:root{color-scheme:dark;--bg:#050915;--panel:#101e34;--ink:#f2f7ff;--muted:#93a8c3;--line:#2a4565;--cyan:#54e9ed;--blue:#76a2ff;--pink:#ff648d;--yellow:#ffca78;--radius:16px}
*{box-sizing:border-box}html{background:var(--bg);min-height:100%}
body{margin:0;min-height:100vh;color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;background:radial-gradient(ellipse 90% 40% at 50% 2%,#163354 0%,transparent 70%),radial-gradient(ellipse 60% 55% at 95% 70%,#1b1741 0%,transparent 75%),#050915;-webkit-tap-highlight-color:transparent;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.25;background-image:linear-gradient(#7285ac12 1px,transparent 1px),linear-gradient(90deg,#7285ac12 1px,transparent 1px);background-size:46px 46px;mask-image:linear-gradient(#000,transparent 90%)}
button{font:inherit;cursor:pointer;touch-action:manipulation}a{color:inherit}button:disabled{cursor:not-allowed;opacity:.4}:focus-visible{outline:3px solid var(--yellow);outline-offset:3px}
[hidden]{display:none!important}.app{position:relative;max-width:920px;padding:0 18px;margin:0 auto}
.topbar{display:flex;align-items:center;justify-content:space-between;padding:20px 0 14px;border-bottom:1px solid #ffffff12}
.studio{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-size:11px;font-weight:950;letter-spacing:.18em}
.studio i{font-style:normal;color:var(--cyan)}.studio-mark{width:34px;height:34px;border:2px solid #55eaea;border-radius:10px;display:grid;place-items:center;color:#e1ffff;font-size:21px;box-shadow:0 0 0 3px #54e9ed11,inset 0 0 13px #54e9ed25}
.topright{display:flex;align-items:center;gap:14px}.build,.side-footer{font-size:10px;color:#8498b7;letter-spacing:.12em;font-weight:700}.iconbtn{background:#101e34;border:1px solid #325171;border-radius:11px;width:40px;height:36px;color:var(--cyan);font-weight:900}
.hero{text-align:center;padding:24px 0 18px}.eyebrow{color:var(--cyan);font-size:10px;font-weight:900;letter-spacing:.23em}.dot{display:inline-block;width:6px;height:6px;background:var(--cyan);border-radius:50%;box-shadow:0 0 11px var(--cyan);margin-right:7px;vertical-align:middle}.slash{opacity:.5;margin:0 8px}
.hero h1{margin:9px 0 2px;font-size:clamp(29px,6vw,45px);line-height:1.15;letter-spacing:-.045em;font-weight:950;text-transform:uppercase}.hero h1 span{color:var(--cyan)}.hero h1 em{font-style:normal;background:linear-gradient(95deg,#d4efff,#6bf5e9);color:transparent;background-clip:text;-webkit-background-clip:text}
.hero p{margin:8px 0 0;color:#92a8c2;font-size:12px;letter-spacing:.03em}.hero p strong{color:#d7e7f7;font-weight:600}
.game-frame{width:100%;max-width:462px;margin:0 auto;border:1px solid #2b4d6b;border-radius:18px;padding:9px;background:#071528;box-shadow:0 25px 90px #0009,0 0 80px #31c8f00d}
.hud{height:61px;display:grid;grid-template-columns:1.2fr .85fr 1fr;align-items:center;gap:8px;padding:2px 8px 9px}
.hud-block{position:relative;font-variant-numeric:tabular-nums;display:flex;flex-direction:column;justify-content:center;gap:5px;min-width:0}.hud-label{color:#8aa9c6;font-size:9px;letter-spacing:.13em;font-weight:850}.hud-block.center{text-align:center}.hud-block.right{text-align:right}
.hud b{font-weight:900;font-size:15px}.hud .time{font-family:"Courier New",monospace;font-size:23px;letter-spacing:.02em;color:#d4ffff}.hud .score{font-family:"Courier New",monospace;font-size:21px}.health-track{height:7px;background:#2a4051;border-radius:10px;overflow:hidden;width:95%}.health-track>div{height:100%;width:100%;background:linear-gradient(90deg,#ff6b95,#ffb5a8);box-shadow:0 0 16px #ff6c95;transition:width .18s}
#hpText{position:absolute;bottom:12px;right:0;font-size:10px;color:#ffc2c9}.score{color:#f9fbff}#comboText{color:var(--yellow)}
.arena{width:100%;position:relative;overflow:hidden;isolation:isolate;border:1px solid #294767;border-radius:11px;box-shadow:inset 0 0 75px #000a;background:#050c1a;touch-action:auto;user-select:none}
#game{width:100%;height:auto;display:block;aspect-ratio:430/650;touch-action:none}
.arena-top{position:absolute;top:12px;left:12px;right:12px;display:flex;justify-content:space-between;pointer-events:none;z-index:1}
.wave-pill{background:#0e2136cd;border:1px solid #37617e;border-radius:99px;padding:6px 10px;font-weight:950;font-size:9px;letter-spacing:.13em;color:#9dcfe5}
.wave-pill span{color:#ffe7ad}.xp-mini{text-align:right;color:#a8d2e8;font-weight:850;font-size:9px;letter-spacing:.09em}
.xp-track{margin-top:5px;width:90px;height:5px;border-radius:9px;overflow:hidden;background:#1d3854}.xp-track span{display:block;width:0%;height:100%;background:linear-gradient(90deg,#28a8f8,#5fffee);box-shadow:0 0 8px #5fffee}
.floating{position:absolute;top:63px;left:0;right:0;display:flex;flex-direction:column;align-items:center;gap:4px;pointer-events:none;z-index:3}
.toast{color:#fff;font-weight:950;font-size:15px;letter-spacing:.13em;text-shadow:0 2px 15px #00fff8;animation:toast .9s ease both}
@keyframes toast{0%{transform:translateY(8px) scale(.93);opacity:0}18%{opacity:1}80%{opacity:1}100%{transform:translateY(-15px);opacity:0}}
.battle-ui{position:absolute;inset:0;z-index:1;pointer-events:none}
.pulse-button{position:absolute;bottom:22px;right:17px;border-radius:50%;height:84px;width:84px;background:#12283eeb;color:#c8ffff;border:2px solid #54d7e4;box-shadow:0 0 0 5px #1de7e414,0 0 27px #06deff4f;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;pointer-events:auto}
.pulse-button.cooldown{filter:saturate(.65);border-color:#55758d;background:#111c2ec9;box-shadow:0 0 0 5px #ffffff0b}
.pulse-gauge{position:absolute;inset:4px;border-radius:50%;border:3px solid transparent;transform:rotate(-90deg);pointer-events:none}
.pulse-symbol{font-size:35px;line-height:34px;font-weight:900;text-shadow:0 0 20px #6bffff}.pulse-name{font-size:10px;letter-spacing:.09em;font-weight:900}
.battle-hint{position:absolute;bottom:22px;left:18px;max-width:120px;color:#ffffff7a;font-size:10px;letter-spacing:.13em;font-weight:850;text-shadow:0 1px 4px black}
.touch-joystick{display:none;pointer-events:none;position:absolute;width:104px;height:104px;border-radius:50%;border:2px solid #8fe6f36b;background:#16527740;transform:translate(-50%,-50%);box-shadow:inset 0 0 25px #50ffff1b;z-index:3}
.stick{position:absolute;width:48px;height:48px;border-radius:50%;left:26px;top:26px;background:#55e9ed90;border:3px solid #d2ffff;box-shadow:0 0 25px #55e9ed}
.overlay{position:absolute;inset:0;z-index:5;display:flex;align-items:center;justify-content:center;padding:16px;background:linear-gradient(180deg,#030b1c8a 0%,#030b1cd6 50%,#030b1cf7 100%);backdrop-filter:blur(5px);overflow:auto;touch-action:pan-y;overscroll-behavior:contain}
.screen{width:100%;max-width:372px;text-align:center;max-height:100%;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#335a7a transparent;padding:6px 3px}
.kicker{text-transform:uppercase;color:var(--cyan);font-size:10px;font-weight:950;letter-spacing:.18em;line-height:1.5}
.screen h2{font-size:clamp(34px,9vw,52px);font-weight:950;letter-spacing:-.055em;line-height:1.02;margin:13px 0 13px;color:#f4faff}
.screen h2 em{color:var(--cyan);font-style:normal;text-shadow:0 0 28px #2debed50}
.screen p{line-height:1.55;color:#afc4d7;font-size:12px;max-width:332px;margin:10px auto 18px}.screen p strong{color:var(--yellow)}
.signal-logo{height:98px;margin:1px auto 10px;display:grid;place-items:center}
.signal-rings{position:relative;width:86px;height:86px;border:2px solid #53e9ed;border-radius:50%;display:grid;place-items:center;box-shadow:0 0 0 10px #40baff0a,0 0 28px #10d9ff50,inset 0 0 22px #51e6f340;animation:breathe 3s ease-in-out infinite}
.signal-rings:before{content:"";position:absolute;width:64px;height:64px;border:1px dashed #b4ffffa8;border-radius:50%;animation:spin 12s linear infinite}.signal-orbit{position:absolute;inset:-9px;border:2px solid transparent;border-top-color:var(--yellow);border-bottom-color:#e98be6;border-radius:50%;animation:spin 5s linear infinite}.signal-core{font-size:43px;color:#f0ffff;line-height:1;text-shadow:0 0 22px #42f3f0}
@keyframes breathe{50%{box-shadow:0 0 0 14px #40baff0a,0 0 38px #10d9ff77,inset 0 0 28px #51e6f355}}@keyframes spin{to{transform:rotate(360deg)}}
.stats-row,.result-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:17px 0}
.stats-row>div,.result-grid>div{background:#0d2237b5;border:1px solid #2b4969;border-radius:11px;padding:10px 4px}
.stats-row b,.result-grid b{display:block;color:#f9f7ff;font-size:20px;font-weight:950;font-family:"Courier New",monospace}
.stats-row small,.result-grid small{display:block;color:#8ca6bf;font-size:8px;font-weight:900;letter-spacing:.11em;margin-top:4px}
.btn-primary{height:49px;width:100%;padding:0 17px;border:1px solid #8ffff3;border-radius:10px;background:linear-gradient(105deg,#63f2df,#39c9ef);box-shadow:0 4px 0 #138f9b,0 0 26px #22d8d02a;color:#052238;text-align:left;font-size:13px;letter-spacing:.08em;font-weight:950;transition:transform .1s,filter .1s}
.btn-primary:hover{filter:brightness(1.09)}.btn-primary:active{transform:translateY(3px);box-shadow:0 1px 0 #138f9b}.btn-primary span{float:right;font-size:20px;line-height:19px}
.two-buttons{display:flex;gap:8px;margin:12px 0 0}.btn-outline{border-radius:10px;background:#0e253cde;border:1px solid #3a6384;padding:11px 9px;color:#c5e9f5;font-size:10px;letter-spacing:.04em;font-weight:900;min-height:41px;flex:1}.btn-outline:hover{border-color:var(--cyan);background:#153554}.btn-outline.wide{width:100%;margin-top:11px}
.meta-note{font-size:9px!important;letter-spacing:.17em;margin:15px 0 0!important;color:#6887a0!important}
.guide{display:flex;gap:12px;align-items:center;flex:1}.guide-icon{font-size:23px;color:var(--cyan);width:26px;flex-shrink:0}.guide strong{display:block;font-size:10px;letter-spacing:.08em;color:#a5bdcd}.guide span{display:block;font-size:11px;line-height:1.5;color:#6e8aa6;margin-top:2px}
.below-game{display:flex;align-items:center;gap:14px;padding:11px 4px 2px}.pause-button{width:40px;height:39px;flex-shrink:0;color:#c9e7f5;background:#132a43;border:1px solid #365772;border-radius:11px;font-weight:900}
kbd{font-family:inherit;color:#b8cce2}.side-footer{display:flex;justify-content:space-between;gap:10px;padding:18px 0 25px;font-size:9px}.sep{color:var(--cyan);margin:0 6px}
.choice h2{font-size:36px}.choice p{font-size:12px;margin-bottom:12px}.cards{display:grid;gap:9px}
.upgrade-card{width:100%;display:flex;align-items:center;text-align:left;gap:13px;border:1px solid #385a78;border-radius:14px;background:linear-gradient(110deg,#112a43,#0b1c33);padding:13px 12px;color:var(--ink);min-height:75px;transition:border-color .15s,transform .15s}
.upgrade-card:hover,.upgrade-card:focus-visible{border-color:var(--cyan);transform:translateX(3px);background:linear-gradient(110deg,#18405a,#0b223c)}
.upgrade-icon{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;background:#274961;color:#6cf5e4;font-size:24px;flex-shrink:0}
.upgrade-info strong{font-size:13px;display:block;letter-spacing:.015em}.upgrade-info span{display:block;color:#9fb8cc;font-size:11px;line-height:1.4;margin-top:4px}.up-arrow{margin-left:auto;color:var(--yellow);font-size:17px}
.micro{font-size:9px;letter-spacing:.11em;color:#688da6;margin-top:16px}
.pause-screen{max-width:300px}.pause-screen h2{font-size:45px}.result-medal{width:68px;height:68px;margin:6px auto 16px;border-radius:50%;display:grid;place-items:center;color:var(--yellow);font-size:36px;border:2px solid #ffd984;box-shadow:0 0 28px #ffb0502b}.ending h2{font-size:38px;margin:10px 0}.result-score{color:#fff;font-size:58px;line-height:1;font-weight:950;font-family:"Courier New",monospace}.result-label{color:var(--cyan);font-size:9px;letter-spacing:.17em;margin-top:4px;font-weight:800}.reward{color:#ffcf87!important;font-weight:850!important;margin:13px auto 17px!important}
.laboratory h2{font-size:30px}.laboratory p{margin:9px auto 12px}.wallet{border:1px solid #375679;border-radius:12px;padding:12px;color:#aec8d9;font-size:10px;font-weight:850;letter-spacing:.07em;display:flex;justify-content:space-between;align-items:center}.wallet b{color:var(--yellow);font-size:23px}
.lab-items{display:grid;gap:7px;margin-top:12px}
.lab-card{border:1px solid #2e4c68;background:#0e2137;text-align:left;color:#d9e8f5;border-radius:12px;padding:11px;display:grid;grid-template-columns:1fr auto;gap:6px;align-items:center}
.lab-card strong{font-size:12px}.lab-card small{display:block;margin-top:4px;color:#91abc2;font-size:10px;line-height:1.35}.lab-card button{border:1px solid #66c4c6;background:#193d53;border-radius:9px;padding:9px;color:#ddffff;font-size:10px;font-weight:900}.lab-card button:disabled{border-color:#35556f;color:#758ba0}
@media(min-width:700px){.app{max-width:900px}.game-frame{max-width:462px}.hero{padding:28px 0}.hero p{font-size:13px}}
@media(max-width:430px){.app{padding:0 9px}.topbar{padding:10px 4px 8px}.build{display:none}.hero{padding:13px 0 12px}.hero h1{font-size:clamp(26px,8vw,34px)}.hero p{font-size:11px}.game-frame{padding:6px}.hud{height:53px}.hud .time{font-size:21px}.hud .score{font-size:19px}.screen{padding:2px 3px}.signal-logo{height:72px;margin-bottom:7px}.signal-rings{width:64px;height:64px}.signal-rings:before{width:44px;height:44px}.signal-core{font-size:35px}.screen h2{font-size:clamp(32px,10vw,42px);margin:8px 0}.screen p{font-size:11px;margin:8px auto 12px}.stats-row{margin:11px 0}.stats-row>div{padding:8px 3px}.stats-row b{font-size:17px}.btn-primary{height:47px}.pulse-button{width:73px;height:73px;bottom:19px;right:13px}.pulse-symbol{font-size:30px}.battle-hint{bottom:19px;left:11px;font-size:9px}.side-footer span:last-child{display:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
