/* BigHero Nexus — "assembly manual" design system.
   Loaded LAST on every site page (not the game room) so one set of tokens wins over the
   per-page :root blocks. Graphite sheet, line-art ink, steel callouts, flat colour-guide chips.
   No gradients, glass, glow or blur. */

@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/barlow-condensed-500.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/barlow-condensed-600.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/barlow-condensed-700.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  color-scheme:dark;
  /* sheet + ink */
  --bg:#16181c; --bg2:#1d2025;
  --surface:#1d2025; --surface-2:#23272d; --surface-3:#2b3037;
  --line:#343a42; --line-2:#4a525c; --line-3:#8fa3b8;
  --text:#e9eaec; --muted:#a6b0bb; --faint:#86909b;
  /* colour-guide chips */
  --chip-blue:#1f5fbf; --chip-red:#d7262d; --chip-yellow:#f6c400; --chip-white:#e9eaec;
  --blue:#4a8ae8; --red:#d7262d; --red-2:#ef5a5f; --green:#3fae6a; --yellow:#f6c400;
  --good:#5cc785; --bad:#ef5a5f; --ink:#16181c;
  /* legacy names used by page-level CSS, mapped onto the system */
  --panel:var(--surface); --panel2:var(--surface-2); --panel-solid:var(--surface);
  --border:var(--line); --border-strong:var(--line-2); --line-strong:var(--line-2);
  --amber:var(--chip-yellow); --amber-2:#ffd633; --amber-dim:rgba(246,196,0,.12);
  --gold:var(--chip-yellow); --accent:var(--chip-yellow);
  --cyan:var(--blue); --violet:var(--chip-blue); --white:var(--text);
  --red-hover:#e23a40; --red-dim:rgba(215,38,45,.14);
  --ok:var(--good);
  --radius:2px; --shadow:none; --cut:none;
  --font-display:'Barlow Condensed','Noto Sans Thai','Leelawadee UI','Yu Gothic UI','Microsoft JhengHei',system-ui,sans-serif;
  --font-body:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Noto Sans Thai','Leelawadee UI','Yu Gothic UI','Microsoft JhengHei',ui-sans-serif,system-ui,sans-serif;
  --font-mono:ui-monospace,'Cascadia Mono',Consolas,'Liberation Mono',Menlo,monospace;
  --ease-out:cubic-bezier(.16,1,.3,1);
}

/* ---------- space backdrop (v1.58.0) ----------
   Deep-space sheet behind every site page: blue-black base, two soft nebula glows and two
   star maps (img/space/*.svg, generated once from a seeded random sky, so nothing
   repeats). Kept sparse and dim so the UI reads first; panels are near-solid. Only the few
   bright stars move (a slow twinkle), and that stops for reduced motion. */
