:root{--font-slab: "Alfa Slab One", "Rockwell", "Georgia", serif;--font-mono: "Courier Prime", "Courier New", monospace;--page: #070b0d;--navy: #131a32;--navy-line: #4a4458;--cream: #ebe3d3;--cream-line: #d8ccb0;--tan: #f2ce95;--red: #bd2e33;--red-dark: #92182d;--coral: #e0505a;--muted: #a39fb5;--ink: #0b0f1f;--tier-bloop: #9aa5b1;--tier-single: #5ec8ff;--tier-double: #7be07b;--tier-triple: #ffd23f;--tier-homer: #ff9f43;--tier-moonshot: #ff5ea8;--tier-strikeout: var(--red)}*{box-sizing:border-box}body{margin:0;min-height:100dvh;background:var(--page);color:var(--cream);font-family:var(--font-mono);font-size:16px}h1,p,ol,ul,table{margin:0;padding:0}ol,ul{list-style:none}button,input{font:inherit;color:inherit}button:focus-visible,input:focus-visible{outline:3px solid var(--tan);outline-offset:2px}.game{width:min(100%,1100px);margin:0 auto;padding:0 0 24px}.stage{container-type:inline-size;display:flex;flex-direction:column;gap:14px}.scene{position:relative;aspect-ratio:868 / 482;overflow:hidden;background:#1a1630}.scene__art{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;image-rendering:pixelated}.scene__missing{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;padding:16px;text-align:center;color:var(--muted);border:2px dashed var(--navy-line)}.scene__missing code{color:var(--tan)}.logo{position:absolute;top:2.4%;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;font-family:var(--font-slab);text-transform:uppercase;line-height:1;white-space:nowrap}.logo__kicker{font-size:2cqw;letter-spacing:.14em;color:#f1d9a3;-webkit-text-stroke:.4cqw var(--ink);paint-order:stroke fill}.logo__title{margin-top:.2cqw;font-size:5.4cqw;font-style:italic;transform:skew(-6deg);color:#f1d9a3;-webkit-text-stroke:.8cqw var(--ink);paint-order:stroke fill;text-shadow:.3cqw .4cqw 0 #8a2a2c,.5cqw .6cqw 0 var(--ink)}.logo__bar{width:84%;height:.7cqw;margin-top:.1cqw;background:var(--red);border-radius:1cqw;box-shadow:0 0 0 .35cqw var(--ink)}.pips{position:absolute;top:21%;left:50%;transform:translate(-50%);display:flex;gap:.6cqw;padding:.6cqw .9cqw;background:var(--navy);border:.25cqw solid var(--cream-line);border-bottom:0;border-radius:.8cqw .8cqw 0 0;z-index:2}.pips__pip{width:1.6cqw;height:1.6cqw;border:.22cqw solid var(--cream-line);border-radius:.3cqw;background:transparent}.pips__pip.is-current{background:var(--red);border-color:var(--cream)}.pips__pip[data-tier]{background:var(--tier-color);border-color:var(--ink)}.linescore{position:absolute;top:37.4%;left:6.5%;width:14%;height:12.6%;table-layout:fixed;border-collapse:collapse;font-size:1.3cqw;text-align:center;color:var(--cream);background:#262a52}.linescore th,.linescore td{padding:0;font-weight:700;border:.15cqw solid #4c4660}.linescore thead th{color:#9a8fa6}.linescore th[scope=row]{width:42%;padding-left:.3cqw;text-align:left}.stage__ui{display:flex;flex-direction:column;align-items:center;gap:14px;padding:0 14px}.qcard{position:relative;width:100%;padding:16px 18px 18px;background:var(--navy);border:2px solid var(--cream-line);border-radius:10px;box-shadow:0 0 0 3px var(--ink),inset 0 0 0 3px var(--navy),inset 0 0 0 4px var(--navy-line)}.qcard__head{display:flex;align-items:center;justify-content:space-between;gap:12px}.qcard__eyebrow{font-size:13px;font-weight:700;letter-spacing:.12em;color:#d9707a}.qcard__prompt{margin-top:10px;font-size:22px;font-weight:700;line-height:1.25;text-wrap:balance}.qcard__note{margin:10px 0 14px;font-size:14px;color:var(--muted);min-height:1.3em}.qcard__note.is-warning{color:var(--coral);font-weight:700}.strikes{display:flex;gap:6px}.strikes__light{width:12px;height:12px;border-radius:50%;border:2px solid var(--navy-line)}.strikes__light.is-lit{background:var(--red);border-color:var(--red)}.rules{margin-top:14px;display:grid;gap:6px;color:var(--muted);font-size:15px}.rules li:before{content:"▸ ";color:var(--coral)}.guess{position:relative}.guess__input{width:100%;padding:12px 14px;font-size:17px;font-weight:700;color:var(--cream);background:#161e3a;border:2px solid var(--tan);border-radius:8px}.guess__input::placeholder{color:#b3aab0;font-weight:400}.result{display:grid;gap:4px;padding:14px;text-align:center;background:var(--ink);border:2px solid var(--tier-color, var(--tan));border-radius:8px}.result__title{font-family:var(--font-slab);font-size:26px;color:var(--tier-color, var(--tan))}.result__detail{font-weight:700;font-size:18px}.result__points{font-size:14px;color:var(--muted)}.actionbar{display:flex;width:min(100%,420px);height:56px;border:2px solid var(--cream-line);border-radius:10px;box-shadow:0 0 0 3px var(--ink);overflow:hidden}.actionbar__clock{display:flex;align-items:center;gap:8px;padding:0 14px;background:var(--tan);color:var(--ink);font-family:var(--font-mono);font-weight:700}.actionbar__icon{width:22px;height:22px}.actionbar__seconds{font-size:24px;min-width:2ch}.actionbar__seconds.is-urgent{color:var(--red-dark);animation:blink .5s steps(2,jump-none) infinite}.actionbar__submit{flex:1;cursor:pointer;border:0;border-left:2px solid var(--cream-line);background:#9a1b30;box-shadow:inset 0 .2cqw #ffffff1f,inset 0 -.3cqw #00000040;color:var(--cream);font-family:var(--font-slab);font-size:22px;letter-spacing:.06em}.actionbar__submit:hover{filter:brightness(1.12)}.actionbar__submit:active{transform:translateY(1px)}.scorebox{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 18px;background:var(--navy);border:2px solid var(--cream-line);border-radius:10px;box-shadow:0 0 0 3px var(--ink)}.scorebox__label{font-size:12px;font-weight:700;letter-spacing:.16em;color:#d9cdb4}.scorebox__value{font-size:20px;font-weight:700}@container (min-width: 640px){.stage{position:relative;display:block}.stage__ui{position:absolute;top:0;right:0;bottom:0;left:0;display:block;padding:0;pointer-events:none}.stage__ui>*{position:absolute;pointer-events:auto}.qcard{top:27.4%;left:23.5%;width:52.8%;padding:1.6cqw 2.6cqw 1.9cqw;border-width:.25cqw;border-radius:1.2cqw;box-shadow:0 0 0 .3cqw var(--ink),inset 0 0 0 .35cqw var(--navy),inset 0 0 0 .45cqw var(--navy-line)}.qcard__eyebrow{font-size:1.45cqw}.qcard__prompt{margin-top:1.1cqw;padding-left:2.8cqw;font-size:2.75cqw}.qcard__note{margin:.9cqw 0 1.3cqw 2.8cqw;font-size:1.45cqw}.strikes__light{width:1.3cqw;height:1.3cqw}.rules{margin-top:1.4cqw;font-size:1.7cqw}.guess__input{padding:.8cqw 1.2cqw;font-size:1.65cqw;border-width:.2cqw;border-radius:.9cqw}.result{padding:1.4cqw;border-width:.25cqw}.result__title{font-size:3.2cqw}.result__detail{font-size:2.2cqw}.result__points{font-size:1.6cqw}.actionbar{left:33.1%;bottom:5.6%;width:34.5%;height:9.4%;border-width:.25cqw;border-radius:1.2cqw;box-shadow:0 0 0 .4cqw var(--ink)}.actionbar__clock{gap:.8cqw;padding:0 1.6cqw}.actionbar__icon{width:2.4cqw;height:2.4cqw}.actionbar__seconds{font-size:2.9cqw}.actionbar__submit{border-left-width:.25cqw;font-size:2.6cqw}.scorebox{right:1.1%;bottom:3.2%;width:12%;padding:1cqw 0;border-width:.25cqw;border-radius:1.2cqw;box-shadow:0 0 0 .4cqw var(--ink)}.scorebox__label{font-size:1.35cqw}.scorebox__value{font-size:2.1cqw;white-space:nowrap}}@container (max-width: 639px){.linescore{font-size:5px}.logo__title{-webkit-text-stroke-width:1.2cqw}.pips{top:auto;bottom:0}}.summary{display:flex;flex-direction:column;gap:14px;padding:18px 14px 0}.eyebrow{font-size:13px;font-weight:700;letter-spacing:.12em;color:var(--coral)}.summary__hero{display:grid;gap:8px;padding:22px 18px;text-align:center;background:var(--navy);border:2px solid var(--cream-line);border-radius:10px;box-shadow:0 0 0 3px var(--ink)}.summary__total{font-family:var(--font-slab);font-size:clamp(36px,9vw,64px)}.summary__rank{font-family:var(--font-slab);font-size:clamp(16px,3.4vw,22px);color:var(--tier-moonshot)}.summary__estimate{color:var(--muted)}.boxscore{display:grid;gap:8px}.boxscore__row{display:flex;align-items:center;gap:14px;padding:12px 14px;background:var(--navy);border:2px solid var(--navy-line);border-radius:8px}.boxscore__badge{flex:none;min-width:48px;padding:8px 6px;text-align:center;font-family:var(--font-slab);color:var(--ink);background:var(--tier-color, var(--cream));border-radius:4px}.boxscore__body{flex:1;min-width:0}.boxscore__prompt,.boxscore__rarest{font-size:14px;color:var(--muted)}.boxscore__answer{font-weight:700}.boxscore__points{font-family:var(--font-slab);color:var(--tier-color, var(--cream))}.summary__again{align-self:center;width:min(100%,320px);height:56px;border:2px solid var(--cream-line);border-radius:10px}.summary__again--quiet{background:var(--navy);color:var(--cream)}.summary__streak{margin-top:6px;font-size:14px;color:var(--muted)}.summary__sharenote{align-self:center;font-size:14px;color:var(--muted);overflow-wrap:anywhere}[data-tier=bloop]{--tier-color: var(--tier-bloop)}[data-tier=single]{--tier-color: var(--tier-single)}[data-tier=double]{--tier-color: var(--tier-double)}[data-tier=triple]{--tier-color: var(--tier-triple)}[data-tier=homer]{--tier-color: var(--tier-homer)}[data-tier=moonshot]{--tier-color: var(--tier-moonshot)}[data-tier=strikeout]{--tier-color: var(--tier-strikeout)}.qcard.is-shaking-0{animation:shake-a .4s}.qcard.is-shaking-1{animation:shake-b .4s}@keyframes shake-a{20%{transform:translate(-10px)}40%{transform:translate(9px)}60%{transform:translate(-6px)}80%{transform:translate(4px)}}@keyframes shake-b{20%{transform:translate(-10px)}40%{transform:translate(9px)}60%{transform:translate(-6px)}80%{transform:translate(4px)}}.strikes__light.is-lit{animation:pop-in .4s both}.result{animation:pop-in .45s both}.pips__pip[data-tier]{animation:pip-pop .6s both}.scorebox__value.is-bumping{display:inline-block;animation:bump .5s}.scorebox{overflow:visible}.scorebox__gain{position:absolute;top:-4px;left:50%;font-family:var(--font-slab);font-size:20px;color:var(--tier-color, var(--cream));text-shadow:2px 2px 0 var(--ink);opacity:0;animation:float-up 1.3s ease-out}.celebrate{position:absolute;top:0;left:0;right:0;aspect-ratio:868 / 482;pointer-events:none;overflow:hidden;z-index:20}.celebrate__flash{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--tier-color, var(--cream));opacity:0;animation:flash .55s ease-out}.celebrate__spark{position:absolute;top:62%;left:50%;width:1.1cqw;height:1.1cqw;background:var(--tier-color, var(--cream));box-shadow:0 0 0 .25cqw var(--ink);opacity:0;animation:spark .9s var(--delay, 0ms) ease-out both}[data-tier=homer].result,[data-tier=moonshot].result{animation:pop-in .45s both,glow .9s .45s 2}@keyframes glow{50%{box-shadow:0 0 0 .5cqw var(--tier-color),0 0 3cqw var(--tier-color)}}@keyframes pop-in{0%{transform:scale(.5);opacity:0}60%{transform:scale(1.08);opacity:1}to{transform:scale(1);opacity:1}}@keyframes pip-pop{0%{transform:scale(.4)}55%{transform:scale(1.5)}to{transform:scale(1)}}@keyframes bump{40%{transform:scale(1.35);color:var(--tan)}}@keyframes float-up{0%{transform:translate(-50%);opacity:0}15%{opacity:1}to{transform:translate(-50%,-46px);opacity:0}}@keyframes flash{0%{opacity:.55}to{opacity:0}}@keyframes spark{0%{transform:rotate(var(--angle)) translate(0);opacity:1}to{transform:rotate(var(--angle)) translate(var(--reach));opacity:0}}@keyframes rainbow{0%{color:#ff5ea8}25%{color:#ffd23f}50%{color:#7be07b}75%{color:#5ec8ff}}@keyframes blink{50%{opacity:.35}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation:none!important}}
