:root{--bg:#0b1020;--panel:#0e1222db;--panel-border:#8ca0ff2e;--text:#e8ecff;--muted:#9aa3c7;--accent:#8be36b;--accent-rgb:139, 227, 107;--surface:#ffffff0a;--accent-strong:#5cc43c;--gold:#f5c542;--danger:#ff5a5a;--health:#e2474b;--radius:14px;--font-display:"Russo One", "Rubik", system-ui, sans-serif;--font-body:"Rubik", system-ui, -apple-system, "Segoe UI", sans-serif;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px);--safe-right:env(safe-area-inset-right,0px);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);font-family:var(--font-body);-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;overscroll-behavior:none;margin:0;overflow:hidden}#stage{touch-action:none;position:fixed;inset:0}.game-canvas{width:100%;height:100%;display:block}.game-labels{pointer-events:none;position:absolute;inset:0}#ui{pointer-events:none;position:fixed;inset:0}#ui a,#ui button,#ui input,#ui .panel,#ui .toast,#ui .room-code{pointer-events:auto}input{font:inherit;color:var(--text);border:1px solid var(--panel-border);-webkit-user-select:text;user-select:text;background:#ffffff0f;border-radius:10px;outline:none;padding:10px 12px}input:focus{border-color:var(--accent)}h1,h2{font-family:var(--font-display);letter-spacing:.02em;font-weight:400}.btn{font:600 15px var(--font-body);cursor:pointer;color:var(--text);white-space:nowrap;border:1px solid #0000;border-radius:10px;padding:10px 16px;transition:transform 80ms,background .15s,opacity .15s}.btn:active:not(:disabled){transform:translateY(1px)scale(.98)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn--primary{background:linear-gradient(180deg, var(--accent), var(--accent-strong));color:#0d1a08;box-shadow:0 4px #2f6b1d}.btn--secondary{border-color:var(--panel-border);background:#ffffff14}.btn--danger{color:#ffd2d2;background:#ff5a5a29;border-color:#ff5a5a80}.btn--ghost{border-color:var(--panel-border);background:0 0}.btn--wide{width:100%}.screen{padding:calc(16px + var(--safe-top)) calc(16px + var(--safe-right)) calc(16px + var(--safe-bottom)) calc(16px + var(--safe-left));display:flex;position:absolute;inset:0;overflow-y:auto}.screen--center{flex-direction:column;justify-content:center;align-items:center}.screen--left{justify-content:flex-start;align-items:center}.screen--bottom{flex-direction:column;justify-content:flex-end;align-items:center}.panel{background:var(--panel);border:1px solid var(--panel-border);border-radius:var(--radius);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);flex-direction:column;gap:12px;width:min(560px,100%);max-height:100%;padding:18px;display:flex;box-shadow:0 20px 60px #00000073}.screen--left .panel{margin-left:max(0px,50vw - 600px)}.panel__header{align-items:center;gap:12px;display:flex}.panel__title{margin:0;font-size:24px}.panel__subtitle{color:var(--muted);margin:2px 0 0;font-size:14px}.panel__body{flex-direction:column;gap:12px;display:flex;overflow-y:auto}.panel__footer{flex-wrap:wrap;justify-content:flex-end;gap:10px;display:flex}.logo{text-shadow:0 0 24px rgba(var(--accent-rgb), .55);flex-direction:column;align-items:center;display:flex}.logo__title{font-family:var(--font-display);color:var(--accent);letter-spacing:.06em;font-size:clamp(40px,9vw,84px)}.logo__subtitle{color:var(--muted);text-transform:uppercase;letter-spacing:.3em;font-size:12px}.loading{gap:28px}.studio-splash{justify-items:center;gap:10px;margin:0;animation:.45s ease-out both studio-reveal;display:grid}.studio-splash__plate{background:radial-gradient(closest-side,#f6f1e738,#0000);padding:12px;display:block}.studio-splash__logo{filter:drop-shadow(0 0 1px #f6f1e7e6)drop-shadow(0 0 10px #f6f1e740);width:min(220px,46vmin);height:min(220px,46vmin);display:block}.studio-splash__caption{color:var(--muted);letter-spacing:.3em;text-transform:uppercase;font-size:13px}@keyframes studio-reveal{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}.loading .meter{width:min(420px,80vw)}.loading__tip{color:var(--muted);text-align:center;max-width:420px;min-height:3em}.loading__error{color:var(--danger)}.main-menu{flex-direction:column;align-items:flex-start;gap:18px}.logo--menu{align-items:flex-start}.main-menu__panel{width:min(380px,100%)}.field{color:var(--muted);flex-direction:column;gap:6px;font-size:13px;display:flex}.hero-chip{border:1px solid var(--hero-color);background:color-mix(in srgb, var(--hero-color) 14%, transparent);color:var(--text);cursor:pointer;font:inherit;border-radius:10px;flex-direction:column;align-items:flex-start;gap:2px;padding:10px 12px;display:flex}.hero-chip__name{color:var(--hero-color);font-weight:800}.hero-chip__title{color:var(--muted);font-size:12px}.join-row{gap:8px;display:flex}.join-row__code{text-transform:uppercase;letter-spacing:.3em;text-align:center;flex:1;min-width:0}.menu-grid{grid-template-columns:1fr 1fr;gap:8px;display:grid}.room-code{border:1px dashed var(--accent);background:rgba(var(--accent-rgb), .06);color:var(--text);cursor:pointer;font:inherit;border-radius:12px;flex-direction:column;align-items:center;padding:14px;display:flex}.room-code strong{font-family:var(--font-display);letter-spacing:.25em;color:var(--accent);font-size:40px}.room-code small,.room-code span{color:var(--muted);font-size:12px}.roster{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.roster__row{background:var(--surface);border-left:3px solid var(--hero-color);border-radius:10px;align-items:center;gap:10px;padding:10px 12px;display:flex}.roster__dot{background:var(--hero-color);border-radius:50%;width:10px;height:10px}.roster__who{flex-direction:column;flex:1;display:flex}.roster__who small{color:var(--muted)}.badge{color:var(--muted);background:#ffffff14;border-radius:999px;padding:4px 10px;font-size:12px}.badge--ok{background:rgba(var(--accent-rgb), .18);color:var(--accent)}.badge--gold{color:var(--gold);background:#f5c54229}.hint{color:var(--muted);margin:0;font-size:13px}.meter{background:#ffffff14;border-radius:9px;min-width:80px;height:18px;position:relative;overflow:hidden}.meter__fill{background:var(--accent);border-radius:9px;transition:width .15s linear;position:absolute;inset:0 auto 0 0}.meter--health .meter__fill{background:linear-gradient(90deg, #b8333a, var(--health))}.meter--danger .meter__fill{background:linear-gradient(90deg, #8a1010, var(--danger))}.meter--gold .meter__fill{background:linear-gradient(90deg, #c8901c, var(--gold))}.meter__label{text-shadow:0 1px 2px #000;place-items:center;font-size:11px;font-weight:800;display:grid;position:absolute;inset:0}.hero-select{pointer-events:none;gap:12px}.hero-select__nav{align-items:center;gap:16px;display:flex}.hero-select__name{text-align:center;min-width:220px}.hero-select__name h1{color:var(--hero-color);text-shadow:0 2px 12px #000;margin:0;font-size:28px}.hero-select__name span{color:var(--muted)}.hero-select__card{width:min(460px,100%)}.hero-select__story{color:var(--muted);margin:0;font-style:italic}.hero-select__perk{color:var(--gold);margin:0}.stat-line{color:var(--muted);grid-template-columns:90px 1fr;align-items:center;gap:10px;font-size:13px;display:grid}.table-scroll{overflow-x:auto}.stats-table{border-collapse:collapse;width:100%;font-size:14px}.stats-table th,.stats-table td{text-align:left;white-space:nowrap;border-bottom:1px solid #ffffff0f;padding:8px 10px}.stats-table th{color:var(--muted);font-size:12px;font-weight:600}.stats-table tr.is-local td{background:rgba(var(--accent-rgb), .08)}.unlocked h2{margin:0 0 8px;font-size:16px}.unlocked__list{flex-wrap:wrap;gap:6px;display:flex}.achievement-grid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px;display:grid}.achievement{background:var(--surface);opacity:.7;border-radius:12px;gap:10px;padding:12px;display:flex}.achievement--done{opacity:1;background:#f5c5421a;border:1px solid #f5c5424d}.achievement__icon{font-size:28px}.achievement__text{flex-direction:column;flex:1;gap:4px;display:flex}.achievement__text small{color:var(--muted)}.stat-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;display:grid}.stat-tile{background:var(--surface);border-radius:12px;flex-direction:column;gap:2px;padding:12px;display:flex}.stat-tile__icon{font-size:22px}.stat-tile strong{font-family:var(--font-display);font-size:22px}.stat-tile small{color:var(--muted)}.settings{flex-direction:column;gap:14px;display:flex}.setting,.shop__header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.setting--toggle input{width:22px;height:22px;accent-color:var(--accent)}.segmented{flex-wrap:wrap;gap:6px;display:flex}.howto h2{margin:4px 0 8px;font-size:18px}.howto ul{color:var(--muted);flex-direction:column;gap:6px;margin:0;padding-left:18px;display:flex}.keys{list-style:none;padding-left:0!important}kbd{font:600 12px var(--font-body);color:var(--text);background:#ffffff1a;border:1px solid #fff3;border-radius:6px;padding:2px 7px}.bestiary{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px;display:grid}.bestiary__entry{background:var(--surface);border-radius:10px;flex-direction:column;gap:4px;padding:10px;display:flex}.bestiary__entry small{color:var(--muted)}.bestiary__stats{color:var(--gold);font-size:12px}.toasts{top:calc(64px + var(--safe-top));right:calc(12px + var(--safe-right));z-index:50;flex-direction:column;gap:8px;width:min(320px,100vw - 24px);display:flex;position:absolute}.toast{background:var(--panel);border:1px solid var(--panel-border);cursor:pointer;border-radius:12px;align-items:flex-start;gap:10px;padding:10px 12px;animation:.25s ease-out toast-in;display:flex}.toast p{color:var(--muted);margin:2px 0 0;font-size:13px}.toast__icon{font-size:22px}.toast--error{border-color:#ff5a5a80}.toast--achievement{border-color:#f5c54299;box-shadow:0 0 24px #f5c54240}@keyframes toast-in{0%{opacity:0;transform:translate(30px)}}.game-screen{position:absolute;inset:0}.hud-top{top:calc(10px + var(--safe-top));left:calc(10px + var(--safe-left));right:calc(10px + var(--safe-right));flex-wrap:wrap;align-items:center;gap:8px;display:flex;position:absolute}.hud-top__actions{gap:8px;margin-left:auto;display:flex}.hud-chip{background:var(--panel);border:1px solid var(--panel-border);border-radius:10px;padding:8px 12px;font-size:14px;font-weight:600}.hud-chip--gold{color:var(--gold)}.hud-chip--muted{color:var(--muted);font-size:12px}.hud-wait{position:absolute;top:40%;left:50%;transform:translate(-50%)}.team{top:calc(60px + var(--safe-top));left:calc(10px + var(--safe-left));flex-direction:column;gap:6px;width:170px;display:flex;position:absolute}.team__member{background:var(--panel);border-left:3px solid var(--hero-color);border-radius:10px;flex-direction:column;gap:4px;padding:6px 8px;display:flex}.team__name{font-size:12px;font-weight:600}.team .meter{height:6px}.hud-bottom{bottom:calc(12px + var(--safe-bottom));left:calc(12px + var(--safe-left));right:calc(12px + var(--safe-right));pointer-events:none;justify-content:space-between;align-items:flex-end;gap:12px;display:flex;position:absolute}.vitals{width:min(320px,42vw)}.vitals .meter{height:24px}.weapon-box{background:var(--panel);border:1px solid var(--panel-border);text-align:right;border-radius:12px;min-width:150px;padding:8px 12px}.weapon-box__name{color:var(--muted);font-size:12px}.weapon-box__ammo{font-family:var(--font-display);font-size:24px}.weapon-box__ammo.is-reloading{color:var(--gold);font-size:16px}.weapon-box__slots{justify-content:flex-end;gap:4px;margin-top:4px;display:flex}.slot{border:1px solid var(--panel-border);width:26px;height:26px;color:var(--muted);font:600 12px var(--font-body);cursor:pointer;background:0 0;border-radius:6px}.slot.is-active{border-color:var(--accent);color:var(--accent)}.banner{text-align:center;pointer-events:none;width:90vw;animation:2.6s forwards banner-in;position:absolute;top:22%;left:50%;transform:translate(-50%)}.banner h2{color:var(--accent);text-shadow:0 0 30px rgba(var(--accent-rgb), .6), 0 3px 0 #000;margin:0;font-size:clamp(30px,7vw,56px)}.banner p{color:var(--text);text-shadow:0 2px 6px #000;margin:4px 0 0}@keyframes banner-in{0%{opacity:0;transform:translate(-50%,20px)scale(.9)}12%{opacity:1;transform:translate(-50%)scale(1)}80%{opacity:1}to{opacity:0}}.downed{text-align:center;border-radius:var(--radius);background:#3c00008c;border:1px solid #ff5a5a73;width:min(360px,90vw);padding:16px;position:absolute;top:34%;left:50%;transform:translate(-50%)}.downed h2{margin:0}.downed p{color:#ffd0d0}.overlay{padding:calc(12px + var(--safe-top)) 12px calc(12px + var(--safe-bottom));pointer-events:auto;background:#05070f99;place-items:center;display:grid;position:absolute;inset:0}.overlay--transparent{pointer-events:none;background:0 0}.overlay .screen{justify-content:center;width:100%;padding:0;position:static}.pause{width:min(380px,100%)}.shop{width:min(1100px,100%);max-height:92vh}.shop__actions{flex-wrap:wrap;gap:8px;display:flex}.shop__grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px;display:grid;overflow-y:auto}.weapon-card{background:var(--surface);border:1px solid #ffffff0f;border-radius:12px;flex-direction:column;gap:8px;padding:12px;display:flex}.weapon-card.is-owned{border-color:rgba(var(--accent-rgb), .35)}.weapon-card header{flex-direction:column;display:flex}.weapon-card header small{color:var(--muted);font-size:12px}.weapon-card__stats{color:var(--gold);flex-wrap:wrap;gap:8px;font-size:13px;display:flex}.upgrade-row{grid-template-columns:1fr auto auto;align-items:center;gap:8px;font-size:13px;display:grid}.upgrade-row .btn{padding:6px 10px;font-size:13px}.pips{gap:3px;display:flex}.pip{background:#ffffff1f;border-radius:3px;width:10px;height:10px}.pip.is-on{background:var(--accent)}.scoreboard{width:min(560px,100%)}.player-label,.merchant-sign{font:600 12px var(--font-body);color:#fff;border:1px solid var(--hero-color);white-space:nowrap;background:#0000008c;border-radius:999px;padding:2px 8px}.player-label--local{display:none}.touch-layer{pointer-events:none;position:absolute;inset:0}.stick,.stick-knob{border-radius:50%;position:absolute;transform:translate(-50%,-50%)}.stick{background:#ffffff0d;border:2px solid #ffffff40;width:112px;height:112px}.stick-knob{background:#ffffff59;width:52px;height:52px}.stick--aim{border-color:#ff785a73}.stick-knob--aim{background:#ff785a8c}.touch-hints{bottom:calc(90px + var(--safe-bottom));color:#ffffff47;justify-content:space-around;font-size:12px;display:flex;position:absolute;left:0;right:0}.touch-buttons{right:calc(16px + var(--safe-right));bottom:calc(100px + var(--safe-bottom));flex-direction:column;gap:10px;display:flex;position:absolute}.touch-btn{border:1px solid var(--panel-border);background:var(--panel);width:54px;height:54px;color:var(--text);pointer-events:auto;border-radius:50%;font-size:22px}@media (width<=640px){.panel{padding:14px}.team{width:130px}.hud-chip{padding:6px 9px;font-size:12px}.weapon-box{min-width:120px}.weapon-box__ammo{font-size:20px}.screen--left{justify-content:center}.screen--left:not(.main-menu){align-items:flex-end}.screen--left:not(.main-menu) .panel{max-height:62%}.main-menu{align-items:stretch}.logo--menu{align-items:center}.main-menu__panel{width:100%}}.bot-picker{flex-wrap:wrap;align-items:center;gap:8px 12px;margin:12px 0;display:flex}.bot-picker__label{white-space:nowrap;flex:1;font-weight:600}.bot-picker__options{gap:6px;display:flex}.bot-picker__option{min-width:40px;height:36px;color:inherit;font:600 15px var(--font-body);cursor:pointer;background:#ffffff0d;border:1px solid #ffffff24;border-radius:10px}.bot-picker__option--active{background:var(--accent);border-color:var(--accent);color:#10140f}.bot-picker__option:disabled{cursor:default}.bot-picker__option:disabled:not(.bot-picker__option--active){opacity:.5}.bot-picker__hint{width:100%;color:var(--muted);font-size:12px}.player-label--offline{border-color:#ff6b5a;animation:.9s steps(2,jump-none) infinite offline-blink;display:block}@keyframes offline-blink{0%{opacity:1}to{opacity:.25}}.reconnect__panel{text-align:center;max-width:360px}.reconnect__icon{font-size:40px;animation:.9s steps(2,jump-none) infinite offline-blink;display:block}.merchant-sign{border-color:var(--gold);padding:3px 10px}.merchant-sign--serving{background:var(--gold);color:#1a1206}.merchant-sign--closed{color:#ffb3a8;border-color:#ff6b5a}.main-menu__language{margin:4px 0 10px}.main-menu__source{color:inherit;opacity:.6;align-self:center;margin-top:4px;font-size:13px}.main-menu__source:hover,.main-menu__source:focus-visible{opacity:1}
