:root{--navy: #122040;--navy2: #0a1428;--ink: #070d1e;--hivis: #d4ef3a;--hivis2: #a9c51c;--cream: #fff6e6;--water: #9fdcff;--flame: #ff8a2a;--warn: #ffdf4a;--chrome: #cfd6e2;--type: "Avenir Next Condensed", "Avenir Next", "Arial Narrow", "Roboto Condensed", "Helvetica Neue", Arial, sans-serif;--num: "DIN Condensed", "DIN Alternate", "Bahnschrift", "Avenir Next Condensed", "Arial Narrow", sans-serif}html,body{background:var(--ink);color:var(--cream);font-family:var(--type)}.stage{background:var(--ink)}.hud{position:absolute;left:0;right:0;top:0;z-index:3;display:flex;align-items:flex-start;justify-content:space-between;padding:calc(8px + var(--safe-t)) calc(10px + var(--safe-r)) 0 calc(10px + var(--safe-l));pointer-events:none}.plate{background:linear-gradient(180deg,#1d3160,var(--navy) 55%,var(--navy2));border:1.5px solid rgba(207,214,226,.55);box-shadow:inset 0 1px #ffffff38,inset 0 -2px #0000004d,0 4px 12px #00000073}.btn{pointer-events:auto;width:44px;height:44px;display:grid;place-items:center;border-radius:50%;color:var(--cream);text-decoration:none;transition:transform .12s ease}.btn:active{transform:scale(.92)}.btn svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}.mute .spk{fill:currentColor;stroke:none}.mute .off,.mute[aria-pressed=true] .wav{display:none}.mute[aria-pressed=true] .off{display:inline}.mute[aria-pressed=true]{color:#fff6e680}.tally{display:flex;flex-direction:column;align-items:center;gap:4px;margin-top:0}.scoreRow{display:flex;align-items:center;gap:8px}.score{min-width:2ch;text-align:center;font-family:var(--num);font-size:34px;line-height:1;font-weight:700;letter-spacing:.02em;font-variant-numeric:tabular-nums;color:var(--cream);text-shadow:0 2px 0 rgba(0,0,0,.5),0 0 18px rgba(255,138,42,.25);transition:transform .25s cubic-bezier(.2,1.6,.4,1)}.score.pop{transform:scale(1.18)}.mult{font-family:var(--num);font-weight:700;font-size:15px;line-height:1;padding:4px 7px 3px;border-radius:6px;background:#ffffff14;color:#fff6e68c;border:1px solid rgba(255,255,255,.15);transition:all .2s ease}.mult.on{background:var(--hivis);color:var(--navy2);border-color:var(--hivis);box-shadow:0 0 14px #d4ef3a73}.mult.bump{animation:bump .45s cubic-bezier(.2,1.6,.4,1)}.mult.drop{animation:shake .4s ease}@keyframes bump{0%{transform:scale(1)}40%{transform:scale(1.5)}to{transform:scale(1)}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-4px)}75%{transform:translate(4px)}}.streak{display:flex;gap:4px;height:5px}.streak i{width:14px;height:4px;border-radius:2px;background:#ffffff29;transition:background .2s ease}.streak i.on{background:var(--hivis)}.status{display:flex;align-items:center;gap:10px;padding:5px 10px;border-radius:99px;background:#070d1e99;border:1px solid rgba(207,214,226,.22)}.tank{display:flex;align-items:center;gap:5px}.tank svg{width:10px;height:14px;fill:var(--water)}.tank .bar{position:relative;width:66px;height:8px;border-radius:4px;background:#ffffff1a;overflow:hidden;box-shadow:inset 0 0 0 1px #ffffff1f}.tank i{position:absolute;inset:0;transform-origin:left center;background:linear-gradient(90deg,#4fb6ec,var(--water));border-radius:4px}.tank.low i{background:repeating-linear-gradient(135deg,#ff8a6a 0 5px,#c4402a 5px 10px)}.pips{display:flex;gap:3px;align-items:flex-end}.pips i{width:10px;height:13px;position:relative;display:block;-webkit-mask:var(--flameMask) center / contain no-repeat;mask:var(--flameMask) center / contain no-repeat;background:#ffffff38;transition:background .15s ease,transform .2s ease}.pips i.on{background:var(--flame);transform:scale(1.12)}.pips i.end{-webkit-mask-image:var(--houseMask);mask-image:var(--houseMask);background:var(--cream);width:12px}.pips.danger i.on{animation:blink .5s ease-in-out infinite}.pips.danger i.end{background:var(--warn);animation:blink .5s ease-in-out infinite}@keyframes blink{50%{opacity:.45}}:root{--flameMask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 13'%3E%3Cpath d='M5 13C2 13 0.5 11 1 8.5 1.5 6 4 5 4 1.5 6.5 3 9 5.5 9 8.5 9 11 7.5 13 5 13z'/%3E%3C/svg%3E");--houseMask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 13'%3E%3Cpath d='M6 1 0.5 6H2v7h8V6h1.5z'/%3E%3C/svg%3E")}.title,.card,.paused{position:absolute;z-index:2;pointer-events:none;text-align:center}.title{inset:0;display:flex;align-items:center;justify-content:center;padding:calc(64px + var(--safe-t)) 20px calc(40px + var(--safe-b));background:radial-gradient(ellipse 80% 45% at 50% 46%,#070d1edb,#070d1e59 75%,#070d1e1a)}.title.fade{animation:fadeOut .45s ease forwards}@keyframes fadeOut{to{opacity:0;transform:scale(1.04)}}.badge{position:relative;width:min(316px,100%);padding:18px 20px;border-radius:22px;background:radial-gradient(120% 60% at 18% 0%,rgba(150,180,255,.22),transparent 60%),radial-gradient(110% 55% at 50% 112%,rgba(255,128,48,.32),transparent 65%),linear-gradient(180deg,#1d3160f5,#0a1428f5);border:2px solid var(--chrome);box-shadow:inset 0 0 0 4px #070d1e99,inset 0 0 0 5px #cfd6e24d,0 20px 50px #0000008c}.crest{font-size:11px;font-weight:700;letter-spacing:.3em;text-transform:uppercase;color:var(--chrome)}.title h1{margin:2px 0 0;font-size:clamp(60px,19vw,82px);font-weight:900;letter-spacing:.06em;text-transform:uppercase;line-height:.95;color:var(--cream);padding-left:.06em;font-stretch:condensed;text-shadow:0 2px 0 #c9d2e0,0 4px 0 #6b7690,0 6px 0 #2b3656,0 10px 18px rgba(0,0,0,.6),0 0 34px rgba(255,138,42,.35)}.tape{height:10px;margin:10px 6px 0;border-radius:2px;box-shadow:0 0 12px #d4ef3a40;background:repeating-linear-gradient(-45deg,var(--hivis) 0 9px,#e8eadf 9px 12px,var(--hivis) 12px 21px,var(--hivis2) 21px 24px)}.sub{margin:10px 0 0;font-size:18px;font-weight:600;letter-spacing:.04em;color:var(--cream);opacity:.92}.legend{display:flex;gap:10px;justify-content:center;margin:14px 0 8px}.legend figure{margin:0;width:124px;height:70px;display:grid;place-items:center;border-radius:12px;background:#070d1e99;border:1px solid rgba(207,214,226,.25)}.legend svg{width:108px;height:64px;overflow:visible}.legend .arc{fill:none;stroke:var(--water);stroke-width:3.2;stroke-linecap:round;stroke-dasharray:.1 6}.legend .win{fill:#0f182c;stroke:#c9c2b0;stroke-width:1.5}.legend .fl{fill:var(--flame)}.legend .fl2{fill:#ffe27a}.legend .ret{fill:none;stroke:var(--hivis);stroke-width:1.8}.legend .cat{fill:#f08a3c}.legend .ring{fill:none;stroke:#ffc7d9;stroke-width:2.4;stroke-linecap:round}.legend .heart{fill:#ff7fa6}.cta{margin-top:10px;font-size:15px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--cream);animation:breathe 2.2s ease-in-out infinite}@keyframes breathe{0%,to{opacity:.5}50%{opacity:1}}.best{margin-top:6px;font-size:13px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--hivis)}.card{left:50%;top:47%;width:min(300px,calc(100% - 44px));transform:translate(-50%,-44%) scale(.96);opacity:0;padding:18px 20px 16px;border-radius:20px;color:var(--cream);background:radial-gradient(120% 50% at 18% 0%,rgba(150,180,255,.2),transparent 60%),radial-gradient(110% 50% at 50% 110%,rgba(255,120,44,.34),transparent 65%),linear-gradient(180deg,#1d3160,var(--navy) 50%,var(--navy2));border:2px solid var(--chrome);box-shadow:inset 0 0 0 4px #070d1e8c,inset 0 0 0 5px #cfd6e247,0 24px 60px #0009,0 0 60px #ff78282e;transition:opacity .35s ease,transform .5s cubic-bezier(.2,1.4,.4,1)}.card:before{content:"";position:absolute;left:18px;right:18px;top:-5px;height:8px;border-radius:2px;background:repeating-linear-gradient(-45deg,var(--hivis) 0 9px,#e8eadf 9px 12px,var(--hivis) 12px 21px,var(--hivis2) 21px 24px)}.card.show{opacity:1;transform:translate(-50%,-50%) scale(1)}.eyebrow{margin-top:4px;font-size:12px;font-weight:700;letter-spacing:.26em;text-transform:uppercase;color:var(--flame)}.safe{margin-top:2px;font-size:15px;font-weight:600;color:var(--chrome)}.big{font-family:var(--num);font-size:76px;font-weight:700;line-height:1;margin-top:8px;font-variant-numeric:tabular-nums;text-shadow:0 3px 0 rgba(0,0,0,.45),0 0 30px rgba(255,138,42,.3)}.newbest{display:inline-block;margin-top:6px;padding:5px 14px 4px;border-radius:99px;font-size:12px;font-weight:800;letter-spacing:.22em;text-transform:uppercase;color:var(--navy2);background:var(--hivis);box-shadow:0 0 18px #d4ef3a80;animation:shine 1.4s ease-in-out infinite}.newbest:before{content:"★ "}@keyframes shine{0%,to{transform:scale(1)}50%{transform:scale(1.07)}}.stats{display:flex;justify-content:center;gap:8px;margin-top:12px}.stats div{flex:1;padding:6px 0 5px;border-radius:10px;background:#ffffff0f;border:1px solid rgba(255,255,255,.1)}.stats b{display:block;font-family:var(--num);font-size:24px;line-height:1}.stats span{display:block;margin-top:2px;font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--chrome)}.row{display:flex;justify-content:space-between;align-items:baseline;margin:12px 4px 0;padding-top:10px;border-top:1px solid rgba(207,214,226,.25);font-size:13px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--chrome)}.row b{font-family:var(--num);font-size:24px;letter-spacing:.02em;color:var(--cream)}.paused{inset:0;display:grid;place-items:center;background:#070d1eb3}@media(max-height:680px){.legend{margin:8px 0 4px}.legend figure{height:60px}.title h1{font-size:58px}.score{font-size:30px}}@media(prefers-reduced-motion:reduce){.cta,.newbest,.pips.danger i{animation:none;opacity:1}.score,.mult{transition:none;animation:none}}.tape,.card:before{background-size:34px 34px;animation:tapeGlint 2.4s linear infinite}@keyframes tapeGlint{to{background-position:34px 0}}.title h1{animation:titleGlow 3.2s ease-in-out infinite}@keyframes titleGlow{0%,to{filter:brightness(1)}50%{filter:brightness(1.08)}}.badge:after{content:"";position:absolute;inset:0;border-radius:22px;pointer-events:none;overflow:hidden;background:linear-gradient(105deg,transparent 38%,rgba(255,255,255,.12) 50%,transparent 62%) -140% 0 / 250% 100% no-repeat;animation:badgeSweep 5s ease-in-out infinite}@keyframes badgeSweep{0%,55%{background-position:140% 0}to{background-position:-140% 0}}.big{animation:bigPop .7s cubic-bezier(.2,1.6,.4,1) both .15s}@keyframes bigPop{0%{transform:scale(.6);opacity:0}to{transform:scale(1);opacity:1}}@media(prefers-reduced-motion:reduce){.tape,.card:before,.title h1,.badge:after,.big{animation:none}}
