:root{--bg: #050a14;--panel: rgba(8, 16, 32, .88);--line: rgba(120, 170, 220, .35);--text: #e8f1ff;--muted: #8fa3bf;--accent: #4ec3ff;--accent-dim: #1a6a96;--danger: #ff6b5a;--ok: #5ddea0;--card: rgba(12, 24, 44, .92);--safe-top: env(safe-area-inset-top, 0px);--safe-right: env(safe-area-inset-right, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-left: env(safe-area-inset-left, 0px);font-family:Segoe UI,Trebuchet MS,sans-serif}*{box-sizing:border-box}html,body,#app,#app *{user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}#app button{touch-action:manipulation}#app input,#app textarea{user-select:text;-webkit-user-select:text}html{margin:0;overscroll-behavior:none;width:100%;height:100%;overflow:hidden}body{margin:0;position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;max-width:100%;overflow:hidden;background:var(--bg);color:var(--text);touch-action:none;-webkit-tap-highlight-color:transparent;overscroll-behavior:none}#app{position:relative;width:100%;height:100%;max-width:100%;overflow:hidden}#game-canvas{display:block;width:100%;height:100%;touch-action:none;user-select:none;-webkit-user-select:none}#ui-root{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:2}#ui-root>*{pointer-events:auto}#ui-root>.hud{pointer-events:none}.hidden{display:none!important}.menu{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,42%);gap:1rem;padding:calc(1rem + var(--safe-top)) calc(1rem + var(--safe-right)) calc(1rem + var(--safe-bottom)) calc(1rem + var(--safe-left));background:linear-gradient(90deg,#040a16cc,#040c1a9e 52%,#0412241f);width:100%;max-width:100%;min-width:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.menu-left{display:flex;flex-direction:column;gap:.85rem;min-width:0;max-width:100%;justify-content:center}.menu-right{position:relative;min-width:0;min-height:220px;max-width:100%}.menu-preview-host{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.brand{margin:0;font-size:clamp(1.8rem,4.5vw,3rem);letter-spacing:.04em;font-weight:700;text-shadow:0 0 24px rgba(78,195,255,.35)}.goal{margin:0;color:var(--muted);max-width:min(36rem,100%);line-height:1.45;font-size:.98rem;overflow-wrap:anywhere}.ship-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem}.ship-card{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:2px solid var(--line);background:var(--card);color:inherit;border-radius:10px;padding:.7rem .65rem;text-align:left;cursor:pointer;min-height:48px;transition:border-color .15s ease,background .15s ease}.ship-card:hover{border-color:#4ec3ffb3}.ship-card.selected{border-color:var(--accent);background:linear-gradient(180deg,#1e466ef2,#0c1c30f2);box-shadow:inset 0 0 0 1px #4ec3ff73;position:relative}.ship-card.selected:after{content:"Выбран";position:absolute;top:.35rem;right:.45rem;font-size:.7rem;color:var(--accent);letter-spacing:.04em;text-transform:uppercase}.ship-card h3{margin:0 0 .35rem;font-size:1rem}.ship-card .role{margin:0 0 .45rem;color:var(--muted);font-size:.78rem}.ship-card ul{margin:0;padding:0;list-style:none;font-size:.78rem;color:#c5d6ea;line-height:1.4}.menu-actions{display:flex;flex-wrap:wrap;gap:.65rem;align-items:center}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--accent-dim);background:linear-gradient(180deg,#2a8fc4,#15648f);color:#fff;border-radius:10px;padding:.75rem 1.15rem;font-size:1rem;font-weight:600;cursor:pointer;min-height:48px;min-width:48px}.btn:disabled{opacity:.55;cursor:default}.btn.secondary{background:#14243ae6;border-color:var(--line);color:var(--text)}.btn.danger{background:linear-gradient(180deg,#b2483d,#7a2a22);border-color:#8a3a32}.hint,.record{margin:0;color:var(--muted);font-size:.82rem;line-height:1.4;max-width:100%;overflow-wrap:anywhere}.hud{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;padding:calc(.55rem + var(--safe-top)) calc(.7rem + var(--safe-right)) calc(.55rem + var(--safe-bottom)) calc(.7rem + var(--safe-left));display:flex;flex-direction:column;justify-content:space-between}.hud-top{display:flex;justify-content:space-between;gap:.75rem;align-items:flex-start}.hud-top,.hud-bottom{transform:translateY(calc((1 - var(--hud-in, 1)) * var(--hud-slide, -24px)))}.hud-bottom{--hud-slide: 24px}.hud-block{background:#060e1c8c;border:1px solid rgba(120,170,220,.2);border-radius:8px;padding:.4rem .55rem;min-width:7rem}.hud-center{text-align:center;min-width:8rem}.hud-label{font-size:.72rem;color:var(--muted)}.hud-value{font-size:1.05rem;font-variant-numeric:tabular-nums}.hp-bar{position:relative;margin-top:.25rem;height:6px;background:#ffffff1f;border-radius:4px;overflow:hidden}.hp-fill{position:relative;height:100%;width:100%;background:linear-gradient(90deg,#3ecf8e,#6ae0ff)}.hp-ghost{position:absolute;left:0;top:0;height:100%;width:100%;background:#ffecdccc}.hud.hp-low .hp-fill{background:linear-gradient(90deg,#ff4a3d,#ff8a5c);animation:hp-blink .9s ease-in-out infinite}.hud.hp-crit .hp-fill{animation-duration:.45s}.hud.hp-low .hp-bar{box-shadow:0 0 0 1px #ff503ccc,0 0 8px #ff3c2899}.hud.hp-low [data-hp]{color:#ff6a5a}.hud-top>.hud-block:first-child{position:relative}.hp-warn{position:absolute;left:0;top:calc(100% + .3rem);white-space:nowrap;text-shadow:0 0 6px rgba(0,0,0,.9);font-size:.72rem;font-weight:700;color:#ff6a5a;text-transform:uppercase;letter-spacing:.04em;animation:hp-blink .45s ease-in-out infinite}@keyframes hp-blink{0%,to{opacity:1}50%{opacity:.35}}@media(prefers-reduced-motion:reduce){.hud.hp-low .hp-fill,.hp-warn{animation:none}}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#02060eb8;padding:calc(1rem + var(--safe-top)) calc(1rem + var(--safe-right)) calc(1rem + var(--safe-bottom)) calc(1rem + var(--safe-left));overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.panel{width:min(360px,100%);max-width:100%;min-width:0;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:1.1rem;display:flex;flex-direction:column;gap:.7rem}.panel h2{margin:0;font-size:1.25rem}.panel .row{display:flex;flex-direction:column;gap:.55rem}.toggle{display:flex;align-items:center;justify-content:space-between;gap:.75rem;min-height:48px;color:var(--text);font-size:.95rem}.toggle input{width:1.2rem;height:1.2rem}.quality-select{min-height:2.2rem;padding:.2rem .5rem;color:var(--text);background:#0a1424e6;border:1px solid rgba(120,170,220,.4);border-radius:6px;font:inherit}#touch-layer{touch-action:none;position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:3}#dash-btn{pointer-events:auto;position:absolute;right:calc(1rem + var(--safe-right));bottom:calc(1.2rem + var(--safe-bottom));width:72px;height:72px;border-radius:50%;border:2px solid rgba(78,195,255,.55);background:#0c1c30b8;color:var(--text);font-weight:600;font-size:.85rem}.joystick-base,.joystick-knob{position:absolute;border-radius:50%;pointer-events:none}.joystick-base{width:104px;height:104px;margin-left:-52px;margin-top:-52px;border:2px solid rgba(140,180,230,.35);background:#0a162859}.joystick-knob{width:44px;height:44px;margin-left:-22px;margin-top:-22px;background:#4ec3ff8c;border:1px solid rgba(200,230,255,.5)}.play-hint{position:absolute;left:50%;top:calc(28% + var(--safe-top));bottom:auto;transform:translate(-50%);color:#c8dcf5c7;font-size:.85rem;text-align:center;pointer-events:none;max-width:min(90vw,22rem);padding:.35rem .6rem;background:#040c1873;border-radius:8px}.play-hint.touch-hint{top:auto;bottom:calc(38% + var(--safe-bottom))}@media(max-width:820px){.menu{grid-template-columns:minmax(0,1fr);grid-template-rows:clamp(170px,28vh,260px) auto;align-content:start;background:linear-gradient(180deg,#0412241a 0,#040a16bd 32%,#040a16cc)}.menu-right{order:-1;min-height:170px}.ship-cards{grid-template-columns:minmax(0,1fr)}.ship-card.selected:after{top:.55rem}}@media(max-height:480px)and (min-width:821px){.menu{grid-template-columns:minmax(0,1fr) minmax(0,36%);align-content:start}.menu-right{min-height:120px}.menu-left{justify-content:flex-start}.ship-cards{grid-template-columns:repeat(3,minmax(0,1fr))}.ship-card{padding:.45rem .4rem}.ship-card ul{display:none}}.hud-right{text-align:right;min-width:9rem}.hud-row{display:flex;justify-content:flex-end;align-items:center;gap:.45rem}.hud-kills{margin-top:.25rem;font-size:.78rem}.mod-btn{pointer-events:auto;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--line);background:#142840d9;color:var(--text);border-radius:8px;padding:.35rem .55rem;min-height:40px;font-size:.78rem;cursor:pointer}.mod-btn.ready{border-color:var(--accent);background:linear-gradient(180deg,#2a8fc4,#15648f);box-shadow:0 0 12px #4ec3ff59}.mod-hint{margin-top:.2rem;color:var(--accent);font-size:.72rem}.icon-btn{pointer-events:auto;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--line);background:#0c182ccc;color:var(--text);border-radius:8px;width:40px;height:40px;cursor:pointer}.hud-bottom{display:flex;flex-direction:column;gap:.35rem;align-items:center;width:100%;max-width:100%;min-width:0;padding-bottom:calc(5.5rem + var(--safe-bottom));padding-left:calc(5.5rem + var(--safe-left));padding-right:calc(5.5rem + var(--safe-right));box-sizing:border-box;pointer-events:none}.boss-bar-wrap{margin:0 auto .15rem;width:min(420px,100%);box-sizing:border-box;background:#060e1c99;border:1px solid rgba(255,120,80,.35);border-radius:8px;padding:.3rem .5rem .4rem}.boss-bar-wrap.phase2{border-color:#ffc8508c}.boss-bar-label{font-size:.72rem;color:#ffb090;margin-bottom:.2rem;text-align:center}.boss-bar{height:8px;background:#ffffff1f;border-radius:4px;overflow:hidden}.boss-bar-fill{height:100%;width:100%;background:linear-gradient(90deg,#ff5a3c,#ffb060)}.boss-warn{margin-top:.25rem;color:#ff8a60;font-size:.78rem;font-weight:650;letter-spacing:.03em}.slot-row{display:flex;gap:.35rem;flex-wrap:nowrap;justify-content:center;width:100%;max-width:min(26rem,100%);min-width:0}.slot{flex:1 1 0;min-width:0;padding:.25rem .35rem;border-radius:6px;border:1px solid rgba(120,170,220,.25);background:#060e1c8c;font-size:.7rem;text-align:center;overflow:hidden;text-overflow:ellipsis}.slot.on{border-color:#4ec3ff8c}.slot.off{opacity:.45}.slot b{display:block;font-size:.9rem}.ready-row{display:flex;gap:.6rem}.ready{font-size:.72rem;color:var(--muted);padding:.15rem .4rem;border:1px solid transparent;border-radius:6px}.ready.ready{color:var(--ok);border-color:#5ddea066}.modifier-panel{width:min(920px,100%);max-width:100%;max-height:min(92vh,900px);overflow-x:hidden;overflow-y:auto}.mod-meta{display:flex;gap:1rem;color:var(--muted);font-size:.9rem}.mod-cards{display:flex;flex-direction:row;gap:.65rem;flex-wrap:nowrap}.mod-card{flex:1;min-width:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;border:1px solid var(--line);background:var(--card);color:inherit;border-radius:10px;padding:.7rem;cursor:pointer;display:flex;gap:.55rem}.mod-card.disabled{opacity:.45;cursor:default}.mod-card-icon{width:42px;height:42px;border-radius:8px;background:linear-gradient(135deg,#1a3a58,#0d2136);border:1px solid rgba(78,195,255,.35);flex-shrink:0;display:flex;align-items:center;justify-content:center;overflow:hidden}.mod-card-icon svg{width:34px;height:34px;display:block}.result-panel{width:min(480px,100%);max-width:100%;max-height:min(92vh,900px);overflow-x:hidden;overflow-y:auto}.result-reason{margin:0;color:var(--muted)}.result-grid{display:grid;grid-template-columns:1fr 1fr;gap:.45rem .75rem;font-size:.88rem}.result-grid div{display:flex;flex-direction:column;gap:.1rem;background:#0812228c;border-radius:8px;padding:.4rem .5rem}.result-grid .wide{grid-column:1 / -1}.result-grid span{color:var(--muted);font-size:.72rem}.result-score{margin:.2rem 0 0;font-size:1.15rem;font-weight:650}.mod-card-title{font-weight:650;font-size:.95rem}.mod-card-role,.mod-card-rank,.mod-card-slot,.mod-card-cost{color:var(--muted);font-size:.75rem;margin-top:.15rem}.mod-card-changes{font-size:.8rem;margin-top:.25rem;line-height:1.35}@media(max-width:720px){.mod-cards{flex-direction:column}.hud-block{min-width:0}.hud-bottom{gap:.22rem;padding-bottom:calc(5.75rem + var(--safe-bottom));padding-left:calc(5.75rem + var(--safe-left));padding-right:calc(5.75rem + var(--safe-right))}.slot-row{gap:.22rem;max-width:100%}.slot{padding:.16rem .18rem;font-size:.6rem}.slot b{font-size:.74rem}.ready-row{gap:.35rem}.ready{font-size:.64rem;padding:.08rem .28rem}.hud-top{flex-wrap:wrap}.play-hint.touch-hint{bottom:calc(42% + var(--safe-bottom));font-size:.78rem}.result-grid{grid-template-columns:minmax(0,1fr)}}