/* BIG historical frequency chart for television; Chart.js 4.6.1 (MIT). */
.frequency{background:#14283d;border:1px solid #35506b;border-radius:16px;padding:clamp(13px,2vw,24px)}
.frequency-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;flex-wrap:wrap}
.frequency-head h2{font-size:clamp(21px,2.1vw,35px);margin:6px 0}
.frequency-head p{color:#b4c5d9;font-size:clamp(11px,1vw,16px);margin:4px 0 12px}
.frequency-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.frequency-controls button{appearance:none;border:1px solid #527290;background:#1c364f;color:#dceaf6;border-radius:9px;min-height:42px;padding:8px 14px;font-size:clamp(12px,1vw,17px);font-weight:800;cursor:pointer}
.frequency-controls button.active,.frequency-controls button[aria-pressed="true"]{border-color:#7be4c6;background:#135b56;color:#eafff7}
.frequency-controls button:focus-visible{outline:3px solid #fff;outline-offset:3px}
.frequency-chart{height:clamp(150px,19vh,290px);position:relative;margin-top:8px}
.frequency-chart canvas{width:100%!important;height:100%!important}
.frequency-fallback{display:grid;grid-template-columns:repeat(10,1fr);gap:8px;height:100%;align-items:end}
.frequency-fallback[hidden]{display:none}
.frequency-fallback div{padding:9px 2px;border-radius:8px;background:#185780;color:#fff;text-align:center;font-size:clamp(11px,1vw,18px)}
.frequency-fallback div:nth-child(even){background:#843e61}
.frequency-fallback strong{font-size:clamp(16px,2vw,28px);display:block}
.frequency-note{color:#9dcae2;font-size:clamp(12px,.95vw,16px);text-align:right;margin-top:5px}

/* TV prioritizes the large, legible 100-outcome board above analytics. */
.tv>.history{order:1}.tv>.frequency{order:2}.tv>footer{order:3}
.history .hist-head{align-items:center;gap:16px;flex-wrap:wrap}
.history .hist-head h2{font-size:clamp(24px,2.5vw,43px);font-weight:900}
.history .stats{gap:9px}.history .stats span{background:#203f56;border:1px solid #4c7193;border-radius:10px;padding:8px 12px;font-size:clamp(14px,1.3vw,23px)}
.road{display:grid;grid-template-columns:repeat(14,minmax(0,1fr));gap:7px;max-height:min(56vh,620px);overflow-y:auto;padding:3px 8px 4px 2px;scrollbar-color:#426c8c #10273d}
.road>.chip{min-height:62px;border-radius:10px;padding:6px 3px;border-width:2px;display:flex;flex-direction:column;justify-content:center;gap:1px}
.road>.chip b{font-size:clamp(21px,2vw,34px);font-weight:900;line-height:1.1}
.road>.chip small{font-size:clamp(10px,.9vw,16px);font-weight:700}
.road>.chip:first-child{border-color:#ffe29a;box-shadow:0 0 0 2px #ffe29a8a}
@media(max-width:1300px){.road{grid-template-columns:repeat(10,minmax(0,1fr))}}
@media(max-width:800px){.road{grid-template-columns:repeat(8,minmax(0,1fr));max-height:55vh}}
@media(max-width:520px){.road{grid-template-columns:repeat(5,minmax(0,1fr))}.road>.chip{min-height:57px}}

@media(max-width:680px){.frequency-controls{width:100%}.frequency-controls button{flex:1;padding:7px 8px}.frequency-chart{height:210px}}