:root{color-scheme:dark;--paper:#eee9d7;--muted:#a7b4a4;--orange:#fc8246;--green:#bedb80}*{box-sizing:border-box}body{margin:0;background:#10231c;color:var(--paper);font-family:Arial,Helvetica,sans-serif;background-image:radial-gradient(ellipse at 50% 10%,#28433166,transparent 65%)}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:3px solid #fbc05f;outline-offset:4px}button{border:1px solid #ffffff24;background:none}header{max-width:1320px;margin:auto;padding:25px 42px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff16}.brand{font-size:22px;font-weight:900;color:var(--paper);text-decoration:none}.brand span{font-size:11px;letter-spacing:2px;color:var(--muted);margin-left:14px}.edition{font:10px monospace;letter-spacing:2px;color:#bbcab4}.edition span{margin:0 15px}i{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--green);margin-right:8px}#audio{font:10px monospace;padding:10px 14px;border-radius:3px;letter-spacing:1px}main{max-width:1320px;padding:0 42px;margin:auto}.masthead{display:flex;align-items:center;justify-content:space-between;padding:36px 0 27px}.eyebrow{font:10px monospace;font-weight:bold;letter-spacing:2px;color:var(--green)}h1{font-size:clamp(36px,5.7vw,76px);line-height:1;margin:13px 0 0;letter-spacing:-4px;font-weight:950;font-style:italic}h1 span{color:var(--orange);margin-left:12px}h1 sup{font-size:13px;vertical-align:top;margin:5px;letter-spacing:0}.masthead p{font-size:13px;line-height:1.7;color:#bcc7b5;border-left:1px solid #ffffff30;padding-left:24px}.cabinet{border:1px solid #637357;border-radius:7px;overflow:hidden;box-shadow:0 25px 80px #0005}.scoreboard{display:flex;justify-content:space-between;align-items:center;background:#142019;padding:17px 30px;border-bottom:4px solid #34452f}.team{display:flex;align-items:center;gap:16px;flex:1}.team small,.clock small{font:9px monospace;letter-spacing:2px;color:var(--muted);display:block;margin-bottom:6px}.team strong{font-size:17px;letter-spacing:1px}.team b{font: bold 43px monospace;letter-spacing:-3px;margin-left:12px}.team-icon{font:bold 35px Georgia;color:var(--green);border:2px solid #bedb8060;width:47px;height:47px;text-align:center;transform:skew(-7deg)}.away{justify-content:flex-end;text-align:right}.away .team-icon{color:var(--orange);border-color:#fc824660}.away b{margin:0 12px 0 0}.clock{text-align:center;min-width:180px}.clock strong{font:bold 36px monospace;line-height:1}.clock>span{display:block;color:var(--green);font:10px monospace;margin-top:8px;letter-spacing:1px}.stadium{position:relative;background:#285238;overflow:hidden}canvas{display:block;width:100%;height:auto;image-rendering:pixelated}.live-badge{position:absolute;top:15px;left:20px;font:9px monospace;letter-spacing:1px;background:#0b211ccc;padding:8px 10px}.live-badge span{color:#aab9a0;margin-left:12px}.live-badge i{background:#fc8246}.pause{position:absolute;right:18px;top:13px;background:#0b211ccc;padding:7px 12px}.overlay{position:absolute;inset:0;background:linear-gradient(90deg,#071b16ed,#0a231b9c 55%,#0a231b10);display:flex;align-items:center;padding:30px 65px}.overlay[hidden]{display:none}.overlay-inner h2{font-size:clamp(30px,5.2vw,68px);line-height:.98;letter-spacing:-2px;margin:18px 0;font-weight:950;font-style:italic}.overlay-inner em{color:var(--green);font-style:italic}.overlay-inner p{font-size:14px;line-height:1.65;color:#ccd4c1}.primary{background:var(--orange);border:0;color:#17231a;font-weight:900;letter-spacing:1px;font-size:13px;padding:16px 24px;min-width:220px;margin:10px 0 20px;box-shadow:4px 4px 0 #0005}.primary span{float:right;font-size:20px}.overlay-inner>small{display:block;font:8px monospace;letter-spacing:1.4px;color:#a9bba6}.ticker{display:flex;align-items:center;gap:18px;padding:12px 20px;background:#1c2f23;border-top:1px solid #ffffff15;border-bottom:1px solid #ffffff15}.ticker>span:first-child{font:9px monospace;letter-spacing:1px;color:var(--orange);white-space:nowrap}.ticker p{margin:0;font-size:12px;color:#d3dbc9;flex:1}.wave{font-size:13px;color:var(--green);white-space:nowrap}.playbook{display:grid;grid-template-columns:1.15fr 1fr 1fr 1fr .8fr;gap:10px;padding:19px;background:#14261d}.playbook-label{display:flex;flex-direction:column;justify-content:center;gap:10px;padding-right:8px}.playbook-label strong{font-size:14px}.playbook-label>span:last-child{font:10px monospace;color:var(--muted)}.play{padding:9px 12px;text-align:left;background:#ffffff03;border-radius:3px;transition:background .15s}.play svg{height:35px;width:100%;stroke:#a2af97;fill:none;stroke-width:2;stroke-linejoin:round}.play span{display:block;font-size:10px;font-weight:bold;white-space:nowrap}.play b{font:9px monospace;color:#899a7d;margin-right:7px}.play small{font:8px monospace;letter-spacing:.6px;color:#9aad92;display:block;margin-top:7px}.play.selected{border-color:var(--green);background:#bedb8010}.play.selected svg{stroke:var(--green)}.play:hover{background:#ffffff0b}.snap{background:var(--green);color:#18291c;font-size:12px;font-weight:900;border-radius:3px}.snap span{display:block;font:9px monospace;margin-top:9px}.snap:disabled{opacity:.4;cursor:default}.instructions{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding:26px 0}.instructions>div{display:flex;gap:13px}.number{font:10px monospace;color:var(--orange);padding-top:2px}.instructions p{margin:0}.instructions strong{display:block;font:10px monospace;letter-spacing:1px;margin-bottom:8px}.instructions p span{font-size:11px;color:var(--muted)}footer{border-top:1px solid #ffffff18;padding:20px 0 28px;display:flex;justify-content:space-between;gap:16px;font:8px monospace;letter-spacing:.7px;color:#859a81}footer a{color:#c5d0ba;text-decoration:none}.flash{position:absolute;top:40%;width:100%;text-align:center;pointer-events:none;font:bold italic clamp(20px,4vw,48px) Arial;text-shadow:3px 3px #10231c;color:#f5e8a4}.touch-controls{display:none}button:disabled{cursor:default}button.play:disabled{opacity:.5}@media(max-width:850px){header{padding:19px 22px}main{padding:0 22px}.edition{display:none}.masthead{padding:28px 0 22px}.masthead p{font-size:11px}.playbook{grid-template-columns:repeat(3,1fr);padding:12px}.playbook-label{grid-column:span 2}.snap{grid-column:3;grid-row:1}.team{gap:8px}.team-icon{display:none}.team strong{font-size:12px}.team b{font-size:34px}.scoreboard{padding:15px}.clock{min-width:135px}.clock strong{font-size:30px}.instructions{gap:12px}.instructions p span{font-size:10px}.overlay{padding:20px 35px}.overlay-inner h2{margin:10px 0}.overlay-inner p{margin:10px 0;font-size:12px}.primary{padding:12px 18px;margin:5px 0 10px}.touch-controls{display:flex;justify-content:space-between;gap:12px;margin-top:15px;touch-action:none}.touch-controls button{background:#253c2b;border:1px solid #516347;border-radius:5px;padding:13px;font:bold 12px monospace;user-select:none;-webkit-user-select:none}.dpad{display:grid;grid-template-columns:repeat(3,39px);gap:4px}.dpad button{padding:10px}.dpad button:first-child{grid-column:2}.dpad button:nth-child(2){grid-column:1}.touch-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}.touch-actions button:first-child{grid-column:span 3;color:var(--green)}footer{flex-wrap:wrap}footer>span:nth-child(2){order:3;width:100%}}@media(max-width:520px){main{padding:0 12px}header{padding:16px 12px}.masthead p{display:none}h1{font-size:44px;letter-spacing:-2px}.eyebrow{font-size:8px;letter-spacing:1.3px}.scoreboard{padding:12px 10px}.team small{font-size:7px;letter-spacing:1px}.team strong{font-size:10px}.team b{font-size:28px;margin-left:2px}.away b{margin-right:2px}.clock{min-width:120px}.clock small{font-size:7px}.clock>span{font-size:8px}.stadium{height:300px}canvas{height:300px;width:100%;object-fit:cover}.overlay{padding:20px}.overlay-inner h2{font-size:40px}.overlay-inner>small{font-size:6px}.live-badge span{display:none}.ticker{gap:9px;padding:10px}.ticker p{font-size:10px}.wave{display:none}.play span{font-size:8px}.play small{font-size:6px}.play{padding:8px}.playbook-label strong{font-size:12px}.instructions{grid-template-columns:1fr;padding:20px 0;gap:16px}.instructions p span{font-size:11px}.instructions strong{margin-bottom:4px}.instructions>div{gap:15px}.touch-actions button{font-size:10px;padding:10px}}

.rules{font:9px monospace;line-height:1.7;color:#b6cb9e;padding:0 0 20px;display:flex;gap:18px}.rules span{color:#8ea182}@media(max-width:520px){.rules{display:block}.rules span{display:block;margin-top:5px}}

.control-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 18px;background:#10251c;border-top:1px solid #ffffff25;font:9px monospace;color:#bedb80}.pass-buttons{display:flex;gap:7px}.pass-buttons button{border:1px solid #bedb8080;border-radius:3px;padding:7px 12px;font-weight:bold;color:#e5edcd;background:#28422c}.pass-buttons button span{font-size:8px;color:#adc094;margin-left:6px}.pass-buttons button:disabled{opacity:.4}.control-bar label{display:flex;align-items:center;gap:10px}.control-bar meter{width:75px;height:10px;accent-color:#bedb80}@media(max-width:520px){.control-bar{padding:9px;gap:8px;flex-wrap:wrap;font-size:8px}.pass-buttons{order:3;width:100%}.pass-buttons button{flex:1;padding:9px}.control-bar meter{width:45px}}

/* Respectable QB matchup and selection screen. */
h1{font-size:clamp(32px,5vw,67px);letter-spacing:-3px}.header-actions{display:flex;gap:8px;align-items:center}#team-switch{font:10px monospace;padding:10px 12px;border-radius:3px}.qb-name{display:block;font:10px monospace;color:#bac8b3;margin-top:6px}.team .team-icon{border-color:var(--team-color);color:var(--team-color)}.selection{width:min(590px,100%)}.selection h2{font-size:48px;margin:14px 0 20px}.team-picker{display:grid;grid-template-columns:1fr 1fr;gap:12px}.team-choice{display:flex;flex-direction:column;align-items:flex-start;gap:7px;padding:17px 20px;border:1px solid #ffffff35;background:#142a30d9;border-radius:5px;text-align:left;transition:border-color .15s,background .15s}.team-choice.bills{border-left:4px solid #3176f2}.team-choice.broncos{border-left:4px solid #fc8246}.team-choice.selected{border-color:#ececd1;background:#274454;box-shadow:0 0 0 1px #ececd1}.team-choice.broncos.selected{background:#49382c}.team-choice .city{font:9px monospace;letter-spacing:2px;color:#c1cdbc}.team-choice strong{font-size:27px;letter-spacing:-1px;font-style:italic}.team-choice .qb{font-size:13px}.team-choice small{font:8px monospace;color:#bcccaf;margin-top:5px}.selection p{font-size:12px;line-height:1.5;margin:15px 0 8px}.selection .primary{margin-bottom:13px}.secondary{padding:14px;margin-left:10px;border-color:#bedb80;color:#bedb80;font:11px monospace}.selection~.flash{font-size:25px}@media(max-width:850px){.selection h2{font-size:32px;margin:8px 0 12px}.team-choice{padding:12px;gap:5px}.team-choice strong{font-size:22px}.selection p{font-size:11px;margin:10px 0}.selection .primary{padding:11px 16px}.qb-name{font-size:8px}.masthead p{max-width:175px}}@media(max-width:520px){h1{font-size:34px;letter-spacing:-1.7px}h1 span{margin-left:7px}.brand span{font-size:8px;margin-left:5px}.header-actions{gap:5px}#audio,#team-switch{font-size:8px;padding:9px 7px}.overlay{padding:16px}.selection h2{font-size:28px}.team-picker{gap:8px}.team-choice{padding:10px;gap:5px}.team-choice strong{font-size:21px}.team-choice .qb{font-size:10px}.team-choice small{font-size:6px;letter-spacing:0}.team-choice .city{font-size:7px}.selection p{font-size:10px;margin:9px 0}.selection .primary{margin:3px 0 9px;padding:10px 14px;min-width:195px;font-size:11px}.selection>small{font-size:6px;letter-spacing:.4px}.qb-name{font-size:6px;max-width:78px;line-height:1.3}.clock{min-width:110px}.team{gap:4px}.team small{letter-spacing:.5px}.secondary{margin:0 0 12px;font-size:10px}.flash{font-size:22px;padding:0 12px}}
/* One-screen arcade: field receives all remaining viewport space. */
html,body{width:100%;height:100%;overflow:hidden;overscroll-behavior:none}body{height:100dvh;display:flex;flex-direction:column}header{width:100%;padding:8px 20px;flex:0 0 44px}main{width:100%;flex:1;min-height:0;display:flex;flex-direction:column;padding:0 20px}.masthead{padding:8px 0;flex:0 0 auto}.masthead .eyebrow{display:none}h1{font-size:28px;letter-spacing:-1px;margin:0}.cabinet{flex:1;min-height:0;display:flex;flex-direction:column}.scoreboard{padding:8px 18px;flex:none}.team b{font-size:30px}.clock strong{font-size:27px}.team small,.clock small{margin-bottom:2px}.clock>span{margin-top:3px}.stadium{flex:1;min-height:0;height:auto;display:flex;align-items:center;justify-content:center;background:#193d2b}canvas{width:100%;height:100%;object-fit:contain;touch-action:none}.control-bar{flex:none;padding:6px 12px}.ticker{padding:5px 12px;min-height:28px;flex:none}.playbook{padding:7px;gap:7px;flex:none;grid-template-columns:repeat(3,1fr) .8fr}.playbook-label,.play small{display:none}.play svg{height:23px}.play{padding:5px 10px}.snap{grid-column:auto;grid-row:auto}.snap span{margin-top:3px}footer{padding:6px 0;font-size:8px;flex:none}.overlay:has(.selection){position:fixed;inset:0;z-index:20;background:#091912eb;backdrop-filter:blur(7px);justify-content:center;padding:16px}.selection{width:min(620px,100%)}.selection h2{font-size:44px;margin:10px 0}.team-picker{margin:12px 0}.team-choice{padding:18px;text-align:left}.team-choice .roster{display:block;font:12px/1.8 monospace;margin:10px 0}.team-choice strong{font-size:28px}.selection .primary:disabled{opacity:.4;cursor:default}.selection>p{min-height:20px}.header-actions button{font:9px monospace;padding:8px}dialog{width:min(460px,94vw);background:#14261d;color:var(--paper);border:1px solid #bedb80;padding:24px}dialog::backdrop{background:#000b}dialog h2{font-size:22px}dialog label{display:block;font:11px monospace;margin:18px 0}dialog audio{display:block;width:100%;height:36px;margin-top:8px}dialog a{color:var(--green)}
@media(max-width:850px){header{padding:6px 10px}main{padding:0 8px}.brand span{display:none}.masthead{padding:5px 0}h1{font-size:23px}.scoreboard{padding:6px 8px}.team b{font-size:27px}.team strong{font-size:11px}.qb-name{font-size:8px}.touch-controls{flex:none;margin:6px 0 0;gap:8px}.touch-controls button{padding:8px}.dpad{grid-template-columns:repeat(3,38px)}.dpad button{padding:7px}.playbook{grid-template-columns:repeat(3,1fr) .85fr}.play span{font-size:8px}.play svg{height:20px}.play b{display:none}.snap{font-size:10px}.snap span{font-size:7px}footer{font-size:6px;gap:3px;padding:4px 0}.ticker p{font-size:10px}.ticker>span:first-child{display:none}.control-bar label{font-size:7px}.pass-buttons button{padding:5px 8px}.team-choice{padding:12px}.team-choice .roster{font-size:10px}.selection h2{font-size:34px}}
@media(max-height:540px){.masthead,footer,.ticker,.scoreboard small,.qb-name,.live-badge{display:none}header{flex-basis:34px}.scoreboard{padding:3px 10px}.clock strong{font-size:22px}.team b{font-size:24px}.team-icon{display:none}.touch-controls{position:absolute;left:12px;right:12px;bottom:112px;pointer-events:none;z-index:3}.touch-controls button{pointer-events:auto;background:#173022aa}.selection .eyebrow,.selection>small{display:none}.selection h2{font-size:26px;margin:0}.team-picker{margin:6px 0}.team-choice{padding:8px}.team-choice strong{font-size:22px}.team-choice .roster{margin:4px 0;line-height:1.4}.selection .primary{margin:0;padding:10px}.selection p{margin:5px 0}.overlay:has(.selection){z-index:20}}

/* Desktop side rails reserve the full center height for the field. */
@media(min-width:851px){
header,main{max-width:1800px}.cabinet{display:grid;grid-template-columns:160px minmax(0,1fr) 180px;grid-template-rows:auto minmax(0,1fr) auto}
.scoreboard{grid-column:1/-1;grid-row:1}.stadium{grid-column:2;grid-row:2}.ticker{grid-column:1/-1;grid-row:3}
.playbook{grid-column:1;grid-row:2;display:flex;flex-direction:column;padding:14px 10px;gap:12px;border-right:1px solid #ffffff20}
.playbook-label{display:flex;gap:8px}.playbook-label strong{font-size:11px;line-height:1.5}.playbook-label>span:last-child{font-size:9px}.play{padding:12px 8px}.play svg{height:42px}.play span{font-size:10px}.snap{padding:16px 4px;margin-top:auto}
.control-bar{grid-column:3;grid-row:2;flex-direction:column;align-items:stretch;justify-content:flex-start;padding:18px 12px;gap:18px;border-top:0;border-left:1px solid #ffffff20;line-height:1.7}
.pass-buttons{flex-direction:column}.pass-buttons button{text-align:left;padding:10px}.control-bar label{flex-direction:column;align-items:flex-start;gap:5px}.control-bar meter{width:100%}.controls-title{font:10px monospace;letter-spacing:2px;color:var(--orange)}.control-bar p{margin:0;color:var(--muted);font-size:10px}footer>span:first-child{display:none}
}
@media(max-width:850px){.controls-title,.movement-help,.return-help,.pause-help{display:none}}
/* Keep sound and booth controls accessible during the pregame broadcast. */
header{position:relative;z-index:21;background:#10231c}
/* Final broadcast fills the viewport too, so the headline/replay controls never clip on phones. */
.overlay:has(.overlay-inner:not(.selection)){position:fixed;inset:44px 0 0;z-index:20;background:#091912eb;backdrop-filter:blur(7px);justify-content:center;padding:16px}
.overlay-inner:not(.selection){width:min(620px,100%)}
@media(max-height:540px){.overlay:has(.overlay-inner:not(.selection)){inset:34px 0 0}.overlay-inner:not(.selection) h2{font-size:30px;margin:8px 0}.overlay-inner:not(.selection) p{font-size:12px;margin:8px 0}.overlay-inner:not(.selection) .primary{margin:4px 0 10px;padding:12px}.overlay-inner:not(.selection) .secondary{margin-bottom:8px}}
/* Three selectable teams, with a compact Jets row on phones. */
.selection{width:min(880px,100%)}
.team-picker{grid-template-columns:repeat(3,minmax(0,1fr))}
.team-choice.jets{border-left:4px solid #52bb86}
.team-choice.jets.selected{background:#154c35}
@media(max-width:650px){.team-picker{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.team-choice.jets{grid-column:1/-1;display:grid;grid-template-columns:1fr 1.5fr;gap:3px 10px}.team-choice.jets .city{grid-column:1}.team-choice.jets strong{grid-column:1}.team-choice.jets .roster{grid-column:2;grid-row:1/3;margin:0;font-size:10px}.team-choice.jets small{grid-column:1/-1;margin-top:3px}.selection h2{margin:6px 0}.team-choice{padding:10px}.team-choice .roster{margin:6px 0}.selection>p{margin:8px 0;font-size:10px}}
@media(max-width:650px){.team-choice strong{font-size:24px}}