*{box-sizing:border-box}html{height:100%;background:#0a1116}body{margin:0;min-height:100%;color:#eef4ef;font-family:Arial,Helvetica,sans-serif;background:radial-gradient(ellipse at 20% 0,#293740 0,transparent 55%),#0a1116;--flavour:#f7abd3;--accent:#e876bb}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #dfff87;outline-offset:3px}button:disabled{cursor:default;opacity:.4}[hidden]{display:none!important}.cabinet{width:min(100% - 28px,570px);margin:auto;padding:max(12px,env(safe-area-inset-top)) 0 max(10px,env(safe-area-inset-bottom));min-height:100svh;display:flex;flex-direction:column;gap:10px}header{height:62px;display:flex;align-items:center;gap:14px;padding:0 8px}header img{width:56px;height:45px;object-fit:contain;mix-blend-mode:screen}header strong{display:block;font-size:22px;letter-spacing:-.7px;font-weight:950;margin-top:4px}.eyebrow{font-size:9px;letter-spacing:2px;font-weight:800;color:#a4c8bc}.review{margin-left:auto;font-size:8px;line-height:1.6;letter-spacing:1.5px;color:#dfff87}.machine{position:relative;border:1px solid #465458;border-radius:22px;background:#0d1b20;overflow:hidden;box-shadow:0 0 0 5px #ffffff04,0 18px 60px #0005;display:flex;flex-direction:column;min-height:550px;flex:1}.hud{display:grid;grid-template-columns:1fr 1fr 1fr;padding:16px 20px 13px;border-bottom:1px solid #ffffff0e;background:linear-gradient(110deg,#182c32,#102329)}small{display:block;font-size:8px;letter-spacing:1.5px;color:#98b4b3;font-weight:700}.hud strong{display:block;font:800 21px 'Courier New',monospace;margin-top:5px;letter-spacing:.5px}.hud strong span{font-size:12px}.center{text-align:center}.center strong{color:var(--flavour)}.right{text-align:right}.urgent{color:#ff9e8c!important}.mission{height:83px;padding:9px 17px;display:flex;align-items:center;gap:11px;background:#12272b;border-bottom:1px solid #ffffff0a;z-index:2}.mission>img{height:60px;width:46px;object-fit:contain;background:#f5f2ed;border-radius:10px;padding:3px}.mission-copy{flex:1;min-width:0}.mission-copy>strong{display:block;font-size:20px;font-weight:900;letter-spacing:-.5px;color:var(--flavour);margin-top:4px}.strikes{text-align:right}.strikes small{font-size:7px;letter-spacing:1px}.strikes strong{font-size:13px;letter-spacing:2px;color:#dfff87;display:block;margin-top:7px}.sequence{display:flex;gap:5px;margin-top:5px}.sequence span{width:6px;height:6px;background:#476061;border-radius:50%}.sequence .current{background:#e3ffab;box-shadow:0 0 8px #dfff87}.arena{position:relative;flex:1;min-height:335px;padding:16px;isolation:isolate;background:radial-gradient(ellipse at 50% 0,#28414666,transparent 65%),repeating-linear-gradient(90deg,#ffffff02 0 1px,transparent 1px 44px),#0d1b20;overflow:hidden}.ambient{position:absolute;border:1px solid var(--flavour);border-radius:50%;opacity:.08;pointer-events:none;z-index:-1}.ambient-one{width:370px;height:370px;left:-140px;top:20px}.ambient-two{width:280px;height:280px;right:-130px;bottom:-40px}.grid{height:100%;min-height:303px;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:12px}.slot{position:relative;min-height:90px;border:1px solid #a2c7c314;background:linear-gradient(135deg,#17303744,#101b2233);border-radius:17px;padding:0;color:#294044;overflow:visible;touch-action:manipulation;user-select:none}.slot:disabled{opacity:1}.slot .empty{position:absolute;inset:0;display:grid;place-items:center;color:#486060;font-size:10px;font-family:monospace;opacity:.45}.token{position:absolute;inset:0;border-radius:17px;background:linear-gradient(155deg,#fffefa,#e8e8dd);box-shadow:inset 0 1px 1px white,0 8px 10px #0003;display:flex;align-items:center;flex-direction:column;justify-content:center;animation:arrive .19s cubic-bezier(.17,.89,.4,1.2);overflow:hidden;transform-origin:center}.token::before{content:'';position:absolute;inset:5px;border:1px solid #a6b7ab33;border-radius:12px;pointer-events:none}.token img{width:67%;height:72%;max-height:95px;object-fit:contain;mix-blend-mode:multiply;transform:rotate(-7deg);pointer-events:none;filter:drop-shadow(1px 4px 2px #1d29321b)}.token .name{position:relative;color:#243435;font-size:9px;line-height:1.1;font-weight:800;max-width:94%;text-align:center;padding:0 3px 5px}.token .ttl{position:absolute;bottom:0;left:0;right:0;height:3px;background:var(--accent);transform:scaleX(var(--ttl));transform-origin:left}.token.expiring .ttl{background:#cf623f}.token.expiring{filter:saturate(.75)}.slot.hit{box-shadow:0 0 20px var(--flavour)}.slot.wrong{animation:wrong .22s linear}.cue{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;background:#102229d9;backdrop-filter:blur(5px);z-index:5}.cue strong{font-size:30px;color:var(--flavour);font-weight:900;margin-top:10px;letter-spacing:-1px}.cue small{font-size:10px}.callout{position:absolute;bottom:9px;left:50%;transform:translateX(-50%);background:#dfff87;color:#122326;border-radius:30px;font-size:10px;font-weight:900;letter-spacing:.7px;padding:8px 14px;pointer-events:none;opacity:0;white-space:nowrap;z-index:6}.callout.show{opacity:1}.burst{position:absolute;width:7px;height:10px;background:var(--flavour);border-radius:60% 40% 60% 40%;pointer-events:none;z-index:8;animation:splash .52s ease-out forwards}.point{position:absolute;color:#f0ffca;font-size:22px;font-weight:900;text-shadow:0 2px 5px #000a;pointer-events:none;z-index:9;animation:points .6s ease-out forwards}.tank{position:relative;min-height:49px;background:#173537;border-top:1px solid #5b77754f;overflow:hidden}.tank-content{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:6px;padding:18px 15px;font-size:8px;letter-spacing:.5px}.tank-content strong{font-size:9px}.tank-content>span:last-child{font-size:14px;font-weight:900}#liquid{position:absolute;inset:0;background:linear-gradient(90deg,var(--accent),var(--flavour));opacity:.36;transform:translateX(-100%);transition:transform .3s ease}#liquid::after{content:'';position:absolute;right:0;top:-30px;height:110px;width:20px;background:#fff6;border-radius:50%;filter:blur(6px)}.controls{padding:4px 4px 0}.controls>div{display:flex;gap:8px;justify-content:center}.controls button{border:1px solid #667b794f;color:#bbd2cc;background:#ffffff03;border-radius:20px;min-height:36px;padding:7px 16px;font-size:9px;font-weight:800;letter-spacing:.7px}.controls p{display:flex;justify-content:space-between;color:#75948d;font-size:7px;letter-spacing:.8px;padding:4px}.overlay{position:absolute;inset:0;z-index:12;background:radial-gradient(ellipse at 80% 35%,#263f4177,transparent 60%),#102127f5;backdrop-filter:blur(7px);overflow-y:auto}.overlay-inner{min-height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:27px 25px}.overlay h1{font-size:clamp(44px,10vw,65px);font-weight:950;line-height:.94;letter-spacing:-3px;margin:18px 0 10px;text-align:left;align-self:center}.overlay em{font-style:italic;color:#dcff86}.hero-shots{display:flex;align-items:center;justify-content:center;height:150px;margin:6px 0 3px;width:100%}.hero-shots img{background:#f7f4ed;object-fit:contain;padding:6px;border-radius:17px;width:86px;height:124px;box-shadow:0 9px 25px #0004;transform:rotate(-14deg)}.hero-shots img:nth-child(2){width:98px;height:144px;z-index:1;transform:rotate(5deg);margin:0 -8px}.hero-shots img:last-child{transform:rotate(16deg)}.overlay p{color:#b3c9c7;font-size:13px;line-height:1.6;margin:12px 0 15px;max-width:360px}.brief{display:flex;flex-direction:column;gap:9px;text-align:left;color:#c1d5cd;font-size:10px;margin:0 0 20px}.brief b{color:#ddff89;margin-right:8px}.primary{width:100%;max-width:320px;min-height:52px;background:#dcff86;color:#162629;border:0;border-radius:12px;box-shadow:0 4px 0 #96b354;font-size:12px;font-weight:900;letter-spacing:.5px;padding:13px}.primary:hover{background:#e6ffab}.secondary{color:#bdcec9;background:transparent;border:1px solid #78958c4a;border-radius:10px;min-height:40px;width:100%;max-width:320px;font-size:10px;font-weight:800;margin-top:13px;padding:8px}.overlay .legal{font-size:9px;line-height:1.5;margin:18px 0 0;color:#829d95}.result-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:20px;font-size:9px;color:#91b1a4}.result-stats b{display:block;color:#e4eddf;font:800 20px monospace;margin-bottom:4px}.medal{font-size:12px;color:#f2dd9b!important;letter-spacing:3px!important}.sound-on{color:#dfff87!important}.paused .arena{filter:saturate(.5)}
@keyframes arrive{from{opacity:0;transform:translateY(9px) scale(.87)}to{opacity:1;transform:none}}@keyframes splash{to{transform:translate(var(--dx),var(--dy)) rotate(80deg) scale(.15);opacity:0}}@keyframes points{to{transform:translateY(-35px);opacity:0}}@keyframes wrong{25%,75%{transform:translateX(-3px)}50%{transform:translateX(3px)}}
@media(min-height:900px){.cabinet{max-height:900px;min-height:900px}.arena{min-height:390px}}@media(max-width:430px){.cabinet{width:calc(100% - 20px);gap:8px}header{height:52px;gap:10px}header strong{font-size:18px}header img{width:45px}.machine{min-height:0}.hud{padding:12px 14px}.hud strong{font-size:19px}.mission{padding:7px 12px;height:78px}.mission-copy>strong{font-size:17px}.arena{padding:12px;min-height:320px}.grid{gap:9px;min-height:296px}.slot{min-height:90px}.keys{display:none}.controls button{min-height:36px;padding:6px 15px}.hero-shots{height:128px}.hero-shots img{height:106px;width:74px}.hero-shots img:nth-child(2){height:126px;width:88px}.overlay-inner{padding:20px}.overlay h1{font-size:49px;margin:15px 0 8px}.overlay p{font-size:12px}.review{font-size:7px}}
@media(max-height:730px){.cabinet{gap:6px}header{height:44px}.hud{padding:9px 13px}.hud strong{font-size:17px}.mission{height:66px}.mission>img{height:48px;width:38px}.arena{min-height:264px;padding:9px}.grid{min-height:246px;gap:8px}.slot{min-height:76px}.token img{max-height:64px}.token .name{font-size:8px}.tank{min-height:40px}.tank-content{padding:12px}.controls p{margin:4px 0}.controls button{min-height:32px}.overlay-inner{padding:20px 22px}.overlay h1{font-size:45px;margin:12px 0 6px}.hero-shots{height:96px}.hero-shots img{height:84px;width:62px;border-radius:12px}.hero-shots img:nth-child(2){height:96px;width:70px}.overlay p{font-size:11px;margin:9px 0}.brief{margin-bottom:14px;gap:7px}.overlay .legal{margin-top:14px}.primary{min-height:45px}.mission-copy>strong{font-size:16px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.burst{display:none}.point{display:none}.overlay,.cue{backdrop-filter:none}}

.arena{display:flex}.grid{flex:1;width:100%;height:auto}.token img{max-height:110px}.sequence{min-height:0}


.sequence span{width:auto;height:auto;border-radius:4px;padding:3px 4px;font-size:7px;font-weight:800;color:#bed0c6;background:#243d40}.sequence .current{color:#17292a;box-shadow:none}.mission:has(.sequence span){height:90px}