:root{color-scheme:dark;--color-ink: #0b151a;--color-ink-soft: #152329;--color-panel: rgba(12, 24, 29, .82);--color-cream: #f4eddb;--color-paper: #ded4be;--color-muted: #87948e;--color-line: rgba(230, 225, 206, .17);--color-accent: #e3a84e;--color-home: #65c8aa;--color-away: #ee7659;--font-display: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;--font-ui: "Avenir Next", Avenir, "Segoe UI", sans-serif;--font-mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;font-family:var(--font-ui);font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden;background:var(--color-ink)}html,body{overflow-x:clip}body{color:var(--color-cream)}button{color:inherit;font:inherit}#game{position:relative;width:100%;height:100%;min-height:520px;overflow:clip;isolation:isolate;background:var(--color-ink)}#field{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block;outline:none}.vignette{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:radial-gradient(ellipse at 51% 51%,transparent 42%,rgba(5,12,15,.24) 78%,rgba(5,11,14,.6))}.scanline{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;opacity:.13;background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(235,231,213,.09) 4px);mix-blend-mode:soft-light}.topbar{position:absolute;z-index:3;top:0;left:0;right:0;height:84px;padding:19px 34px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(239,229,202,.13);background:linear-gradient(180deg,rgba(7,15,18,.6),transparent)}.brand-lockup,.topbar-right,.brand-mark,.live-indicator,.score-main,.team-score,.score-details,.count-group,.lights,.bottom-left,.play-by-play,.controls-hint,.pitch-options,.pitch-names,.title-kicker,.title-controls{display:flex;align-items:center}.brand-lockup{gap:12px}.brand-mark{width:32px;height:32px;position:relative;gap:3px;transform:skew(-11deg)}.brand-mark span{display:block;width:12px;height:100%;background:var(--color-accent)}.brand-mark span+span{height:67%;align-self:flex-end;background:var(--color-cream)}.eyebrow,.micro-label{color:var(--color-muted);font:700 9px/1 var(--font-mono);letter-spacing:.16em}.brand-name{margin-top:5px;font:22px/.9 var(--font-display);letter-spacing:.055em}.brand-name span{color:var(--color-accent)}.topbar-right{gap:21px}.live-indicator{gap:8px;color:var(--color-paper);font:700 9px var(--font-mono);letter-spacing:.14em}.live-indicator i,.situation-pip{width:6px;height:6px;border-radius:50%;background:var(--color-home);box-shadow:0 0 12px #65c8aab3}.icon-button{width:34px;height:34px;display:grid;place-items:center;border:1px solid var(--color-line);border-radius:50%;background:#0a151973;cursor:pointer}.icon-button svg{width:17px;fill:none;stroke:var(--color-cream);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.icon-button.muted svg path:first-child{opacity:.4}.scorebug{position:absolute;z-index:4;top:100px;left:34px;width:303px;border:1px solid rgba(231,224,201,.2);background:var(--color-panel);box-shadow:0 12px 40px #0000002e;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.score-main{min-height:70px;justify-content:space-between;padding:12px 15px;border-bottom:1px solid var(--color-line)}.team-score{gap:8px;min-width:105px}.team-score .team-dot{width:7px;height:7px;border-radius:50%;background:var(--color-away)}.team-score.home .team-dot{background:var(--color-home)}.team-name{color:#c1c3b6;font:700 8px var(--font-mono);letter-spacing:.1em}.team-score strong{margin-left:auto;color:var(--color-cream);font:24px/.9 var(--font-display)}.inning-cell{text-align:center;padding:0 12px;border-left:1px solid var(--color-line);border-right:1px solid var(--color-line)}.inning-cell strong{display:block;margin-top:7px;white-space:nowrap;font:700 10px var(--font-mono);letter-spacing:.04em}.score-details{min-height:57px;padding:8px 13px;gap:16px}.count-group{gap:5px;flex-direction:column;align-items:flex-start}.count-group .micro-label{font-size:7px}.lights{gap:4px}.lights i{display:block;width:6px;height:6px;border-radius:50%;background:#c9cab738}#balls-lights i.on{background:var(--color-home);box-shadow:0 0 7px #65c8aa8c}#strikes-lights i.on{background:var(--color-accent);box-shadow:0 0 7px #e3a84e80}#outs-lights i.on{background:var(--color-away);box-shadow:0 0 7px #ee765980}.base-diamond{position:relative;width:34px;height:34px;margin-left:auto;transform:rotate(45deg)}.base{position:absolute;width:8px;height:8px;border:1px solid rgba(244,237,219,.56);background:#142625d9}.base.second{top:0;left:13px}.base.first{right:0;top:13px}.base.third{left:0;top:13px}.base.home{bottom:0;left:13px}.base.occupied{border-color:var(--color-accent);background:var(--color-accent);box-shadow:0 0 8px #e3a84e80}.situation-tag{position:absolute;z-index:2;top:105px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:9px;padding:8px 12px;border:1px solid rgba(235,229,205,.13);background:#0a15186e;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#d8d6c7;font:700 8px var(--font-mono);letter-spacing:.14em;white-space:nowrap}.situation-pip{width:5px;height:5px;background:var(--color-accent);box-shadow:0 0 9px #e3a84e8c}.aim-reticle{position:absolute;z-index:2;left:50%;top:51%;width:45px;height:45px;border:1px solid rgba(244,237,219,.28);border-radius:50%;transform:translate(-50%,-50%);opacity:.56;transition:left .14s,top .14s,opacity .3s;pointer-events:none}.aim-reticle:before,.aim-reticle:after{content:"";position:absolute;background:#f4eddb80}.aim-reticle:before{left:50%;top:-6px;bottom:-6px;width:1px}.aim-reticle:after{top:50%;left:-6px;right:-6px;height:1px}.aim-reticle span{position:absolute;top:7px;right:7px;bottom:7px;left:7px;border:1px dashed rgba(244,237,219,.3);border-radius:50%}.pitch-track{position:absolute;z-index:2;left:50%;top:25%;width:3px;height:140px;border-radius:5px;background:linear-gradient(180deg,transparent,rgba(243,234,208,.45),transparent);opacity:0;transition:opacity .3s;transform:translate(-50%)}.pitch-track.active{opacity:.8}.pitch-track span{position:absolute;width:19px;height:19px;left:50%;top:50%;border:1px solid rgba(243,234,208,.65);border-radius:50%;transform:translate(-50%,-50%)}.pitch-track i{position:absolute;left:50%;top:100%;width:5px;height:5px;border-radius:50%;transform:translate(-50%,-50%);background:var(--color-accent);box-shadow:0 0 10px var(--color-accent)}.bottom-left{position:absolute;z-index:3;bottom:28px;left:34px;flex-direction:column;align-items:flex-start;gap:14px}.play-by-play{gap:9px;color:#f1ecd8db;font-size:11px;letter-spacing:.02em;text-shadow:0 1px 8px rgba(0,0,0,.6)}.pbp-icon{color:var(--color-accent);font-size:13px}.controls-hint{gap:11px;color:#dfddcba6;font:700 8px var(--font-mono);letter-spacing:.1em}.controls-hint b{width:1px;height:14px;background:var(--color-line)}kbd{display:inline-grid;min-width:19px;height:19px;place-items:center;margin-right:2px;border:1px solid rgba(239,230,205,.22);border-bottom-width:2px;border-radius:3px;color:var(--color-paper);font:700 8px var(--font-mono);vertical-align:middle}.controls-hint kbd{min-width:16px;height:16px;font-size:7px}.right-rail{position:absolute;z-index:3;right:34px;bottom:30px;width:145px}.rail-card,.wind-readout{border:1px solid rgba(231,224,201,.17);background:#0b171ab0;-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px)}.rail-card{padding:12px 13px 11px}.rail-card strong{display:block;margin-top:8px;color:var(--color-cream);font:18px/.9 var(--font-display);letter-spacing:.06em}.pitch-options{justify-content:space-between;margin-top:13px}.pitch-options span{display:grid;place-items:center;width:31px;height:25px;border:1px solid var(--color-line);color:var(--color-muted);font:700 8px var(--font-mono);cursor:pointer}.pitch-options span.selected{border-color:#e3a84eb3;color:var(--color-accent);background:#e3a84e1a}.pitch-names{justify-content:space-between;margin-top:6px;color:var(--color-muted);font:6px var(--font-mono);letter-spacing:.07em}.wind-readout{display:flex;align-items:center;justify-content:space-between;margin-top:6px;padding:9px 12px}.wind-readout strong{color:var(--color-paper);font:700 10px var(--font-mono)}.wind-readout small{color:var(--color-muted);font-size:7px}.callout{position:absolute;z-index:5;left:50%;top:43%;display:flex;align-items:center;flex-direction:column;transform:translate(-50%,-50%) scale(.86);opacity:0;pointer-events:none;transition:opacity .22s,transform .32s cubic-bezier(.2,.8,.2,1);text-shadow:0 3px 20px rgba(0,0,0,.55)}.callout.show{opacity:1;transform:translate(-50%,-50%) scale(1)}.callout-rule{width:35px;height:2px;margin-bottom:8px;background:var(--color-accent)}.callout strong{color:var(--color-cream);font:54px/.92 var(--font-display);letter-spacing:.025em;text-align:center}.callout span:last-child{margin-top:7px;color:#f4eddbb3;font:700 9px var(--font-mono);letter-spacing:.2em;text-align:center}.corner-note{position:absolute;z-index:2;right:34px;top:28px;color:#e2e0cd6e;font:700 8px var(--font-mono);letter-spacing:.12em}.corner-note span{padding:0 5px;color:var(--color-accent)}.title-screen,.final-screen{position:absolute;z-index:10;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;overflow:hidden;background:radial-gradient(ellipse at 50% 49%,#08101366 0,#070f12b0 54%,#070f12e8);transition:opacity .55s,visibility .55s}.title-screen.dismissed{opacity:0;visibility:hidden;pointer-events:none}.title-content{position:relative;z-index:2;width:min(550px,calc(100% - 32px));text-align:center;animation:title-in .8s both}@keyframes title-in{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}.title-kicker{justify-content:center;gap:10px;color:var(--color-accent);font:700 8px var(--font-mono);letter-spacing:.24em}.title-kicker span{width:19px;height:1px;background:var(--color-accent);opacity:.7}.title-content h1{margin:27px 0 0;color:var(--color-cream);font:112px/.72 var(--font-display);letter-spacing:.035em;text-shadow:0 6px 35px rgba(0,0,0,.25)}.title-content h1 em{color:var(--color-accent);font-style:normal;font-size:91px;letter-spacing:.12em}.title-subtitle{margin-top:28px;color:#efe7d0bd;font:700 9px var(--font-mono);letter-spacing:.24em}.title-content p{margin:13px 0 24px;color:#dcdccab8;font-size:12px;letter-spacing:.03em}.play-button{display:inline-flex;align-items:center;justify-content:space-between;gap:32px;min-width:192px;height:48px;padding:0 15px 0 19px;border:1px solid var(--color-accent);background:var(--color-accent);color:var(--color-ink);cursor:pointer;font:800 10px var(--font-mono);letter-spacing:.15em;transition:background .2s,color .2s,transform .2s}.play-button:hover{background:transparent;color:var(--color-accent);transform:translateY(-2px)}.play-button b{font-size:17px;font-weight:400}.title-controls{justify-content:center;gap:17px;margin-top:22px;color:#e6e2ce9c;font:700 7px var(--font-mono);letter-spacing:.1em}.title-controls kbd{min-width:22px;height:18px;font-size:7px}.title-footer{position:absolute;right:34px;bottom:25px;left:34px;display:flex;justify-content:space-between;color:#e2e0cd66;font:700 7px var(--font-mono);letter-spacing:.13em}.title-orbit{position:absolute;left:50%;top:50%;border:1px solid rgba(232,222,193,.1);border-radius:50%;transform:translate(-50%,-50%) rotate(-15deg);pointer-events:none}.orbit-one{width:min(76vw,1000px);height:min(42vw,520px)}.orbit-two{width:min(64vw,820px);height:min(31vw,380px);border-color:#e8dec10f}.final-screen[hidden]{display:none}.final-screen{background:#060d10c4;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}.final-card{width:min(420px,calc(100% - 32px));padding:33px;border:1px solid rgba(231,224,201,.21);background:#0d1b1fed;text-align:center;box-shadow:0 25px 80px #0006}.final-card h2{margin:13px 0 22px;font:54px/.9 var(--font-display)}.final-score{display:flex;align-items:center;justify-content:center;gap:27px;margin-bottom:26px;padding:17px 0;border-top:1px solid var(--color-line);border-bottom:1px solid var(--color-line)}.final-score div{display:flex;flex-direction:column;gap:6px}.final-score span{color:var(--color-muted);font:700 8px var(--font-mono);letter-spacing:.15em}.final-score strong{font:37px var(--font-display)}.final-score i{color:var(--color-accent);font-style:normal}.final-card p{margin:18px 0 0;color:var(--color-muted);font-size:10px}@media(max-width:760px){#game{min-height:460px}.topbar{height:68px;padding:13px 17px}.brand-mark{width:25px;height:25px}.brand-name{font-size:18px}.topbar-right{gap:12px}.corner-note{display:none}.scorebug{top:81px;left:14px;width:280px}.situation-tag{top:85px;left:auto;right:14px;transform:none;font-size:7px}.bottom-left{left:15px;bottom:15px;gap:10px}.right-rail{right:15px;bottom:15px;width:123px}.rail-card{padding:10px}.rail-card strong{font-size:15px}.pitch-options span{width:27px}.pitch-names{font-size:5px}.title-content h1{font-size:clamp(76px,18vw,105px)}.title-content h1 em{font-size:.83em}.title-footer{right:15px;left:15px;bottom:15px;font-size:6px}.title-controls{gap:9px;font-size:6px}}@media(max-width:480px){.scorebug{width:253px;left:10px}.score-main{padding:10px}.team-score{min-width:88px;gap:6px}.team-name{font-size:7px}.team-score strong{font-size:21px}.inning-cell{padding:0 7px}.score-details{gap:11px;padding-inline:10px}.situation-tag{top:149px;right:10px}.right-rail{width:108px;right:10px}.wind-readout{padding:7px 9px}.bottom-left{left:10px;max-width:calc(100% - 132px)}.controls-hint{flex-wrap:wrap;gap:7px;font-size:7px}.play-by-play{font-size:10px}.title-content h1{font-size:74px}.title-subtitle{letter-spacing:.14em}.title-controls{flex-wrap:wrap}.title-footer span:last-child{display:none}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}