:root{
  --bg:#0a0e17; --bg2:#0f1420;
  --surface:rgba(14,19,30,.95); --surface-2:rgba(22,29,44,.96); --surface-3:#253047;
  --line:#26314a; --line-2:#3a4762; --line-3:#8fa6c4;
  --ink:#0a0e17;
}
html{background:#04060c !important}
:root body{background:transparent !important;background-image:none !important;animation:none !important;color:var(--text);font-family:var(--font-body)}
/* The legacy cosmic lobby (gundam.css body.lobby-page::before/::after, !important) stays off:
   ::before is repainted as the new sheet and ::after is removed. */
:root body::after{content:none !important;display:none !important}
/* base + nebulae + the faint far-star map (static) */
:root body::before{content:"" !important;display:block !important;position:fixed !important;inset:0 !important;pointer-events:none;z-index:-1 !important;
  transform:none !important;filter:none !important;mix-blend-mode:normal !important;width:auto !important;height:auto !important;
  opacity:1 !important;animation:none !important;
  background:
    url('img/space/space_stars_far.svg') center / cover no-repeat,
    radial-gradient(ellipse 60% 50% at 10% 6%,rgba(46,92,200,.2),transparent 70%),
    radial-gradient(ellipse 55% 45% at 94% 92%,rgba(120,64,190,.15),transparent 70%),
    linear-gradient(180deg,#05070e 0%,#070b16 55%,#060812 100%) !important;
}
/* the few brighter near stars; they twinkle slowly. Lives on html::after, which the legacy CSS
   never touches, and animates opacity only (no repaint). */
html::after{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;will-change:opacity;
  background:url('img/space/space_stars_near.svg') center / cover no-repeat;
  opacity:.75;
  animation:nexusStarTwinkle 6s ease-in-out infinite alternate;
}
@keyframes nexusStarTwinkle{from{opacity:.45}to{opacity:.85}}
@media (prefers-reduced-motion:reduce){html::after{animation:none}}
.space-bg,.page-bg,.bg-fx{display:none !important}
::selection{background:var(--chip-yellow);color:var(--ink)}
*{scrollbar-color:var(--line-2) var(--bg)}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{background:var(--line-2);border:2px solid var(--bg)}
input,textarea{caret-color:var(--chip-yellow)}
:focus-visible{outline:2px solid var(--chip-yellow) !important;outline-offset:2px}
a{text-underline-offset:3px}
table{font-variant-numeric:tabular-nums}

/* ---------- type ---------- */
h1,h2,h3,.section-title,.brand b{font-family:var(--font-display);letter-spacing:.01em}
.eyebrow,.section-eyebrow,.patch-eyebrow,.showcase-label{display:none !important}
.part-code{font-family:var(--font-mono);font-size:.78em;font-weight:600;letter-spacing:0;
  display:inline-block;padding:1px 6px;border:1px solid var(--line-3);border-radius:var(--radius);
  color:var(--text);line-height:1.5;white-space:nowrap}

/* section heading = title + leader rule to the sheet edge */
.section-title{display:flex;align-items:center;gap:16px;text-align:left !important;
  font-size:clamp(24px,3vw,34px) !important;font-weight:700 !important;text-transform:uppercase;line-height:1.05;margin:0 0 14px !important}
.section-title::after{content:"";flex:1 1 40px;height:1px;background:var(--line-2)}
.section-sub{color:var(--muted);text-align:left !important;max-width:68ch;margin-left:0 !important}

/* ---------- top bar ---------- */
.topbar,.site-header,header.topbar{background:rgba(6,9,16,.72) !important;border-bottom:1px solid var(--line) !important;
  backdrop-filter:blur(12px) saturate(1.2) !important;-webkit-backdrop-filter:blur(12px) saturate(1.2) !important;box-shadow:none !important}
.brand-logo{border-radius:var(--radius) !important;border-color:var(--line-2) !important}
.brand b{font-size:19px !important;font-weight:700 !important;text-transform:uppercase;letter-spacing:.04em !important}
.brand span{letter-spacing:.12em}
.nav-links a{font-family:var(--font-display);font-size:16px !important;font-weight:600 !important;text-transform:uppercase;
  letter-spacing:.04em;border-radius:0 !important;color:var(--muted);padding:8px 12px !important;
  border-bottom:2px solid transparent}
.nav-links a:hover{background:transparent !important;color:var(--text);border-bottom-color:var(--line-3)}
.nav-links a[aria-current="page"],.nav-links a.active{color:var(--text);border-bottom-color:var(--chip-yellow);background:transparent !important}
.nx-lang{display:inline-flex;align-items:center;min-height:32px;padding:4px 10px;border-radius:var(--radius);border:1px solid var(--line-2);
  background:transparent;color:var(--text);font:600 13px var(--font-body);cursor:pointer}
.nx-lang:hover{border-color:var(--line-3)}
.discord-login-btn-zero{border-radius:var(--radius) !important;box-shadow:none !important;font-weight:700}

/* ---------- controls ---------- */
.btn{border-radius:var(--radius) !important;clip-path:none !important;box-shadow:none !important;
  font-family:var(--font-display);font-size:17px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
  transition:background-color .15s var(--ease-out),color .15s var(--ease-out),border-color .15s var(--ease-out)}
.btn.primary,.btn.amber{background:var(--chip-yellow) !important;color:var(--ink) !important;border:1px solid var(--chip-yellow) !important}
.btn.primary:not(:disabled):hover,.btn.amber:not(:disabled):hover{background:#ffd633 !important;border-color:#ffd633 !important}
.btn.violet{background:var(--chip-blue) !important;color:#fff !important;border:1px solid var(--chip-blue) !important}
.btn.violet:not(:disabled):hover{background:#2a6fd6 !important}
.btn.ghost{background:transparent !important;color:var(--text) !important;border:1px solid var(--line-2) !important}
.btn.ghost:not(:disabled):hover{border-color:var(--line-3) !important}
.btn:disabled{opacity:.45}

.ipt,.play textarea,.play select,input[type=text],input[type=search],textarea,select{
  border-radius:var(--radius) !important;background-color:var(--bg) !important;border-color:var(--line-2) !important;color:var(--text);box-shadow:none !important}
.ipt:focus,.play textarea:focus,.play select:focus,input:focus,textarea:focus,select:focus{border-color:var(--chip-yellow) !important;outline:none}
::placeholder{color:var(--faint);opacity:1}

/* segmented tabs = colour-guide chips */
.tabs{background:transparent !important;border:1px solid var(--line-2) !important;border-radius:var(--radius) !important;padding:0 !important;gap:0 !important}
.tab{border-radius:0 !important;font-family:var(--font-display);font-size:15px !important;white-space:nowrap;font-weight:700 !important;text-transform:uppercase;
  letter-spacing:.04em;color:var(--muted) !important;box-shadow:none !important;border-right:1px solid var(--line-2) !important}
.tab:last-child{border-right:0 !important}
.tab:hover{background:var(--surface-2) !important;color:var(--text) !important}
.tab.active{background:var(--chip-blue) !important;color:#fff !important}
.mode-switch{border-radius:var(--radius) !important;border:1px solid var(--line-2) !important;background:transparent !important;padding:0 !important;gap:0 !important}
.mode-btn{border-radius:0 !important;font-weight:700 !important;box-shadow:none !important}
.mode-btn.active{background:var(--text) !important;color:var(--ink) !important}
.strength-btn{border-radius:0 !important}
.strength-btn.active{background:var(--text) !important;color:var(--ink) !important}

/* ---------- panels ---------- */
.play,.rooms,.feature,.patch-note-box,.shot-card,.panel,.card-panel{border-radius:var(--radius) !important;box-shadow:none !important;
  backdrop-filter:none !important;-webkit-backdrop-filter:none !important;background:var(--surface) !important;border:1px solid var(--line) !important}
.alert{border-radius:var(--radius) !important}
.mode-pill,.rooms-live-status,.patch-latest-pill{border-radius:var(--radius) !important}
.room-table th{font-family:var(--font-mono);font-size:11px !important;letter-spacing:.06em;color:var(--faint) !important}
.room-code,.wait .code{font-family:var(--font-mono)}
.rooms-head h3{font-family:var(--font-display);font-size:20px;text-transform:uppercase;letter-spacing:.03em}
.wait .orb{border-radius:50%}

/* ============ LOBBY: the assembly sheet ============ */
.lobby-page .hero{padding-top:36px !important;padding-bottom:20px !important}
.lobby-page .hero::after{content:none !important}
.sheet-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:8px 32px;
  padding-bottom:18px;border-bottom:1px solid var(--line-2)}
.sheet-head h1{grid-column:1;margin:0 !important;font-size:clamp(34px,4.6vw,60px) !important;font-weight:700 !important;
  line-height:.98 !important;text-transform:uppercase;letter-spacing:.005em !important;color:var(--text);max-width:24ch;text-wrap:balance}
.sheet-head h1 em{font-style:normal;color:var(--muted);font-weight:600;background:none !important;-webkit-text-fill-color:currentColor}
.sheet-head .lede{grid-column:1;margin:4px 0 0 !important;color:var(--muted);font-size:16px;max-width:60ch}
.sheet-head .build-meta{grid-column:2;grid-row:1 / span 2;margin:0;display:flex;gap:8px;align-items:center;flex-wrap:wrap;
  justify-content:flex-end;color:var(--muted);font-size:13px;white-space:nowrap}

.lobby-page .play-showcase-grid{grid-template-columns:minmax(0,1fr) 280px !important;max-width:none !important;gap:24px !important;
  margin:24px 0 0 !important;align-items:start !important}
.lobby-page .play-showcase-grid .play{order:1;grid-column:1;grid-row:1;padding:0 !important;margin:0 !important;max-width:none !important}
.lobby-page .lobby-showcase{order:2;grid-column:2;grid-row:1;max-width:none !important;min-height:0 !important;margin:0 !important;
  padding:0 !important;border:0 !important;background:none !important;box-shadow:none !important;border-radius:0 !important}
.lobby-page .lobby-showcase .gundam-slider{flex:none !important;min-height:0 !important;aspect-ratio:63/88}
.lobby-page .lobby-showcase .gundam-track,.lobby-page .lobby-showcase .gundam-card-frame{min-height:0 !important;height:100%}
.gundam-card-frame{border-radius:var(--radius) !important;box-shadow:none !important;border-color:var(--line) !important;background:var(--surface) !important}

/* the form is the two-step sheet; a rail across its top is step progress */
#gundamRoomForm{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);padding-top:3px}
#gundamRoomForm::after{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--line)}
#gundamRoomForm::before{content:"";position:absolute;z-index:1;left:0;right:0;top:0;height:3px;background:var(--chip-blue);
  transform:scaleX(.5);transform-origin:left;transition:transform .45s var(--ease-out)}
#gundamRoomForm.deck-ready::before{transform:scaleX(1)}
#gundamRoomForm > input[type=hidden]{display:none}
.lobby-page .step{padding:22px 24px 24px;min-width:0}
.lobby-page .step + .step{border-left:1px solid var(--line)}
.step-head{display:flex;align-items:center;gap:12px;margin:0 0 18px;font-size:22px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;line-height:1}
.step-no,.btn.primary .step-no{flex:0 0 auto;display:inline-grid;place-items:center;width:32px;height:32px;border-radius:50%;
  border:2px solid var(--line-3);color:var(--text);font-family:var(--font-display);font-size:18px;font-weight:700;
  transition:background-color .3s var(--ease-out),border-color .3s var(--ease-out),color .3s var(--ease-out)}
.step.is-done .step-no{background:var(--chip-blue);border-color:var(--chip-blue);color:#fff}
#gundamRoomForm.deck-ready #stepMode .step-no{background:var(--chip-blue);border-color:var(--chip-blue);color:#fff}

/* step 3 is the start button itself */
.lobby-page .pane .btn.block.primary,.lobby-page .pane .btn.block.amber{position:relative;min-height:56px;font-size:20px;margin-top:6px}
.lobby-page .pane .btn.block.primary::before,.lobby-page .pane .btn.block.amber::before{content:"3";display:inline-grid;place-items:center;
  width:28px;height:28px;border-radius:50%;border:2px solid currentColor;font-size:16px;line-height:1;margin-right:4px}
.lobby-page #gundamSubmitPrivateBtn::before{content:none}

.lobby-page .play .ident{gap:16px}
.lobby-page .fl label,.lobby-page .fl-row label,.release-copy b{font-family:var(--font-mono);font-size:11px !important;font-weight:600 !important;
  letter-spacing:.08em !important;text-transform:uppercase;color:var(--muted) !important}
.lobby-page .fl-row a{color:var(--text) !important;text-decoration:underline;text-decoration-color:var(--line-3)}
.release-picker{border-radius:var(--radius) !important;background:transparent !important;border:0 !important;padding:0 !important;margin:16px 0 0 !important}
.release-option{border-radius:var(--radius) !important;background:var(--bg) !important;border:1px solid var(--line-2) !important;box-shadow:none !important}
.release-option:has(input:checked){border-color:var(--chip-yellow) !important}
.release-copy span{color:var(--faint)}
.pane .hint{color:var(--muted)}
.ai-deck-trigger{border-radius:var(--radius) !important;background:var(--bg) !important;border:1px solid var(--line-2) !important;box-shadow:none !important}
.ai-deck-modal-panel{border-radius:var(--radius) !important;background:var(--surface) !important;border:1px solid var(--line-2) !important}
.ai-deck-tile{border-radius:var(--radius) !important;box-shadow:none !important}

@media (max-width:980px){
  .lobby-page .play-showcase-grid{grid-template-columns:1fr !important}
  .lobby-page .lobby-showcase{display:none}
}
@media (max-width:760px){
  .lobby-page .wrap{padding-left:16px !important;padding-right:16px !important}
  .sheet-head{grid-template-columns:1fr}
  .sheet-head .build-meta{grid-column:1;grid-row:auto;justify-content:flex-start}
  #gundamRoomForm{grid-template-columns:1fr}
  .lobby-page .step{padding:18px 16px 20px}
  .lobby-page .step + .step{border-left:0;border-top:1px solid var(--line)}
}
@media (prefers-reduced-motion:reduce){
  #gundamRoomForm::before,.step-no{transition:none}
}

/* ============ DECK BUILDER ============ */
.deck-page .brand h1,.deck-top h1{font-family:var(--font-display);font-size:26px !important;font-weight:700;text-transform:uppercase;letter-spacing:.03em}
.deck-top{border-bottom:1px solid var(--line);padding-bottom:14px}
.btn.danger{background:transparent !important;border:1px solid var(--chip-red) !important;color:#ffb4b6 !important}
.btn.danger:not(:disabled):hover{background:var(--chip-red) !important;color:#fff !important}
.panel{background:var(--surface) !important;border:1px solid var(--line) !important;border-radius:var(--radius) !important;box-shadow:none !important}
.panel-head{border-bottom-color:var(--line) !important}
.panel-title{font-family:var(--font-display);font-size:22px !important;font-weight:700 !important;text-transform:uppercase;letter-spacing:.03em}
.stat{background:var(--bg) !important;border:1px solid var(--line) !important;border-radius:var(--radius) !important}
.stat b{font-family:var(--font-display);font-size:26px !important;font-weight:700;font-variant-numeric:tabular-nums}
.stat span{font-family:var(--font-mono);font-size:10.5px !important;color:var(--faint) !important}
.range-block{background:var(--bg) !important;border:1px solid var(--line) !important;border-radius:var(--radius) !important}
.range-title{font-family:var(--font-mono);color:var(--muted) !important}
.dual-range input[type="range"]::-webkit-slider-thumb{background:var(--chip-yellow) !important;border:2px solid var(--ink) !important;box-shadow:none !important}
.dual-range input[type="range"]::-moz-range-thumb{background:var(--chip-yellow) !important;border:2px solid var(--ink) !important;box-shadow:none !important}
.dual-range-track{background:var(--line-2) !important;box-shadow:none !important;border-radius:0 !important}
.dual-range-track span{background:var(--chip-yellow) !important;box-shadow:none !important}
input[type=range]{accent-color:var(--chip-yellow)}
.multi-dd>summary,.mydeck-filter-btn,.deck-name{border-radius:var(--radius) !important;background:var(--bg) !important;border-color:var(--line-2) !important}
/* Pressed "My Deck" filter: the forced dark background above left its dark text unreadable. */
.mydeck-filter-btn[aria-pressed="true"]{background:var(--chip-yellow) !important;color:var(--ink) !important;border-color:var(--chip-yellow) !important}
.multi-dd-panel,.mydecks-modal{border-radius:var(--radius) !important;background:var(--surface) !important;border:1px solid var(--line-2) !important}
.card-tile{border-radius:var(--radius) !important;border:1px solid var(--line) !important;background:var(--bg) !important;box-shadow:none !important}
.card-tile:hover{transform:none !important;border-color:var(--line-3) !important;box-shadow:none !important}
.card-tile.in-deck{border-color:var(--chip-blue) !important;box-shadow:inset 0 0 0 1px var(--chip-blue) !important}
.card-tile .code{font-family:var(--font-mono);font-size:11.5px !important;color:var(--text) !important;font-weight:600 !important}
.card-tile .name{font-weight:700}
.tag,.pill{border-radius:var(--radius) !important;border-color:var(--line-2) !important;background:transparent !important;color:var(--muted) !important}
.qty-badge{border-radius:var(--radius) !important;background:var(--chip-blue) !important;border-color:var(--chip-blue) !important;color:#fff !important}
.card-step-btn,.qty-control button,.deck-visual-card .vq button{border-radius:var(--radius) !important;background:var(--bg) !important;border:1px solid var(--line-2) !important;color:var(--text) !important}
.card-step-btn:hover,.qty-control button:hover,.deck-visual-card .vq button:hover{background:var(--text) !important;color:var(--ink) !important;border-color:var(--text) !important}
.validation{border-radius:var(--radius) !important}
.curve-toggle{border-radius:var(--radius) !important;border-color:var(--line-2) !important}
.curve-mode-btn.is-active{background:var(--chip-yellow) !important;color:var(--ink) !important}
.curve-bar{border-radius:0 !important;background:var(--chip-yellow) !important}
.add-target-btn{border-radius:0 !important}
.deck-img-count{border-radius:var(--radius) !important;background:var(--chip-yellow) !important;border:2px solid var(--ink) !important;color:var(--ink) !important;box-shadow:none !important}
.bo3-badge{border-radius:var(--radius) !important}
.add-target-group,.lang-pick{border-radius:var(--radius) !important;border:1px solid var(--line-2) !important;background:transparent !important}
.add-target-btn.is-active,.add-target-btn[aria-pressed="true"]{background:var(--text) !important;color:var(--ink) !important}
.bo3-badge{background:transparent !important;border:1px solid var(--good) !important;color:var(--good) !important}
.deck-side .stat-box,.deck-side .meta-box,.deck-side [class*="-box"]{border-radius:var(--radius) !important}


/* inputs without a type attribute still get the system field */
input:not([type]),input[type=email],input[type=number],input[type=url]{border-radius:var(--radius) !important;background-color:var(--bg) !important;border-color:var(--line-2) !important;color:var(--text)}

/* ============ PROFILE ============ */
.profile-section,.upload-card,.stat-card-profile{border-radius:var(--radius) !important;background:var(--surface) !important;border:1px solid var(--line) !important;box-shadow:none !important}
.upload-card{background:var(--bg) !important;border-style:dashed !important;border-color:var(--line-2) !important}
.profile-section h2,.profile-section h3,.profile-section-title{font-family:var(--font-display);text-transform:uppercase;letter-spacing:.03em}
.btn-primary{border-radius:var(--radius) !important;background:var(--chip-yellow) !important;border:1px solid var(--chip-yellow) !important;color:var(--ink) !important;box-shadow:none !important;
  font-family:var(--font-display);font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.btn-primary:not(:disabled):hover{background:#ffd633 !important}
.btn-secondary{border-radius:var(--radius) !important;background:transparent !important;border:1px solid var(--line-2) !important;color:var(--text) !important;box-shadow:none !important;
  font-family:var(--font-display);font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.btn-secondary:not(:disabled):hover{border-color:var(--line-3) !important}
.system-choice-card{border-radius:var(--radius) !important;box-shadow:none !important;background:var(--bg) !important;border-color:var(--line) !important}
.system-choice-img,.upload-preview{border-radius:var(--radius) !important}
.profile-tab-clean,.match-tab-profile{border-radius:var(--radius) !important}
.profile-tab-clean.active,.profile-tab-clean[aria-selected="true"],.match-tab-profile.active{background:var(--chip-blue) !important;color:#fff !important}
.profile-trigger-zero{border-radius:var(--radius) !important}
.system-choice-card:has(input:checked){border-color:var(--chip-yellow) !important;box-shadow:inset 0 0 0 1px var(--chip-yellow) !important}
.system-choice-card:hover{border-color:var(--line-3) !important}

/* ============ DECKLISTS ============ */
.hero h1{font-family:var(--font-display) !important;text-transform:uppercase;font-weight:700 !important;letter-spacing:.01em !important}
.search,.search input{border-radius:var(--radius) !important}
.search input{background:var(--bg) !important;border-color:var(--line-2) !important}
.chip{border-radius:var(--radius) !important;background:transparent !important;border:1px solid var(--line-2) !important;color:var(--muted) !important;box-shadow:none !important}
.chip:hover{border-color:var(--line-3) !important;color:var(--text) !important}
.chip.active{background:var(--text) !important;border-color:var(--text) !important;color:var(--ink) !important}
.chip .dot{border-radius:0 !important}
.deck-card{border-radius:var(--radius) !important;background:var(--surface) !important;border:1px solid var(--line) !important;box-shadow:none !important}
.deck-card:hover{border-color:var(--line-3) !important;transform:none !important;box-shadow:none !important}
.deck-cover{border-radius:0 !important}
.deck-cover .count,.deck-cover .likes,.deck-cover [class*="like"]{border-radius:var(--radius) !important;font-family:var(--font-mono);font-size:11px !important}
.deck-card .deck-name{font-family:var(--font-display);font-size:19px !important;font-weight:700 !important;text-transform:uppercase;letter-spacing:.02em}
/* colour pair label: the words carry the colours; a neutral chip keeps "White" readable */
.clabel{background:transparent !important;border:1px solid var(--line-2) !important;color:var(--text) !important;border-radius:var(--radius) !important;text-shadow:none !important}
.pill{border-radius:var(--radius) !important;background:transparent !important;border:1px solid var(--line-2) !important;color:var(--muted) !important}
.btn.like{border-radius:var(--radius) !important}
.profile-dropdown-zero{border-radius:var(--radius) !important;background:var(--surface) !important;border:1px solid var(--line-2) !important;box-shadow:0 12px 28px rgba(0,0,0,.4) !important}

/* lobby lower sections */
.br-section .br-strip{background:var(--surface) !important;border-color:var(--line) !important;border-radius:var(--radius) !important}
.br-strip select,.br-strip input{border-radius:var(--radius) !important}

/* ---- finish-review fixes ---- */
.break-card{border-radius:var(--radius) !important;background:var(--bg) !important;border:1px solid var(--line) !important;box-shadow:none !important}
.break-card h3{font-family:var(--font-display);font-size:15px;text-transform:uppercase;letter-spacing:.04em}
.deck-visual-grid > .empty{grid-column:1 / -1;white-space:nowrap}
/* range blocks: the Min/Max words floated mid-track; the block title already names the range */
.dual-range label{font-size:0 !important}
/* field labels in the body face (mono stays for part codes and data) */
.lobby-page .fl label,.lobby-page .fl-row label,.release-copy b{font-family:var(--font-body) !important;font-size:12px !important;font-weight:700 !important;letter-spacing:.06em !important}
.range-title,.stat span{font-family:var(--font-body) !important}
/* one authored motion moment: the step rail; section entrances render in place */
body.reveal-ready .reveal{opacity:1 !important;transform:none !important;transition:none !important}
@media (max-width:420px){.brand-name > span,.brand span:not(.brand-name){display:none !important}.brand b{white-space:nowrap}}
/* Live Matches / Waiting Rooms on phones: each room is one compact card —
   cells flow and wrap on a line, the Spectate/Join button stays pinned right,
   inside the screen. min-width:0 undoes .room-table's 760px desktop minimum
   (gundam.css), which kept the table 760px wide and pushed the button off-screen.
   Leaderboards (.lb-table) are excluded: they keep their own compact columns
   (index.php container queries) — stacking them made every row ~145px tall. */
@media (max-width:760px){
  .room-table:not(.lb-table){min-width:0 !important;width:100% !important}
  .room-table:not(.lb-table) thead{display:none}
  .room-table:not(.lb-table),.room-table:not(.lb-table) tbody{display:block}
  .room-table:not(.lb-table) tr{display:flex;flex-wrap:wrap;align-items:center;column-gap:10px;row-gap:2px;position:relative;
    padding:8px 100px 8px 12px;border-bottom:1px solid var(--line)}
  .room-table:not(.lb-table) td{display:block;width:auto !important;min-width:0;border:0 !important;padding:0 !important;white-space:normal !important}
  .room-table:not(.lb-table) td:nth-child(n+4):not(:last-child){font-size:11.5px;color:var(--muted)}
  .room-table:not(.lb-table) td:last-child{position:absolute;right:10px;top:50%;transform:translateY(-50%)}
  .room-table:not(.lb-table) tr:has(td[colspan]){padding-right:12px}
  .room-table:not(.lb-table) td[colspan]{position:static;transform:none;width:100% !important;text-align:left}
}
.custom-track img{border-radius:var(--radius) !important}
.support-link::after{content:"" !important;display:inline-block;width:10px;height:10px;margin-left:5px;opacity:.75 !important;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M7 17 17 7M8 7h9v9'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M7 17 17 7M8 7h9v9'/%3E%3C/svg%3E") center/contain no-repeat}

/* ---- one site header language on every page ---- */
.nx-brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--text)}
.nx-brand .brand-logo{width:34px;height:34px;object-fit:cover;border:1px solid var(--line-2);border-radius:var(--radius)}
.nx-brand .brand-name b{display:block;font-family:var(--font-display);font-size:19px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;line-height:1.05}
.nx-brand .brand-name h1{margin:0 !important;font-family:var(--font-body) !important;font-size:11px !important;font-weight:600 !important;
  color:var(--muted);letter-spacing:.12em !important;text-transform:uppercase}
.deck-top{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.nx-inline-nav{display:flex;gap:4px}
.nx-inline-nav a{text-decoration:none}
#deUpdateDeckBtn{background:var(--chip-blue) !important;border-color:var(--chip-blue) !important;color:#fff !important}
.top-right [data-lang-picker]{display:inline-flex}
.nx-404-top{position:fixed;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 22px;
  border-bottom:1px solid #343a42;background:#16181c}
.nx-404-brand{display:flex;align-items:center;gap:10px;color:#e9eaec;text-decoration:none;font-family:'Barlow Condensed',system-ui,sans-serif;
  font-size:19px;text-transform:uppercase;letter-spacing:.04em}
.nx-404-brand img{border:1px solid #4a525c;border-radius:2px}
@media (max-width:420px){
  .topbar-inner{gap:8px !important;padding:10px 12px !important}
  .brand{gap:8px !important}
  .brand b{font-size:16px !important}
  .nx-lang{padding:4px 8px}
}
.mp-tab{border-radius:var(--radius) !important;background:transparent !important;border:1px solid var(--line-2) !important;box-shadow:none !important}
.mp-tab.is-active{background:var(--chip-blue) !important;border-color:var(--chip-blue) !important;color:#fff !important}
.patch-tab{border-radius:var(--radius) !important;box-shadow:none !important}
.patch-tab.patch-tab-active{background:var(--chip-yellow) !important;border-color:var(--chip-yellow) !important;color:var(--ink) !important}
.patch-version-pill,.patch-latest-pill{border-radius:var(--radius) !important}
.nx-404-nav{display:flex;gap:18px;margin-left:auto;margin-right:12px}
.nx-404-nav a{color:#a6b0bb;text-decoration:none;font-family:'Barlow Condensed',system-ui,sans-serif;font-size:16px;font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.nx-404-nav a:hover{color:#e9eaec}
@media (max-width:520px){.nx-404-nav{gap:10px}.nx-404-nav a{font-size:14px}.nx-404-brand b{display:none}}
.lang-pick-label{display:inline-block;flex:none}

/* step 2 mode tabs: six modes (Quick, Ranked, VS AI, Custom, Battle Royale, Team) in a 3-col grid */
.lobby-page .play .tabs{display:grid !important;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px !important;background:var(--line-2) !important;border:1px solid var(--line-2) !important}
.lobby-page .play .tab{border-right:0 !important;background:var(--bg) !important;min-height:40px}
.lobby-page .play .tab.active{background:var(--chip-blue) !important}
.lobby-page .pane .br-strip{margin-top:14px !important;background:transparent !important;border:1px solid var(--line) !important;border-radius:var(--radius) !important;padding:12px !important;gap:8px !important}
.lobby-page .pane .br-strip .br-title{width:100%;font-family:var(--font-body);font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.lobby-page .pane .br-strip .br-title small{background:transparent !important;border-radius:var(--radius) !important;border:1px solid var(--line-2)}
.lobby-page .pane .br-spacer{display:none}
.lobby-page .pane .br-strip select,.lobby-page .pane .br-strip input{border-radius:var(--radius) !important}
.lobby-page .pane .wait{margin-top:12px}
.br-update-note{border-radius:var(--radius) !important;background:transparent !important;border:1px solid var(--line) !important;margin-top:12px}
.deck-mydecks-btn{border-radius:var(--radius) !important;background:transparent !important;border:1px solid var(--line-2) !important;color:var(--text) !important;box-shadow:none !important}
