/* © 2026 18cores, LLC. All rights reserved. */
:root{color-scheme:dark;--bg: #0b1119;--panel: #101923;--line: #26323c;--muted: #83949e;--ink: #eff5ed;--green: #bdff64;--orange: #ff9366;--mono: ui-monospace, SFMono-Regular, Consolas, monospace}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:Arial,Helvetica,sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit}button:disabled{cursor:default;opacity:.4}button:focus-visible,a:focus-visible{outline:2px solid var(--green);outline-offset:3px}a{color:inherit;text-decoration:none}.app{width:100%;height:100vh;height:100dvh;padding:0 12px 10px;display:flex;flex-direction:column;background:var(--bg)}.header{flex:0 0 46px;display:flex;align-items:center;justify-content:space-between;gap:12px}.brand{display:flex;align-items:center;gap:9px;font-weight:900;font-size:15px;letter-spacing:1.5px;white-space:nowrap}.brand svg{width:23px;height:23px;fill:var(--green)}.header-right{display:flex;align-items:center;gap:8px}.volume-control{display:flex;align-items:center;gap:6px}.volume-control input{width:80px;margin:0;accent-color:var(--green);cursor:pointer}.volume-control output{width:30px;color:var(--muted);font:9px var(--mono)}.volume-control input:focus-visible{outline:2px solid var(--green);outline-offset:3px}.icon-button{border:1px solid var(--line);background:transparent;padding:6px 9px;border-radius:4px;font-size:14px}.icon-button span{font:10px var(--mono);margin-left:4px}.icon-button svg{width:14px;height:14px;vertical-align:-2px;fill:none;stroke:currentColor;stroke-width:1.5}.icon-button:hover{background:var(--panel);border-color:#546552}.control-button{border-color:transparent}.control-button i,.game-footer i{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--green);margin-right:6px}.control-label{color:var(--muted)}main{flex:1;min-height:0}.cabinet{width:100%;height:100%;display:grid;grid-template-rows:50px minmax(0,1fr) 30px;border:1px solid #34434c;border-radius:6px;overflow:hidden;background:#070c13}.hud{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:0 22px;background:#111b25;border-bottom:1px solid var(--line)}.hud>div{min-width:90px}.hud span{display:block;font:8px var(--mono);letter-spacing:1.5px;color:var(--muted);margin-bottom:4px}.hud strong{font:19px var(--mono);letter-spacing:2px}.hud-best strong{color:#a8bca0}.hud-center{text-align:center}.hud-center strong{font-size:14px}.hud-center span{font-size:10px;letter-spacing:1px;transition:color .3s}.hud-center span.hot{color:var(--orange)}.hud-lives{text-align:right}.hud-lives strong{color:var(--green);font-size:18px}.screen{position:relative;min-height:0;min-width:0;overflow:hidden;background:#070c13}canvas{display:block;width:100%;height:100%;object-fit:contain}.screen:after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,#0000 0 3px,#0002 4px);opacity:.23}.overlay{position:absolute;inset:0;display:grid;place-items:center;background:radial-gradient(ellipse at center,#080f19ef 5%,#080f1980 75%);z-index:2;text-align:center;overflow-y:auto}.overlay[hidden]{display:none}.overlay-content{padding:24px;width:min(540px,100%);max-height:100%}.mission-tag{font:9px var(--mono);letter-spacing:2px;color:var(--green);margin-bottom:23px}.hero-alien svg{height:52px;width:52px;color:var(--green);filter:drop-shadow(0 0 12px #bdff6499)}h1{font-size:clamp(30px,4.2vw,58px);letter-spacing:-2px;margin:16px 0 10px;font-weight:800}.overlay p{color:#9fb0bd;font-size:13px;margin:0 0 25px;line-height:1.5}.primary-button{border:0;border-radius:4px;background:var(--green);color:#14200d;font-size:13px;font-weight:700;padding:16px 24px;min-width:230px;display:inline-flex;gap:35px;align-items:center;justify-content:space-between}.primary-button:hover{background:#d1ff96}.primary-button span{font-size:20px;line-height:16px}#start-hint{display:block;font:8px var(--mono);letter-spacing:1px;color:#81919c;margin-top:17px}.secondary-button{display:block;margin:17px auto 0;border:0;background:transparent;color:#aebbc4;font-size:12px}.secondary-button[hidden]{display:none}.title-controls{font:10px/1.7 var(--mono);color:var(--muted);margin-top:24px}.title-controls span{margin:0 7px;color:#455966}.game-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 16px;border-top:1px solid var(--line);background:#111b25}.game-footer>span{font:8px var(--mono);letter-spacing:1px;color:#aab9c1}.game-footer .play-hint{color:#6d838e}.play-hint span{padding:0 12px}.text-button{border:0;background:transparent;font:10px var(--mono);padding:0;color:#cbd5d7;white-space:nowrap}.text-button:hover{color:var(--green)}kbd{display:inline-block;border:1px solid #35434d;border-radius:3px;padding:2px 4px;font:8px var(--mono);color:#a4b4bf;margin-left:8px}.toast{position:absolute;bottom:18px;left:50%;transform:translate(-50%);padding:10px 18px;color:var(--green);background:#101b26e8;border:1px solid #bdff6444;border-radius:4px;font:11px var(--mono);letter-spacing:1px;opacity:0;transition:opacity .15s;z-index:4;max-width:95%;text-align:center;pointer-events:none}.toast.visible{opacity:1}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}dialog{background:#111b25;color:var(--ink);border:1px solid #43524a;border-radius:10px;padding:32px;max-width:480px;width:calc(100% - 32px);max-height:calc(100dvh - 32px);box-shadow:0 24px 100px #0008}dialog::backdrop{background:#020710d9}.section-label{font:10px var(--mono);letter-spacing:1.5px;color:#bdc9cd;margin-bottom:15px}dialog h2{font-size:32px;letter-spacing:-1px;margin:20px 0 12px}dialog p{color:#a5b5be;font-size:13px;line-height:1.7}dialog small{display:block;font:9px var(--mono);color:var(--muted);margin-top:18px}#controller-help{font-size:11px}#test-device{font:11px/1.6 var(--mono);color:var(--green);overflow-wrap:anywhere;margin:25px 0 18px}.test-indicators{display:flex;flex-wrap:wrap;gap:10px}.test-indicators span{flex:1 1 70px;text-align:center;border:1px solid var(--line);padding:16px 5px;font:11px var(--mono);border-radius:5px}.test-indicators .active{background:var(--green);color:#111b10}.test-detail{min-height:40px}.app:fullscreen{padding:0 6px 6px}.app:fullscreen .header{flex-basis:38px}@media(max-width:700px){.app{padding:0 6px 6px}.header{flex-basis:44px;gap:5px}.brand{font-size:12px;letter-spacing:1px;gap:5px}.brand svg{width:19px;height:19px}.header-right{gap:3px}.volume-control input{width:45px}.volume-control output{display:none}.icon-button{padding:6px}.icon-button>span{display:none}.control-button:after{content:"Controls";font:9px var(--mono)}.hud{padding:0 10px;gap:8px}.hud>div{min-width:0}.hud span{font-size:6px;letter-spacing:.6px}.hud strong{font-size:15px;letter-spacing:1px}.hud-center strong{font-size:11px}.hud-lives strong{font-size:13px}.game-footer{padding:0 9px}.game-footer>span{font-size:7px;letter-spacing:.3px}.game-footer .play-hint{display:none}.overlay-content{padding:20px 14px}.title-controls{font-size:8px}.title-controls span{margin:0 3px}.toast{font-size:9px;padding:8px 12px}}@media(max-height:700px){.overlay-content{padding-top:16px;padding-bottom:16px}.hero-alien{display:none}.mission-tag{margin-bottom:10px;font-size:8px}h1{font-size:36px;margin-top:10px}.overlay p{margin-bottom:16px}.title-controls{margin-top:15px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}.mission-tag{display:none}#start-hint{font:11px var(--mono);letter-spacing:1px;color:#9aa9b4;margin-top:18px}.title-controls{display:grid;gap:10px;justify-items:center;font:16px/1.5 Arial,Helvetica,sans-serif;color:#c9d4dc;margin-top:24px;padding:16px 22px;background:#080f19e6;border:1px solid #1d2c38;border-radius:10px;width:max-content;max-width:min(820px,calc(100vw - 32px));position:relative;left:50%;transform:translate(-50%)}.title-controls>div{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px 22px}.title-controls .act{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;margin:0;color:#d3dde4}.title-controls b{font:11px var(--mono);letter-spacing:1.5px;color:#8d9eaa;font-weight:400}.title-controls kbd{display:inline-block;min-width:36px;padding:6px 10px;font:bold 16px/1.2 var(--mono);color:#fff;background:#16263a;border:1px solid #4a6073;border-bottom-width:3px;border-radius:6px;text-align:center}@media(max-height:640px),(max-width:620px){.title-controls{font-size:14px;padding:12px 14px;gap:8px;margin-top:14px}.title-controls>div{gap:8px 14px}.title-controls kbd{font-size:14px;padding:5px 8px;min-width:30px}}.overlay{overflow-x:hidden;grid-template-columns:minmax(0,1fr)}.overlay-content{box-sizing:border-box;max-width:100%}@media(max-width:620px){.title-controls{width:auto;max-width:100%;left:0;transform:none}}canvas{touch-action:none;-webkit-user-select:none;user-select:none}.title-controls .touch-row{display:none}.app[data-input=touch] .title-controls>div:not(.touch-row){display:none}.app[data-input=touch] .title-controls .touch-row{display:flex}.app[data-input=touch] #start-hint{display:none}.app[data-input=touch] .cabinet{grid-template-rows:50px minmax(0,1fr) 0}.app[data-input=touch] .game-footer{display:none}@media(max-height:520px){.app[data-input=touch] .header{flex-basis:34px}.app[data-input=touch] .cabinet{grid-template-rows:32px minmax(0,1fr) 0}.app[data-input=touch] .hud span{font-size:6px;margin-bottom:1px}.app[data-input=touch] .hud strong{font-size:13px}}.hud{position:relative}.hud-tip{position:absolute;inset:0;display:grid;place-items:center;background:#111b25;color:var(--green);font:12px var(--mono);letter-spacing:2px;opacity:0;pointer-events:none;transition:opacity .4s}.hud.tip .hud-tip{opacity:1}.hud-pause{display:none}.app[data-input=touch] .hud-pause{display:flex;gap:4px;align-items:center;justify-content:center;flex:0 0 34px;min-width:0;height:34px;border:1px solid #3a4c5a;border-radius:50%}.app[data-input=touch] .hud-pause i{width:4px;height:12px;border-radius:1px;background:#eef4f8}.app[data-input=touch] .hud{cursor:pointer}html,body{height:100%;overflow:hidden;overscroll-behavior:none}body{touch-action:manipulation}.overlay{touch-action:pan-y}.app{position:fixed;inset:0;height:auto;padding-top:env(safe-area-inset-top);padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right));padding-bottom:max(10px,env(safe-area-inset-bottom))}@media(max-width:700px){.app{padding-left:max(6px,env(safe-area-inset-left));padding-right:max(6px,env(safe-area-inset-right));padding-bottom:max(6px,env(safe-area-inset-bottom))}}.title-controls .home-tip{display:none}.app[data-input=touch][data-home-tip=yes] .title-controls .home-tip{display:block;font-size:13px;color:#9aa9b4;margin-top:2px}.home-tip kbd{font-size:11px}#fullscreen[hidden]{display:none}.app[data-input=touch] .toast{top:14px;bottom:auto}.overlay-sound{display:none}@media(max-height:520px){.app[data-input=touch] .header{display:none}.app[data-input=touch]{padding-top:6px}.app[data-input=touch] .overlay-sound{display:block;margin:12px auto 0;border:0;background:transparent;color:#aebbc4;font-size:12px}}body{-webkit-touch-callout:none}.icon-button svg.speaker{width:16px;height:16px;vertical-align:-3px}.overlay-sound svg.speaker{width:14px;height:14px;vertical-align:-2px;fill:none;stroke:currentColor;stroke-width:1.5;margin-right:4px}.screen{display:flex}canvas{flex:1 1 0;min-width:0;width:auto}.backglass{display:none}@media(min-aspect-ratio:5/4)and (min-width:900px){.backglass{display:flex;flex-direction:column;flex:0 0 auto;height:100%;aspect-ratio:.64;padding:14px 0 14px 14px;gap:10px}.backglass img{width:100%;flex:1 1 0;min-height:0;object-fit:cover;object-position:top;border-radius:6px;border:2px solid #3b2a1c;box-shadow:0 0 40px #ffb54722,inset 0 0 0 1px #000}.backglass-art{position:relative;flex:1 1 0;min-height:0}.backglass-art img{position:absolute;inset:0;height:100%}.backglass-art img.night{opacity:0;box-shadow:none}.display{flex:0 0 auto;min-height:0;display:flex;flex-direction:column;justify-content:center;gap:6px;padding:10px 14px;border-radius:6px;border:2px solid #3b2a1c;background:radial-gradient(circle,#2a1400 0 1px,transparent 1.4px) 0 0 / 4px 4px,#0d0700;color:#ff9a2e;font:bold 15px var(--mono);letter-spacing:2px;text-shadow:0 0 8px #ff8a1fcc;text-align:center}.dmd-score{font-size:clamp(22px,3.2vw,40px);letter-spacing:3px}.dmd-row{display:flex;justify-content:space-between;font-size:13px}.dmd-message{min-height:3.4em;display:grid;align-content:center;gap:4px}.dmd-message b{font-size:clamp(16px,2vw,24px);letter-spacing:3px;color:#ffb547}.dmd-message span{font-size:11px;color:#ffc27a}.dmd-message.flash b{animation:dmd-flash .5s steps(2) 2}}@keyframes dmd-flash{50%{opacity:.25}}.hud-message{position:absolute;inset:0;display:grid;place-content:center;text-align:center;gap:1px;background:#120a02f2;color:#ffb547;font:bold 15px var(--mono);letter-spacing:2px;opacity:0;pointer-events:none;transition:opacity .15s;z-index:1}.hud-message span{font-size:9px;letter-spacing:1px;color:#ffc27a;font-weight:400}.hud-message.visible{opacity:1}:root{--green: #ffb547}.primary-button:hover{background:#ffd08a}.hero-alien svg{color:#ffb547;filter:drop-shadow(0 0 12px #ffb54799)}.brand svg{fill:#ffb547}.toast{color:#ffb547;border-color:#ffb54744}.primary-button{color:#2a1600}.touch-halves{display:inline-grid;grid-template-columns:1fr 1fr;width:116px;height:104px;border:2px solid #5c6f82;border-radius:10px;overflow:hidden;flex:0 0 auto}.touch-halves i{display:grid;place-items:center;font:bold 10px/1.35 var(--mono);letter-spacing:0;color:#ffd08a;text-align:center;font-style:normal;background:#ffb5471f}.touch-halves i+i{border-left:2px dashed #5c6f82;background:#ffb54733}.title-controls .touch-row strong{color:#ffd08a}.title-controls .touch-row{flex-direction:column;gap:6px}.title-controls .touch-row .act{white-space:normal;text-align:center;max-width:34em;display:block}@media(min-width:701px){.header{flex-basis:56px}.brand{font-size:18px}.brand svg{width:26px;height:26px}.icon-button{font-size:16px;padding:8px 12px}.icon-button span{font:14px var(--mono)}.icon-button svg{width:17px;height:17px}.volume-control input{width:100px}.volume-control output{width:44px;font:13px var(--mono)}.cabinet{grid-template-rows:70px minmax(0,1fr) 46px}.hud span{font-size:13px;letter-spacing:1.5px;margin-bottom:5px;color:#9fb0bd}.hud strong{font-size:26px}.hud-center strong{font-size:18px}.hud-center span{font-size:13px}.hud-lives strong{font-size:24px}.hud-tip{font-size:15px}.hud-message{font-size:18px}.hud-message span{font-size:13px}.overlay p{font-size:18px;line-height:1.55}.primary-button{font-size:20px;padding:18px 28px;min-width:280px}.primary-button span{font-size:26px;line-height:20px}.secondary-button{font-size:17px;margin-top:18px}#start-hint{font-size:14px}.game-footer>span{font-size:15px;letter-spacing:.5px}.game-footer .play-hint{color:#9fb0bd}.title-controls b{font-size:13px}.play-hint span{padding:0 14px}.text-button{font-size:15px}kbd{font-size:13px;padding:3px 7px}.toast{font-size:16px;padding:12px 22px}.dmd-row{font-size:16px}.dmd-message span{font-size:15px}}@media(min-width:701px)and (max-height:820px){.hero-alien{display:none}h1{font-size:44px;margin:6px 0 8px}.overlay p{margin-bottom:16px}.secondary-button,#start-hint{margin-top:12px}.title-controls{margin-top:14px;padding:12px 18px;gap:8px}}@media(min-width:701px)and (max-height:640px){#start-hint{display:none}h1{font-size:36px}.overlay p{font-size:16px;margin-bottom:12px}.title-controls{margin-top:10px;padding:8px 14px;gap:6px}}.back-link,.help-button{display:none}.tips>summary{display:none}.app:not([data-input=touch]) .tips-fullscreen{display:none}.hud-long{font-style:normal}.app[data-input=touch] .header{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;flex-basis:58px;gap:8px}.app[data-input=touch] .back-link{display:inline-flex;align-items:center;gap:2px;justify-self:start;padding:10px 6px 10px 0;font:600 17px/1 Arial,Helvetica,sans-serif;color:#eef4f8}.app[data-input=touch] .back-link svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}.app[data-input=touch] .brand{justify-self:center;font-size:16px;letter-spacing:3px;pointer-events:none}.app[data-input=touch] .brand svg{display:none}.app[data-input=touch] .header-right{justify-self:end;gap:8px}.app[data-input=touch] #test-controller,.app[data-input=touch] .volume-control,.app[data-input=touch] #fullscreen{display:none}.app[data-input=touch] .help-button{display:inline-grid}.app[data-input=touch] .help-button,.app[data-input=touch] #sound{place-items:center;width:46px;height:46px;padding:0;border:1px solid #3a4c5a;border-radius:12px}.app[data-input=touch] .help-button svg,.app[data-input=touch] #sound svg{width:23px;height:23px;vertical-align:0;fill:none;stroke:currentColor;stroke-width:1.6}.app[data-input=touch] #sound svg path:first-child{fill:currentColor}.app[data-input=touch] #sound>span{display:none}.app[data-input=touch] .cabinet{grid-template-rows:66px minmax(0,1fr) 0}.app[data-input=touch] .hud{padding:0 12px;gap:10px}.app[data-input=touch] .hud-pause{flex-basis:44px;height:44px}.app[data-input=touch] .hud span{font-size:12px;letter-spacing:1.5px;margin-bottom:4px;color:#9fb0bd}.app[data-input=touch] .hud strong,.app[data-input=touch] .hud-center strong,.app[data-input=touch] .hud-lives strong{font-size:20px;letter-spacing:1px}.app[data-input=touch] .hud-long{display:none}.app[data-input=touch] .hud-center,.app[data-input=touch] .hud-lives{text-align:left}.app[data-input=touch] .hud-lives strong{color:var(--orange);letter-spacing:3px}.app[data-input=touch] #arcade{display:none}.app[data-input=touch] h1{font-size:clamp(36px,11vw,46px);letter-spacing:-1.5px;line-height:1.05;margin:8px 0 14px}.app[data-input=touch] .overlay p{font-size:17px;line-height:1.5;color:#c9d4dc;margin-bottom:22px}.app[data-input=touch] .primary-button{width:min(100%,360px);font-size:21px;padding:18px 24px;border-radius:12px}.app[data-input=touch] .secondary-button{font-size:17px;margin-top:16px;color:#e3eaef}.app[data-input=touch] .tips{margin:26px auto 0;width:min(100%,420px);border:1px solid #34444f;border-radius:14px;background:#0a121bd9;text-align:left}.app[data-input=touch] .tips>summary{display:flex;align-items:center;gap:12px;padding:15px 16px;font:16px/1.3 Arial,Helvetica,sans-serif;color:#eef4f8;cursor:pointer;list-style:none}.app[data-input=touch] .tips>summary::-webkit-details-marker{display:none}.app[data-input=touch] .tips>summary span{flex:1}.app[data-input=touch] .tips svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}.app[data-input=touch] .tips .tips-chevron{transition:transform .2s}.app[data-input=touch] .tips[open] .tips-chevron{transform:rotate(180deg)}.app[data-input=touch] .tips .title-controls{margin:0;padding:0 16px 16px;border:0;background:none;width:auto;max-width:none;left:0;transform:none;font-size:15px}.app[data-input=touch] .tips .touch-row{flex-direction:column;align-items:center;text-align:center}.app[data-input=touch] .tips .touch-row>b{display:none}.app[data-input=touch] .tips .act{white-space:normal;display:block}.app[data-input=touch] .tips-fullscreen{margin:0 auto 16px}.app[data-input=touch] .hero-alien{display:none}@media(max-height:520px){.app[data-input=touch] .cabinet{grid-template-rows:40px minmax(0,1fr) 0}.app[data-input=touch] .hud span{font-size:10px;margin-bottom:1px}.app[data-input=touch] .hud strong,.app[data-input=touch] .hud-center strong,.app[data-input=touch] .hud-lives strong{font-size:15px}.app[data-input=touch] .hud-pause{flex-basis:32px;height:32px}.app[data-input=touch] h1{font-size:30px;margin:4px 0 8px}.app[data-input=touch] .overlay p{font-size:15px;margin-bottom:12px}}.app[data-input=touch] .touch-halves{width:140px;height:104px}.app[data-input=touch] .touch-halves i{font-size:12px}.app[data-input=touch] .cabinet{grid-template-columns:minmax(0,1fr)}#music[hidden],#overlay-music[hidden]{display:none}.icon-button svg.note{width:16px;height:16px;vertical-align:-3px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}.overlay-music,.app[data-input=touch] #music{display:none}.app[data-input=touch] .overlay-music:not([hidden]){display:block;margin:14px auto 0;border:0;background:transparent;color:#e3eaef;font-size:17px}.overlay-music svg.note{width:17px;height:17px;vertical-align:-3px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;margin-right:6px}
