:root{--bg-a: #15110d;--bg-b: #262218;--bg-c: #3e2f1f;--card: rgba(11, 9, 6, .82);--line: rgba(240, 168, 82, .38);--line-strong: rgba(255, 210, 150, .76);--text: #fff4e4;--muted: #dcbfa0;--accent: #ffb347;--accent-cold: #7ce5ff;--danger: #ff6f6f;--hp: #6dff8b;--shield: #86ddff;--font-display: "Bungee", cursive;--font-body: "Noto Sans SC", sans-serif;--font-mono: "IBM Plex Mono", monospace}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;font-family:var(--font-body);color:var(--text);background:radial-gradient(circle at 22% 18%,#54321f 0%,transparent 34%),radial-gradient(circle at 81% 86%,#103a47 0%,transparent 32%),linear-gradient(135deg,var(--bg-a),var(--bg-b),var(--bg-c));overflow:hidden}#app{position:relative;width:100%;height:100%}.grain{position:absolute;inset:0;pointer-events:none;z-index:12;background-image:radial-gradient(rgba(255,255,255,.07) .6px,transparent .6px);background-size:3px 3px;opacity:.28;mix-blend-mode:soft-light}#game-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}.panel{position:absolute;left:14px;top:12px;min-width:280px;max-width:min(500px,72vw);padding:12px;border:1px solid var(--line);border-radius:14px;background:var(--card);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);pointer-events:none;z-index:20}.cockpit{box-shadow:inset 0 0 0 1px #ffcb8829,0 14px 40px #0000006b}.hud-headline{font-family:var(--font-mono);font-size:10px;letter-spacing:1.8px;color:var(--accent);margin-bottom:8px}.hud-row{display:flex;justify-content:space-between;gap:10px;font-size:12px;margin-bottom:6px;font-family:var(--font-mono)}.hud-row.main{gap:6px}.hud-row.single{color:var(--accent-cold);justify-content:flex-start}.value-pill{border:1px solid rgba(255,208,145,.42);border-radius:999px;padding:2px 8px;background:#ffb7471f;white-space:nowrap}.bar-wrap{display:grid;grid-template-columns:44px 1fr;align-items:center;gap:8px;font-size:12px;margin-top:7px}.bar{width:100%;height:9px;background:#ffffff1a;border-radius:99px;overflow:hidden;border:1px solid rgba(255,255,255,.18)}.bar-fill{height:100%;transition:width .1s linear}.bar-fill.hp{background:linear-gradient(90deg,#21dc62,var(--hp))}.bar-fill.shield{background:linear-gradient(90deg,#33a6ff,var(--shield))}.overlay{position:absolute;inset:0;display:none;align-items:center;justify-content:center;z-index:40;background:radial-gradient(circle at 80% 10%,#fcba6a26,#0a0806e6);padding:18px;animation:fadeOverlay .16s ease}.overlay.visible{display:flex}@keyframes fadeOverlay{0%{opacity:0}to{opacity:1}}.card{width:min(560px,96vw);background:linear-gradient(156deg,#100b07f2,#20140bf2);border:1px solid var(--line);border-radius:16px;padding:20px;box-shadow:0 22px 55px #00000085,inset 0 0 0 1px #ffcc881f}.card.large{width:min(920px,96vw)}.card.xlarge{width:min(1120px,98vw);max-height:90vh;overflow:auto}.hero-shell{width:min(980px,97vw);display:grid;grid-template-columns:1.45fr 1fr;gap:20px}.title-chip{font-family:var(--font-mono);color:var(--accent);font-size:12px;letter-spacing:1.6px;margin-bottom:10px}.briefing{border:1px solid rgba(255,197,126,.35);border-radius:12px;padding:14px;background:#f7aa4e14}.loadout-grid{margin-top:14px;display:grid;grid-template-columns:repeat(2,minmax(220px,1fr));gap:12px}.pick-list{display:grid;gap:8px}.pick-item{border:1px solid rgba(255,213,153,.28);border-radius:10px;background:#ffbc5e12;padding:8px;text-align:left;cursor:pointer;font-family:var(--font-body)}.pick-item:hover{border-color:#ffe2b0ad}.pick-item.active{border-color:#7ef5cdb8;box-shadow:inset 0 0 0 1px #7ef5cd40;background:#7ef5cd1c}.pick-item strong{display:block;font-size:14px}.pick-item .meta{display:block;font-size:11px;color:var(--accent-cold);margin:2px 0}.pick-item .tradeoff{display:block;font-size:11px;color:var(--muted)}.levelup-card{border-color:#7ce5ff66;box-shadow:0 28px 80px #070e14b3,inset 0 0 0 1px #7ce5ff2e}h1,h2,h3{margin:0 0 10px;font-family:var(--font-display);letter-spacing:.6px;line-height:1.05}h1{font-size:clamp(32px,5.2vw,58px)}h2{font-size:clamp(24px,4vw,38px)}p{color:var(--muted);margin:6px 0;line-height:1.5}.btn{position:relative;border:1px solid rgba(255,209,146,.46);border-radius:9px;padding:9px 14px;background:linear-gradient(130deg,#ffb04a1f,#ffffff0a);color:var(--text);cursor:pointer;font-family:var(--font-mono);letter-spacing:.5px;transition:transform .12s ease,border-color .12s ease,background .12s ease}.btn:hover{transform:translateY(-2px);border-color:var(--line-strong);background:linear-gradient(130deg,#ffb04a38,#ffffff14)}.btn.primary{border-color:#ffdc99d1;background:linear-gradient(120deg,#ffa442c7,#f57a44b8);color:#1a1008;font-weight:600}.btn:disabled{opacity:.45;cursor:default;transform:none}.lang-toggle{position:absolute;top:14px;right:14px;z-index:42;min-width:74px;padding:8px 12px}.button-row{margin-top:14px;display:flex;gap:10px;flex-wrap:wrap}.levelup-tip{font-family:var(--font-mono);font-size:12px;color:var(--accent-cold)}.option-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px;margin-bottom:10px}.option-btn{text-align:left;display:grid;gap:6px;min-height:126px;border:1px solid rgba(255,207,139,.38);background:linear-gradient(150deg,#28180cbf,#09111aa6)}.option-btn.option-rare{border-color:#7ce5ffa6;box-shadow:inset 0 0 0 1px #7ce5ff2e}.option-btn strong{font-family:var(--font-body);font-size:16px}.option-btn small{color:var(--muted)}.option-key{justify-self:start;font-family:var(--font-mono);font-size:11px;padding:2px 6px;border-radius:99px;border:1px solid rgba(255,255,255,.24);background:#ffffff0f}.option-synergy{color:var(--accent-cold);font-size:11px}.option-footer{grid-column:1 / -1;font-size:12px;margin-top:2px}.header-row{display:flex;justify-content:space-between;align-items:center;gap:12px}.talent-shell{border-color:#ffcf8b73}.talent-branches{margin-top:14px;display:grid;grid-template-columns:repeat(3,minmax(220px,1fr));gap:10px}.talent-hint{min-height:22px;margin-top:8px;margin-bottom:0;color:var(--accent-cold);font-size:13px}.talent-branch{border:1px solid rgba(255,218,164,.25);border-radius:12px;padding:10px;background:#0003}.talent-grid{display:grid;grid-template-columns:repeat(2,minmax(80px,1fr));gap:8px}.talent-node{padding:8px;border:1px solid rgba(255,255,255,.24);border-radius:8px;background:#ffffff08;font-size:12px;text-align:left}.talent-node.unlocked{border-color:#7ef5cdbf;background:#45f5c526}.talent-node.locked{opacity:.64}#mobile-controls{position:absolute;inset:0;pointer-events:none;z-index:30;display:none}#joystick-area{position:absolute;left:18px;bottom:20px;width:146px;height:146px;border-radius:50%;pointer-events:auto}#joystick-base,#joystick-stick{position:absolute;border-radius:50%}#joystick-base{width:146px;height:146px;border:1px solid rgba(255,216,160,.42);background:#ffab4d1f}#joystick-stick{width:70px;height:70px;left:38px;top:38px;border:1px solid rgba(126,245,205,.72);background:#7ef5cd38;transition:transform 70ms linear}.mobile-right{position:absolute;right:14px;bottom:20px;display:grid;gap:9px;pointer-events:auto}kbd{padding:2px 6px;border-radius:5px;border:1px solid rgba(255,220,171,.5);background:#ffb24e26;margin-right:4px;font-family:var(--font-mono)}@media(orientation:portrait)and (max-width:960px){#mobile-controls{display:block}.panel{left:8px;top:6px;min-width:190px;max-width:min(390px,92vw)}.hero-shell,.loadout-grid{grid-template-columns:1fr}.hud-row,.bar-wrap,.talent-node{font-size:11px}.talent-branches{grid-template-columns:1fr}.card{width:min(95vw,620px);padding:16px}.lang-toggle{top:8px;right:8px;min-width:66px;padding:7px 10px}}