/* @generated by build.sh from src/game.css + src/game-*.css; edit src/, then rerun build.sh */
/* ---- Gravity Gang: game UI ---- */
.gg{--ink:#0b0d14;--panel:rgba(12,15,24,.82);--panel2:rgba(22,27,40,.92);--line:rgba(255,255,255,.14);--fg:#eef2fa;--muted:#a9b3c7;--sun:#ffc93c;--sky:#48d8f7;--hp:#ff5a4a;--foe:#ff3c3c;
  --display:'Russo One','Arial Black',Impact,system-ui,sans-serif;--hudf:'Chakra Petch',ui-sans-serif,system-ui,sans-serif;
  position:relative;overflow:hidden;background:#07080c;color:var(--fg);font-family:var(--hudf);user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;outline:none;touch-action:manipulation}
.gg canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}
.gg [hidden]{display:none!important}
.gg button{font-family:var(--hudf)}
.gg .nogl{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:24px;color:var(--muted)}
.gg .hud{position:absolute;inset:0;pointer-events:none;font-size:clamp(11px,1.35vw,14px)}
.gg:not(.playing) .hud{display:none}
.gg .obj{position:absolute;left:max(12px,env(safe-area-inset-left));top:max(12px,env(safe-area-inset-top));max-width:min(30%,380px);background:var(--panel);border-left:3px solid var(--sun);padding:6px 10px;line-height:1.35;clip-path:polygon(0 0,100% 0,calc(100% - 10px) 100%,0 100%)}
.gg .obj b{display:block;font-family:var(--display);font-weight:400;color:var(--sun);font-size:.85em;letter-spacing:.08em;text-transform:uppercase}
.gg .compass{position:absolute;left:50%;top:max(10px,env(safe-area-inset-top));transform:translateX(-50%);width:min(36%,440px);height:40px;background:linear-gradient(90deg,transparent,var(--panel) 18%,var(--panel) 82%,transparent);overflow:hidden}
.gg .cin{position:absolute;inset:0}
.gg .cin span{position:absolute;top:30%;transform:translate(-50%,-50%);white-space:nowrap;font-weight:600}
.gg .cin span.mk{top:74%}
.gg .cd{color:var(--fg);font-family:var(--display);font-size:.95em}.gg .cd.sm{color:var(--muted);font-size:.7em}
.gg .mk{font-size:.78em;padding:1px 5px;border-radius:3px;background:rgba(0,0,0,.35)}
.gg .cin .grp{color:var(--muted)}.gg .cin .grp b{font-size:1em;padding:0;background:none;font-weight:inherit}.gg .cin .grp i{font-style:normal}
.gg .mk.ship{color:var(--sun)}.gg .mk.obj{color:#ff5a7a}.gg .mk.cache{color:#e6ecff}.gg .mk.poi{color:var(--muted);background:none}
.gg .cmid{position:absolute;left:50%;top:0;width:2px;height:6px;background:var(--sun);transform:translateX(-50%)}
.gg .topr{position:absolute;right:max(12px,env(safe-area-inset-right));top:max(10px,env(safe-area-inset-top));display:flex;gap:6px;pointer-events:auto}
.gg .topr button{background:var(--panel);color:var(--fg);border:1px solid var(--line);padding:5px 10px;font-weight:600;cursor:pointer;clip-path:polygon(6px 0,100% 0,calc(100% - 6px) 100%,0 100%)}
.gg .topr button:hover{background:var(--panel2)}
.gg .xhair{position:absolute;left:50%;top:50%;width:26px;height:26px;transform:translate(-50%,-50%);transition:width .1s,height .1s}
.gg .xhair i{position:absolute;background:#fff;box-shadow:0 0 2px #000}
.gg .xhair i:nth-child(1){left:50%;top:0;width:2px;height:8px;margin-left:-1px}.gg .xhair i:nth-child(2){left:50%;bottom:0;width:2px;height:8px;margin-left:-1px}
.gg .xhair i:nth-child(3){top:50%;left:0;height:2px;width:8px;margin-top:-1px}.gg .xhair i:nth-child(4){top:50%;right:0;height:2px;width:8px;margin-top:-1px}
.gg .xhair.foe i{background:var(--foe)}.gg .xhair.adsx{width:14px;height:14px}
.gg.in-veh .xhair{width:34px;height:34px}
.gg .hitm{position:absolute;left:50%;top:50%;width:22px;height:22px;transform:translate(-50%,-50%) rotate(45deg);opacity:0;border:2px solid #fff;border-width:0 2px;transition:opacity .08s}
.gg .hitm.crit{border-color:#ffd23f;width:30px;height:30px}
.gg .bars{position:absolute;left:max(12px,env(safe-area-inset-left));bottom:max(12px,env(safe-area-inset-bottom));display:flex;gap:8px;align-items:flex-end;width:min(40%,340px)}
.gg .lvl{width:44px;height:44px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--panel);border:2px solid var(--sun);clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%)}
.gg .lvl b{font-family:var(--display);font-weight:400;font-size:1.25em;line-height:1;color:var(--sun)}.gg .lvl span{font-size:.6em;color:var(--muted)}
.gg .bcol{flex:1;display:flex;flex-direction:column;gap:3px;min-width:0}
.gg .bar{position:relative;height:14px;background:rgba(0,0,0,.55);border:1px solid var(--line);clip-path:polygon(0 0,100% 0,calc(100% - 8px) 100%,0 100%)}
.gg .bar i{position:absolute;left:0;top:0;bottom:0;transition:width .12s}
.gg .bar em{position:absolute;right:12px;top:50%;transform:translateY(-50%);font-style:normal;font-size:.72em;font-weight:700;text-shadow:0 1px 2px #000}
.gg .bar.sh i{background:linear-gradient(90deg,#1aa6d9,var(--sky))}.gg .bar.hp i{background:linear-gradient(90deg,#c9302c,var(--hp))}
.gg .bar.xp{height:5px}.gg .bar.xp i{background:var(--sun)}
.gg .bars.lowsh .bar.sh{animation:blink .5s steps(2) infinite}
@keyframes blink{50%{border-color:var(--sky)}}
.gg .wpn{position:absolute;right:max(12px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom));min-width:210px;max-width:min(42%,330px);background:var(--panel);padding:8px 12px;text-align:right;clip-path:polygon(10px 0,100% 0,100% 100%,0 100%)}
.gg .wname{font-family:var(--display);font-size:1em;line-height:1.15;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gg .wrow{display:flex;justify-content:flex-end;align-items:center;gap:8px;margin-top:2px}
.gg .ammo{font-size:1em;color:var(--muted);font-variant-numeric:tabular-nums}.gg .ammo b{font-family:var(--display);font-weight:400;font-size:1.5em;color:var(--fg)}.gg .ammo .rl{color:var(--sun);font-weight:700}
.gg .rbar{height:3px;background:rgba(255,255,255,.1);margin-top:4px}.gg .rbar i{display:block;height:100%;background:var(--sun)}
.gg .wnext{font-size:.75em;color:var(--muted);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gg .chip{--c:var(--muted);display:inline-block;font-size:.72em;font-weight:700;letter-spacing:.04em;padding:1px 7px;border:1px solid var(--c);color:var(--c);border-radius:2px;text-transform:uppercase}
.gg .abil{position:absolute;right:max(12px,env(safe-area-inset-right));bottom:calc(max(12px,env(safe-area-inset-bottom)) + 96px);display:flex;align-items:center;gap:8px;flex-direction:row-reverse}
.gg .abil .ring{--p:1;width:46px;height:46px;border-radius:50%;background:conic-gradient(var(--sun) calc(var(--p)*360deg),rgba(255,255,255,.12) 0);display:flex;align-items:center;justify-content:center}
.gg .abil .ring b{width:36px;height:36px;border-radius:50%;background:var(--ink);display:flex;align-items:center;justify-content:center;font-size:.72em;font-weight:700}
.gg .abil span{font-family:var(--display);font-size:.85em;background:var(--panel);padding:3px 8px}
.gg .vehhud{position:absolute;left:50%;bottom:max(14px,env(safe-area-inset-bottom));transform:translateX(-50%);display:flex;align-items:center;gap:10px;background:var(--panel);padding:6px 14px;min-width:220px}
.gg .vehhud b{font-family:var(--display);font-weight:400;color:var(--sun)}.gg .vehhud .bar{flex:1;height:10px}.gg .vehhud .bar i{background:linear-gradient(90deg,#ffb13c,#ffd23f)}
.gg .vehhud span{font-variant-numeric:tabular-nums;color:var(--muted);min-width:64px;text-align:right}
.gg .prompt{position:absolute;left:50%;top:62%;transform:translateX(-50%);background:var(--panel2);border:1px solid var(--sun);padding:6px 14px;font-weight:700;white-space:nowrap}
.gg .toast{position:absolute;left:50%;top:calc(max(10px,env(safe-area-inset-top)) + 92px);transform:translateX(-50%);width:min(90%,520px);display:flex;flex-direction:column;gap:5px;align-items:center}
.gg .toast div{background:var(--panel);border-left:3px solid var(--sky);padding:5px 12px;text-align:center;animation:ggpop .2s ease-out}
.gg .banner{position:absolute;left:50%;top:24%;transform:translateX(-50%);text-align:center;width:min(92%,640px)}
.gg .banner b{display:block;font-family:var(--display);font-weight:400;font-size:clamp(26px,5vw,54px);letter-spacing:.06em;color:var(--sun);text-shadow:0 3px 0 #000,0 0 24px rgba(255,201,60,.35)}
.gg .banner span{display:inline-block;margin-top:6px;background:var(--panel);padding:5px 12px}.gg .banner span:empty{display:none}
.gg .banner.go{animation:ggban 4.2s ease-out forwards}
@keyframes ggban{0%{opacity:0;transform:translateX(-50%) scale(1.2)}8%{opacity:1;transform:translateX(-50%) scale(1)}85%{opacity:1}100%{opacity:0}}
@keyframes ggbanL{0%{opacity:0;transform:scale(1.08)}8%{opacity:1;transform:none}85%{opacity:1}100%{opacity:0;transform:none}} /* edge-anchored banners (portrait, touch landscape): no translateX(-50%) */
.gg.narrow .banner.go{animation-name:ggbanL}
@keyframes ggpop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.gg .dmg{position:absolute;inset:0;overflow:hidden}
.gg .dn{position:absolute;left:0;top:0;font-family:var(--display);font-size:1.1em;text-shadow:0 2px 0 #000,0 0 3px #000;white-space:nowrap;will-change:transform}
.gg .dn.crit{font-size:1.5em}
.gg .hurt{position:absolute;inset:0;opacity:0;background:radial-gradient(ellipse at center,transparent 55%,rgba(200,20,20,.75) 100%)}
.gg .hitdir{position:absolute;left:50%;top:50%;width:100vmin;height:100vmin;margin:-50vmin 0 0 -50vmin;opacity:0;pointer-events:none;background:radial-gradient(ellipse 22% 9% at 50% 9%,rgba(255,60,50,.95),rgba(255,60,50,.45) 55%,transparent 100%)}
.gg .cloakfx{position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 50%,rgba(120,255,160,.25) 100%);border:2px solid rgba(159,232,111,.4)}
.gg .lockhint{position:absolute;left:50%;bottom:12%;transform:translateX(-50%);background:var(--panel);padding:6px 12px;font-size:.85em;color:var(--muted);white-space:nowrap}
.gg .lootpop{position:absolute;right:max(12px,env(safe-area-inset-right));top:calc(max(10px,env(safe-area-inset-top)) + 210px);width:min(320px,86%);pointer-events:auto;animation:ggpop .2s ease-out;max-height:calc(100% - 200px);overflow:auto}
/* loot card */
.gg .loot,.page .loot{--r:#fff;background:linear-gradient(160deg,color-mix(in srgb,var(--r) 22%,#141824) 0%,#10131c 60%);border:1px solid color-mix(in srgb,var(--r) 70%,transparent);border-top:3px solid var(--r);padding:10px 12px;display:flex;flex-direction:column;gap:6px;clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%);min-width:0;color:#eef2fa;font-family:'Chakra Petch',ui-sans-serif,system-ui,sans-serif}
.loot header{display:flex;justify-content:space-between;gap:8px;font-size:12px}
.loot .rar{color:var(--r);font-weight:700;letter-spacing:.08em;text-transform:uppercase}.loot .mk{color:#a9b3c7}
.loot h4{margin:0;font-family:'Russo One','Arial Black',system-ui,sans-serif;font-weight:400;font-size:18px;line-height:1.15;color:#fff}
.loot .kvs{display:grid;grid-template-columns:1fr 1fr;gap:2px 14px}
.loot .kv{display:flex;justify-content:space-between;gap:6px;font-size:13px;color:#a9b3c7;border-bottom:1px solid rgba(255,255,255,.06)}
.loot .kv b{color:#fff;font-variant-numeric:tabular-nums}.loot .kv i{font-style:normal;margin-left:3px;font-size:10px}.loot .kv i.up{color:#5fe07a}.loot .kv i.dn{color:#ff6a5a}
.loot .chips{display:flex;flex-wrap:wrap;gap:4px}
.loot .chip{--c:#a9b3c7;font-size:11px;font-weight:700;padding:1px 7px;border:1px solid var(--c);color:var(--c);text-transform:uppercase;letter-spacing:.03em}
.loot .flavor{margin:0;color:#ff6a5a;font-style:italic;font-size:13px}
.gg .lacts{display:flex;gap:6px;flex-wrap:wrap;margin-top:2px}
.gg .btn{font-family:var(--display);font-size:18px;letter-spacing:.04em;color:#10131c;background:var(--sun);border:0;padding:10px 26px;cursor:pointer;clip-path:polygon(10px 0,100% 0,calc(100% - 10px) 100%,0 100%);text-transform:uppercase}
.gg .btn:hover{filter:brightness(1.08)}.gg .btn:active{transform:translateY(1px)}
.gg .btn.sm{font-size:13px;padding:6px 14px}.gg .btn.ghost{background:#2b3244;color:var(--fg)}
.gg button:focus-visible{outline:2px solid var(--sky);outline-offset:2px}
/* touch */
.gg .touch{display:none}
.gg.is-touch.playing .touch{display:block}
.gg.is-touch .lockhint{display:none}
.gg .stickzone{position:absolute;left:0;bottom:0;width:44%;height:64%;pointer-events:auto;touch-action:none}
.gg .stick{position:absolute;display:none;width:116px;height:116px;margin:-58px 0 0 -58px;border-radius:50%;border:2px solid rgba(255,255,255,.3);background:rgba(10,12,20,.35)}
.gg .stick i{position:absolute;left:50%;top:50%;width:50px;height:50px;margin:-25px 0 0 -25px;border-radius:50%;background:rgba(255,201,60,.9)}
.gg .tbtns{position:absolute;right:max(10px,env(safe-area-inset-right));bottom:calc(max(10px,env(safe-area-inset-bottom)) + 86px);width:230px;height:230px;pointer-events:none}
.gg .tb{position:absolute;pointer-events:auto;touch-action:none;border-radius:50%;border:2px solid rgba(255,255,255,.35);background:rgba(10,12,20,.55);color:#fff;font-weight:700;font-size:12px;width:58px;height:58px;padding:0}
.gg .tb.down{background:rgba(255,201,60,.55)}.gg .tb.on{background:rgba(72,216,247,.45)}
.gg .tb.fire{right:0;bottom:0;width:92px;height:92px;background:rgba(255,90,74,.55);font-size:15px}
.gg .tb.jump{right:104px;bottom:0;width:66px;height:66px}
.gg .tb.aim{right:4px;bottom:104px}.gg .tb.rel{right:70px;bottom:78px}.gg .tb.swap{right:140px;bottom:74px;width:50px;height:50px;font-size:10px}
.gg .tb.abl{--p:1;right:124px;bottom:132px;background:conic-gradient(rgba(255,201,60,.8) calc(var(--p)*360deg),rgba(10,12,20,.55) 0)}
.gg .tb.use{right:66px;bottom:150px;width:64px;height:64px;background:rgba(255,201,60,.75);color:#10131c}
.gg.is-touch .wpn{bottom:max(10px,env(safe-area-inset-bottom));min-width:0;max-width:44%;padding:5px 9px}
.gg.is-touch .abil{display:none}
.gg.is-touch .prompt{top:40%}
.gg.in-veh .tb.aim,.gg.in-veh .tb.rel,.gg.in-veh .tb.swap,.gg.in-veh .tb.abl{display:none}
.gg.in-veh .abil{display:none}
.gg.narrow .compass{top:auto;bottom:calc(max(10px,env(safe-area-inset-bottom)) + 300px);width:60%}
.gg.narrow .obj{top:calc(max(10px,env(safe-area-inset-top)) + 38px);max-width:min(calc(100% - 158px),340px);font-size:.85em}
.gg.narrow .topr button[data-a=full]{display:none} /* Menu stays: in portrait it is the only on-screen way to pause or exit */
.gg.narrow .toast{top:calc(max(10px,env(safe-area-inset-top)) + 150px)}
.gg.narrow .banner{top:calc(max(10px,env(safe-area-inset-top)) + 150px);left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));transform:none;width:auto}.gg.narrow .banner b{font-size:28px;line-height:1.05} /* portrait: title only (the subtitle goes to the toasts), at the top of the toast column; toasts step down under it */
.gg.narrow .hud.banup .toast{top:calc(max(10px,env(safe-area-inset-top)) + 192px)}.gg.narrow .hud.bossup .banner{top:calc(max(10px,env(safe-area-inset-top)) + 206px)}.gg.narrow .hud.bossup.banup .toast{top:calc(max(10px,env(safe-area-inset-top)) + 248px)}
.gg.narrow .bars{width:46%}
.gg.narrow .wpn{bottom:calc(max(10px,env(safe-area-inset-bottom)) + 0px);max-width:42%}
.gg.narrow.is-touch .tbtns{transform:scale(.86);transform-origin:bottom right}
.gg.narrow .lootpop{top:calc(max(10px,env(safe-area-inset-top)) + 200px);bottom:auto;right:12px;width:min(320px,86%);transform:none;max-height:44%}
/* panels */
.gg .panel{position:absolute;inset:max(10px,env(safe-area-inset-top)) max(10px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));background:rgba(8,10,16,.94);border:1px solid var(--line);display:flex;flex-direction:column;gap:10px;padding:12px;overflow:hidden;pointer-events:auto;z-index:5}
.gg .panel header{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.gg .panel header h3{margin:0;font-family:var(--display);font-weight:400;font-size:20px;color:var(--sun);letter-spacing:.04em}
.gg .panel header span{color:var(--muted);flex:1;font-size:13px}
.gg .icols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;min-height:0;flex:1}
@media (max-width:640px){.gg .icols{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto}}
.gg .ilist{overflow:auto;display:flex;flex-direction:column;gap:4px;min-height:0}
.gg .idetail{overflow:auto;min-height:0}
.gg .irow{display:grid;grid-template-columns:4px minmax(0,1fr) auto;gap:8px;align-items:center;text-align:left;background:#141824;border:1px solid transparent;color:var(--fg);padding:6px 8px;cursor:pointer;font-size:13px}
.gg .irow i{align-self:stretch;background:var(--r)}.gg .irow span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gg .irow em{font-style:normal;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.gg .irow em b{color:var(--sun);font-weight:700}.gg .irow.sel,.gg .irow:hover{border-color:var(--r);background:#1a2030}
.gg .wlist{overflow:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px;align-content:start}
.gg .wcard{display:grid;grid-template-columns:56px minmax(0,1fr);gap:10px;background:#141824;border:1px solid var(--line);padding:12px;align-items:start}
.gg .wcard .btn{grid-column:1/-1;justify-self:end}
.gg .wcard .wbtns{grid-column:1/-1;flex-direction:row;flex-wrap:wrap;justify-content:flex-end}
.gg .wcard h4{margin:0;font-family:var(--display);font-weight:400;font-size:17px}
.gg .wcard p{margin:3px 0 0;font-size:13px;color:var(--muted)}.gg .wcard .rule{color:var(--sky)}.gg .wcard .st{color:var(--sun)}
.gg .wcard.here{border-color:var(--sun)}.gg .wcard.locked{opacity:.6}
.gg .orb{width:56px;height:56px;border-radius:50%;background:radial-gradient(circle at 35% 30%,var(--hi),var(--c) 55%,#05060a 100%)}
/* menu */
.gg .menu{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 30%,rgba(10,12,20,.55),rgba(5,6,10,.9));overflow:auto;display:flex;align-items:center;align-items:safe center;justify-content:center;padding:16px;z-index:6;pointer-events:auto}
.gg .mwrap{width:100%;max-width:860px;display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center}
.gg .logo{font-family:var(--display);font-size:clamp(34px,6.5vw,64px);line-height:1;color:var(--sun);letter-spacing:.04em;text-shadow:0 4px 0 #000,0 0 30px rgba(255,201,60,.3);transform:skewX(-8deg)}
.gg .logo span{color:#fff}
.gg .msub{margin:0;color:var(--muted);letter-spacing:.2em;text-transform:uppercase;font-size:12px}
.gg .hgrid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;width:100%}
@media (max-width:620px){.gg .hgrid{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.gg .hpick b{font-size:12px}.gg .hpick span{font-size:9px;letter-spacing:0}}
.gg .hpick span{line-height:1.15}
.gg .crewlooks{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.gg .crewlooks button{display:flex;align-items:center;gap:6px;min-height:36px;padding:4px 10px 4px 6px;background:#141824;border:1px solid var(--line);color:var(--fg);font:inherit;font-size:13px;cursor:pointer}
.gg .crewlooks button[aria-pressed=true]{border-color:var(--v);background:#1a2030}
.gg .crewlooks i{width:22px;height:22px;border-radius:50%;flex:none;background:conic-gradient(var(--a) 0 50%,var(--t) 50% 80%,var(--v) 80%);border:1px solid #0c0a1c}
.gg .hpick{background:#141824;border:1px solid var(--line);border-bottom:3px solid var(--c);color:var(--fg);padding:4px 4px 8px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:1px;transition:transform .12s}
.gg .hpick img{width:100%;aspect-ratio:1/1;display:block;background:radial-gradient(circle at 50% 70%,color-mix(in srgb,var(--c) 45%,transparent),transparent 70%)}
.gg .hpick img:not(.ready){visibility:hidden}
.gg .hpick b{font-family:var(--display);font-weight:400;font-size:13px}.gg .hpick span{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.gg .hpick[aria-pressed=true]{transform:translateY(-3px);border-color:var(--c);background:#1a2030}
.gg .hinfo{max-width:620px;background:var(--panel);padding:10px 14px;text-align:left;font-size:14px;line-height:1.45}
.gg .hinfo h4{margin:0 0 4px;font-family:var(--display);font-weight:400;font-size:18px}.gg .hinfo p{margin:4px 0 0;color:#d5dbea}.gg .hinfo .hstats{color:var(--muted);font-size:12px}
/* co-op: pings, teammates, downed */
.gg .ptag.ping span{color:#10131c;background:#5fe07a}.gg .ptag.ping.foe span{background:#ff5a4a;color:#fff}
.gg .mk.mate{color:#5fe07a}.gg .mk.mate.down{color:#ff5a4a;font-weight:700}
.gg .respawn.downed{background:rgba(60,0,0,.35);justify-content:flex-end;padding-bottom:22%;pointer-events:none}
.gg .respawn .dtxt{background:var(--panel);padding:4px 12px}
.gg .tb.ping{right:188px;bottom:28px;width:46px;height:46px;font-size:10px;background:rgba(95,224,122,.45)}
.gg.in-turret .tb.jump,.gg.in-turret .vehhud{display:none}
/* camera option on the hero screen */
.gg .viewpick{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:center}
.gg .viewpick span{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.14em;margin-right:4px}
.gg .viewpick button{background:#141824;color:var(--fg);border:1px solid var(--line);padding:6px 12px;cursor:pointer;font-weight:700;clip-path:polygon(6px 0,100% 0,calc(100% - 6px) 100%,0 100%)}
.gg .viewpick button[aria-pressed=true]{background:var(--sun);color:#10131c;border-color:var(--sun)}
.gg .mfine{margin:0;max-width:640px;color:var(--muted);font-size:12px}
.gg .fade{position:absolute;inset:0;background:#000;opacity:0;pointer-events:none;transition:opacity .6s;z-index:8}
.gg .fade.on{opacity:1}
.gg .respawn{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;background:rgba(40,0,0,.45);z-index:7}
.gg .respawn b{font-family:var(--display);font-weight:400;font-size:clamp(26px,5vw,48px);color:var(--hp)}
@media (max-height:500px){.gg.is-touch .tbtns{transform:scale(.8);transform-origin:bottom right;bottom:calc(max(8px,env(safe-area-inset-bottom)) + 70px)}.gg .vehhud{bottom:auto;top:calc(max(10px,env(safe-area-inset-top)) + 46px)}.gg .banner{top:30%}.gg .banner b{font-size:clamp(22px,5vw,40px)}}
.gg .coopchip{position:absolute;right:max(12px,env(safe-area-inset-right));top:calc(max(10px,env(safe-area-inset-top)) + 34px);background:var(--panel);border-left:3px solid #5fe07a;padding:3px 10px;font-size:.8em;font-weight:700;color:#5fe07a}
.gg .tags{position:absolute;inset:0;overflow:hidden}
.gg .ptag{position:absolute;left:0;top:0;display:flex;flex-direction:column;align-items:center;gap:2px;white-space:nowrap}
.gg .ptag span{background:var(--panel);color:#5fe07a;font-weight:700;font-size:.8em;padding:1px 6px}
.gg .ptag i{width:46px;height:4px;background:rgba(0,0,0,.6)}.gg .ptag b{display:block;height:100%;background:#5fe07a}
.gg .panel.coop{inset:auto;left:50%;top:50%;transform:translate(-50%,-50%);width:min(640px,94%);max-height:92%;overflow:auto}
.gg .cbody{display:flex;flex-direction:column;gap:12px}
.gg .ccols{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:560px){.gg .ccols{grid-template-columns:1fr}}
.gg .ccols section{background:#141824;border:1px solid var(--line);padding:12px;display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.gg .ccols h4{margin:0;font-family:var(--display);font-weight:400;font-size:17px}.gg .ccols p{margin:0;color:var(--muted);font-size:13px}
.gg .cjoin{display:flex;gap:8px;align-items:center}
.gg .cjoin input{width:170px;font-family:var(--display);font-size:22px;letter-spacing:.2em;text-transform:uppercase;text-align:center;background:#0b0d14;color:var(--fg);border:1px solid var(--line);padding:6px}
.gg .cjoin input:focus{outline:2px solid var(--sky)}
.gg .ccode{display:flex;flex-direction:column;align-items:center;background:#141824;padding:10px}
.gg .ccode span{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.14em}.gg .ccode b{font-family:var(--display);font-weight:400;font-size:44px;letter-spacing:.3em;color:var(--sun)}
.gg .cstat{margin:0;color:#5fe07a;font-weight:700}.gg .cplayers{margin:0;padding-left:1.2em;color:var(--muted)}.gg .cplayers b{color:var(--fg)}
.gg .cnote{margin:0;color:var(--muted);font-size:13px}.gg .cerr{margin:0;color:#ff6a5a;font-weight:700}
@media (prefers-reduced-motion:reduce){.gg *{animation:none!important;transition:none!important}}
.gg .tb.dive{display:none;right:186px;bottom:-6px;width:54px;height:54px;font-size:11px;background:rgba(72,160,247,.5)}
.gg.is-under .tb.dive{display:block}
.gg.h2-roll .tb.dive{display:block}.gg.h2-roll .tb.ping{right:198px;bottom:60px}
.gg .respawn.arena b{color:#ff8aa0}
.gg.is-arena .obj{max-width:min(48%,560px)}
.gg .itabs{display:flex;gap:6px;margin-left:auto;margin-right:8px}
.gg .upg{padding:10px 14px;overflow:auto;max-height:calc(100% - 60px)}
.gg .upts{margin:0 0 10px;opacity:.9}.gg .upts b{color:var(--sun)}
.gg .ulist{display:grid;gap:6px}
.gg .urow{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center;background:rgba(255,255,255,.04);padding:7px 10px;border-radius:6px}
.gg .urow b{display:block}.gg .urow span{font-size:.85em;opacity:.75}.gg .urow em{font-style:normal;color:var(--sun);font-size:.85em}
.gg .pips{display:flex;gap:3px}.gg .pips i{width:10px;height:10px;border-radius:2px;background:rgba(255,255,255,.15)}.gg .pips i.on{background:var(--sun)}
.gg .unl{margin:4px 0 0;padding-left:18px;font-size:.9em;line-height:1.5}.gg .unl li{opacity:.7}.gg .unl li.ok{opacity:1}.gg .unl li span{color:#9fe7ff}
.gg .upg h4{margin:14px 0 4px}
.gg .btn[disabled]{opacity:.45;cursor:default}
.gg .bars .lvl.pts{box-shadow:0 0 0 2px var(--sun),0 0 12px var(--sun)}
.gg .minimap{position:absolute;left:auto;bottom:auto;right:max(12px,env(safe-area-inset-right));top:calc(max(10px,env(safe-area-inset-top)) + 62px);width:140px;height:140px;border-radius:50%;pointer-events:auto;cursor:pointer;display:none;filter:drop-shadow(0 2px 6px rgba(0,0,0,.5))}
.gg.playing .minimap{display:block}
.gg.narrow .minimap{width:104px;height:104px;top:calc(max(10px,env(safe-area-inset-top)) + 40px)}
@media (max-height:500px){.gg .minimap{width:96px;height:96px;top:calc(max(10px,env(safe-area-inset-top)) + 40px)}}
.gg .lootpop{z-index:3}
.gg .lootpop .ltap{display:none}
.gg .hname{display:flex;gap:8px;align-items:center;justify-content:center;margin:6px 0}
.gg .hname input{width:170px;background:#0b0d14;color:var(--fg);border:1px solid var(--line);padding:6px 8px;font-size:16px}
.gg .hname input:focus{outline:2px solid var(--sky)}
.gg .hpid{font-size:.72em;color:var(--muted);letter-spacing:.06em;font-variant-numeric:tabular-nums}
.gg .ptag span small{opacity:.7;font-weight:400;margin-left:4px}
.gg .topr button[data-a=mic].on{border-color:#5fe07a;color:#5fe07a}.gg .topr button[data-a=mic].live{background:rgba(95,224,122,.35)}
.gg .vtalk{position:absolute;right:max(12px,env(safe-area-inset-right));top:calc(max(10px,env(safe-area-inset-top)) + 208px);background:var(--panel);border-left:3px solid #5fe07a;padding:3px 10px;font-size:.85em;font-weight:700;color:#5fe07a}
.gg.narrow .vtalk{right:auto;left:max(12px,env(safe-area-inset-left));top:calc(max(10px,env(safe-area-inset-top)) + 128px)}
.gg.narrow .coopchip{right:auto;left:max(12px,env(safe-area-inset-left));top:calc(max(10px,env(safe-area-inset-top)) + 104px)}
.gg .ptag.talking span::before{content:'🔊 '}
.gg .cvoice{background:#141824;padding:10px;display:flex;flex-direction:column;gap:8px;align-items:flex-start}.gg .cvoice h4{margin:0}
.gg .cplayers li.talking b{color:#5fe07a}
.gg .vmute{margin-left:8px;background:#141824;color:var(--fg);border:1px solid var(--line);font-size:12px;padding:2px 8px;cursor:pointer}
.gg .hsound{display:flex;gap:6px;align-items:center;justify-content:center;flex-wrap:wrap;margin:6px 0}
.gg .hsound button{background:#141824;color:var(--muted);border:1px solid var(--line);padding:4px 10px;cursor:pointer}.gg .hsound button[aria-pressed=true]{color:var(--fg);border-color:var(--sun)}
.gg .hsound input{width:120px;accent-color:var(--sun)}
.gg .vols{display:grid;gap:4px;background:#141824;padding:8px 12px;margin:6px auto;max-width:360px;text-align:left}
.gg .vols h4{margin:0 0 2px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.gg .vols label{display:grid;grid-template-columns:84px 1fr 34px;align-items:center;gap:8px;font-size:13px}
.gg .vols input{width:100%;accent-color:var(--sun)}.gg .vols output{text-align:right;color:var(--muted);font-variant-numeric:tabular-nums}
.gg .wbtns{display:flex;flex-direction:column;gap:6px;align-items:stretch}
.gg .invite{position:absolute;left:50%;top:calc(max(10px,env(safe-area-inset-top)) + 96px);transform:translateX(-50%);background:var(--panel2);border:1px solid #5fe07a;padding:8px 12px;display:flex;gap:10px;align-items:center;pointer-events:auto;z-index:4;max-width:92%}
.gg .invite span{font-size:.95em}.gg .invite b{color:#5fe07a}
.gg .backup{width:min(100%,620px);background:var(--panel);padding:6px 14px;text-align:left;font-size:14px}
.gg .backup summary{cursor:pointer;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.14em;padding:4px 0}
.gg .backup p{margin:6px 0;color:var(--muted);line-height:1.4}
.gg .backup .brow{display:flex;gap:8px;flex-wrap:wrap}
.gg .backup .btn[disabled]{opacity:.45;cursor:not-allowed}
.gg .backup textarea{display:block;box-sizing:border-box;width:100%;margin-top:8px;background:#0b0d14;color:var(--fg);border:1px solid var(--line);padding:6px 8px;font:16px/1.35 ui-monospace,Menlo,monospace;resize:vertical;word-break:break-all}
.gg .backup textarea:focus{outline:2px solid var(--sky)}
.gg .backup .bmsg:empty{display:none}.gg .backup .bmsg{color:var(--fg)}
.gg.is-under .tb.ping{right:198px;bottom:60px}
@media (max-height:500px){.gg:not(.narrow) .compass{top:calc(max(10px,env(safe-area-inset-top)) + 40px);width:min(30%,260px)}.gg.is-touch:not(.narrow) .compass{width:min(26%,240px)}}
/* gear (17-gear.js): Power badge, wallet, auto-equip bar, difficulty note */
.loot .pow{color:#ffd23f;font-weight:800;font-size:20px;line-height:1.1;font-variant-numeric:tabular-nums}.loot .pow small{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#a9b3c7}.loot .pow i{font-style:normal;margin-left:6px;font-size:13px}.loot .pow i.up{color:#5fe07a}.loot .pow i.dn{color:#ff6a5a}
.gg .gbar{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0 0 8px}.gg .gbar .btn[aria-pressed=true]{border-color:var(--sun)}
.gg .wallet{margin-left:auto;color:var(--muted);font-size:13px;white-space:nowrap}.gg .wallet b{color:var(--sun);font-variant-numeric:tabular-nums}
.gg .upg .wallet{margin-left:6px}
.gg .dnote{margin:-2px 0 4px;text-align:center;color:var(--muted);font-size:12px}
/* enemy labels (src/18-labels.js): threat colour on the name, shield bar over health bar; boss bar under the compass */
.gg .etag{position:absolute;left:0;top:0;display:flex;flex-direction:column;align-items:center;gap:1px;white-space:nowrap;will-change:transform;--lc:#eef2fa}
.gg .etag span{font-weight:700;font-size:.78em;color:var(--lc);text-shadow:0 1px 0 #000,0 0 3px #000;letter-spacing:.02em}
.gg .etag span em,.gg .bossbar em{font-style:normal;opacity:.85;font-weight:800}
.gg .etag i{display:block;width:54px;height:4px;background:rgba(0,0,0,.65);box-shadow:0 0 0 1px rgba(0,0,0,.5)}
.gg .etag i.s{height:3px}.gg .etag i u,.gg .bossbar i u{display:block;height:100%;width:100%;background:var(--hp)}
.gg .etag i.s u,.gg .bossbar i.s u{background:var(--sky)}
.gg .lv-grey{--lc:#8d95a5}.gg .lv-easy{--lc:#7ee08f}.gg .lv-even{--lc:#eef2fa}.gg .lv-tough{--lc:#ffa640}.gg .lv-deadly{--lc:#ff4d4d}
/* F3 colour-blind modes (src/34-access.js toggles .cb-rg / .cb-by on the root): threat tags and ping tags, tuned with cb-test.cjs */
.gg.cb-rg .lv-easy{--lc:#88eeaa}.gg.cb-rg .lv-deadly{--lc:#ee4444}
.gg.cb-rg .ptag.ping span{background:#55dd88}.gg.cb-rg .ptag.ping.foe span{background:#ee2233}.gg.cb-by .ptag.ping span{background:#aadd88}
/* rarity letter badges (C/U/R/E/L/M) on the loot card, the pickup strip and inventory rows, only with a mode on */
.gg.cb-rg .loot .rar::before,.gg.cb-by .loot .rar::before{content:attr(data-l);display:inline-block;min-width:1.25em;margin-right:5px;padding:0 3px;background:var(--r);color:#10131c;text-align:center;letter-spacing:0;-webkit-text-fill-color:#10131c}
.gg.cb-rg .irow,.gg.cb-by .irow{grid-template-columns:16px minmax(0,1fr) auto}
.gg.cb-rg .irow i::after,.gg.cb-by .irow i::after{content:attr(data-l);display:flex;height:100%;align-items:center;justify-content:center;font-style:normal;font-weight:800;font-size:11px;color:#10131c}
.gg.narrow .etag span{font-size:.72em}.gg.narrow .etag i{width:42px}
.gg .bossbar{position:absolute;left:50%;top:calc(max(10px,env(safe-area-inset-top)) + 46px);transform:translateX(-50%);width:min(36%,440px);display:flex;flex-direction:column;gap:3px;background:var(--panel);padding:5px 10px 7px;border-bottom:3px solid var(--foe);--lc:#eef2fa}
.gg .bossbar .bn{text-align:center;font-family:var(--display);letter-spacing:.06em;font-size:1.05em;color:var(--lc)}
.gg .bossbar i{display:block;height:10px;background:rgba(0,0,0,.6)}.gg .bossbar i.s{height:5px}
.gg .hud.bossup .toast{top:calc(max(10px,env(safe-area-inset-top)) + 118px)}
.gg.narrow .bossbar{width:calc(100% - 32px);top:calc(max(10px,env(safe-area-inset-top)) + 150px);font-size:.9em}
.gg.narrow .hud.bossup .toast{top:calc(max(10px,env(safe-area-inset-top)) + 206px)}
@media (max-height:500px){.gg:not(.narrow) .bossbar{top:calc(max(10px,env(safe-area-inset-top)) + 84px)}.gg:not(.narrow) .hud.bossup .toast{top:calc(max(10px,env(safe-area-inset-top)) + 134px)}}
/* Phase L: dual-element chip, legendary effect lines, Mythic card (19-legendary.js) */
.loot .dualplus{color:#fff;font-weight:800;font-size:12px;margin:0 -2px;align-self:center}
.loot .lfx{margin:0;font-size:13px;color:#ffd9a0;line-height:1.3}.loot .lfx b{color:var(--r);font-weight:800;letter-spacing:.02em}.loot .lfx.mkfx{color:#a9b3c7;font-size:12px}
.gg .loot.mythic,.page .loot.mythic{background:linear-gradient(160deg,color-mix(in srgb,#ff4fd8 26%,#141824) 0%,color-mix(in srgb,#48d8f7 14%,#10131c) 55%,#10131c 100%);box-shadow:0 0 0 1px #ff4fd8,0 0 18px rgba(255,79,216,.35)}
.loot.mythic .rar{background:linear-gradient(90deg,#ff4fd8,#ffa62b,#48d8f7,#ff4fd8);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:ggmyth 3s linear infinite}
@keyframes ggmyth{to{background-position:300% 0}}
@media (prefers-reduced-motion:reduce){.loot.mythic .rar{animation:none}}
/* challenges board (src/22-challenges.js) */
.gg .urow.chal strong{font-size:.85em;color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums}
.gg .urow.chal.done strong{color:#5fe07a}.gg .urow.chal.done b{opacity:.75}
.gg .cbar{display:block;height:6px;margin:5px 0 3px;border-radius:3px;background:rgba(255,255,255,.1);overflow:hidden;max-width:320px}
.gg .cbar i{display:block;height:100%;background:var(--sun);border-radius:3px}
.gg .urow.chal.done .cbar i{background:#5fe07a}
@media (max-width:560px){.gg .urow.chal{grid-template-columns:1fr auto}.gg .urow.chal em{grid-column:1/-1;grid-row:2}}
/* Vehicle Yard (src/21-yard.js) */
.gg .qmrows{display:grid;gap:6px;margin-bottom:10px}
.gg .ytabs{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 10px}
.gg .yrow{grid-template-columns:auto 1fr auto auto}
.gg .yrow.on{outline:1px solid var(--sun)}
.gg .yrow .ystat{display:block;margin-top:2px;color:var(--sun);opacity:.85}
.gg .yswatch{display:inline-block;width:34px;height:22px;border-radius:5px;background:linear-gradient(180deg,var(--c) 0 62%,var(--a) 62% 76%,var(--c) 76%);border:1px solid rgba(255,255,255,.25);flex:none}
.gg .ypaints{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:6px}
.gg .ypaint{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:8px;align-items:center;text-align:left;background:rgba(255,255,255,.04);border:1px solid transparent;border-radius:6px;padding:6px 8px;color:inherit;font:inherit;cursor:pointer;min-height:44px}
.gg .ypaint .yswatch{grid-row:1/3}
.gg .ypaint b{font-size:.9em}.gg .ypaint span{font-size:.8em;color:var(--sun)}
.gg .ypaint.on{border-color:var(--sun)}
.gg .ypaint:disabled{opacity:.45;cursor:default}
.gg .ycall{margin-top:12px}
.gg .upts .btn{margin-right:6px}
/* skill trees (src/28-skills.js) */
.gg .skhead{display:flex;gap:10px;align-items:flex-start;justify-content:space-between}
.gg .skhead p{margin:0;font-size:14px;line-height:1.4}.gg .skhead em{font-style:normal;color:var(--sun)}.gg .skhead span{color:var(--muted);font-size:12px}
.gg .sknote{margin:8px 0 0;color:var(--muted);font-size:12px}
.gg .sktree{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:10px}
.gg .skbr{background:rgba(255,255,255,.04);border-radius:8px;padding:8px;min-width:0;display:grid;gap:6px;align-content:start}
.gg .skbr h4{margin:0;font-size:15px}.gg .skbr h4 small{color:var(--muted);font-weight:400}.gg .skbr>p{margin:0 0 2px;font-size:12px;color:var(--muted)}
.gg .sknode{display:grid;grid-template-columns:28px minmax(0,1fr);gap:8px;align-items:start;text-align:left;width:100%;min-height:44px;padding:7px 8px;border-radius:6px;border:1px solid var(--line);background:rgba(0,0,0,.25);color:var(--fg);font:inherit;font-size:12px;line-height:1.35;cursor:pointer;touch-action:manipulation}
.gg .sknode i{font-style:normal;font-weight:700;font-size:11px;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;border:1px solid var(--line);color:var(--muted)}
.gg .sknode b{display:block;font-size:13px;margin-bottom:1px}.gg .sknode small{display:block;margin-top:3px;font-size:11px;color:var(--muted)}
.gg .sknode.on{border-color:var(--sun);background:rgba(255,201,60,.1)}.gg .sknode.on i{background:var(--sun);color:#1a1406;border-color:var(--sun)}
.gg .sknode.can{border-color:var(--sky)}.gg .sknode.can i{color:var(--sky);border-color:var(--sky)}.gg .sknode.can small{color:var(--sky)}
.gg .sknode.lock{opacity:.55;cursor:default}
.gg .sknode:focus-visible{outline:2px solid var(--sky);outline-offset:2px}
@media (max-width:620px){.gg .sktree{grid-template-columns:minmax(0,1fr)}}
.gg .itabs{flex-wrap:wrap;justify-content:flex-end}
@media (max-width:620px){.gg .itabs{margin-left:0;justify-content:flex-start}}
.gg .skload{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:10px}
.gg .skslot{border:1px dashed var(--line);border-radius:8px;padding:6px 10px;min-width:0}
.gg .skslot small{display:block;font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}.gg .skslot b{display:block;font-size:13px;color:var(--muted);overflow-wrap:anywhere}
.gg .skslot.full{border-style:solid;border-color:var(--sun)}.gg .skslot.full b{color:var(--fg)}
.gg .skcell{display:grid;gap:4px}
.gg .sknode .skkind{display:block;font-style:normal;font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-bottom:1px}
.gg .skcell.ka .skkind{color:#b77bff}.gg .skcell.kp .skkind{color:var(--sky)}
.gg .skcell.eq .sknode.on{box-shadow:inset 3px 0 0 var(--sun)}
.gg .skeq{min-height:44px;width:100%;border-radius:6px;border:1px solid var(--sky);background:rgba(72,216,247,.08);color:var(--fg);font:inherit;font-size:12px;cursor:pointer;touch-action:manipulation}
.gg .skeq.is-on{border-color:var(--sun);background:rgba(255,201,60,.14)}
.gg .skeq:focus-visible{outline:2px solid var(--sky);outline-offset:2px}

/* phone audit (2026-09-30): touch text and targets; landscape phones get an explicit two-row touch cluster (nothing scaled, every button 48px+), toasts under the compass, the loot card top-left without the stat grid, HUD chips away from the mini-map */
.gg.is-touch .hud{font-size:clamp(12px,1.5vw,14px)}
.gg.is-touch .cd.sm{font-size:.78em}.gg.is-touch .mk{font-size:.85em}.gg.is-touch .cin span.mk{font-size:max(12px,.85em)}.gg.is-touch .wnext{font-size:.8em}.gg.is-touch .chip{font-size:.78em}.gg.is-touch .lvl span{font-size:.68em}
.gg.is-touch .panel{background:rgba(8,10,16,.97)}
.gg.is-touch .itabs .btn{min-height:38px}.gg.is-touch .irow{min-height:42px}
.gg.is-touch .menu .btn[data-go]{position:sticky;bottom:6px;z-index:2;box-shadow:0 4px 18px rgba(0,0,0,.6)}
.gg.is-touch .tb.swap,.gg.is-touch .tb.ping{width:48px;height:48px}
@media (max-height:500px){
.gg.is-touch .tbtns{transform:none;width:350px;height:154px;bottom:calc(max(8px,env(safe-area-inset-bottom)) + 78px)}
.gg.is-touch .tbtns .tb{width:52px;height:52px;font-size:11px}
.gg.is-touch .tbtns .tb.fire{right:0;bottom:0;width:82px;height:82px;font-size:14px}
.gg.is-touch .tbtns .tb.jump{right:92px;bottom:6px;width:62px;height:62px}
.gg.is-touch .tbtns .tb.ping{right:164px;bottom:12px;width:50px;height:50px}
.gg.is-touch .tbtns .tb.use{right:224px;bottom:4px;width:62px;height:62px}
.gg.is-touch .tbtns .tb.dive{right:290px;bottom:8px;width:54px;height:54px}
.gg.is-touch .tbtns .tb.aim{right:4px;bottom:86px}
.gg.is-touch .tbtns .tb.rel{right:66px;bottom:88px}
.gg.is-touch .tbtns .tb.abl{right:128px;bottom:88px}
.gg.is-touch .tbtns .tb.swap{right:190px;bottom:90px;width:48px;height:48px;font-size:10px}
.gg.is-touch .tbtns .tb.h4blade{right:248px;bottom:90px;width:50px;height:50px}
.gg.is-touch .hud:not(.bossup) .toast,.gg.is-touch .hud.bossup .toast{top:calc(max(10px,env(safe-area-inset-top)) + 86px);left:max(12px,env(safe-area-inset-left));right:auto;transform:none;width:min(40%,380px);align-items:flex-start}
.gg.is-touch .toast div{text-align:left;padding:4px 10px}
.gg.is-touch .lootpop{right:auto;left:max(12px,env(safe-area-inset-left));top:auto;bottom:calc(max(12px,env(safe-area-inset-bottom)) + 66px);width:min(46%,360px);transform:none;max-height:none;animation:none}
.gg.is-touch .lootpop .loot{padding:4px 10px 5px;gap:0 10px;border-top-width:2px;display:flex;flex-wrap:wrap;align-items:baseline}
.gg.is-touch .lootpop .loot header,.gg.is-touch .lootpop .ltap{width:100%;flex:none}
.gg.is-touch .lootpop .loot header{font-size:11px}
.gg.is-touch .lootpop .kvs,.gg.is-touch .lootpop .chips,.gg.is-touch .lootpop .flavor,.gg.is-touch .lootpop .lfx,.gg.is-touch .lootpop .lacts,.gg.is-touch .lootpop header .mk{display:none}
.gg.is-touch .lootpop h4{font-size:15px}.gg.is-touch .lootpop .pow{font-size:16px}.gg.is-touch .lootpop .pow small{font-size:10px}
.gg.is-touch .lootpop .ltap{display:block;font-size:11px;color:#a9b3c7;margin-top:2px}
.gg.is-touch .coopchip{right:auto;left:50%;transform:translateX(-50%);top:calc(max(10px,env(safe-area-inset-top)) + 84px)}
.gg.is-touch .vtalk{right:auto;left:50%;transform:translateX(-50%);top:calc(max(10px,env(safe-area-inset-top)) + 108px)}
.gg.is-touch .hud.bossup .coopchip{top:calc(max(10px,env(safe-area-inset-top)) + 134px)}.gg.is-touch .hud.bossup .vtalk{top:calc(max(10px,env(safe-area-inset-top)) + 158px)}
.gg.is-touch .invite{top:calc(max(10px,env(safe-area-inset-top)) + 136px)}
.gg.is-touch:not(.narrow) .prompt{top:auto;transform:none;left:calc(40% + 24px + env(safe-area-inset-left));bottom:calc(max(8px,env(safe-area-inset-bottom)) + 226px);max-width:calc(60% - 160px - env(safe-area-inset-left) - env(safe-area-inset-right));font-size:12px;padding:5px 12px;overflow:hidden;text-overflow:ellipsis} /* one line, right of the toast column, above the button cluster (its top row is GADGET: tbtns 78 + 90 + 50 px), left of the mini-map */
.gg.is-touch .h4chip{bottom:auto;top:calc(max(10px,env(safe-area-inset-top)) + 70px)}
.gg.is-touch .banner{top:calc(max(10px,env(safe-area-inset-top)) + 84px);left:calc(40% + 24px + env(safe-area-inset-left));right:calc(max(12px,env(safe-area-inset-right)) + 112px);transform:none;width:auto;max-width:400px}.gg.is-touch .banner b{font-size:22px;line-height:1}.gg.is-touch .banner span{margin-top:2px;padding:3px 10px;font-size:12px}.gg.is-touch .banner.go{animation-name:ggbanL}
.gg.is-touch .obj{max-width:min(28%,380px)}
.gg .logo{font-size:clamp(26px,5vw,40px)}.gg .mwrap{gap:6px}
.gg .hgrid{gap:5px}.gg .hpick{padding:2px 2px 5px}.gg .hpick img{width:64%}.gg .hpick b{font-size:12px}.gg .hpick span{font-size:9px;letter-spacing:.02em}
.gg .hinfo{font-size:13px;padding:8px 12px}
}
.gg.is-touch .bar em{font-size:.8em}
/* portrait phone (Safari; the PWA locks landscape): the pickup strip sits left of the buttons above the bars, and the cluster's small buttons stay 44px+ */
.gg.narrow.is-touch .lootpop{left:max(12px,env(safe-area-inset-left));right:auto;top:auto;bottom:calc(max(12px,env(safe-area-inset-bottom)) + 70px);width:calc(50% - 36px);max-height:none;transform:none;animation:none}
.gg.narrow.is-touch .lootpop .loot{padding:4px 8px 5px;gap:0 8px;border-top-width:2px;display:flex;flex-wrap:wrap;align-items:baseline}
.gg.narrow.is-touch .lootpop .kvs,.gg.narrow.is-touch .lootpop .chips,.gg.narrow.is-touch .lootpop .flavor,.gg.narrow.is-touch .lootpop .lfx,.gg.narrow.is-touch .lootpop .lacts,.gg.narrow.is-touch .lootpop header .mk{display:none}
.gg.narrow.is-touch .lootpop .loot header,.gg.narrow.is-touch .lootpop .ltap{width:100%;flex:none}.gg.narrow.is-touch .lootpop .loot header{font-size:11px}.gg.narrow.is-touch .lootpop h4{font-size:14px}.gg.narrow.is-touch .lootpop .pow{font-size:15px}
.gg.narrow.is-touch .tb.swap,.gg.narrow.is-touch .tb.ping{width:52px;height:52px}
.gg.narrow.is-touch .tb.swap{right:132px;bottom:76px} /* between RELOAD (right 70-128) and PING (from 188) */
.gg.narrow.is-touch.is-under .tb.ping,.gg.narrow.is-touch.h2-roll .tb.ping{right:198px;bottom:146px} /* DIVE/ROLL takes its spot: above GADGET, right of SKILL */
.gg.narrow.is-touch .tb.rel{bottom:92px}.gg.narrow.is-touch .tb.abl{right:136px;bottom:148px} /* clear of USE (right 66-130) */
/* hero menu (2026-09-30, Brian on iPhone: "this feels tight"): the side pane wrappers are invisible on desktop, iPad and portrait; landscape phones get two panes, heroes left and details + Deploy right, clear of the Dynamic Island */
.gg .mside,.gg .mscroll{display:contents}
.gg .mwrap .btn[data-go]{order:1}.gg .mwrap .mfine{order:2}
.gg .menu{padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}
@media (max-height:500px){
.gg .menu{padding:max(8px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));overflow:hidden;align-items:stretch}
.gg .mwrap{max-width:none;height:100%;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);grid-template-rows:auto auto minmax(0,1fr);column-gap:14px;row-gap:4px;align-items:start;text-align:left}
.gg .mwrap .logo{grid-column:1;grid-row:1;font-size:26px;justify-self:center}
.gg .mwrap .msub{grid-column:1;grid-row:2;justify-self:center;font-size:10px}
.gg .mwrap .hgrid{grid-column:1;grid-row:3;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.gg .mwrap .hpick{padding:4px 2px 5px}.gg .mwrap .hpick img{width:80%}.gg .mwrap .hpick b{font-size:12px}.gg .mwrap .hpick span{display:none}
.gg .mwrap .hpick[aria-pressed=true]{transform:none;box-shadow:0 0 0 2px var(--c)}
.gg .mside{grid-column:2;grid-row:1/4;display:flex;flex-direction:column;gap:8px;min-height:0;height:100%}
.gg .mscroll{flex:1;min-height:0;overflow:auto;display:flex;flex-direction:column;gap:8px;align-items:stretch;overscroll-behavior:contain}
.gg .mscroll>*{max-width:none;width:auto;margin:0}
.gg .mscroll .hinfo{font-size:13px;padding:8px 12px}.gg .mscroll .mfine{font-size:11px}
.gg .menu .mside .btn[data-go]{position:static;order:0;align-self:stretch;box-shadow:none;min-height:48px;flex:none;white-space:nowrap;font-size:clamp(14px,2.4vw,20px);padding-left:10px;padding-right:10px}
}
/* landscape phone in Safari (address bar takes ~65 pt: 874x337 on an iPhone 17): heroes in two rows of 7, smaller mini-map, cluster lowered onto a one-line weapon card, banner raised, so the top button row clears both */
@media (max-height:360px){
.gg .mwrap .logo{font-size:22px}.gg .mwrap .msub{display:none}
.gg .mwrap .hgrid{grid-row:2/4;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px;overflow:auto;min-height:0;align-self:stretch;align-content:start}
.gg .minimap{width:84px;height:84px;top:calc(max(8px,env(safe-area-inset-top)) + 34px)}
.gg.is-touch .tbtns{bottom:calc(max(8px,env(safe-area-inset-bottom)) + 44px)}
.gg.is-touch:not(.narrow) .prompt{top:calc(max(10px,env(safe-area-inset-top)) + 81px);bottom:auto;font-size:12px;line-height:15px;padding:2px 9px} /* Safari bars: the gap between the compass (ends 90) and the button row / crosshair */
.gg.is-touch .wpn{display:flex;align-items:center;gap:8px;padding:4px 9px 6px}
.gg.is-touch .wpn .wname{font-size:13px;max-width:150px}
.gg.is-touch .wpn .wrow{margin-top:0}
.gg.is-touch .wpn .wnext{display:none}
.gg.is-touch .wpn .rbar{position:absolute;left:10px;right:9px;bottom:1px;margin:0}
.gg.is-touch .banner{top:calc(max(8px,env(safe-area-inset-top)) + 80px)}.gg.is-touch .banner b{font-size:18px}
.gg.is-touch .toast div:nth-last-child(n+3){display:none}
.gg.is-touch .lootpop .ltap{display:none}
}
/* landscape Safari with its tab bar (several tabs open): ~874x293 on an iPhone 17. A 64 px mini-map, 46 px buttons (72 px FIRE), one toast at a time */
@media (max-height:320px){
.gg .minimap{width:64px;height:64px;top:calc(max(8px,env(safe-area-inset-top)) + 34px)}
.gg.is-touch .tbtns{height:130px}
.gg.is-touch .tbtns .tb{width:46px;height:46px;font-size:10px}
.gg.is-touch .tbtns .tb.fire{width:72px;height:72px;font-size:13px}
.gg.is-touch .tbtns .tb.jump{right:82px;bottom:4px;width:56px;height:56px}
.gg.is-touch .tbtns .tb.ping{right:146px;bottom:8px;width:46px;height:46px}
.gg.is-touch .tbtns .tb.use{right:200px;bottom:2px;width:54px;height:54px}
.gg.is-touch .tbtns .tb.dive{right:262px;bottom:6px;width:48px;height:48px}
.gg.is-touch .tbtns .tb.aim{right:4px;bottom:78px}
.gg.is-touch .tbtns .tb.rel{right:58px;bottom:80px}
.gg.is-touch .tbtns .tb.abl{right:112px;bottom:80px}
.gg.is-touch .tbtns .tb.swap{right:166px;bottom:82px;width:44px;height:44px}
.gg.is-touch .tbtns .tb.h4blade{right:216px;bottom:82px;width:46px;height:46px}
.gg.is-touch .toast div:nth-last-child(n+2){display:none}
}
/* scope view and sight pictures (src/29-sights.js): the lens's huge box-shadow is the dark surround */
.gg .scopev{position:absolute;inset:0;pointer-events:none;visibility:hidden;opacity:0;overflow:hidden;container-type:size}
.gg .scopev .lens{position:absolute;left:50%;top:50%;width:90vmin;width:min(94cqw,94cqh);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;box-shadow:0 0 0 200vmax #05070a,inset 0 0 0 3px #0b0d12,inset 0 0 30px 14px rgba(0,0,0,.85);background:radial-gradient(circle,rgba(120,200,255,0) 55%,rgba(40,90,130,.2) 100%)}
.gg .scopev i{position:absolute;background:#0a0c10;box-shadow:0 0 1px rgba(255,255,255,.6)}
.gg .scopev .sh{left:4%;right:4%;top:50%;height:2px;margin-top:-1px}.gg .scopev .sv{top:4%;bottom:4%;left:50%;width:2px;margin-left:-1px}
.gg .scopev .pl,.gg .scopev .pr{top:50%;width:33%;height:6px;margin-top:-3px}.gg .scopev .pl{left:0}.gg .scopev .pr{right:0}
.gg .scopev .pb{bottom:0;left:50%;width:6px;height:33%;margin-left:-3px}
.gg .scopev b{position:absolute;left:50%;top:50%;width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%;background:#ff3b3b;box-shadow:0 0 5px #ff3b3b}
.gg.sight-scope .xhair{opacity:0}
.gg.sight-iron .xhair i,.gg.sight-dot .xhair i{display:none}
.gg.sight-iron .xhair::after,.gg.sight-dot .xhair::after{content:'';position:absolute;left:50%;top:50%;width:4px;height:4px;margin:-2px 0 0 -2px;border-radius:50%;background:#fff;box-shadow:0 0 2px #000}
.gg.sight-dot .xhair::after{width:7px;height:7px;margin:-3.5px 0 0 -3.5px;background:#ff3b3b;box-shadow:0 0 6px #ff3b3b,0 0 1px #000}
/* controllers (src/30-pad.js): menu highlight, button badges, the layout chart; touch buttons hide while a controller is in use */
.gg .pf{outline:3px solid var(--sun)!important;outline-offset:2px;box-shadow:0 0 0 5px rgba(255,201,60,.25)}
.gg.pad-on .touch{display:none!important}
.gg .gpb{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 5px;border-radius:11px;font-style:normal;font-weight:800;font-size:12px;line-height:1;background:#2b3244;color:#fff;border:1px solid rgba(255,255,255,.25)}
.gg .gp-xbox.gpk-a{background:#3fa34d}.gg .gp-xbox.gpk-b{background:#d0342c}.gg .gp-xbox.gpk-x{background:#2a6fdb}.gg .gp-xbox.gpk-y{background:#d9a400;color:#10131c}
.gg .gp-ps.gpk-a{color:#7fb2ff}.gg .gp-ps.gpk-b{color:#ff6a6a}.gg .gp-ps.gpk-x{color:#ff8ad8}.gg .gp-ps.gpk-y{color:#5fe0b0}
.gg .padmap{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 10px;align-items:center;margin:8px 0 4px;font-size:13px;text-align:left}
.gg .padmap span:nth-child(odd){display:flex;justify-content:flex-end;min-width:52px}
.gg .padset .viewpick{justify-content:flex-start;margin:4px 0}
.gg .padset .vols{margin:6px 0}
.gg .btn.pf,.gg .viewpick button.pf,.gg .pbtn.pf{background:#fff!important;color:#10131c!important;transform:scale(1.06)}
/* main menu + settings (src/31-menu.js): a rail of screens on the left, the chosen screen in a scrolling pane; these rules replace the older one-column hero menu layout above */
.gg .menu{display:flex;align-items:center;justify-content:center;overflow:hidden;padding:max(12px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}
.gg .gm{width:100%;max-width:1120px;height:min(680px,100%);display:grid;grid-template-columns:230px minmax(0,1fr);gap:14px;min-height:0}
.gg .gmrail{display:flex;flex-direction:column;gap:6px;min-height:0;overflow-x:hidden;overflow-y:auto} /* x hidden: the italic logo overhangs the rail by ~5px, which gave the desktop rail a sideways scrollbar */
.gg .gmrail .logo{font-size:34px;margin:4px 0 10px;text-align:left}
.gg .gmlegal{grid-column:1/-1;margin:auto 0 0;padding-top:6px;font-size:12px;color:#a9b4c6;text-align:center}
.gg .gmlegal a{color:inherit;display:inline-block;padding:6px 4px}
.gg .menu .gm .btn.gmgo{position:static;box-shadow:none;width:100%;margin-bottom:6px;font-size:18px;padding:12px 14px}
.gg .gmi{display:block;width:100%;text-align:left;background:rgba(20,24,36,.85);color:var(--fg);border:1px solid var(--line);border-left:3px solid transparent;padding:11px 14px;font-family:var(--display);font-size:16px;letter-spacing:.04em;cursor:pointer;min-height:44px}
.gg .gmi:hover{background:#1a2030}
.gg .gmi[aria-current=true]{border-left-color:var(--sun);color:var(--sun);background:#1a2030}
.gg .gmpane{background:rgba(8,10,16,.88);border:1px solid var(--line);padding:14px 16px;overflow:auto;min-height:0;display:flex;flex-direction:column;gap:12px;text-align:left;overscroll-behavior:contain}
.gg .gmh{margin:0;font-family:var(--display);font-weight:400;font-size:22px;color:var(--sun);letter-spacing:.04em}
.gg .gmpane .hgrid{width:100%}
.gg .gmpane .hinfo{max-width:none}
.gg .gmtabs{margin:0;justify-content:flex-start;flex-wrap:wrap}
.gg .gmset{display:grid;gap:8px}
.gg .gmrow{display:grid;grid-template-columns:minmax(150px,260px) minmax(0,1fr);gap:8px 16px;align-items:center;background:rgba(255,255,255,.04);padding:10px 12px;border-radius:6px}
.gg .gml b{display:block;font-size:15px}.gg .gml span{display:block;font-size:12px;color:var(--muted);margin-top:2px}
.gg .gmc{display:flex;justify-content:flex-end;min-width:0}
.gg .gmseg{display:flex;flex-wrap:wrap;gap:4px;justify-content:flex-end}
.gg .gmseg button{background:#141824;color:var(--fg);border:1px solid var(--line);padding:8px 14px;min-height:40px;cursor:pointer;font-weight:700;font-size:14px;border-radius:4px}
.gg .gmseg button[aria-pressed=true]{background:var(--sun);color:#10131c;border-color:var(--sun)}
.gg .gmsl{display:flex;align-items:center;gap:10px;width:min(320px,100%)}
.gg .gmsl input{flex:1;accent-color:var(--sun);min-height:32px}
.gg .gmsl output{min-width:44px;text-align:right;font-variant-numeric:tabular-nums;color:var(--muted)}
.gg .gmtext{width:min(220px,100%);background:#0b0d14;color:var(--fg);border:1px solid var(--line);padding:8px 10px;font-size:16px}
.gg .gmnote{margin:0;color:var(--muted);font-size:14px;line-height:1.45}
.gg .gmsub{margin:6px 0 0;font-family:var(--display);font-weight:400}
.gg .gmhelp{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}
.gg .gmhelp h4{margin:0 0 6px;font-family:var(--display);font-weight:400}
.gg .gpb.key{border-radius:4px;font-size:11px;padding:0 7px;white-space:nowrap}
.gg .keymap span:nth-child(odd){min-width:96px}
.gg .gm-save .backup{width:100%;max-width:none}
.gg .gmpane .padmap{max-width:520px}
.gg .fps{position:absolute;left:50%;bottom:max(4px,env(safe-area-inset-bottom));transform:translateX(-50%);background:var(--panel);padding:2px 8px;font-weight:800;font-size:13px;font-variant-numeric:tabular-nums;color:#5fe07a;border-left:3px solid currentColor}
.gg.in-veh .fps{bottom:calc(max(14px,env(safe-area-inset-bottom)) + 46px)}
.gg .fps.mid{color:#ffc93c}.gg .fps.low{color:#ff5a4a}
.gg.hud-lg .hud{font-size:clamp(13px,1.75vw,17px)}
.gg.hud-lg.is-touch .hud{font-size:clamp(14px,1.9vw,17px)}
@media (max-height:500px){
.gg .gm{height:100%;grid-template-columns:168px minmax(0,1fr);gap:10px}
.gg .gmrail{gap:4px}.gg .gmrail .logo{font-size:20px;margin:0 0 4px}
.gg .menu .gm .btn.gmgo{font-size:14px;padding:9px 10px;margin-bottom:2px}
.gg .gmi{padding:7px 10px;font-size:13px;min-height:40px}
.gg .gmpane{padding:10px 12px;gap:8px}.gg .gmh{font-size:17px}
.gg .gmpane .hgrid{grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}
.gg .gmpane .hpick span{display:none}
.gg .gmrow{padding:7px 10px}
}
@media (max-width:620px){
.gg .gm{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);height:100%}
.gg .gmrail{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;overflow:visible}
.gg .gmrail .logo{grid-column:1/-1;font-size:24px;text-align:center;margin:0}
.gg .menu .gm .btn.gmgo{grid-column:1/-1;margin:0}
.gg .gmi{text-align:center;padding:8px 4px;font-size:12px;border-left:1px solid var(--line);border-bottom:3px solid transparent}
.gg .gmi[aria-current=true]{border-bottom-color:var(--sun)}
.gg .gmrow{grid-template-columns:minmax(0,1fr)}.gg .gmc,.gg .gmseg{justify-content:flex-start}
}
/* portrait compass at the top, out of the fight (Brian 2026-10-11: "the compass is right in the middle of the screen") */
.gg.narrow .compass{top:calc(max(10px,env(safe-area-inset-top)) + 38px);bottom:auto;left:max(12px,env(safe-area-inset-left));transform:none;width:calc(100% - 148px - env(safe-area-inset-left) - env(safe-area-inset-right));height:28px;font-size:.85em} /* under the top buttons, left of the mini-map; the objective steps down under it */
.gg.narrow .obj{top:calc(max(10px,env(safe-area-inset-top)) + 70px)}
/* portrait fights (Brian 2026-10-11, "real estate is pretty small"): two toasts at most, and the pickup strip is one slim line */
.gg.narrow .toast div:nth-last-child(n+3){display:none}
.gg.narrow.is-touch .lootpop{width:calc(50% - 30px);bottom:calc(max(12px,env(safe-area-inset-bottom)) + 76px)}
.gg.narrow.is-touch .lootpop .loot{padding:2px 7px 3px;flex-wrap:nowrap;align-items:baseline}
.gg.narrow.is-touch .lootpop .loot header{display:none}
.gg.narrow.is-touch .lootpop h4{font-size:12px;flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0}
.gg.narrow.is-touch .lootpop .pow{font-size:12px;flex:none}.gg.narrow.is-touch .lootpop .pow small{display:none}

/* ---- TV & phones (37-phones) ---- */
.gg .phj{display:grid;grid-template-columns:minmax(180px,38%) 1fr;gap:20px;align-items:center}
.gg .phqr{aspect-ratio:1;border-radius:8px;overflow:hidden;background:#fff;color:#07080c;display:grid;place-items:center}.gg .phqr svg{display:block;width:100%;height:100%}
.gg .phside{display:flex;flex-direction:column;gap:10px}
.gg .phcode{font:800 44px ui-monospace,monospace;letter-spacing:.14em;color:var(--gold,#ffc23d)}
#ggPhoneLost{position:absolute;left:50%;top:12px;transform:translateX(-50%);z-index:60;max-width:80%;padding:10px 16px;border-radius:8px;background:#3a1512;color:#ffd1ca;font-weight:600;text-align:center}
#ggPhoneLost[hidden]{display:none}
/* ---- TV mode: text grows with the screen, nothing sits in the outer 5% a TV may crop ---- */
html.tv{--sx:4vw;--sy:4.5vh}
html.tv:not(.tv-half) .gg .menu{padding:var(--sy) var(--sx)}
html.tv:not(.tv-half) .gg .menu>*{zoom:var(--tvz)}
html.tv .gg .hud{inset:var(--sy) var(--sx);font-size:calc(14px*var(--tvz))}
html.tv .gg .btn:focus,html.tv .gg .pf{outline:4px solid #ffc23d;outline-offset:3px}
html.tv:not(.tv-half) .gg .menu .gm{height:min(680px,calc((100vh - 2*var(--sy))/var(--tvz)))}
/* Store UI audit 2026-11-10: on touch screens the top HUD buttons, rail items and legal links get 44pt targets. */
@media (pointer:coarse){
  .gg .topr button{min-height:44px;padding:5px 12px}
  .gg .gmi{min-height:44px}
  .gg .gmlegal a{position:relative}
  .gg .gmlegal a::after{content:'';position:absolute;left:-6px;right:-6px;top:50%;height:44px;transform:translateY(-50%)}
}
/* Phase 3 lane A (61-arsenal): rail gun charge bar under the crosshair, class trait chip */
.ars-charge { position: fixed; left: 50%; top: calc(50% + 34px); width: 110px; height: 6px; margin-left: -55px; border-radius: 3px; background: rgba(8, 20, 28, .55); box-shadow: 0 0 0 1px rgba(95, 244, 255, .5); opacity: 0; transition: opacity .12s; pointer-events: none; z-index: 30; }
.ars-charge.on { opacity: 1; }
.ars-charge > i { display: block; height: 100%; width: 0; border-radius: 3px; background: linear-gradient(90deg, #5ff4ff, #ffffff); }
.loot .ars-trait { margin: 4px 0 2px; font-size: 12px; font-weight: 700; color: #5ff4ff; }
/* Phase 3 lane D: the Gunsmith bench (src/65-bench.js), inside the Inventory's Gunsmith tab */
.gg .upg.gsbpane{padding:8px 10px;display:flex;flex-direction:column}
.gg .gsb{display:grid;grid-template-columns:minmax(150px,.8fr) minmax(220px,1.3fr) minmax(220px,1fr);gap:10px;min-height:0;flex:1}
.gg .gsb>div{min-width:0;min-height:0;overflow:auto}
.gg .gsb h4{margin:2px 0 6px}
.gg .gsbguns{display:flex;flex-direction:column;gap:4px}
.gg .gsb .btn small{display:block;font-weight:400;opacity:.78;font-size:12px;text-transform:none;letter-spacing:0;line-height:1.25;margin-top:2px}
.gg .gsbgun,.gg .gsbopt,.gg .gsbsw{text-align:left;width:100%;min-height:42px}
.gg .gsbgun b,.gg .gsbopt b,.gg .gsbsw b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gg .gsbview{position:relative;height:150px;border-radius:10px;background:radial-gradient(ellipse at 50% 60%,rgba(72,216,247,.16),rgba(0,0,0,.25) 70%);overflow:hidden}
.gg .gsbcv{display:block;width:100%;height:100%;touch-action:none;cursor:grab}
.gg .gsbturn{position:absolute;bottom:6px;min-width:40px;min-height:40px;padding:0}
.gg .gsbturn.l{left:6px}.gg .gsbturn.r{right:6px}
.gg .gsbname{margin:6px 0;font-weight:700;text-align:center}
.gg .gsbfins,.gg .gsbslots{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:6px}
.gg .gsbfins .btn{flex:1;min-height:40px}
.gg .gsbslots .btn{flex:1 1 30%;min-height:42px;text-align:left}
.gg .gsbopts,.gg .gsbsws{display:flex;flex-direction:column;gap:4px}
.gg .gsb .locked{opacity:.62}
.gg .gsbsw{display:flex;align-items:center;gap:8px}
.gg .gsbsw i{flex:none;width:28px;height:28px;border-radius:6px;border:1px solid rgba(255,255,255,.35)}
.gg .gsbsw b,.gg .gsbsw small{min-width:0}
.gg .gsbsw>b{flex:1}
.gg .gsbclear{width:100%;min-height:40px;margin-bottom:6px}
.gg .gsbacts{display:flex;flex-direction:column;gap:6px;margin:6px 0}
.gg .gsbacts .btn{min-height:44px}
.gg .gsbmsg{margin:4px 0;color:#9fe86f;font-size:14px}.gg .gsbmsg.bad{color:#ffb35a}
.gg .gsbnote{margin:4px 0;opacity:.85;font-size:14px}
.gg .gsbwallet{margin:4px 0;font-size:13px;opacity:.85}
.gg .gsbdiff{width:100%;border-collapse:collapse;font-size:13px;font-variant-numeric:tabular-nums}
.gg .gsbdiff th,.gg .gsbdiff td{padding:3px 4px;border-bottom:1px solid rgba(255,255,255,.08);text-align:right}
.gg .gsbdiff th:first-child{text-align:left;font-weight:400}
.gg .gsbdiff tr.up td:last-child{color:#5fe07a;font-weight:700}
.gg .gsbdiff tr.dn td:last-child{color:#ff7a6b;font-weight:700}
.gg.cb-rg .gsbdiff tr.up td:last-child{color:#58b6ff}.gg.cb-rg .gsbdiff tr.dn td:last-child{color:#ffb000}
/* narrow screens (portrait phones): one column, the page scrolls */
@media (max-width:760px){
  .gg .upg.gsbpane{display:block;overflow:auto}
  .gg .gsb{grid-template-columns:1fr;flex:none;overflow:visible}
  .gg .gsb>div{overflow:visible}
  .gg .gsbguns{flex-direction:row;flex-wrap:wrap}
  .gg .gsbguns h4{display:none}
  .gg .gsbgun{flex:1 1 45%;width:auto;min-width:0}
}
/* short landscape phones: two columns (guns + view/options | stats), each scrolls on its own */
@media (max-height:500px) and (min-width:761px){
  .gg .gsb{grid-template-columns:minmax(140px,.7fr) minmax(220px,1.3fr) minmax(200px,1fr);gap:6px}
  .gg .gsbview{height:96px}
  .gg .gsbname{margin:3px 0}
  .gg .gsb h4{margin:0 0 4px}
}
@media (max-height:320px) and (min-width:761px){
  .gg .gsbview{height:72px}
  .gg .gsbdiff{font-size:12px}
}
/* Styles for Phase F family features, Phase 2 gear and Phase 4 appearance; build.sh appends src/game-*.css after src/game.css (each file under 800 lines). */
/* F1 player profiles (src/32-profiles.js) */
.gg .pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:10px;width:100%}
.gg .prof{background:#141824;border:1px solid var(--line);border-bottom:3px solid var(--c,var(--line));color:var(--fg);padding:6px 6px 10px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:2px;min-height:48px;font:inherit}
.gg .prof img{width:100%;max-width:120px;aspect-ratio:1/1;display:block;background:radial-gradient(circle at 50% 70%,color-mix(in srgb,var(--c) 45%,transparent),transparent 70%)}
.gg .prof img:not(.ready),.gg .pic img:not(.ready),.gg .pdelbox img:not(.ready){visibility:hidden}
.gg .prof b{font-family:var(--display);font-weight:400;font-size:15px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gg .prof span{font-size:12px;color:var(--muted)}
.gg .prof[aria-pressed=true]{border-color:var(--c);background:#1a2030;box-shadow:0 0 0 2px var(--c)}
.gg .prof[aria-pressed=true] span{color:var(--sun)}
.gg .prof.padd{border-style:dashed;justify-content:center}
.gg .prof.padd i{font-style:normal;font-family:var(--display);font-size:44px;line-height:1.2;color:var(--sun)}
.gg .picon{grid-template-columns:repeat(7,minmax(0,1fr))}
.gg .pic{background:#141824;border:1px solid var(--line);border-bottom:3px solid var(--c);padding:3px;cursor:pointer;min-height:48px}
.gg .pic img{width:100%;aspect-ratio:1/1;display:block}
.gg .pic[aria-pressed=true]{background:#1a2030;box-shadow:0 0 0 2px var(--c);border-color:var(--c)}
.gg .pdel summary{cursor:pointer;color:var(--muted);font-size:14px;padding:6px 0;min-height:40px}
.gg .pdel .brow{flex-wrap:wrap;gap:6px}
.gg .pdelbox{display:flex;align-items:center;gap:12px}.gg .pdelbox img{width:72px;height:72px}
.gg .pdelbox b{display:block;font-family:var(--display);font-weight:400;font-size:18px;color:var(--c)}.gg .pdelbox span{color:var(--muted);font-size:13px}
.gg .gm-players textarea{width:100%;background:#0b0d14;color:var(--fg);border:1px solid var(--line);padding:6px 8px;font-size:16px;resize:none}
.gg .gm-players .brow{display:flex;gap:8px;flex-wrap:wrap}
.gg .btn.hold{position:relative;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;background:#3a1418;border-color:#ff5a4a;color:#fff}
.gg .btn.hold .hfill{position:absolute;left:0;top:0;bottom:0;width:0;background:#ff5a4a}
.gg .btn.hold .hlbl{position:relative}
.gg .btn.danger{background:#ff5a4a;border-color:#ff5a4a;color:#10131c}
@media (max-height:500px){.gg .pgrid{grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:6px}.gg .prof img{max-width:72px}.gg .prof b{font-size:13px}.gg .pdelbox img{width:52px;height:52px}}
@media (max-width:620px){.gg .pgrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.gg .picon{grid-template-columns:repeat(5,minmax(0,1fr))}}
/* F2 quick-chat wheel + speech bubbles (src/33-quickchat.js) */
.gg .qcw{position:absolute;inset:0;z-index:40;pointer-events:none;background:radial-gradient(ellipse at center,rgba(8,10,16,.66),rgba(8,10,16,.1) 75%)}
.gg .qcw .qci,.gg .qcw .qcmid{position:absolute;left:50%;top:50%;pointer-events:auto;font-weight:700;font-size:15px;color:var(--fg);background:var(--panel2);border:1px solid var(--line);padding:8px 12px;min-height:40px;white-space:nowrap;cursor:pointer;touch-action:manipulation}
.gg .qcw .qcmid{transform:translate(-50%,-50%);min-width:96px;color:var(--muted);border-radius:999px}
.gg .qcw .qci.emo{border-color:rgba(72,216,247,.45);color:var(--sky)}
.gg .qcw .qci.on{background:var(--sun);color:#10131c;border-color:var(--sun)}
.gg .qcw.tight .qci,.gg .qcw.tight .qcmid{font-size:13px;padding:6px 8px;min-height:36px}
.gg .qcw.tiny .qci,.gg .qcw.tiny .qcmid{font-size:12px;padding:5px 6px;min-height:36px;letter-spacing:0}
.gg .qcb{position:absolute;left:0;top:0;background:#fff;color:#10131c;font-weight:700;font-size:14px;padding:4px 10px;border-radius:10px;white-space:nowrap;pointer-events:none}
.gg .qcb::after{content:'';position:absolute;left:50%;bottom:-6px;margin-left:-6px;border:6px solid transparent;border-bottom:0;border-top-color:#fff}
/* F4 loadout presets (src/35-presets.js): Inventory → Loadouts */
.gg .pcards{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:10px}
.gg .pcard{background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:6px;padding:8px 10px;display:grid;gap:4px;align-content:start}
.gg .pcard.worn{border-color:var(--sun)}
.gg .pcard header{display:flex;align-items:center;gap:8px;margin-bottom:2px}.gg .pcard header b{font-family:var(--display);font-weight:400;letter-spacing:.06em;text-transform:uppercase}
.gg .panel .pcard header .pwear{flex:none;color:#10131c;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#10131c;background:var(--sun);padding:1px 6px;border-radius:2px}
.gg .pcard.empty p{margin:2px 0 4px;color:var(--muted);font-size:.9em}
.gg .prow{display:grid;grid-template-columns:4.6em minmax(0,1fr);gap:8px;align-items:baseline;font-size:.92em}
.gg .prow small{color:var(--muted)}.gg .prow span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gg .prow b{font-weight:700}.gg .prow b i{display:inline-block;width:.7em;height:.7em;margin-right:5px;background:var(--r);vertical-align:baseline}
.gg .prow em{font-style:normal;color:var(--muted);margin-left:6px;font-variant-numeric:tabular-nums}
.gg .prow .pemp{color:var(--muted);font-style:italic}.gg .prow.sold .pemp{color:var(--sun);white-space:normal}.gg .prow.sold .pemp em{display:block;margin-left:0;font-size:.88em;color:var(--muted)}
.gg .prow span em{font-style:normal}
.gg .pcard .lacts{margin-top:6px}
.gg .pnote{margin:6px 0 0;font-size:.85em;color:var(--muted)}
.gg.cb-rg .prow b i,.gg.cb-by .prow b i{width:auto;height:auto;min-width:1.1em;padding:0 2px;text-align:center;font-style:normal;font-size:.8em;line-height:1.25;color:#10131c}
.gg.cb-rg .prow b i::after,.gg.cb-by .prow b i::after{content:attr(data-l)}
.gg.is-touch .pcard .btn{min-height:38px}
/* F5 photo mode (src/36-photo.js) */
.gg.photo .hud{display:block}.gg.photo .hud>:not(.touch){display:none!important}.gg.photo .touch .tbtns{display:none}.gg.is-touch.photo .touch{display:block}
.gg .phm{position:absolute;z-index:45;top:max(10px,env(safe-area-inset-top));right:max(10px,env(safe-area-inset-right));bottom:max(10px,env(safe-area-inset-bottom));width:300px;display:flex;flex-direction:column;background:var(--panel2);border:1px solid var(--line);color:var(--fg)}
.gg .phm[hidden]{display:none}
.gg .phm header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px;border-bottom:1px solid var(--line)}
.gg .phm header .btn{min-height:36px}.gg .phm header b{font-family:var(--display);font-weight:400;font-size:18px;color:var(--sun);letter-spacing:.04em}
.gg .phm .phbody{flex:1;min-height:0;overflow-y:auto;padding:6px 10px;display:flex;flex-direction:column;gap:8px}
.gg .phm .phr{display:flex;flex-direction:column;gap:4px}.gg .phm .phr>span{font-size:13px;color:var(--muted);font-weight:600}
.gg .phm .gmseg{flex-wrap:wrap;justify-content:flex-start}.gg .phm .gmseg button{min-height:36px}
.gg .phm .gmsl{display:flex;align-items:center;gap:8px}.gg .phm .gmsl input{flex:1;min-width:0}
.gg .phm .phud{display:flex;gap:6px;flex-wrap:wrap}.gg .phm .phud .btn{flex:1;min-height:38px;touch-action:none;user-select:none;-webkit-user-select:none}
.gg .phm .phco{margin:0;font-size:13px;color:var(--sky)}.gg .phm .phhint{margin:0;font-size:12px;color:var(--muted)}
.gg .phm footer{padding:8px 10px;border-top:1px solid var(--line)}.gg .phm .phshot{width:100%;min-height:46px;font-size:17px}
.gg .phm .phmsg{margin:4px 0 0;font-size:13px;color:var(--sun);min-height:1.2em}
.gg .phm.hid{bottom:auto;width:auto;background:none;border:0}
.gg .phflash{position:absolute;inset:0;z-index:46;background:#fff;pointer-events:none;animation:ggphf .45s ease-out forwards}
@keyframes ggphf{from{opacity:.85}to{opacity:0}}
@media (max-height:500px){.gg .phm{width:250px}.gg .phm header{padding:4px 8px}.gg .phm header b{font-size:15px}.gg .phm .phbody{gap:5px;padding:4px 8px}.gg .phm .gmseg button{min-height:32px;font-size:12px;padding:2px 6px}.gg .phm .phshot{min-height:40px;font-size:15px}.gg .phm footer{padding:5px 8px}.gg .phm .phmsg{font-size:12px;margin-top:2px}.gg .phm .phhint{display:none}.gg .phm label.phr{flex-direction:row;align-items:center;gap:6px}.gg .phm label.phr>span{width:78px;flex:none;font-size:12px}}
@media (max-width:620px) and (orientation:portrait){.gg .phm{left:max(8px,env(safe-area-inset-left));right:max(8px,env(safe-area-inset-right));top:auto;width:auto;max-height:40%}.gg.photo .touch .stickzone{bottom:40%;height:50%}}
/* F9 fast travel: relay rows on the world map */
.gg .wcard .ftrow{grid-column:1/-1;margin-top:2px}
.gg .wcard .ftst{color:var(--sky);font-size:12px}
.gg .ftbtns{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.gg .ftbtns .btn{justify-self:auto;min-height:38px}
.gg .map .ftwarn{margin:0 0 8px;padding:8px 10px;background:#3a1c1c;border:1px solid #ff6a5a;color:#ffd7d0;font-size:13px}
/* F6 couch co-op (src/37-couch.js): Menu → Couch co-op */
.gg .cpcols{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:8px 0}
.gg .cpcols h4{margin:0 0 6px;font-family:var(--display);font-weight:400;font-size:16px;color:var(--sun)}
.gg .cpgrid{grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:6px}
.gg .cpgrid .prof img{max-width:72px}
.gg .cpgrid .prof:disabled{opacity:.35;cursor:default}
.gg .cpin{flex-wrap:wrap;justify-content:flex-start;margin-top:8px}
.gg.couch [data-a=full]{display:none}
.gg .cpin button:disabled{opacity:.35}
.gg .cpneed b{color:var(--sun)}
@media (max-width:760px){.gg .cpcols{grid-template-columns:1fr}}
/* F7 gifts (src/42-gift.js) */
.gg .gfoffer>p{margin:0 0 6px;font-size:.95em}.gg .gfoffer>p b{color:var(--sun)}
.gg .gfoffer .gftime{margin-left:6px;color:var(--muted);font-variant-numeric:tabular-nums}
.gg .gfacts{margin-top:6px}
.gg.is-touch .gfoffer .btn,.gg.is-touch .gfacts .btn{min-height:38px}
/* F10 badges */
.gg .bdet{background:#141824;border:1px solid var(--line);border-left:3px solid var(--line);padding:8px 10px;display:flex;flex-direction:column;gap:2px}
.gg .bdet.got{border-left-color:var(--sun)}.gg .bdet b{font-size:15px}.gg .bdet span{font-size:13px;color:var(--muted)}.gg .bdet em{font-style:normal;font-size:13px;color:var(--sky)}
.gg .bcat{margin:4px 0 0;font-size:14px;color:var(--muted);letter-spacing:.04em}
.gg .bgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:6px}
.gg .bdg{background:#141824;border:1px solid var(--line);color:var(--fg);font:inherit;padding:6px 6px 7px;display:grid;grid-template-columns:28px minmax(0,1fr);grid-template-rows:auto auto auto;column-gap:6px;align-items:center;text-align:left;cursor:pointer;min-height:48px;touch-action:manipulation}
.gg .bdg i{grid-row:1/4;font-style:normal;font-size:20px;line-height:28px;width:28px;height:28px;text-align:center;border-radius:50%;background:rgba(255,255,255,.06);color:var(--muted)}
.gg .bdg b{font-size:13px;line-height:1.15;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere}
.gg .bdg em{font-style:normal;font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}
.gg .bbar{display:block;height:4px;border-radius:2px;background:rgba(255,255,255,.1);overflow:hidden}.gg .bbar i{display:block;height:100%;background:var(--sky)}
.gg .bdg.got{border-color:color-mix(in srgb,var(--sun) 55%,var(--line))}.gg .bdg.got i{background:var(--sun);color:#10131c}.gg .bdg.got em{color:#5fe07a}.gg .bdg.got .bbar i{background:#5fe07a}
.gg .bdg.rw:not(.got) i{box-shadow:inset 0 0 0 1px var(--sky)}
.gg .bdg[aria-pressed=true]{box-shadow:0 0 0 2px var(--sun)}
@media (max-height:500px){.gg .bgrid{grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:5px}.gg .bdg{min-height:44px;padding:4px 5px 5px}}
.gg .qcw .qci.lock{opacity:.45;border-style:dashed}.gg .qcw .qci.lock::after{content:' · locked';font-weight:400;font-size:.8em}
/* F15 overdrive (src/45-overdrive.js) */
.gg .obj .odchip{float:right;margin:0 2px 2px 8px;padding:1px 6px;border-radius:3px;background:#ff6a2a;color:#10131c;font-style:normal;font-weight:800;font-size:11px;line-height:1.5;letter-spacing:.04em;text-transform:uppercase;white-space:nowrap}
.gg .odstep{align-items:center;flex-wrap:nowrap}
.gg .odstep button{min-width:44px;font-size:18px;padding:4px 12px}
.gg .odstep button[disabled]{opacity:.4;cursor:default}
.gg .odstep output{min-width:64px;text-align:center;font-weight:800;color:#ff8a4a}
.gg .odlock{color:var(--muted);font-weight:700}
/* F8 scoreboard (src/41-score.js) */
.gg .scbd{position:absolute;z-index:4;box-sizing:border-box;left:50%;top:calc(max(10px,env(safe-area-inset-top)) + 56px);transform:translateX(-50%);width:min(680px,calc(100% - 32px));max-height:calc(100% - 200px);display:flex;flex-direction:column;gap:6px;padding:10px 12px;background:rgba(8,10,16,.88);border:1px solid var(--line);border-top:3px solid var(--sun);pointer-events:none;font-family:var(--hudf)}
.gg .scbd button,.gg .scbd.ovf .scbody{pointer-events:auto}
.gg .scbd>header{display:flex;align-items:center;justify-content:space-between;gap:10px}
.gg .scbd>header b{display:block;font-family:var(--display);font-weight:400;font-size:20px;color:var(--sun);letter-spacing:.03em}
.gg .scbd>header span{font-size:13px;color:var(--muted)}
.gg .scbd .scbody{overflow:auto;min-height:0;overscroll-behavior:contain}
.gg .scbd .schint{margin:0;font-size:12px;color:var(--muted)}
.gg .scgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:6px}
.gg .scp{background:#141824;border:1px solid var(--line);border-left:3px solid var(--sky);padding:6px 9px;display:flex;flex-direction:column;gap:4px;min-width:0}
.gg .scp.me{border-left-color:var(--sun)}.gg .scp.wait{opacity:.7}
.gg .scp header{display:flex;flex-direction:column;gap:1px;min-width:0}
.gg .scp header b{font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.gg .scp header b i{font-style:normal;font-size:11px;color:var(--muted);font-weight:400}
.gg .scp header em{font-style:normal;font-size:13px;color:var(--sun)}.gg .scp header em span{color:var(--muted)}
.gg .scp dl{margin:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:2px}
.gg .scp dl div{display:flex;flex-direction:column;min-width:0}
.gg .scp dt{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.gg .scp dd{margin:0;font-size:15px;font-variant-numeric:tabular-nums;white-space:nowrap}
.gg .scp p{margin:0;font-size:12px;color:var(--muted)}.gg .scp .scb b{font-weight:600}
.gg .gm-score .scgrid{margin-top:8px}
.gg.is-touch .scbd{left:max(12px,env(safe-area-inset-left));transform:none;top:calc(max(8px,env(safe-area-inset-top)) + 44px);width:min(600px,calc(100% - 380px));max-height:calc(100% - 300px)}
.gg.is-touch .scbd .btn{min-height:40px}
@media (max-height:500px){.gg .scbd{top:calc(max(6px,env(safe-area-inset-top)) + 40px);max-height:calc(100% - 150px);padding:6px 8px;gap:4px}.gg.is-touch .scbd{width:min(560px,calc(100% - 330px));max-height:calc(100% - 126px)}.gg .scbd>header b{font-size:16px}.gg .scbd>header span{font-size:12px}.gg .scbd .schint{display:none}
  .gg .scbd .scgrid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:4px}.gg .scbd .scp{padding:3px 7px;gap:1px}
  .gg .scbd .scp header{flex-direction:row;flex-wrap:wrap;gap:0 6px;align-items:baseline}.gg .scbd .scp header b{font-size:13px}.gg .scbd .scp header em{font-size:12px}
  .gg .scbd .scp dl{display:flex;flex-wrap:wrap;gap:0 8px}.gg .scbd .scp dl div{flex-direction:row-reverse;gap:3px;align-items:baseline}.gg .scbd .scp dt{font-size:11px;text-transform:none;letter-spacing:0}.gg .scbd .scp dd{font-size:12px}.gg .scbd .scp p{font-size:11px}}
@media (max-width:620px) and (orientation:portrait){.gg .scbd,.gg.is-touch .scbd{left:10px;right:10px;width:auto;transform:none;top:calc(max(10px,env(safe-area-inset-top)) + 156px);max-height:38%}.gg .scgrid{grid-template-columns:1fr}}
/* F11 collectibles (src/43-collect.js) */
.gg .colcap{position:absolute;left:0;right:0;margin:0 auto;bottom:calc(max(10px,env(safe-area-inset-bottom)) + 17%);width:min(80%,540px);z-index:30;background:rgba(8,14,22,.92);border:1px solid rgba(95,242,255,.4);border-left:3px solid #5ff2ff;padding:8px 14px 10px;text-align:left;animation:ggpop .2s ease-out;cursor:pointer}
.gg .colcap[hidden]{display:none}
.gg .colcap small{display:block;color:#5ff2ff;font-size:11px;letter-spacing:.06em;text-transform:uppercase}
.gg .colcap b{display:block;font-size:15px;margin:2px 0}
.gg .colcap p{margin:0;font-size:14px;line-height:1.4}
@media (max-height:500px){.gg.is-touch .colcap{bottom:calc(max(6px,env(safe-area-inset-bottom)) + 70px);left:calc(max(10px,env(safe-area-inset-left)) + 2px);right:auto;margin:0;width:min(40%,360px);padding:5px 10px 6px}.gg.is-touch .colcap b{font-size:13px}.gg.is-touch .colcap p{font-size:12px;line-height:1.3}}
.gg.narrow .colcap{bottom:auto;top:calc(max(10px,env(safe-area-inset-top)) + 230px);width:min(92%,420px)}
.gg .coltabs .btn{white-space:nowrap}
.gg .colsum b{color:var(--fg)}
.gg .colh{margin:2px 0 -4px;font-size:14px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.gg .collist{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:6px}
.gg .colrow{background:#141824;border:1px solid var(--line);border-left:3px solid #39404d;color:var(--muted);font:inherit;padding:7px 10px;text-align:left;cursor:pointer;min-height:48px;display:flex;flex-direction:column;gap:2px;touch-action:manipulation}
.gg .colrow b{font-size:14px;color:var(--fg);font-weight:700}
.gg .colrow span{font-size:13px;line-height:1.35}
.gg .colrow.got.log{border-left-color:#5ff2ff}.gg .colrow.got.fig{border-left-color:#ffc94a}.gg .colrow.got span{color:var(--fg)}
.gg .colrow:not(.got) b{color:var(--muted)}
.gg .colrow[aria-expanded=true]{border-color:#5ff2ff}
@media (max-height:500px){.gg .collist{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:5px}.gg .colrow{min-height:44px;padding:5px 8px}.gg .colrow b{font-size:13px}.gg .colrow span{font-size:12px}}
/* F12 world events (src/46-events.js) */
.gg .obj .evobj{margin:0 0 4px;padding:0 0 4px;border-bottom:1px solid rgba(255,154,60,.45);color:#ffe3c2;font-weight:600}
.gg .obj .evobj b{color:#ff9a3c}
.gg.is-touch .obj .evobj{margin:0;padding:0;border:0}

/* Phase 2 lane D: backpack grid (57-backpack.js). Tiles are .irow buttons; the rarity colour is the top edge, the <i> badge shows the rarity letter in colour-blind modes */
.gg .bpctl{display:flex;gap:6px;align-items:center;flex:1 1 220px;min-width:0}
.gg .bpsort{white-space:nowrap;flex:none}
.gg .bpfil{display:flex;gap:4px;flex-wrap:nowrap;overflow-x:auto;max-width:100%;scrollbar-width:none}
.gg .bpfil::-webkit-scrollbar{display:none}
.gg .bpfil .btn{flex:none;white-space:nowrap}.gg .bpfil small{opacity:.7;font-variant-numeric:tabular-nums}
.gg .bpfil .btn[aria-pressed=true]{border-color:var(--sun)}
.gg .ilist .bpgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(82px,1fr));gap:5px;align-content:start}
.gg .bpgrid .irow.bpt{position:relative;display:flex;flex-direction:column;align-items:stretch;justify-content:space-between;gap:3px;min-height:44px;padding:7px 6px 5px;background:#141824;border:1px solid rgba(255,255,255,.08);border-top:3px solid var(--r);overflow:hidden;text-align:left;touch-action:manipulation}
.gg .bpgrid .irow.bpt span{font-weight:700;font-size:12px;padding-right:12px}
.gg .bpgrid .irow.bpt em{display:flex;justify-content:space-between;align-items:baseline;gap:4px;font-size:11px;min-width:0}
.gg .bpgrid .irow.bpt em b{order:2;min-width:0}
.gg .bpgrid .irow.bpt em b{font-size:10px;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gg .bpgrid .irow.bpt i{display:none;position:absolute;top:3px;right:3px;width:14px;height:14px;background:var(--r)}
.gg.cb-rg .bpgrid .irow.bpt i,.gg.cb-by .bpgrid .irow.bpt i{display:block}
.gg .bpgrid .irow.bpt .bpf{position:absolute;top:2px;right:5px;color:var(--sun);font-size:12px;line-height:1}
.gg.cb-rg .bpgrid .irow.bpt .bpf,.gg.cb-by .bpgrid .irow.bpt .bpf{right:21px}
.gg .bpgrid .irow.bpt.eq{background:#171c29}
.gg .bpgrid .irow.bpt.sel,.gg .bpgrid .irow.bpt:hover{border-color:var(--r);background:#1e2536;box-shadow:inset 0 0 0 1px var(--r)}
.gg .bpempty{color:var(--muted);font-size:13px;margin:6px 2px;line-height:1.4}
.gg.is-touch .ilist .bpgrid{grid-template-columns:repeat(auto-fill,minmax(88px,1fr))}
.gg.is-touch .bpgrid .irow.bpt{min-height:50px}.gg.is-touch .bpfil .btn,.gg.is-touch .bpsort{min-height:38px}
@media (max-width:620px){.gg .bpctl{flex-basis:100%;order:3}}
/* Phase 2 lane A: armour cards + Stats panel (src/53-armor.js, src/54-statpanel.js) */
.gg .loot .kv.ar-lv span,.gg .loot .kv.ar-lv b{color:var(--muted);font-weight:500}
.gg .sp{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px 16px;align-items:start}
.gg .sp-sec{min-width:0}.gg .sp-sec h4{margin:0 0 6px}
.gg .sp-tot{grid-column:2;grid-row:1 / span 3}
.gg .sp-slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:5px}
.gg .sp-slot{display:flex;flex-direction:column;align-items:flex-start;gap:1px;min-height:52px;padding:5px 8px;text-align:left;background:var(--panel2);color:var(--fg);border:1px solid var(--line);border-left:3px solid var(--r,var(--line));cursor:pointer;font:inherit}
.gg .sp-slot small{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.04em}
.gg .sp-slot b{font-size:12.5px;line-height:1.2;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.gg .sp-slot em{font-style:normal;color:var(--sun);font-size:12px}
.gg .sp-slot.empty b{color:var(--muted);font-weight:500}
.gg .sp-slot:hover,.gg .sp-slot:focus-visible{background:rgba(255,255,255,.08)}
.gg .sp-slot.on{outline:2px solid var(--sun);outline-offset:-2px}
.gg .sp-info{margin:6px 0 0;padding:6px 8px;background:rgba(255,201,60,.08);border-left:3px solid var(--sun);font-size:13px}
.gg .sp-rows{display:flex;flex-direction:column}
.gg .sp-row{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:10px;padding:4px 0;border-bottom:1px solid var(--line)}
.gg .sp-row b{text-align:right;font-variant-numeric:tabular-nums}
.gg .sp-row em,.gg .sp-row small{grid-column:1 / -1;font-style:normal;font-size:12px;color:var(--muted)}
.gg .sp-row em{color:#7ee08f}.gg .sp-row em:empty{display:none}
.gg .sp-stat{padding:4px 0;border-bottom:1px solid var(--line)}
.gg .sp-stat.zero{opacity:.55}
.gg .sp-sh{display:flex;align-items:baseline;gap:8px}.gg .sp-sh span{flex:1}.gg .sp-sh b{font-variant-numeric:tabular-nums}
.gg .sp-sh small{color:var(--sun);font-size:11px;text-transform:uppercase}
.gg .sp-stat ul{list-style:none;margin:2px 0 0;padding:0 0 0 10px}
.gg .sp-stat li{display:flex;gap:8px;font-size:12px;color:var(--muted)}.gg .sp-stat li span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gg .sp-stat li i{font-style:normal;font-variant-numeric:tabular-nums}
.gg .sp-stat li.on{color:var(--sun)}
@media (max-width:760px){.gg .sp{grid-template-columns:minmax(0,1fr)}.gg .sp-tot{grid-column:auto;grid-row:auto}}
.gg.is-touch .sp-slot{min-height:48px}
@media (max-height:500px){.gg .sp-slots{grid-template-columns:repeat(auto-fill,minmax(108px,1fr))}.gg .sp-slot{min-height:44px;padding:4px 7px}}
/* Phase 2 set bonuses (src/55-sets.js) */
.gg .gs-set{flex-basis:100%;width:100%;box-sizing:border-box;margin:6px 0 0;padding:6px 8px;border-left:3px solid var(--c);border-radius:6px;background:rgba(255,255,255,.05);min-width:0}
.gg .gs-h{display:flex;justify-content:space-between;gap:8px;font-size:13px;font-weight:700;color:var(--c)}
.gg .gs-n{color:#c9d2e0;font-weight:600;white-space:nowrap}
.gg .gs-set ul{list-style:none;margin:4px 0 0;padding:0;display:grid;gap:2px}
.gg .gs-set li{display:flex;gap:6px;align-items:baseline;font-size:12px;line-height:1.3;color:#7f8a9c;overflow-wrap:anywhere}
.gg .gs-set li b{flex:none;min-width:16px;text-align:center;border-radius:4px;background:rgba(255,255,255,.08);color:#9aa4b4;font-size:12px}
.gg .gs-set li.on{color:#eef3fb}
.gg .gs-set li.on b{background:var(--c);color:#0b0e14}
.gg .gs-panel{margin:8px 0}
.gg .gs-panel h5{margin:0 0 2px;font-size:14px;color:#fff}
.gg .gs-tip{margin:0 0 4px;font-size:12px;color:#9aa4b4}
/* ---- Phase 2 lane C: gadgets (56-gadgets.js): a recharge ring above the skill's on desktop, a GADGET button in the touch cluster ---- */
.gg .gadhud{position:absolute;right:max(16px,env(safe-area-inset-right));bottom:calc(max(12px,env(safe-area-inset-bottom)) + 150px);display:flex;align-items:center;gap:8px;flex-direction:row-reverse;pointer-events:none}
.gg .gadhud .ring{width:38px;height:38px;border-radius:50%;background:conic-gradient(#8dff6a calc(var(--p,1)*360deg),rgba(255,255,255,.12) 0);display:flex;align-items:center;justify-content:center}
.gg .gadhud .ring b{width:30px;height:30px;border-radius:50%;background:var(--ink);display:flex;align-items:center;justify-content:center;font-size:.68em;font-weight:700}
.gg .gadhud span{font-family:var(--display);font-size:.8em;background:var(--panel);padding:3px 8px}
.gg.is-touch .gadhud,.gg.in-veh .gadhud{display:none}
.gg .tb.gad{right:196px;bottom:84px;width:50px;height:50px;font-size:9px;background:conic-gradient(rgba(141,255,106,.7) calc(var(--p,1)*360deg),rgba(10,12,20,.55) 0)}
.gg.in-veh .tb.gad{display:none}
.gg.narrow.is-touch .tb.gad{width:56px;height:56px} /* portrait: .tbtns is scaled .86, keep it 48px on screen */
@media (max-height:500px){
.gg.is-touch .tbtns .tb.gad{right:248px;bottom:90px;width:50px;height:50px;font-size:9px}
.gg.is-touch .tbtns .tb.h4blade{right:306px}
}
@media (max-height:320px){
.gg.is-touch .tbtns .tb.gad{right:216px;bottom:82px;width:46px;height:46px;font-size:8px}
.gg.is-touch .tbtns .tb.h4blade{right:270px}
}
/* Phase 4 wardrobe (src/92-wardrobe.js): the Wardrobe button on the Hero screen, then a live preview + outfit and colour pickers in the hero pane */
.gg .wdrow{display:flex;align-items:center;gap:10px;margin-top:10px;flex-wrap:wrap}
.gg .wdrow .btn{min-height:40px;min-width:120px}
.gg .wdrow span{color:var(--muted);font-size:13px}
.gg .gmpane.gm-wd{overflow:hidden}
.gg .wd{display:grid;grid-template-columns:minmax(220px,38%) minmax(0,1fr);gap:12px;flex:1;min-height:0}
.gg .wdstage{position:relative;min-height:0;display:flex;flex-direction:column;border:1px solid var(--line);background:radial-gradient(circle at 50% 60%,color-mix(in srgb,var(--c) 32%,transparent),transparent 66%),#0b0d14}
.gg .wdview{position:relative;flex:1;min-height:0}
.gg .wdview canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:grab}
.gg .wdview canvas:active{cursor:grabbing}
.gg .wdturn{display:flex;align-items:center;justify-content:center;gap:10px;padding:4px 6px 6px;color:var(--muted);font-size:12px}
.gg .wdturn .btn{min-width:48px;min-height:38px;padding:2px 12px;font-size:20px;line-height:1;font-family:var(--hudf)}
.gg .wdtry{position:absolute;left:6px;right:6px;top:6px;display:flex;align-items:center;gap:8px;background:var(--panel2);border-left:3px solid var(--sky);padding:4px 6px 4px 10px;font-size:13px;z-index:1}
.gg .wdtry span{flex:1;min-width:0}.gg .wdtry .btn{min-height:32px}
.gg .wdside{display:flex;flex-direction:column;gap:8px;min-height:0;overflow:auto;overscroll-behavior:contain;padding:2px 4px 0 2px}
.gg .wdtabs .btn{min-height:36px}
.gg .wdgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(136px,1fr));gap:6px}
.gg .wdit{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:2px;min-height:50px;padding:6px 10px;background:#141824;border:1px solid var(--line);border-left:3px solid var(--line);color:var(--fg);font:inherit;text-align:left;cursor:pointer;border-radius:4px}
.gg .wdit:hover{background:#1a2030}
.gg .wdit b{font-size:14px;line-height:1.2}.gg .wdit span{font-size:12px;color:var(--muted)}
.gg .wdit.locked{background:#0f1118;border-style:dashed;border-left-style:solid}.gg .wdit.locked b{color:#c3cad8}
.gg .wdit.picked{background:#1d2232}
.gg .wdit[aria-pressed=true]{border-color:var(--sun);border-left-color:var(--sun);background:#232233}
.gg .wdit[aria-pressed=true] span::after{content:' · Wearing';color:var(--sun);font-weight:700}
.gg .wdit.tried{border-color:var(--sky);border-left-color:var(--sky)}
.gg .wdit.tried span::after{content:' · Trying on';color:var(--sky);font-weight:700}
.gg .wddet{background:rgba(255,255,255,.05);padding:8px 12px;border-radius:6px;display:grid;gap:3px}
.gg .wddet.locked{border-left:3px solid var(--sky)}
.gg .wddet b{font-family:var(--display);font-weight:400;font-size:16px}
.gg .wddet p{margin:0;font-size:13px;color:#d5dbea;line-height:1.4}.gg .wddet .wdhow{color:var(--muted)}
.gg .wdacts{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:4px}.gg .wdacts .btn{min-height:38px}
.gg .wdnote{font-size:12px;color:var(--muted)}
.gg .wdcol{display:grid;gap:5px}
.gg .wdcol h5{margin:2px 0 0;font-size:14px}.gg .wdcol h5 span{font-weight:400;color:var(--muted);font-size:12px;margin-left:4px}
.gg .wdsws{display:flex;flex-wrap:wrap;gap:6px}
.gg .wdsw{width:36px;height:36px;padding:0;border-radius:50%;border:2px solid #0c0a1c;background:var(--s);box-shadow:0 0 0 1px var(--line);cursor:pointer;color:#10131c;font:inherit;font-size:11px;font-weight:800}
.gg .wdsw.hero{width:auto;min-width:60px;border-radius:18px;padding:0 10px;text-shadow:0 0 3px rgba(255,255,255,.6)}
.gg .wdsw[aria-pressed=true]{box-shadow:0 0 0 3px var(--sun),0 0 0 5px rgba(255,201,60,.3)}
.gg .wdfoot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto;position:sticky;bottom:0;background:rgba(8,10,16,.96);padding:6px 0 2px;z-index:1}
.gg .wdfoot .wdcr{color:var(--sun);font-weight:700;font-size:13px}
.gg .wdfoot .btn{min-height:40px;min-width:110px}
@media (max-height:500px){
.gg .wd{grid-template-columns:minmax(170px,32%) minmax(0,1fr);gap:8px}
.gg .wdgrid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:5px}
.gg .wdit{min-height:44px;padding:4px 8px}.gg .wdit b{font-size:13px}
.gg .wddet{padding:6px 10px}.gg .wddet b{font-size:15px}.gg .wddet p{font-size:12px}
.gg .wdturn span{display:none}.gg .wdturn{padding:2px 4px 4px}
.gg .wdsws{gap:5px}
}
@media (max-height:340px){
.gg .gm-wd .gmh{display:none}
.gg .wdturn .btn{min-height:34px}
}
@media (max-width:620px){
.gg .gmpane.gm-wd{overflow:auto}
.gg .wd{grid-template-columns:minmax(0,1fr);flex:none}
.gg .wdstage{height:min(40vh,300px)}
.gg .wdside{overflow:visible;padding-right:0}
}
/* Controls page controller picture (30-pad padArtHTML): full width above the keyboard and touch columns; the text list replaces it on narrow screens */
.gg .gmhelp .padsec{grid-column:1/-1}
.gg .padart{display:block;width:100%;max-width:820px;margin:0 auto 4px;font-size:15px}
.gg .padart .pbody{fill:#2a3040;stroke:#7d8aa6;stroke-width:2}
.gg .padart .ptrig,.gg .padart .pbump{fill:#3a4256;stroke:#7d8aa6;stroke-width:1.5}
.gg .padart .pstick{fill:#151924;stroke:#9aa7c2;stroke-width:3}
.gg .padart .pdpad,.gg .padart .psmall{fill:#151924;stroke:#9aa7c2;stroke-width:1.5}
.gg .padart .pfl{fill:#0b0e14;font-size:12px;font-weight:700;text-anchor:middle}
.gg .padart .pline{fill:none;stroke:#ffd23f;stroke-width:1.2;opacity:.75}
.gg .padart .pdot{fill:#ffd23f}
.gg .padart .plab{fill:#e8ecf4}
.gg .padart .pk{fill:#ffd23f;font-weight:700}
.gg .gmhelp .padlist{display:none}
@media (max-width:620px){.gg .padart{display:none}.gg .gmhelp .padlist{display:block}}
/* pickup popup: smaller and see-through so it never hides the hero or the fight (Brian 2026-10-06) */
.gg .lootpop .loot{background:linear-gradient(160deg,color-mix(in srgb,var(--r) 18%,rgba(16,19,28,.62)) 0%,rgba(16,19,28,.55) 60%);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.gg .lootpop{width:min(280px,80%)}
.gg.is-touch .lootpop,.gg.narrow.is-touch .lootpop{width:min(30%,250px)}
.gg.is-touch .lootpop .loot{padding:3px 8px 4px;gap:0 8px}
.gg.is-touch .lootpop h4{font-size:13px}.gg.is-touch .lootpop .pow{font-size:13px}.gg.is-touch .lootpop .pow small{font-size:11px}
.gg.is-touch .lootpop .ars-trait,.gg.is-touch .lootpop .ltap{display:none}
/* Sync across devices (67-sync): inputs stay at 16px+ so iOS doesn't zoom */
.gg .syncbox{margin-top:10px}
.gg .syncbox .synccode{flex:1 1 180px;min-width:0;box-sizing:border-box;background:#0b0d14;color:var(--fg);border:1px solid var(--line);padding:6px 8px;font:16px/1.35 ui-monospace,Menlo,monospace;letter-spacing:.06em;text-transform:uppercase}
.gg .syncbox .synccode:focus{outline:2px solid var(--sky)}
.gg .syncbox .syncshow{font:700 20px/1.3 ui-monospace,Menlo,monospace;letter-spacing:.1em;color:var(--fg);margin:6px 0;user-select:all}
.gg .syncbox .smsg:empty{display:none}.gg .syncbox .smsg{color:var(--fg)}
/* Phase 7 Elite robots (src/78-elites.js): wider bars with a glow; the name keeps its threat colour */
.gg .etag.elite i{width:70px;box-shadow:0 0 0 1px rgba(0,0,0,.5),0 0 5px rgba(255,255,255,.75)}
/* 30-padmap: Settings → Controller test readout + guided setup */
.gg .padtest{border:1px solid #3a4256;border-radius:8px;padding:8px 10px;margin:4px 0 10px}
.gg .padtest .padlive{font:13px/1.5 ui-monospace,Menlo,monospace;color:#cfd6e4;margin:6px 0;word-break:break-word}
.gg .padtest .padcap{color:#ffd23f;font-weight:700;margin:6px 0}
.gg .padtest .padcap .btn{margin-left:6px}
/* inventory on phones (Brian 2026-10-11, iPhone: "swiping menu with guns and shields floats / bounces", "can't scroll up to see the rest"):
   the tabs and gear bar ate the panel, leaving the item list 60-240 px and the card clipped, so a swipe moved a few px and rubber-banded.
   Short or narrow screens scroll the whole panel instead; the item card stays in view (sticky: beside the grid in landscape, pinned
   along the bottom in portrait) and the page never bounces behind it */
.gg .bpfil{overscroll-behavior-x:contain}
.gg .ilist,.gg .idetail{overscroll-behavior:contain}
@media (max-height:520px),(max-width:640px){
  .gg .panel.inv{overflow-y:auto;overscroll-behavior:contain}
  .gg .panel.inv>*{flex-shrink:0}
  .gg .panel.inv .icols{flex:none;min-height:auto;align-items:start}
  .gg .panel.inv .ilist{overflow:visible}
  .gg .panel.inv .idetail{position:sticky;top:0;max-height:calc(100dvh - 44px);overflow:auto}
}
@media (max-width:640px){
  .gg .panel.inv .icols{grid-template-rows:auto auto}
  .gg .panel.inv{scroll-padding-bottom:calc(46dvh + 24px)} /* tiles scrolled into view by controller/keys land above the sticky card */
  .gg .panel.inv .idetail{top:auto;bottom:-12px;max-height:46dvh;background:rgba(8,10,16,.97);border-top:1px solid var(--line);margin:0 -12px;padding:8px 12px 12px;box-shadow:0 -10px 18px rgba(0,0,0,.55)}
}
/* 68-bestsave: a higher save on this device, offered on the start screen */
.gg .bsv{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;padding:10px 12px;margin:0 0 10px;border:1px solid var(--sun);border-left:4px solid var(--sun);background:rgba(255,196,40,.08)}
.gg .bsv>div:first-child{flex:1 1 220px;min-width:0;display:flex;flex-direction:column;gap:2px}.gg .bsv b{font-size:15px}.gg .bsv span{font-size:12.5px;color:var(--muted)}
.gg .bsv .brow{display:flex;gap:8px;flex-wrap:wrap}
.loot .pow b.bst{display:inline-block;margin-left:8px;padding:1px 6px;border-radius:4px;background:#2a3d24;color:#8ef07a;font-size:11px;letter-spacing:.06em;text-transform:uppercase;vertical-align:middle} /* boosted gear chip (17-gear gearBoost) */

/* first-screen purpose line (31-menu MENU_WHY) */
.gg .gmwhy{margin:-4px 0 8px;font-size:13px;line-height:1.35;color:#cfd6e4;max-width:60ch}
@media (max-height:500px){.gg .gmwhy{font-size:12px;margin:-6px 0 4px}}
@media (max-height:360px){.gg .gmwhy{font-size:11px;line-height:1.25;margin:-6px 0 2px}}
/* Phase M missions (src/70-missions.js): dropship map list, radio caption, objective line */
.gg .msnrow{margin-top:6px}
.gg .msnlist{list-style:none;margin:4px 0 0;padding:0;display:grid;gap:4px}
.gg .msnlist li{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:38px;padding:2px 6px;border-left:3px solid rgba(95,242,160,.35);background:rgba(8,14,22,.45)}
.gg .msnlist li.done{border-left-color:#5ff2a0}
.gg .msnlist li.lock{opacity:.55}
.gg .msnlist li span{font-size:14px}
.gg .msnlist .btn{min-height:36px;flex:none}
.gg .msncap{border-color:rgba(95,242,160,.45);border-left-color:#5ff2a0;bottom:calc(max(10px,env(safe-area-inset-bottom)) + 26%)}
.gg .msncap small{color:#5ff2a0}
.gg .msnobj b{color:#5ff2a0}
.gg.is-touch .msncap{width:min(62%,460px)}
/* Phase M lane B: mission troopers */
.gg .ptag.ally span{color:#8fd3ff}
.gg .ptag.ally.down span{opacity:.55}
.gg .ptag.ally.down span::after{content:' · rebooting';font-weight:400}