:root{--bg: #05070f;--panel: #0d1526;--panel-deep: #0a1122;--panel-raised: #101a30;--line: #24406b;--line-strong: #2c4a7a;--text: #cfe3ff;--text-strong: #e8f0fc;--muted: #7fa3d6;--muted-2: #9fbde8;--accent: #ffd23f;--accent-deep: #e8a818;--ok: #6fe08a;--bad: #ff6b6b;--info: #4fc3f7;--brand-2: #38bdf8;--radius: 10px;--focus: 0 0 0 2px var(--accent), 0 0 0 4px rgba(255, 210, 63, .25)}*{margin:0;padding:0;box-sizing:border-box}html{color-scheme:dark}body{background:var(--bg);color:var(--text);font-family:Segoe UI,system-ui,-apple-system,sans-serif;min-height:100dvh;display:flex;flex-direction:column;align-items:center;padding:10px}#app{width:min(100%,1280px);max-width:100%;margin:auto}#hud{display:flex;flex-direction:column;gap:8px;padding:10px 14px 12px;background:linear-gradient(180deg,var(--panel),#0a1020);border:1px solid var(--line);border-bottom:none;border-radius:var(--radius) var(--radius) 0 0}.hud-row{display:flex;align-items:center;justify-content:space-between;gap:14px}.brand{font-weight:800;letter-spacing:3px;color:var(--accent);text-shadow:0 0 12px rgba(255,210,63,.6)}.hud-stats{display:flex;gap:18px;align-items:center}.stat{display:flex;flex-direction:column;align-items:flex-start;gap:1px}.hud-label{font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted)}.stat-val{font-weight:700;font-size:15px;line-height:1.15}.stat-val.credits{color:var(--ok)}.stat-val.lives{color:var(--bad)}.stat-val.wave{color:var(--accent)}.stat-val.shield{color:var(--info)}.sector,#sector{font-size:12px;color:var(--muted);font-style:italic;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:280px;margin-left:6px}.hud-saber{display:flex;align-items:center;gap:8px}#saber-bar{display:inline-block;width:70px;height:10px;background:var(--panel);border:1px solid var(--line);border-radius:5px;overflow:hidden;vertical-align:middle}#saber-fill{display:block;height:100%;width:100%;background:linear-gradient(90deg,var(--info),#bfe9ff);transform:scaleX(1);transform-origin:left center;transition:transform .1s linear;will-change:transform}.hud-controls{justify-content:space-between}.hud-btn-group{display:flex;gap:8px}#btn-start{min-width:220px}.btn{min-height:32px;background:#12213c;color:var(--text);border:1px solid var(--line);padding:6px 14px;border-radius:6px;cursor:pointer;font-size:13px;font-family:inherit}.btn:hover{background:#1b3054}.btn.primary{background:var(--accent);color:#1a1a00;border-color:var(--accent);font-weight:700}.btn.primary:disabled{opacity:.4;cursor:default}.btn.active{outline:2px solid var(--accent)}.btn.danger{background:#3a1520;border-color:#8a3040;color:#ff9aa8}.btn.danger:hover{background:#4a1a28}:where(.btn,.build-btn,.pick-btn,.perk-buy,#credit-name):focus-visible,#game:focus-visible{outline:none;box-shadow:var(--focus)}#game-wrap{border:1px solid var(--line);border-top:none;border-radius:0 0 var(--radius) var(--radius);overflow:hidden;background:#0a1020}#canvas-holder{position:relative;line-height:0}#game{display:block;background:#060a15;width:100%;height:auto;aspect-ratio:16 / 9;touch-action:none;image-rendering:auto;cursor:crosshair}#play-row{display:flex;gap:0;align-items:stretch}#side-panel{width:240px;padding:10px;background:var(--panel-deep);border-left:1px solid #1c2740;display:flex;flex-direction:column;gap:10px;overflow-y:auto}#info-panel{display:none;background:var(--panel-raised);border:1px solid var(--line-strong);border-radius:var(--radius);padding:10px 12px;font-size:12px;color:var(--text-strong)}#info-panel h3{color:var(--accent);font-size:13px;margin-bottom:6px}#info-panel .row{display:flex;justify-content:space-between;margin:3px 0}#info-panel .row .k{color:var(--muted)}#info-panel .actions{display:flex;gap:6px;margin-top:8px}#info-panel .actions button{flex:1;padding:6px 4px;font-size:11px}#info-panel .spec-choice{display:flex;gap:6px;flex:1}#info-panel .spec-choice button{flex:1;padding:6px 2px;font-size:11px}#wave-preview{background:var(--panel-raised);border:1px solid var(--line-strong);border-radius:var(--radius);padding:12px 14px;font-size:13px}#wave-preview h4{color:var(--accent);font-size:13px;margin-bottom:6px}#wave-preview .wp-entries{font-size:12px;color:#ff9a5a;margin-bottom:6px}#wave-preview .wp-row{display:flex;justify-content:space-between;margin:3px 0}#wave-preview .wp-row b{color:var(--text-strong)}#wave-preview .wp-reward{font-size:12px;color:var(--ok);margin-top:8px;border-top:1px solid var(--line);padding-top:6px}#wave-preview .wp-empty{color:var(--muted);font-style:italic}#bottom-bar{display:flex;align-items:stretch;justify-content:space-between;gap:10px;padding:8px 10px;min-height:96px;border-top:1px solid #1c2740;background:var(--panel-deep)}#build-bar{display:grid;grid-template-columns:repeat(auto-fit,minmax(92px,1fr));gap:8px;flex:1;min-width:0}.build-btn{width:100%;min-width:0;padding:6px 4px 4px;background:#0d1526e6;border:1px solid var(--line);border-radius:8px;cursor:pointer;text-align:center;color:var(--text);font-family:inherit}.build-btn:hover{border-color:var(--accent)}.build-btn.selected{border-color:var(--accent);box-shadow:0 0 10px #ffd23f80}.build-btn .name{font-size:12px;font-weight:700;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.build-btn .attr{font-size:10.5px;color:var(--muted-2);display:block;line-height:1.3}.build-btn .cost{font-size:12px;font-weight:700;color:var(--ok);display:block;margin-top:1px}.build-icon{display:block;margin:0 auto 2px}.build-btn.locked{opacity:.45;cursor:default}#overlay,#sector-picker{position:absolute;top:0;right:0;bottom:0;left:0;background:#04060cd9;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center;padding:16px}#sector-picker{z-index:10;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}#overlay h1{color:var(--accent);letter-spacing:6px;font-size:clamp(22px,5vw,42px)}#overlay h2{color:var(--bad);letter-spacing:4px;font-size:clamp(18px,4vw,34px)}#overlay p{max-width:520px;line-height:1.5;color:#a9c4ec}#overlay .subtitle{color:var(--muted);font-size:13px}#sector-picker h3{color:var(--accent);letter-spacing:2px}.pick-list{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;max-width:780px}.pick-btn{width:180px;padding:14px 12px;background:#0d1526f2;border:1px solid var(--line);border-radius:var(--radius);cursor:pointer;text-align:center;color:var(--text);font-family:inherit;transition:border-color .15s,transform .15s}.pick-btn:hover:not([disabled]){border-color:var(--accent);transform:translateY(-2px)}.pick-btn[disabled]{opacity:.35;cursor:default}.pick-name{display:block;font-weight:700;font-size:14px;margin-bottom:4px}.pick-sub{display:block;font-size:11px;color:var(--muted)}.pick-note{font-size:11px;color:var(--muted);font-style:italic}#sector-intro{position:absolute;top:42%;left:50%;transform:translate(-50%,-50%) scale(.9);text-align:center;opacity:0;transition:opacity .5s,transform .5s;pointer-events:none;background:#080c1abf;border:1px solid var(--accent);border-radius:14px;padding:clamp(14px,3vw,22px) clamp(18px,6vw,44px);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);max-width:min(90%,520px)}#sector-intro.show{opacity:1;transform:translate(-50%,-50%) scale(1)}#sector-intro h2{color:var(--accent);letter-spacing:3px;font-size:clamp(16px,3.4vw,24px);margin:0 0 10px}#sector-intro p.sub{color:var(--text-strong);font-size:clamp(11px,2.4vw,14px);margin:0;line-height:1.4}#toast{position:absolute;left:50%;bottom:14px;transform:translate(-50%,12px);background:#0d1526f2;border:1px solid var(--accent);color:var(--text-strong);border-radius:999px;padding:8px 16px;font-size:13px;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;z-index:25;max-width:90%}#toast.show{opacity:1;transform:translate(-50%)}#wave-recap{position:absolute;top:14px;left:14px;min-width:196px;padding:10px 14px;background:#0a101eeb;border:1px solid var(--line);border-radius:10px;box-shadow:0 8px 24px #00000073;color:var(--text-strong);font-size:12.5px;opacity:0;transform:translateY(-8px);pointer-events:none;transition:opacity .22s ease,transform .22s ease;z-index:14}#wave-recap.show{opacity:1;transform:translateY(0)}#wave-recap h4{margin:0 0 6px;font-size:12px;letter-spacing:1px;text-transform:uppercase;color:var(--accent)}#wave-recap .wr-row{display:flex;justify-content:space-between;gap:16px;line-height:1.5}#wave-recap .wr-row span{color:var(--muted)}#wave-recap b.ok{color:var(--ok)}#wave-recap b.bad{color:var(--bad)}#crash{position:absolute;top:0;right:0;bottom:0;left:0;background:#06080ff5;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:24px;text-align:center;z-index:70}#crash h3{color:var(--bad);letter-spacing:2px}#crash p{color:var(--text);font-size:13px;max-width:560px;font-family:ui-monospace,Cascadia Code,monospace}#meta-panel,#help-panel,#settings-panel{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;overflow-y:auto;overscroll-behavior:contain}#meta-panel{background:#070b16;gap:24px;z-index:50;padding:40px 24px}#help-panel{background:#04060ceb;gap:0;z-index:60;padding:0;overflow:hidden}#settings-panel{background:#04060ceb;gap:18px;z-index:55;padding:36px 20px}#meta-panel h3,#help-panel h3,#settings-panel h3{color:var(--accent);letter-spacing:2px;text-align:center}#meta-panel .meta-points{color:var(--ok);font-weight:700;font-size:15px;text-align:center}.meta-list{display:flex;gap:20px;flex-wrap:wrap;justify-content:center}.perk-card{width:240px;padding:20px;background:#0d1526f2;border:1px solid var(--line);border-radius:var(--radius);text-align:center;color:var(--text);display:flex;flex-direction:column;gap:8px}.perk-card .p-icon{font-size:34px;line-height:1;margin-bottom:10px}.perk-card .p-name{font-weight:700;font-size:16px;line-height:1.4;margin:0 0 10px;padding-bottom:8px;border-bottom:1px solid var(--line-strong)}.perk-card .p-desc{font-size:13px;line-height:1.5;color:var(--muted-2);margin:0 0 10px}.perk-card .p-val{font-size:12.5px;line-height:1.5;color:#a9c4ec}.perk-card .p-val b{color:var(--ok)}.perk-card .p-lvl{font-size:12px;color:var(--muted-2)}.perk-buy{width:100%;margin-top:auto;padding:10px 8px;background:linear-gradient(180deg,var(--accent),var(--accent-deep));color:#221a00;border:1px solid #ffe9a8;border-radius:8px;cursor:pointer;font-weight:800;font-size:13px;font-family:inherit;transition:transform .12s,box-shadow .12s,filter .12s}.perk-buy:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 0 16px #ffd23f80;filter:brightness(1.1)}.perk-buy:active:not(:disabled){transform:translateY(0)}.perk-buy:disabled{opacity:.35;cursor:default;background:#4a5568;border-color:#4a5568;color:#a0aab8}.meta-help{max-width:780px;text-align:left;font-size:13px;color:#a9c4ec;line-height:1.7;display:flex;flex-direction:column;gap:8px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:16px 20px}.meta-help b{color:var(--accent)}.meta-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;position:sticky;bottom:0;padding:12px 0 6px;background:linear-gradient(180deg,#070b1600,#070b16 40%);width:100%}#settings-panel #btn-settings-close{position:sticky;bottom:16px}.help-box{max-width:640px;width:100%;background:var(--panel);border:1px solid var(--line-strong);border-radius:12px;padding:20px 26px;color:var(--text);font-size:13.5px;line-height:1.65}.help-scroll{flex:1 1 auto;min-height:0;width:100%;overflow-y:auto;overscroll-behavior:contain;display:flex;flex-direction:column;align-items:center;gap:16px;padding:26px 20px 16px}.help-footer{flex:0 0 auto;width:100%;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:20px;padding:12px 20px calc(12px + env(safe-area-inset-bottom,0px));background:#070b16;border-top:1px solid var(--line);box-shadow:0 -8px 24px #00000073}.help-footer .btn.primary{min-width:220px;padding:10px 20px}.help-box h4{color:var(--brand-2);margin:14px 0 6px;font-size:14px}.help-box h4:first-child{margin-top:0}.help-box b{color:var(--accent)}.help-check{display:flex;align-items:center;gap:8px;font-size:13px;color:#a9c4ec;cursor:pointer}.help-check input{width:18px;height:18px;accent-color:var(--brand-2);cursor:pointer}.settings-box{width:min(480px,100%);background:var(--panel);border:1px solid var(--line-strong);border-radius:12px;padding:18px 24px;color:var(--text);font-size:13.5px}.settings-box h4{color:var(--brand-2);margin:0 0 10px;font-size:13px;text-transform:uppercase;letter-spacing:1px}.settings-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid #1a2440}.settings-row:last-child{border-bottom:none}.settings-row label{color:#a9c4ec}.settings-row select,.settings-row input[type=range]{background:#1a2436;border:1px solid var(--line-strong);color:var(--text-strong);border-radius:6px;padding:6px 10px;font-size:13px;font-family:inherit}.settings-row input[type=range]{width:160px;padding:0}.settings-note{font-size:11px;color:var(--muted);font-style:italic;max-width:480px;text-align:center}#studio-splash{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--panel);display:flex;align-items:center;justify-content:center;z-index:20;animation:splash-bg 2.6s ease forwards;pointer-events:none}.splash-inner{text-align:center}.splash-logo{display:flex;align-items:center;justify-content:center;gap:18px;font-size:clamp(28px,6vw,54px);font-weight:700;letter-spacing:4px;color:#fff;animation:splash-logo 2.6s ease forwards}.splash-star{width:clamp(28px,6vw,56px);height:auto;filter:drop-shadow(0 0 14px rgba(56,189,248,.7))}.splash-sub{margin-top:14px;font-size:16px;letter-spacing:6px;text-transform:uppercase;color:var(--brand-2);animation:splash-sub 2.6s ease forwards}@keyframes splash-logo{0%{opacity:0;transform:scale(.86);letter-spacing:24px}25%{opacity:1;transform:scale(1);letter-spacing:14px}75%{opacity:1}to{opacity:0;transform:scale(1.05)}}@keyframes splash-sub{0%,15%{opacity:0}35%{opacity:1}75%{opacity:1}to{opacity:0}}@keyframes splash-bg{0%,70%{opacity:1}to{opacity:0;visibility:hidden}}#site-footer{display:flex;align-items:center;justify-content:center;gap:10px;padding:12px 0 4px;font-size:12.5px;color:#9a9a9a;width:100%;flex-wrap:wrap}#site-footer .brand-link{display:inline-flex;align-items:center;gap:7px;color:#fff;font-weight:700;font-size:14px;text-decoration:none;transition:filter .15s}#site-footer .brand-link:hover{filter:drop-shadow(0 0 8px rgba(56,189,248,.8))}.brand-star{width:18px;height:18px}#site-footer a{color:var(--brand-2);text-decoration:none}#site-footer .sep{color:#4a4a4a}#credit-name{cursor:default;-webkit-user-select:none;user-select:none}#credit-name.unlocked{color:var(--brand-2);cursor:pointer}.is-hidden{display:none!important}#app:fullscreen{width:100vw;height:100vh;background:var(--bg);padding:10px 16px;display:flex;flex-direction:column;justify-content:center;margin:0}#app:fullscreen #game-wrap{flex:0 0 auto}#app:fullscreen #hud{border-radius:var(--radius) var(--radius) 0 0}@media (max-width: 900px){#side-panel{width:100%;flex-direction:row;flex-wrap:wrap;border-left:none;border-top:1px solid #1c2740;order:2}#play-row{flex-direction:column}#build-bar{grid-template-columns:repeat(auto-fit,minmax(88px,1fr))}}@media (max-width: 760px){body{padding:6px}#hud{padding:8px 10px;gap:6px}.hud-row{flex-wrap:wrap;gap:8px}.brand{font-size:15px}.hud-stats{gap:10px;width:100%;justify-content:space-between}.stat-val{font-size:14px}.sector,#sector{max-width:100%;font-size:11px;order:3;flex-basis:100%;margin-left:0}.hud-saber{margin-left:auto}.hud-controls{flex-direction:column;gap:6px}#btn-start{min-width:0;width:100%;padding:10px}.hud-btn-group{width:100%}.hud-btn-group .btn{flex:1;padding:8px 2px;font-size:11px}#side-panel{padding:8px;gap:8px}#info-panel,#wave-preview{flex:1 1 100%;font-size:12px;padding:8px 10px}#bottom-bar{padding:6px}#build-bar{grid-template-columns:repeat(3,1fr);gap:6px}.build-btn .attr{font-size:10px}.help-box{padding:14px 16px;font-size:13px}.help-scroll{padding:16px 12px 10px}.help-footer{flex-direction:column-reverse;gap:10px;padding:10px 12px calc(10px + env(safe-area-inset-bottom,0px))}.help-footer .btn.primary{width:100%;min-width:0}#meta-panel{padding:16px 10px;gap:12px}.perk-card{width:100%;max-width:320px}#site-footer{font-size:11px;gap:6px;padding:8px 0 2px}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}#studio-splash{display:none}}
