.football-step{position:absolute;z-index:12;inset:auto 6% 12%;max-width:600px;margin:auto;padding:22px 26px;background:linear-gradient(145deg,#12243cf7,#191d3ff7);border:2px solid #ffdc45;border-radius:18px;box-shadow:0 18px 70px #0009;text-align:center;color:#fff}
.football-step[hidden],.football-step [hidden]{display:none!important}.football-step h2{font-weight:900;font-size:clamp(20px,3vw,36px);line-height:1.1;margin:7px 0 10px;letter-spacing:-1px}.football-step p{font-size:14px;line-height:1.45;margin:10px 0 16px;color:#dae8f9;min-height:20px}.football-step .eyebrow{color:#ffdc45}.football-choices{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}.football-step button{border:0;background:#ffdc45;color:#141e35;font-weight:900;border-radius:9px;padding:13px 24px;min-height:46px;cursor:pointer;touch-action:manipulation}.football-step button:nth-child(even){background:#59baff}.football-step button:disabled{opacity:.5;cursor:default}.football-step button:focus-visible{outline:3px solid white;outline-offset:4px}.football-coin{width:70px;height:70px;margin:12px auto;color:#ffdc45;background:#95762a;border:4px solid #ffe681;border-radius:50%;font-size:43px;line-height:60px;box-shadow:inset 0 0 0 3px #c29d35}.football-coin.flipping{animation:bowl-coin .32s linear infinite}@keyframes bowl-coin{50%{transform:scaleX(.1) translateY(-10px)}}.football-meter{max-width:380px;margin:15px auto 0}.meter-rail{position:relative;height:26px;border:2px solid #d1e3ff;border-radius:7px;background:linear-gradient(90deg,#438dff,#68dcb6 58%,#ffdb45 85%,#ff656c);overflow:visible}.meter-zone{display:none}.accuracy .meter-rail{background:linear-gradient(90deg,#e4566d,#f4bc62 37%,#74e3ad 38%,#74e3ad 62%,#f4bc62 63%,#e4566d)}.accuracy .meter-zone{display:block;position:absolute;left:38%;width:24%;height:100%;background:#96ffb944;border-inline:2px solid #fff}.accuracy .meter-zone:after{content:'';position:absolute;left:50%;height:100%;border-left:2px dashed #fff}.meter-rail i{position:absolute;top:-10px;left:0;height:44px;width:4px;background:white;box-shadow:0 0 8px #fff;transform:translateX(-2px);pointer-events:none}.meter-rail i:before{content:'▼';position:absolute;top:-12px;left:-7px;color:#fff;font-size:17px}.meter-labels{display:flex;justify-content:space-between;margin:12px 0 10px;font:800 11px var(--font-ui);color:#b4ccea}.meter-labels strong{color:#fff;font-size:15px}.football-meter button{width:100%}.football-step.notice{pointer-events:none}.football-step.notice p{margin-bottom:0}@media(max-width:600px){.football-step{inset:auto 3% 4%;padding:15px 14px;border-radius:12px}.football-step h2{font-size:23px;margin:5px}.football-step p{font-size:12px;margin:8px 0}.football-step button{min-height:44px;padding:11px 15px;font-size:12px}.football-coin{width:46px;height:46px;font-size:30px;line-height:38px;margin:8px auto}.football-meter{margin-top:15px}.meter-rail{height:20px}.meter-rail i{height:36px;top:-9px}.meter-labels{margin:9px 0 6px}}@media(prefers-reduced-motion:reduce){.football-coin.flipping{animation:none}}
/* Keep pause reachable above the meter panel on narrow screens. */
.arena #pause{z-index:16}
/* Extra points use a vertical up/down accuracy arrow; kickoffs keep horizontal power. */
.accuracy .football-meter{display:grid;grid-template-columns:1fr 60px 1fr;align-items:center;gap:10px}
.accuracy .meter-rail{grid-column:2;grid-row:1;width:28px;height:116px;margin:auto;background:linear-gradient(180deg,#e4566d,#f4bc62 37%,#74e3ad 38%,#74e3ad 62%,#f4bc62 63%,#e4566d)}
.accuracy .meter-zone{left:0;top:38%;width:100%;height:24%;border-inline:0;border-block:2px solid #fff}
.accuracy .meter-zone:after{left:0;top:50%;height:0;width:100%;border-left:0;border-top:2px dashed #fff}
.accuracy .meter-rail i{height:4px;width:44px;transform:translateY(-2px)}
.accuracy .meter-rail i:before{content:'▶';left:-14px;top:-8px}
.accuracy .meter-labels{grid-column:3;grid-row:1;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch;justify-content:space-between;margin:0}
.accuracy .football-meter button{grid-column:1/-1;grid-row:2}
@media(max-width:600px){.accuracy .meter-rail{height:78px}.accuracy .football-meter{gap:8px;margin-top:8px}.accuracy.football-step{padding:12px}.accuracy .meter-rail i{height:4px}}

/* Original pixel official. Four poses share one transparent atlas. */
.referee-sprite{display:block;flex:0 0 auto;width:112px;height:112px;background-image:url('assets/stadium-referee-v1.webp');background-repeat:no-repeat;background-size:400% 100%;image-rendering:pixelated;filter:drop-shadow(0 4px 0 #081a2860)}
.referee-coin{background-position:0 0}.referee-touchdown{background-position:33.3333% 0}.referee-good{background-position:66.6667% 0}.referee-miss{background-position:100% 0}
.referee-call{position:absolute;z-index:8;right:14px;top:12%;display:flex;align-items:center;gap:8px;max-width:48%;padding:5px 13px 5px 3px;border:2px solid #ffdf52;border-radius:12px;background:linear-gradient(135deg,#132a43f5,#28315af5);box-shadow:0 8px 24px #0006;pointer-events:none;animation:official-enter .22s ease-out}
.referee-call[hidden],.toss-official[hidden]{display:none!important}.referee-call small{display:block;color:#ffdf52;font:800 9px var(--font-ui);letter-spacing:1px;margin-bottom:4px}.referee-call strong{display:block;color:#fff6b4;font:900 27px/.95 var(--font-display),sans-serif;text-shadow:2px 2px #0a1225}
.referee-call .referee-sprite{animation:official-cheer .4s ease-in-out 6 alternate}.toss-official{display:flex;align-items:center;justify-content:center;gap:8px;margin:-9px 0 8px}.toss-official .referee-sprite{width:80px;height:80px}.toss-official b{max-width:90px;text-align:left;color:#b9d5f8;font:800 10px/1.5 var(--font-ui);letter-spacing:1px}
@keyframes official-enter{from{opacity:0;translate:16px 0}to{opacity:1;translate:0 0}}@keyframes official-cheer{to{transform:translateY(-5px) rotate(2deg)}}
.paused .referee-sprite,.paused.football-step .football-coin,.referee-call.paused{animation-play-state:paused}.reduced .referee-sprite{animation:none}
@media(max-width:680px){.referee-call{top:13%;right:7px;gap:4px;padding:3px 8px 3px 0;max-width:48%;border-radius:7px}.referee-call .referee-sprite{width:60px;height:60px}.referee-call small{font-size:6px;letter-spacing:0}.referee-call strong{font-size:17px}.toss-official{margin:-4px 0 4px}.toss-official .referee-sprite{width:49px;height:49px}.toss-official b{font-size:7px;max-width:80px}.football-step:has(.toss-official:not([hidden])) .football-coin{position:absolute;left:calc(50% - 57px);top:35px;width:22px;height:22px;font-size:14px;line-height:14px;border-width:2px;margin:0}}
@media(prefers-reduced-motion:reduce){.referee-call,.referee-call .referee-sprite{animation:none}}

/* During scoring, the official stays in a corner clear of the central dance card. */
.referee-call.with-score{top:auto;bottom:8px;right:8px;max-width:28%;padding:3px 9px 3px 0;border-width:1px;z-index:4}.referee-call.with-score .referee-sprite{width:58px;height:58px}.referee-call.with-score strong{font:800 13px/1.1 var(--font-ui)}.referee-call.with-score small{font-size:7px}
@media(max-width:680px){.referee-call.with-score{right:5px;bottom:5px;max-width:25%;padding:2px 4px;gap:2px}.referee-call.with-score .referee-sprite{width:28px;height:28px}.referee-call.with-score strong{font-size:8px}.referee-call.with-score small{display:none}}

.referee-call.with-score.score-red{left:8px;right:auto}@media(max-width:680px){.referee-call.with-score.score-red{left:5px;right:auto}}