/* =========================================================
   EXO 100X Rust — stylesheet
   ========================================================= */

:root {
  --void: #08090C;
  --slab: #0E1014;
  --slab-2: #14171D;
  --slab-3: #1C2028;
  --edge: #2A2D32;
  --edge-soft: rgba(243,106,33,.08);

  /* EXO orange brand palette. Variable names stay stable for compatibility. */
  --red: #F36A21;
  --red-hi: #FF9A45;
  --red-deep: #A83A12;
  --red-dim: rgba(243,106,33,.12);
  --gold:      #E8B93C;
  --gold-dim:  rgba(232,185,60,.12);
  --live:      #3ECF7C;
  --busy:      #E8873C;

  --text:      #EDF7FC;
  --text-2:    #9CB2C1;
  --muted:     #667F91;

  --r:         6px;
  --r-lg:      10px;
  --shell:     1240px;
  --gut:       clamp(18px,4vw,44px);
  --ff:        "Archivo", system-ui, -apple-system, "Segoe UI", sans-serif;
  --ff-cond:   "Barlow Condensed", "Arial Narrow", sans-serif;
  --ff-mono:   "IBM Plex Mono", ui-monospace, Menlo, monospace;
}

*,*::before,*::after { box-sizing: border-box; }
html { background: var(--void); -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--void); color: var(--text);
  font-family: var(--ff); font-size: 15.5px; line-height: 1.6;
  font-variant-numeric: tabular-nums; -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--red-hi); outline-offset: 2px; border-radius: 2px; }
.skip { position: absolute; left: -9999px; z-index: 200; background: var(--gold); color: var(--void); padding: 10px 16px; font-weight: 700; }
.skip:focus { left: 8px; top: 8px; }

h1,h2,h3 { font-family: var(--ff); font-weight: 800; line-height: 1.05; letter-spacing: -.022em; margin: 0; }
h1 { font-size: clamp(2.3rem,4.6vw,3.5rem); }
h2 { font-size: clamp(1.8rem,3.4vw,2.6rem); }
h3 { font-size: 1.06rem; font-weight: 700; letter-spacing: -.01em; }
.dot { color: var(--red); }
.mb-lg { margin-bottom: 34px; }
.num { font-variant-numeric: tabular-nums; }
.muted { color: var(--muted); }
.sub-head { font-size: .72rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; color: var(--muted); margin: 0 0 16px; }
.field-label { display: block; font-size: .68rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; color: var(--muted); }

/* ---------- layout ---------- */
main { min-height: 60vh; }
.section { max-width: var(--shell); margin: 0 auto; padding: clamp(46px,6.5vw,84px) var(--gut); }
.section.band { max-width: none; background: var(--slab); border-block: 1px solid var(--edge); }
.section.band > * { max-width: var(--shell); margin-inline: auto; }
.split { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.45fr); gap: clamp(28px,5vw,56px); }

/* ---------- kicker ---------- */
.kicker-row { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; flex-wrap: wrap; }
.kicker-pill {
  display: inline-block; padding: 4px 11px; border: 1px solid rgba(243,106,33,.45);
  border-radius: 4px; color: var(--red-hi);
  font-size: .68rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase;
}
.kicker-label { display: inline-flex; align-items: center; gap: 8px; font-size: .74rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; color: var(--muted); }
.dot-live { width: 7px; height: 7px; border-radius: 50%; background: var(--live); box-shadow: 0 0 0 0 rgba(62,207,124,.55); animation: pulse 2.4s ease-out infinite; flex-shrink: 0; }
@keyframes pulse { 70% { box-shadow: 0 0 0 8px rgba(62,207,124,0); } 100% { box-shadow: 0 0 0 0 rgba(62,207,124,0); } }

.section-lead { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap; margin-bottom: 34px; }
.lead-link { display: inline-flex; align-items: center; gap: 8px; color: var(--red-hi); font-size: .78rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.lead-link svg { width: 16px; height: 16px; transition: transform .15s; }
.lead-link:hover svg { transform: translateX(3px); }

/* ---------- topbar ---------- */
.topbar { position: sticky; top: 0; z-index: 80; background: rgba(3,8,18,.94); backdrop-filter: blur(14px); border-bottom: 1px solid var(--edge); }
.topbar-in { max-width: var(--shell); margin: 0 auto; padding: 0 var(--gut); height: 62px; display: flex; align-items: center; gap: 26px; }
.brand { margin-right: auto; }
.brand-mark { font-family: var(--ff-cond); font-size: 1.85rem; font-weight: 900; letter-spacing: .01em; font-style: italic; background: linear-gradient(90deg,#F4FBFF 0%,#FF8A32 58%,#D94D13 100%); -webkit-background-clip:text; background-clip:text; color:transparent; }
.topbar nav { display: flex; gap: 4px; }
.topbar nav a {
  padding: 7px 12px; border-radius: 4px;
  font-size: .78rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase;
  color: var(--text-2); transition: color .15s, background .15s;
}
.topbar nav a:hover { color: var(--text); background: var(--slab-2); }
.topbar nav a.is-active { color: var(--red-hi); }
.topbar nav a.nav-store { background: var(--gold-dim); color: var(--gold); }
.topbar nav a.nav-store:hover { background: rgba(232,185,60,.2); }
.topbar-actions { display: flex; align-items: center; }
.chip { display: flex; align-items: center; gap: 9px; font-size: .85rem; font-weight: 600; }
.chip img { width: 28px; height: 28px; border-radius: 4px; background: var(--slab-2); }
.menu-toggle { display: none; background: none; border: 0; padding: 10px; cursor: pointer; }
.menu-toggle span { display: block; width: 22px; height: 2px; background: var(--text); margin: 4px 0; transition: transform .2s, opacity .2s; }
.menu-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.menu-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* ---------- buttons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 10px 17px; border: 1px solid transparent; border-radius: var(--r);
  font-size: .78rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase;
  cursor: pointer; white-space: nowrap; transition: background .15s, border-color .15s, color .15s;
}
.btn svg { width: 15px; height: 15px; fill: currentColor; flex-shrink: 0; }
.btn svg[fill="none"] { fill: none; }
.btn-lg { padding: 14px 24px; font-size: .84rem; }
.btn-sm { padding: 7px 13px; font-size: .72rem; }
.btn-block { width: 100%; }
.btn-notch { border-radius: 0; clip-path: polygon(0 0, 100% 0, calc(100% - 13px) 100%, 0 100%); padding-right: 30px; }
.btn-primary { background: linear-gradient(135deg,#B84318,var(--red)); color: #00141D; border-color: rgba(255,154,69,.48); box-shadow: 0 8px 28px rgba(11,182,225,.14); }
.btn-primary:hover { background: linear-gradient(135deg,#D95B20,var(--red-hi)); }
.btn-ghost { background: var(--slab-2); border-color: var(--edge); color: var(--text); }
.btn-ghost:hover { border-color: var(--muted); background: var(--slab-3); }
.btn-steam { background: var(--slab-2); border-color: var(--edge); }
.btn-steam:hover { border-color: var(--muted); }
.btn-danger { background: transparent; border-color: rgba(243,106,33,.4); color: var(--red-hi); }
.btn-danger:hover { background: var(--red-dim); }
.btn-connect { background: rgba(8,126,168,.42); border-color: rgba(243,106,33,.32); color: #D9F9FF; }
.btn-connect:hover { background: rgba(8,126,168,.75); border-color: var(--red); color: #fff; }

/* ---------- hero ---------- */
.hero { position: relative; border-bottom: 1px solid var(--edge); overflow: hidden; }
.hero-bg {
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 60% 70% at 72% 42%, rgba(243,106,33,.14), transparent 62%),
    linear-gradient(100deg, var(--void) 0%, var(--void) 40%, #16110F 74%, #241713 100%);
}
.hero-bg::after {
  content: ""; position: absolute; inset: 0; opacity: .5;
  background-image: linear-gradient(rgba(255,255,255,.016) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.016) 1px, transparent 1px);
  background-size: 54px 54px;
}
.hero-in { position: relative; max-width: var(--shell); margin: 0 auto; padding: clamp(64px,10vw,132px) var(--gut) clamp(56px,8vw,104px); }
.hero-live { display: inline-flex; align-items: center; gap: 10px; margin: 0 0 26px; font-size: .92rem; color: var(--text-2); }
.hero-live b { color: var(--text); font-weight: 800; }
.pulse { width: 8px; height: 8px; border-radius: 50%; background: var(--live); box-shadow: 0 0 0 0 rgba(62,207,124,.6); animation: pulse 2.4s ease-out infinite; }
.hero-title {
  font-family: var(--ff-cond); font-weight: 900; text-transform: uppercase;
  font-size: clamp(3.4rem,10.5vw,8rem); line-height: .88; letter-spacing: -.015em;
  margin: 0 0 34px;
}
.hero-title .accent { color: var(--red); }
.hero-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.hero-strip { position: relative; border-top: 1px solid var(--edge); background: rgba(3,8,18,.72); }
.hero-strip-in {
  max-width: var(--shell); margin: 0 auto; padding: 16px var(--gut);
  display: flex; align-items: center; justify-content: space-between; gap: 22px; flex-wrap: wrap;
}
.strip-label { font-size: .68rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.strip-stats { display: flex; gap: clamp(18px,3vw,40px); flex-wrap: wrap; }
.strip-stats div { display: flex; align-items: baseline; gap: 7px; }
.strip-stats b { font-size: 1.02rem; font-weight: 800; }
.strip-stats span { font-size: .68rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }

/* ---------- page head ---------- */
.page-head { max-width: var(--shell); margin: 0 auto; padding: clamp(40px,5.5vw,66px) var(--gut) 0; }
.page-head.is-center { text-align: center; }
.page-head.is-center .kicker-row { justify-content: center; }
.page-head p { color: var(--text-2); max-width: 62ch; margin: 14px 0 0; }
.page-head.is-center p { margin-inline: auto; }

/* ---------- server board ---------- */
.board-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 26px; flex-wrap: wrap; margin-bottom: 30px; }
.board-head.compact { align-items: center; margin-bottom: 24px; }
.board-head-right { display: flex; align-items: center; gap: 26px; flex-wrap: wrap; }
.board-counts { display: flex; gap: 26px; }
.board-counts div { display: flex; flex-direction: column; }
.board-counts b { font-size: 1.75rem; font-weight: 800; line-height: 1; }
.board-counts span { font-size: .66rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); margin-top: 5px; }

.forcewipe-box {
  display: flex; align-items: center; gap: 12px;
  background: var(--gold-dim); border: 1px solid rgba(232,185,60,.3);
  border-radius: var(--r); padding: 9px 13px;
}
.fw-icon { display: flex; }
.fw-icon svg { width: 17px; height: 17px; fill: var(--gold); }
.forcewipe-box > div { display: flex; flex-direction: column; }
.fw-label { font-size: .64rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; color: var(--gold); }
.fw-date { font-size: .84rem; font-weight: 600; color: var(--text); white-space: nowrap; }

.region-group { margin-bottom: 30px; }
.region-head { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.region-code {
  font-family: var(--ff-mono); font-size: .68rem; font-weight: 500;
  background: var(--slab-3); border: 1px solid var(--edge); color: var(--text-2);
  padding: 3px 7px; border-radius: 3px;
}
.region-name { font-size: .78rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.region-count { font-size: .7rem; font-weight: 700; background: var(--slab-3); color: var(--muted); padding: 2px 8px; border-radius: 100px; }
.region-total { margin-left: auto; font-size: .7rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.region-head.plain { margin-bottom: 16px; }

.srow-list { border: 1px solid var(--edge); border-radius: var(--r-lg); overflow: hidden; background: var(--slab); }
.srow {
  display: grid;
  grid-template-columns: 12px minmax(0,1.5fr) minmax(0,1.5fr) auto auto;
  align-items: center; gap: 18px;
  padding: 15px 20px; border-bottom: 1px solid var(--edge-soft);
  transition: background .15s;
}
.srow:last-child { border-bottom: 0; }
.srow:hover { background: var(--slab-2); }
.srow-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--muted); }
.dot-online { background: var(--live); }
.dot-busy { background: var(--busy); }
.dot-wiping { background: var(--gold); }
.dot-offline { background: var(--red); }
.srow-name { display: flex; align-items: center; gap: 10px; min-width: 0; flex-wrap: wrap; }
.srow-name > a { font-size: 1rem; font-weight: 700; letter-spacing: -.01em; }
.srow-name > a:hover { color: var(--red-hi); }
.srow-tags { display: flex; gap: 5px; flex-wrap: wrap; }
.srow-tags em, .wipe-card-tags em {
  font-style: normal; font-size: .64rem; font-weight: 700; letter-spacing: .04em;
  background: var(--slab-3); color: var(--muted); padding: 3px 7px; border-radius: 3px; white-space: nowrap;
}
.wipe-card-tags .tag-region { background: rgba(70,110,200,.16); color: #8FB0EE; }
.srow-wipe { display: flex; align-items: center; gap: 8px; font-size: .84rem; color: var(--text-2); min-width: 0; }
.srow-wipe svg { width: 14px; height: 14px; fill: var(--muted); flex-shrink: 0; }
.srow-wipe-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.srow-wipe.is-soon { color: var(--gold); }
.srow-wipe.is-soon svg { fill: var(--gold); }
.cd-pill {
  font-family: var(--ff-mono); font-size: .74rem; font-weight: 500;
  background: var(--slab-3); border: 1px solid var(--edge); color: var(--text-2);
  padding: 3px 8px; border-radius: 4px; white-space: nowrap;
}
.cd-pill.is-soon, .cd-pill.is-amber { background: var(--gold-dim); border-color: rgba(232,185,60,.32); color: var(--gold); }
.srow-pop { display: flex; align-items: center; gap: 12px; justify-content: flex-end; }
.mini-bar { display: block; width: 62px; height: 4px; background: var(--slab-3); border-radius: 100px; overflow: hidden; flex-shrink: 0; }
.mini-bar i { display: block; height: 100%; background: linear-gradient(90deg, var(--red), var(--busy)); border-radius: 100px; }
.mini-bar.lg { width: 100%; height: 6px; margin: 10px 0 4px; }
.srow-count { font-family: var(--ff-mono); font-size: .82rem; color: var(--muted); white-space: nowrap; }
.srow-count b { color: var(--text); font-weight: 600; }

/* ---------- feature grid ---------- */
.feature-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(280px,1fr)); gap: 16px; }
.feature { background: var(--slab); border: 1px solid var(--edge); border-radius: var(--r-lg); padding: 24px; }
.feature-num { display: block; font-family: var(--ff-mono); font-size: .8rem; color: var(--muted); margin-bottom: 14px; }
.feature h3 { margin-bottom: 8px; }
.feature p { color: var(--muted); font-size: .89rem; margin: 0; }

/* ---------- social rows ---------- */
.social-rows { display: flex; flex-direction: column; gap: 10px; }
.social-row {
  display: flex; align-items: center; gap: 16px;
  background: var(--slab); border: 1px solid var(--edge); border-radius: var(--r-lg);
  padding: 15px 20px; transition: border-color .15s, background .15s;
}
.social-row:hover { border-color: var(--slab-3); background: var(--slab-2); }
.social-tile { width: 42px; height: 42px; border-radius: 9px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.social-tile svg { width: 20px; height: 20px; fill: #fff; }
.brand-discord { background: #5865F2; }
.brand-youtube { background: #FF0033; }
.brand-tiktok  { background: #111; border: 1px solid var(--edge); }
.brand-x       { background: #111; border: 1px solid var(--edge); }
.social-text { display: flex; flex-direction: column; }
.social-text b { font-size: 1rem; font-weight: 700; }
.social-text em { font-style: normal; font-size: .84rem; color: var(--muted); }
.social-arrow { margin-left: auto; }
.social-arrow svg { width: 18px; height: 18px; stroke: var(--muted); }
.social-row:hover .social-arrow svg { stroke: var(--text); }

/* ---------- ready band ---------- */
.ready-band { text-align: center; padding: clamp(56px,9vw,110px) var(--gut); border-top: 1px solid var(--edge); background: radial-gradient(ellipse 60% 120% at 50% 0%, rgba(243,106,33,.07), transparent 70%); }
.ready-title { font-family: var(--ff-cond); font-weight: 900; text-transform: uppercase; font-size: clamp(3.4rem,11vw,8.5rem); line-height: .9; margin-bottom: 34px; }
.ready-actions { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; }

/* ---------- wipe schedule ---------- */
.fw-banner {
  display: flex; align-items: center; justify-content: space-between; gap: 32px; flex-wrap: wrap;
  background: linear-gradient(115deg, rgba(8,126,168,.4) 0%, rgba(40,14,17,.5) 55%, var(--slab) 100%);
  border: 1px solid rgba(243,106,33,.28); border-radius: var(--r-lg);
  padding: clamp(24px,3.6vw,38px); margin-bottom: 32px;
}
.fw-banner h2 { margin: 14px 0 10px; font-size: clamp(1.5rem,3vw,2.1rem); }
.fw-banner p { color: var(--text-2); margin: 0; max-width: 52ch; font-size: .92rem; }
.fw-clock { display: flex; align-items: flex-start; gap: 8px; }
.fw-clock > div { display: flex; flex-direction: column; align-items: center; min-width: 58px; }
.fw-clock b { font-size: clamp(2rem,4.4vw,3.1rem); font-weight: 800; line-height: 1; font-variant-numeric: tabular-nums; }
.fw-clock span { font-size: .62rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); margin-top: 8px; }
.fw-clock i { font-style: normal; font-size: clamp(1.4rem,3vw,2.2rem); color: var(--red); line-height: 1.1; }

.wipe-region { margin-bottom: 34px; }
.wipe-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(300px,1fr)); gap: 16px; }
.wipe-card { display: flex; flex-direction: column; background: var(--slab); border: 1px solid var(--edge); border-radius: var(--r-lg); padding: 20px; }
.wipe-card.is-today { border-color: rgba(243,106,33,.5); box-shadow: inset 3px 0 0 var(--red); }
.wipe-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.wipe-card-head h3 a:hover { color: var(--red-hi); }
.badge-today {
  display: inline-flex; align-items: center; gap: 6px; white-space: nowrap;
  background: var(--red-dim); border: 1px solid rgba(243,106,33,.35); color: var(--red-hi);
  font-size: .64rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase;
  padding: 3px 9px; border-radius: 100px;
}
.badge-today i { width: 5px; height: 5px; border-radius: 50%; background: currentColor; }
.wipe-card-tags { display: flex; gap: 5px; flex-wrap: wrap; margin: 10px 0 0; }
.wipe-card-body { padding: 18px 0; margin-top: 14px; border-top: 1px solid var(--edge-soft); flex: 1; }
.wipe-when { font-size: 1.02rem; font-weight: 700; margin: 7px 0 10px; }
.wipe-big { font-family: var(--ff); font-size: clamp(1.5rem,2.6vw,1.95rem); font-weight: 800; margin: 0; letter-spacing: -.02em; }
.wipe-big.is-today { color: var(--red-hi); }
.wipe-big.is-muted { color: var(--muted); }
.wipe-card-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 0; border-top: 1px solid var(--edge-soft); flex-wrap: wrap; }
.cadence { display: inline-flex; align-items: center; gap: 6px; background: var(--slab-3); padding: 4px 10px; border-radius: 4px; font-size: .66rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--text-2); }
.cadence svg { width: 13px; height: 13px; fill: var(--muted); }
.cadence-detail { font-size: .76rem; color: var(--muted); }

.info-cards { display: grid; grid-template-columns: repeat(auto-fit,minmax(270px,1fr)); gap: 16px; margin-top: 34px; }
.info-card { display: flex; gap: 14px; background: var(--slab); border: 1px solid var(--edge); border-radius: var(--r-lg); padding: 20px; }
.info-icon { width: 36px; height: 36px; border-radius: 8px; background: var(--red-dim); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.info-icon svg { width: 17px; height: 17px; fill: var(--red-hi); }
.info-card b { display: block; margin-bottom: 5px; font-size: .96rem; }
.info-card p { margin: 0; color: var(--muted); font-size: .85rem; }

/* ---------- filters / pills ---------- */
.filter-row { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 28px; }
.filter {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--slab); border: 1px solid var(--edge); padding: 8px 15px; border-radius: 100px;
  font-size: .8rem; font-weight: 700; color: var(--text-2); cursor: pointer; transition: all .15s;
}
.filter em { font-style: normal; font-size: .68rem; background: var(--slab-3); color: var(--muted); padding: 1px 7px; border-radius: 100px; }
.filter:hover { border-color: var(--muted); color: var(--text); }
.filter.is-active { background: var(--red-dim); border-color: rgba(243,106,33,.45); color: var(--red-hi); }
.filter.is-active em { background: rgba(243,106,33,.2); color: var(--red-hi); }
.pill-row { display: flex; flex-wrap: wrap; gap: 6px; }
.pill { padding: 6px 13px; border-radius: 100px; font-size: .78rem; font-weight: 700; color: var(--text-2); border: 1px solid var(--edge); background: var(--slab); transition: all .15s; }
.pill:hover { border-color: var(--muted); color: var(--text); }
.pill.is-active { background: var(--red); border-color: var(--red); color: #fff; }
.filter-item.is-hidden { display: none; }

/* ---------- leaderboard chrome ---------- */
.lb-title { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.lb-meta { font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.lb-meta span { color: var(--text); font-size: 1.15rem; font-weight: 800; }
.mode-tabs { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; border: 1px solid var(--edge); border-radius: var(--r-lg); overflow: hidden; background: var(--slab); margin-bottom: 16px; }
.mode-tab { padding: 15px 18px; text-align: center; border-right: 1px solid var(--edge); border-top: 2px solid transparent; transition: background .15s; }
.mode-tab:last-child { border-right: 0; }
.mode-tab:hover { background: var(--slab-2); }
.mode-tab.is-active { background: rgba(8,126,168,.24); border-top-color: var(--red); }
.mode-tab b { display: block; font-size: .92rem; font-weight: 700; }
.mode-tab em { font-style: normal; font-size: .72rem; color: var(--muted); }
.mode-tab.is-active b { color: var(--text); }

.season-bar { display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; background: var(--slab); border: 1px solid var(--edge); border-radius: var(--r-lg); padding: 13px 20px; margin-bottom: 16px; }
.season-left { display: flex; align-items: center; gap: 11px; flex-wrap: wrap; }
.season-left b { font-size: .96rem; font-weight: 700; }
.pill-live { font-size: .62rem; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; background: rgba(62,207,124,.13); color: var(--live); padding: 3px 9px; border-radius: 100px; }
.season-switch { font-size: .78rem; color: var(--muted); border-bottom: 1px solid transparent; }
.season-switch:hover { color: var(--red-hi); border-bottom-color: currentColor; }
.season-right { display: flex; align-items: center; gap: 10px; font-size: .68rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.cd-inline { font-family: var(--ff-mono); font-size: .84rem; letter-spacing: 0; text-transform: none; color: var(--gold); }

.lb-controls { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 20px; }
.search-box { position: relative; flex: 1 1 260px; display: flex; align-items: center; }
.search-icon { position: absolute; left: 13px; display: flex; pointer-events: none; }
.search-icon svg { width: 15px; height: 15px; fill: var(--muted); }
.search-box input { width: 100%; padding-left: 38px !important; }
.no-results { text-align: center; color: var(--muted); padding: 26px; }

/* ---------- stat strip ---------- */
.stat-strip { display: grid; grid-template-columns: repeat(auto-fit,minmax(140px,1fr)); gap: 1px; background: var(--edge); border: 1px solid var(--edge); border-radius: var(--r-lg); overflow: hidden; margin-bottom: 22px; }
.stat-strip > div { background: var(--slab); padding: 19px; }
.stat-strip.inset > div { background: var(--slab-2); }
.stat-strip b { display: block; font-size: 1.85rem; font-weight: 800; line-height: 1; }
.stat-strip span { display: block; font-size: .68rem; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; color: var(--muted); margin-top: 7px; }

/* ---------- tables ---------- */
.table-wrap { border: 1px solid var(--edge); border-radius: var(--r-lg); overflow-x: auto; background: var(--slab); }
.data-table { width: 100%; border-collapse: collapse; font-size: .88rem; min-width: 680px; }
.data-table th {
  text-align: left; padding: 12px 16px;
  font-size: .66rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase;
  color: var(--muted); background: var(--slab-2); border-bottom: 1px solid var(--edge); white-space: nowrap;
}
.data-table th.is-sorted { color: var(--red-hi); }
.data-table td { padding: 11px 16px; border-bottom: 1px solid var(--edge-soft); }
.data-table tr:last-child td { border-bottom: 0; }
.data-table tbody tr:hover { background: var(--slab-2); }
.data-table .num, .data-table th.num { text-align: right; }
.data-table td.is-sorted { font-weight: 800; color: var(--text); }
.c-rank { width: 58px; }
.rank-num { font-family: var(--ff-mono); font-size: .92rem; font-weight: 500; color: var(--muted); }
.rank-1 { color: var(--gold); font-weight: 700; }
.rank-2 { color: #C7CEDB; font-weight: 700; }
.rank-3 { color: #C2743F; font-weight: 700; }
.player-cell { display: flex; align-items: center; gap: 11px; min-width: 0; }
.player-cell img { width: 32px; height: 32px; border-radius: 4px; background: var(--slab-3); flex-shrink: 0; }
.player-meta { display: flex; flex-direction: column; min-width: 0; }
.player-meta b { font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.player-meta code { font-family: var(--ff-mono); font-size: .68rem; color: var(--muted); }
.player-cell:hover .player-meta b { color: var(--red-hi); }
.vip { font-style: normal; font-size: .62rem; font-weight: 800; padding: 2px 7px; border-radius: 100px; background: var(--gold-dim); color: var(--gold); flex-shrink: 0; }
.empty { text-align: center; color: var(--muted); padding: 34px 16px; }
.empty-block { color: var(--muted); background: var(--slab); border: 1px dashed var(--edge); border-radius: var(--r-lg); padding: 36px; text-align: center; grid-column: 1/-1; margin: 0; }

/* ---------- products ---------- */
.product-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(272px,1fr)); gap: 16px; }
.product-card { display: flex; flex-direction: column; background: var(--slab); border: 1px solid var(--edge); border-radius: var(--r-lg); overflow: hidden; transition: border-color .15s; }
.product-card:hover { border-color: var(--slab-3); }
.product-face { position: relative; aspect-ratio: 16/8; display: flex; align-items: center; justify-content: center; background: radial-gradient(circle at 50% 125%, rgba(243,106,33,.3), transparent 66%), var(--slab-2); border-bottom: 1px solid var(--edge); }
.product-symbol { font-family: var(--ff-cond); font-size: 2.5rem; font-weight: 900; font-style: italic; color: rgba(242,244,247,.24); }
.product-badge { position: absolute; top: 11px; right: 11px; font-size: .62rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; background: var(--gold); color: var(--void); padding: 3px 9px; border-radius: 100px; }
.product-body { padding: 18px; display: flex; flex-direction: column; flex: 1; }
.product-body h3 { margin: 6px 0 8px; font-size: 1.12rem; }
.product-body p { color: var(--muted); font-size: .86rem; margin: 0 0 18px; flex: 1; }
.product-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.price { font-size: 1.5rem; font-weight: 800; letter-spacing: -.02em; }
.price i { font-style: normal; font-size: .92rem; color: var(--muted); margin-right: 1px; }

/* ---------- panels / server detail ---------- */
.panel { background: var(--slab); border: 1px solid var(--edge); border-radius: var(--r-lg); padding: 22px; margin-bottom: 16px; }
.panel-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(258px,1fr)); gap: 16px; }
.panel-grid .panel { margin-bottom: 0; }
.server-hero { border-bottom: 1px solid var(--edge); background: linear-gradient(180deg, var(--slab) 0%, var(--void) 100%); }
.server-hero-in { max-width: var(--shell); margin: 0 auto; padding: clamp(38px,5.5vw,68px) var(--gut); display: grid; grid-template-columns: minmax(0,1.5fr) minmax(0,1fr); gap: clamp(28px,5vw,56px); align-items: center; }
.server-hero h1 { margin: 13px 0 10px; }
.server-hero > .server-hero-in p { color: var(--text-2); max-width: 50ch; margin: 12px 0 24px; }
.server-hero-meter { background: var(--slab); border: 1px solid var(--edge); border-radius: var(--r-lg); padding: 22px; }
.big-num { display: flex; flex-direction: column; }
.big-num b { font-size: 3.2rem; font-weight: 800; line-height: 1; letter-spacing: -.03em; }
.big-num span { font-size: .84rem; color: var(--muted); margin-top: 5px; }
.meter-wipe { margin-top: 16px; padding: 13px 15px; background: var(--void); border: 1px solid var(--edge); border-radius: var(--r); display: flex; flex-direction: column; gap: 4px; }
.meter-wipe span { font-size: .68rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.meter-wipe b { font-family: var(--ff-mono); font-size: 1.02rem; }
.status { display: inline-flex; align-items: center; gap: 6px; font-size: .68rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; padding: 4px 10px; border-radius: 100px; background: var(--slab-2); color: var(--muted); }
.status i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.status-online { color: var(--live); background: rgba(62,207,124,.1); }
.status-busy { color: var(--busy); background: rgba(232,135,60,.1); }
.status-wiping { color: var(--gold); background: var(--gold-dim); }
.status-offline { color: var(--red-hi); background: var(--red-dim); }
.connect-string { display: inline-block; font-family: var(--ff-mono); font-size: .82rem; background: var(--void); border: 1px solid var(--edge); padding: 7px 11px; border-radius: var(--r); color: var(--text-2); margin-top: 16px; word-break: break-all; }
.spec-list { margin: 0; }
.spec-list > div { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 11px 0; border-bottom: 1px solid var(--edge-soft); }
.spec-list dt { color: var(--muted); font-size: .88rem; }
.spec-list dd { margin: 0; font-weight: 700; }

/* ---------- player / account ---------- */
.player-hero { max-width: var(--shell); margin: 0 auto; padding: clamp(36px,5vw,60px) var(--gut) 0; display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
.avatar-lg { width: 90px; height: 90px; border-radius: var(--r-lg); background: var(--slab-2); border: 1px solid var(--edge); }
.badge-row { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.tag { font-size: .72rem; font-weight: 600; padding: 4px 10px; border-radius: 100px; background: var(--slab-2); border: 1px solid var(--edge); color: var(--text-2); }
.tag-vip { background: var(--gold-dim); border-color: rgba(232,185,60,.35); color: var(--gold); }
.account-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.account-grid .panel { margin-bottom: 0; }
.account-grid .span-2 { grid-column: 1/-1; }
.profile-panel { display: flex; align-items: center; gap: 18px; }
.sign-out { text-align: center; padding: 16px; }
.sign-out a { color: var(--muted); font-size: .88rem; border-bottom: 1px solid transparent; }
.sign-out a:hover { color: var(--red-hi); border-bottom-color: currentColor; }
.signin-box { background: var(--slab); border: 1px solid var(--edge); border-radius: var(--r-lg); padding: 34px; max-width: 480px; }
.signin-box p { color: var(--muted); margin: 0 0 22px; }

/* ---------- forms ---------- */
.admin-form { display: grid; grid-template-columns: repeat(auto-fit,minmax(200px,1fr)); gap: 14px; }
.admin-form label { display: flex; flex-direction: column; gap: 6px; font-size: .78rem; font-weight: 700; color: var(--muted); }
.admin-form .span-2 { grid-column: 1/-1; }
.admin-form .checkbox { flex-direction: row; align-items: center; gap: 9px; }
.admin-form input[type="checkbox"] { width: auto; accent-color: var(--red); }
input[type="text"],input[type="password"],input[type="number"],input[type="search"],input[type="datetime-local"],input:not([type]) {
  width: 100%; background: var(--void); border: 1px solid var(--edge); border-radius: var(--r);
  padding: 10px 13px; color: var(--text); font: inherit; font-size: .9rem;
}
input:focus { border-color: var(--muted); outline: none; box-shadow: 0 0 0 2px var(--red-dim); }
.admin-login { display: flex; justify-content: center; padding-top: clamp(48px,9vw,100px); }
.login-box { width: 100%; max-width: 380px; display: flex; flex-direction: column; gap: 12px; margin-bottom: 0; }
.login-box h1 { font-size: 2rem; }
.login-box label { font-size: .78rem; font-weight: 700; color: var(--muted); }
.form-error { color: var(--red-hi); font-size: .86rem; margin: 0; }
.prose { max-width: 68ch; }
.prose p { color: var(--text-2); margin: 0 0 18px; }

/* ---------- footer ---------- */
.site-footer { border-top: 1px solid var(--edge); background: var(--slab); }
.footer-in { max-width: var(--shell); margin: 0 auto; padding: clamp(38px,5vw,58px) var(--gut); display: grid; grid-template-columns: 2.2fr 1fr 1fr 1fr; gap: 34px; }
.footer-brand p { color: var(--muted); font-size: .87rem; max-width: 42ch; margin: 12px 0 18px; }
.socials { display: flex; gap: 9px; }
.socials a { width: 36px; height: 36px; border-radius: var(--r); display: flex; align-items: center; justify-content: center; background: var(--slab-2); border: 1px solid var(--edge); transition: all .15s; }
.socials svg { width: 16px; height: 16px; fill: var(--text-2); }
.socials a:hover { border-color: var(--muted); background: var(--slab-3); }
.socials a:hover svg { fill: var(--text); }
.footer-col { display: flex; flex-direction: column; gap: 10px; }
.footer-col h2 { font-size: .7rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; color: var(--muted); margin-bottom: 2px; }
.footer-col a { font-size: .89rem; color: var(--text-2); }
.footer-col a:hover { color: var(--red-hi); }
.footer-base { border-top: 1px solid var(--edge); padding: 17px var(--gut); max-width: var(--shell); margin: 0 auto; display: flex; justify-content: space-between; gap: 14px; flex-wrap: wrap; font-size: .8rem; color: var(--muted); }

/* ---------- toast ---------- */
.toast { position: fixed; left: 50%; bottom: 26px; transform: translate(-50%,20px); background: var(--text); color: var(--void); padding: 11px 20px; border-radius: var(--r); font-size: .88rem; font-weight: 700; opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; z-index: 150; max-width: calc(100vw - 32px); }
.toast.is-visible { opacity: 1; transform: translate(-50%,0); }

/* ---------- responsive ---------- */
@media (max-width: 1000px) {
  .srow { grid-template-columns: 12px minmax(0,1fr) auto; row-gap: 12px; align-items: start; }
  .srow-dot { align-self: start; margin-top: 7px; }
  .srow-name { align-items: baseline; }
  .srow-wipe { grid-column: 2/-1; flex-wrap: wrap; }
  .srow-wipe-text { white-space: normal; overflow: visible; }
  .srow-pop { grid-column: 2; justify-content: flex-start; align-self: center; }
  .btn-connect { grid-column: 3; grid-row: 3; align-self: center; }
  .mode-tabs { grid-auto-flow: row; grid-auto-columns: auto; }
  .mode-tab { border-right: 0; border-bottom: 1px solid var(--edge); border-top: 0; border-left: 2px solid transparent; text-align: left; }
  .mode-tab.is-active { border-left-color: var(--red); }
}
@media (max-width: 900px) {
  .server-hero-in, .split { grid-template-columns: 1fr; }
  .footer-in { grid-template-columns: 1fr 1fr; }
  .footer-brand { grid-column: 1/-1; }
  .account-grid { grid-template-columns: 1fr; }
  .board-head, .board-head-right { align-items: flex-start; }
}
@media (max-width: 720px) {
  .menu-toggle { display: block; order: 3; }
  .topbar-in { gap: 12px; height: 58px; }
  .topbar nav { position: absolute; top: 100%; left: 0; right: 0; flex-direction: column; gap: 0; background: var(--slab); border-bottom: 1px solid var(--edge); padding: 8px var(--gut) 16px; display: none; }
  .topbar nav.is-open { display: flex; }
  .topbar nav a { padding: 12px 0; border-bottom: 1px solid var(--edge-soft); border-radius: 0; }
  .chip span { display: none; }
  .footer-in { grid-template-columns: 1fr; }
  .fw-clock > div { min-width: 46px; }
  .board-counts { gap: 18px; }
  .srow { padding: 14px 16px; }
  .btn-notch { clip-path: none; padding-right: 17px; }
}
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}


/* ---------- EXO kits browser ---------- */
.kits-intro {
  max-width: var(--shell); margin: 0 auto; padding: 0 var(--gut) 34px;
  display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 34px; align-items: end;
  border-bottom: 1px solid var(--edge);
}
.kits-intro h2 { font-size: clamp(2rem,4vw,3.6rem); margin: 8px 0 10px; letter-spacing: -.035em; }
.kits-intro p { max-width: 68ch; color: var(--text-2); margin: 0; }
.kits-intro-stat { min-width: 145px; border-left: 1px solid var(--edge); padding-left: 28px; display:flex; flex-direction:column; }
.kits-intro-stat b { font-family: var(--ff-cond); font-size: 3.2rem; line-height: 1; }
.kits-intro-stat span { margin-top: 5px; color: var(--muted); font-size: .76rem; text-transform: uppercase; letter-spacing: .11em; }
.kits-section { padding-top: 44px; }
.kits-rewards-section { border-top: 1px solid var(--edge); background: linear-gradient(180deg,rgba(255,255,255,.012),transparent); }
.kits-heading { display:grid; grid-template-columns:minmax(0,1fr) minmax(260px,.65fr); gap:30px; align-items:end; margin-bottom:24px; }
.kits-heading h2 { margin:9px 0 0; }
.kits-heading>p { color:var(--muted); margin:0; font-size:.9rem; line-height:1.6; }
.kit-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.kit-grid-rewards { grid-template-columns:repeat(3,minmax(0,1fr)); }
.kit-card {
  position:relative; background:var(--slab); border:1px solid var(--edge); border-radius:var(--r-lg);
  overflow:hidden; display:flex; flex-direction:column; min-width:0; transition:transform .18s,border-color .18s,box-shadow .18s;
}
.kit-card:hover { transform:translateY(-4px); border-color:rgba(255,255,255,.2); box-shadow:0 18px 48px rgba(0,0,0,.22); }
.kit-card-art { position:relative; aspect-ratio:1.28/1; overflow:hidden; background:var(--void); border-bottom:1px solid var(--edge); }
.kit-card-art::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 50%,rgba(3,8,18,.66)); pointer-events:none; }
.kit-card-art img { width:100%; height:100%; object-fit:cover; display:block; transform:scale(1.02); }
.kit-tier { position:absolute; top:12px; left:12px; z-index:2; padding:5px 9px; border-radius:100px; font-size:.61rem; font-weight:850; letter-spacing:.09em; text-transform:uppercase; background:rgba(3,8,18,.88); border:1px solid var(--edge); backdrop-filter:blur(8px); }
.kit-gold .kit-tier { color:#f2c957; border-color:rgba(242,201,87,.34); }
.kit-silver .kit-tier { color:#d9e1e8; }
.kit-blue .kit-tier { color:#6fb6ff; border-color:rgba(111,182,255,.3); }
.kit-bronze .kit-tier { color:#e88f52; border-color:rgba(232,143,82,.32); }
.kit-purple .kit-tier { color:#b985ff; border-color:rgba(185,133,255,.3); }
.kit-pink .kit-tier { color:#ff7bc7; border-color:rgba(255,123,199,.3); }
.kit-orange .kit-tier { color:#ff9a45; border-color:rgba(255,154,69,.3); }
.kit-card-body { padding:18px; display:flex; flex-direction:column; flex:1; }
.kit-card-body h3 { margin:6px 0 8px; font-size:1.28rem; }
.kit-card-body>p { color:var(--muted); font-size:.84rem; line-height:1.55; min-height:64px; margin:0 0 14px; }
.kit-highlights { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:16px; }
.kit-highlights span { font-size:.66rem; color:var(--text-2); background:var(--slab-2); border:1px solid var(--edge-soft); border-radius:100px; padding:4px 8px; }
.kit-card-meta { display:grid; grid-template-columns:1fr 1fr; border-top:1px solid var(--edge-soft); border-bottom:1px solid var(--edge-soft); margin:0 0 14px; }
.kit-card-meta>div { padding:10px 0; display:flex; flex-direction:column; gap:2px; }
.kit-card-meta>div+div { border-left:1px solid var(--edge-soft); padding-left:14px; }
.kit-card-meta small { color:var(--muted); font-size:.62rem; text-transform:uppercase; letter-spacing:.1em; }
.kit-card-meta b { font-size:.82rem; }
.kit-view-btn { margin-top:auto; }
.product-kit-link { display:inline-block; margin:-6px 0 14px; color:var(--red-hi); font-size:.75rem; font-weight:750; }
.product-kit-link:hover { text-decoration:underline; }

/* kit detail modal */
body.kit-modal-open { overflow:hidden; }
.kit-modal { position:fixed; inset:0; z-index:300; display:none; align-items:center; justify-content:center; padding:24px; }
.kit-modal.is-open { display:flex; }
.kit-modal-backdrop { position:absolute; inset:0; background:rgba(0,0,0,.82); backdrop-filter:blur(9px); }
.kit-dialog {
  position:relative; z-index:1; width:min(1320px,96vw); max-height:min(900px,92vh);
  display:grid; grid-template-columns:minmax(300px,.72fr) minmax(500px,1.28fr);
  background:#0b0e12; border:1px solid rgba(255,255,255,.14); border-top:2px solid var(--red);
  box-shadow:0 34px 100px rgba(0,0,0,.6); overflow:auto;
}
.kit-close { position:absolute; right:15px; top:10px; z-index:5; width:42px; height:42px; border:0; background:transparent; color:var(--red-hi); font-family:var(--ff-cond); font-size:2.6rem; font-weight:900; line-height:1; cursor:pointer; }
.kit-dialog-copy { padding:34px; border-right:1px solid var(--edge); display:flex; flex-direction:column; min-width:0; }
.kit-dialog-head { display:grid; grid-template-columns:116px 1fr; gap:20px; align-items:center; padding-right:35px; }
.kit-dialog-art { width:116px; height:116px; object-fit:cover; border:1px solid var(--edge); border-radius:var(--r); }
.kit-dialog-head h2 { font-size:clamp(2.2rem,4vw,4rem); line-height:.94; margin:7px 0 9px; }
.kit-dialog-head p { color:var(--muted); font-size:.88rem; line-height:1.55; margin:0; }
.kit-dialog-stats { display:grid; grid-template-columns:1fr 1fr; margin:28px 0; border:1px solid var(--edge); }
.kit-dialog-stats>div { padding:17px; display:flex; flex-direction:column; gap:5px; }
.kit-dialog-stats>div+div { border-left:1px solid var(--edge); }
.kit-dialog-stats span { color:var(--muted); font-size:.66rem; text-transform:uppercase; letter-spacing:.11em; }
.kit-dialog-stats b { font-family:var(--ff-mono); font-size:1.1rem; }
.kit-access { padding:18px; background:var(--slab); border:1px solid var(--edge); margin-bottom:22px; }
.kit-access p { color:var(--text-2); margin:8px 0 0; }
.kit-dialog-actions { margin-top:auto; display:flex; gap:10px; }
.kit-inventory-panel { padding:34px 26px 26px; min-width:0; display:flex; flex-direction:column; }
.kit-inventory-head { display:flex; align-items:center; justify-content:space-between; gap:20px; margin:0 42px 15px 0; }
.kit-inventory-head small { color:var(--muted); font-size:.72rem; }
.kit-inventory-image-wrap { background:#080a0d; border:1px solid var(--edge); overflow:hidden; min-height:420px; display:flex; align-items:center; justify-content:center; }
.kit-inventory-image { display:block; width:100%; height:auto; max-height:620px; object-fit:contain; }
.kit-note { color:var(--muted); font-size:.72rem; line-height:1.5; margin:12px 2px 0; }

@media (max-width: 1120px) {
  .kit-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .kit-grid-rewards { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .kit-dialog { grid-template-columns:1fr; }
  .kit-dialog-copy { border-right:0; border-bottom:1px solid var(--edge); }
}
@media (max-width: 680px) {
  .kits-intro,.kits-heading { grid-template-columns:1fr; }
  .kits-intro-stat { border-left:0; border-top:1px solid var(--edge); padding:18px 0 0; }
  .kit-grid,.kit-grid-rewards { grid-template-columns:1fr; }
  .kit-modal { padding:0; align-items:stretch; }
  .kit-dialog { width:100vw; min-height:100vh; max-height:100vh; border-left:0; border-right:0; }
  .kit-dialog-copy,.kit-inventory-panel { padding:24px 18px; }
  .kit-dialog-head { grid-template-columns:80px 1fr; gap:14px; padding-right:28px; }
  .kit-dialog-art { width:80px; height:80px; }
  .kit-inventory-image-wrap { min-height:250px; }
}


/* ---------- Store-integrated EXO kit system v2 ---------- */
.store-section-head {
  display:grid; grid-template-columns:minmax(0,1fr) minmax(300px,460px); gap:42px; align-items:start; margin-bottom:24px;
}
.store-section-head h2 { margin:8px 0 0; }
.store-section-head>p { color:var(--muted); margin:0; font-size:.9rem; line-height:1.65; }
.store-kits-section { border-top:1px solid var(--edge); background:linear-gradient(180deg,rgba(255,255,255,.012),transparent); }
.store-rewards-section { border-top:1px solid var(--edge); background:linear-gradient(180deg,rgba(255,75,44,.018),transparent); }
.store-kit-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(310px,360px)); gap:16px; justify-content:start; align-items:stretch; }
.store-reward-grid { grid-template-columns:repeat(auto-fit,minmax(310px,360px)); }

.store-kit-card {
  width:100%; min-width:0; min-height:430px; position:relative; overflow:hidden;
  background:linear-gradient(155deg,#11151a 0%,#0a0d10 72%);
  border:1px solid var(--edge); border-radius:var(--r-lg);
  display:flex; flex-direction:column; transition:transform .18s,border-color .18s,box-shadow .18s;
}
.store-kit-card::before {
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.34;
  background:
    linear-gradient(115deg,transparent 0 56%,rgba(255,255,255,.025) 56% 57%,transparent 57%),
    repeating-linear-gradient(0deg,transparent 0 39px,rgba(255,255,255,.018) 40px);
}
.store-kit-card::after {
  content:""; position:absolute; width:220px; height:220px; border:1px solid rgba(255,255,255,.035);
  transform:rotate(45deg); top:-130px; right:-100px; pointer-events:none;
}
.store-kit-card:hover { transform:translateY(-3px); border-color:rgba(255,255,255,.2); box-shadow:0 20px 54px rgba(0,0,0,.25); }
.store-kit-top { position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; padding:16px 17px 8px; }
.store-kit-index { font-family:var(--ff-mono); font-size:.7rem; color:var(--muted); letter-spacing:.12em; }
.store-kit-tier { font-size:.61rem; text-transform:uppercase; letter-spacing:.11em; font-weight:850; color:var(--text-2); border:1px solid var(--edge-soft); border-radius:100px; padding:5px 8px; }
.store-kit-mark { position:relative; z-index:1; min-height:132px; padding:15px 17px 18px; display:flex; flex-direction:column; justify-content:flex-end; border-bottom:1px solid var(--edge-soft); }
.store-kit-mark>span { position:absolute; top:6px; right:14px; font-family:var(--ff-cond); font-weight:900; font-size:4.8rem; line-height:1; letter-spacing:-.06em; color:rgba(255,255,255,.025); }
.store-kit-mark b { font-family:var(--ff-cond); font-size:2.2rem; line-height:.92; letter-spacing:-.025em; }
.store-kit-mark em { margin-top:6px; font-style:normal; color:var(--muted); font-size:.68rem; text-transform:uppercase; letter-spacing:.12em; }
.store-kit-body { position:relative; z-index:1; padding:17px; display:flex; flex-direction:column; flex:1; }
.store-kit-body>p { color:var(--muted); font-size:.82rem; line-height:1.55; margin:0 0 14px; min-height:61px; }
.store-kit-tags { display:flex; flex-wrap:wrap; gap:5px; margin-bottom:16px; }
.store-kit-tags span { font-size:.62rem; color:var(--text-2); background:rgba(255,255,255,.025); border:1px solid var(--edge-soft); border-radius:100px; padding:4px 7px; }
.store-kit-meta { display:grid; grid-template-columns:1fr 1fr; margin-top:auto; border-top:1px solid var(--edge-soft); border-bottom:1px solid var(--edge-soft); }
.store-kit-meta>div { padding:10px 0; display:flex; flex-direction:column; gap:2px; }
.store-kit-meta>div+div { border-left:1px solid var(--edge-soft); padding-left:12px; }
.store-kit-meta small { color:var(--muted); font-size:.59rem; text-transform:uppercase; letter-spacing:.1em; }
.store-kit-meta b { font-size:.78rem; }
.store-kit-actions { display:flex; flex-direction:column; gap:9px; margin-top:14px; }
.store-kit-actions .btn { width:100%; }
.kit-get-link { color:var(--text-2); font-size:.71rem; font-weight:760; text-align:center; padding:3px; }
.kit-get-link:hover { color:var(--red-hi); }

.kit-gold { border-top:2px solid #c79d3b; }
.kit-silver { border-top:2px solid #9aa6b3; }
.kit-blue { border-top:2px solid #4d90d6; }
.kit-bronze { border-top:2px solid #b56c3b; }
.kit-orange { border-top:2px solid #e67824; }
.kit-purple { border-top:2px solid #7955bd; }
.kit-pink { border-top:2px solid #c65a93; }

/* Text-first kit modal — intentionally no kit/card images */
.kit-dialog-text {
  width:min(1120px,95vw); display:grid; grid-template-columns:minmax(300px,.82fr) minmax(420px,1.18fr);
  background:#0a0d10; border:1px solid rgba(255,255,255,.15); border-top:2px solid var(--red); overflow:hidden;
}
.kit-detail-main { position:relative; padding:38px; border-right:1px solid var(--edge); overflow:hidden; }
.kit-detail-rank {
  position:absolute; right:-12px; top:-27px; font-family:var(--ff-cond); font-weight:900; font-size:10rem;
  color:rgba(255,255,255,.025); letter-spacing:-.08em; pointer-events:none;
}
.kit-detail-main h2 { position:relative; font-size:clamp(2.8rem,5vw,5rem); margin:8px 0 12px; letter-spacing:-.045em; line-height:.9; }
.kit-detail-summary { position:relative; max-width:48ch; color:var(--muted); font-size:.9rem; line-height:1.65; }
.kit-how { margin-top:22px; padding:18px; background:var(--slab); border:1px solid var(--edge); }
.kit-how p { color:var(--text-2); font-size:.84rem; line-height:1.55; margin:8px 0 16px; }
.kit-detail-contents { padding:38px 28px; background:linear-gradient(150deg,#0d1115,#080a0d); }
.kit-content-head { display:flex; justify-content:space-between; align-items:center; gap:16px; margin:0 36px 18px 0; }
.kit-content-head small { color:var(--muted); font-size:.68rem; }
.kit-content-list { border-top:1px solid var(--edge); }
.kit-content-row { display:grid; grid-template-columns:46px 1fr; align-items:center; gap:12px; min-height:58px; border-bottom:1px solid var(--edge); }
.kit-content-row>span { height:100%; display:flex; align-items:center; justify-content:center; font-family:var(--ff-mono); font-size:.68rem; color:var(--red-hi); border-right:1px solid var(--edge); }
.kit-content-row>b { font-size:.86rem; font-weight:700; color:var(--text-2); }
.kit-content-callout { margin-top:20px; border-left:2px solid var(--red); padding:13px 15px; background:rgba(255,75,44,.035); }
.kit-content-callout b { font-size:.8rem; }
.kit-content-callout p { margin:5px 0 0; color:var(--muted); font-size:.72rem; line-height:1.5; }

@media(max-width:1100px){
  .store-kit-grid { grid-template-columns:repeat(auto-fit,minmax(300px,360px)); }
  .store-reward-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .kit-dialog-text { grid-template-columns:1fr; max-height:92vh; overflow:auto; }
  .kit-detail-main { border-right:0; border-bottom:1px solid var(--edge); }
}
@media(max-width:680px){
  .store-section-head { grid-template-columns:1fr; }
  .store-kit-grid,.store-reward-grid { grid-template-columns:1fr; }
  .kit-detail-main,.kit-detail-contents { padding:26px 18px; }
  .kit-detail-rank { font-size:7rem; }
}


/* ---------- monthly kit pricing ---------- */
.monthly-note {
  margin:-5px 0 22px; display:flex; align-items:center; gap:16px; padding:13px 15px;
  background:rgba(255,255,255,.018); border:1px solid var(--edge); border-left:2px solid var(--red);
}
.monthly-note>span { flex:0 0 auto; color:var(--red-hi); font-family:var(--ff-mono); font-size:.65rem; font-weight:800; letter-spacing:.1em; }
.monthly-note p { margin:0; color:var(--muted); font-size:.73rem; line-height:1.45; }
.kit-price-row { display:flex; align-items:end; justify-content:space-between; gap:10px; padding:14px 0 3px; }
.kit-price-row>div { display:flex; align-items:baseline; gap:5px; }
.kit-price-row strong { font-family:var(--ff-cond); font-size:1.8rem; line-height:1; letter-spacing:-.03em; }
.kit-price-row span { color:var(--muted); font-size:.66rem; }
.kit-price-row>small { color:var(--muted); font-size:.61rem; text-transform:uppercase; letter-spacing:.08em; }
.kit-buy-btn { width:100%; }
.kit-modal-price { margin:18px 0 0; display:flex; align-items:baseline; gap:10px; }
.kit-modal-price strong { font-family:var(--ff-cond); font-size:2.5rem; color:var(--text); }
.kit-modal-price span { color:var(--muted); font-size:.76rem; }


/* ---------- EXO Control: Kit Manager ---------- */
.admin-section-head{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:16px}
.admin-section-head h2,.admin-section-head h3{margin:0}.admin-actions{display:flex;gap:6px;flex-wrap:wrap}
.kit-editor-shell{margin-top:22px;padding:22px;border:1px solid var(--edge);background:linear-gradient(160deg,#10151b,#0a0d10)}
.kit-editor-title{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:18px}
.kit-editor-title h3{font-size:1.8rem;margin:4px 0 0}
.admin-form textarea,.admin-form select{width:100%;background:#090c10;border:1px solid var(--edge);color:var(--text);padding:12px;border-radius:3px;font:inherit}
.admin-form textarea:focus,.admin-form select:focus{outline:0;border-color:var(--red)}
.kit-items-editor{padding-top:12px;border-top:1px solid var(--edge)}#kitItemsList{display:grid;gap:8px}
.kit-item-admin-row{display:grid;grid-template-columns:1.25fr 1fr 90px 130px 100px auto;gap:8px;align-items:center}
.kit-item-admin-row input,.kit-item-admin-row select{min-width:0}
.kit-content-row small{color:var(--muted);font-size:.65rem;padding-right:10px}
.kit-content-row b em{font-style:normal;color:var(--red-hi);font-family:var(--ff-mono);font-size:.74rem;margin-left:6px}
@media(max-width:1050px){.kit-item-admin-row{grid-template-columns:1fr 1fr 90px 1fr}}
@media(max-width:680px){.admin-section-head{align-items:flex-start;flex-direction:column}.kit-item-admin-row{grid-template-columns:1fr}.kit-editor-shell{padding:16px}}


/* ---------- PayPal one-time 30-day access ---------- */
.payment-banner{margin:0 0 18px;padding:15px 17px;border:1px solid var(--edge);display:flex;gap:10px;align-items:center}
.payment-banner b{font-size:.82rem}.payment-banner span{color:var(--muted);font-size:.78rem}
.payment-banner.is-success{border-left:3px solid #48c978;background:rgba(72,201,120,.045)}
.payment-banner.is-error{border-left:3px solid #e24b4b;background:rgba(226,75,75,.045)}
.account-access-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:16px}
.account-access-head h2,.account-access-head p{margin-top:0}
.access-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.access-card{border:1px solid var(--edge);background:var(--slab-2);padding:16px;display:flex;flex-direction:column;gap:5px}
.access-card h3{font-size:1.15rem;margin:2px 0 8px}.access-card>b{font-family:var(--ff-mono);font-size:.84rem}
.access-card>small{color:var(--muted);font-size:.68rem}.access-card>a{margin-top:9px;color:var(--red-hi);font-size:.72rem;font-weight:760}
@media(max-width:800px){.access-grid{grid-template-columns:1fr}.account-access-head{align-items:flex-start;flex-direction:column}.payment-banner{align-items:flex-start;flex-direction:column}}

/* Leaderboards v13 */
.leaderboard-table .metric-value{font-weight:900;color:var(--text);font-size:.92rem}
.leaderboard-table th.is-sorted{color:var(--red-hi)}
.player-cell img,.avatar-lg{object-fit:cover;background:#11151b}

/* EXO 100X Rust hero */

.hero-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  z-index: 0;
  pointer-events: none;
  background: #030812;
}
.hero-bg {
  z-index: 1;
  background:
    linear-gradient(90deg, rgba(2,7,15,.96) 0%, rgba(2,8,18,.84) 34%, rgba(2,12,24,.50) 62%, rgba(2,8,18,.72) 100%),
    linear-gradient(180deg, rgba(2,8,18,.18) 0%, rgba(2,8,18,.08) 58%, rgba(2,8,18,.74) 100%);
}
.hero-bg::after {
  opacity: .18;
}
.hero-in,
.hero-strip {
  z-index: 2;
}
@media (prefers-reduced-motion: reduce) {
  .hero-image { display: none; }
}

/* =========================================================
   EXO Creator Program — v17 UI
   ========================================================= */

/* ---------- shared section furniture ---------- */
.creator-section { position: relative; }
.creator-section + .creator-section::before {
  content: ""; position: absolute; top: 0; left: var(--gut); right: var(--gut); height: 1px;
  background: linear-gradient(90deg, transparent, rgba(233,238,245,.09) 10%, rgba(233,238,245,.09) 90%, transparent);
}
.creator-section h2 {
  font-size: clamp(1.85rem, 3.7vw, 2.75rem); letter-spacing: -.038em; line-height: 1.04; margin: 0 0 16px;
}
.creator-lead { color: var(--text-2); max-width: 640px; margin: 0; font-size: .98rem; line-height: 1.72; }

.cp-rail { display: flex; align-items: center; gap: 13px; margin-bottom: 18px; }
.cp-rail::before { content: ""; width: 26px; height: 2px; background: var(--red); border-radius: 2px; flex-shrink: 0; }
.cp-rail span { font-size: .69rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--text-2); }

/* ---------- hero ---------- */
.creator-hero {
  position: relative; overflow: hidden; border-bottom: 1px solid var(--edge);
  padding: clamp(58px, 8.5vw, 104px) var(--gut) clamp(46px, 6vw, 78px);
  background:
    radial-gradient(ellipse 62% 68% at 50% -12%, rgba(243,106,33,.17), transparent 62%),
    radial-gradient(ellipse 90% 60% at 50% 118%, rgba(243,106,33,.05), transparent 60%),
    var(--void);
}
.creator-hero-in { max-width: 1120px; margin: 0 auto; text-align: center; }

.creator-eyebrow { display: flex; align-items: center; justify-content: center; gap: 10px; margin-bottom: 26px; }
.creator-eyebrow i { width: 7px; height: 7px; border-radius: 50%; background: var(--red); flex-shrink: 0; }
.creator-eyebrow span { font-size: .7rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: var(--text-2); }

.creator-hero h1 {
  font-size: clamp(2.5rem, 6.6vw, 4.7rem); line-height: 1.02; letter-spacing: -.045em;
  font-weight: 800; margin: 0 0 26px;
}
.creator-hero h1 .accent { display: block; color: var(--red); }

.creator-hero-lead {
  max-width: 830px; margin: 0 auto 34px; color: var(--text-2);
  font-size: clamp(.98rem, 1.15vw, 1.08rem); line-height: 1.72;
}

.creator-actions { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; }

.creator-pills { display: flex; justify-content: center; flex-wrap: wrap; gap: 9px; margin: 34px 0 0; }
.creator-pills span {
  display: inline-flex; align-items: center; gap: 8px;
  border: 1px solid var(--edge); border-radius: 999px; padding: 8px 15px;
  background: rgba(233,238,245,.02); color: var(--text-2);
  font-size: .755rem; font-weight: 600; letter-spacing: .005em;
}
.creator-pills svg { width: 13px; height: 13px; opacity: .75; flex-shrink: 0; }

.creator-summary {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px;
  text-align: left; margin-top: 46px;
}
.creator-summary article {
  background: linear-gradient(180deg, #0E1116, #0A0D12);
  border: 1px solid var(--edge); border-radius: 12px; padding: 24px 22px;
}
.creator-summary article.featured {
  border-color: rgba(243,106,33,.38);
  background: linear-gradient(180deg, rgba(243,106,33,.11), rgba(243,106,33,.015));
}
.creator-summary b {
  display: block; font-size: clamp(1.85rem, 2.7vw, 2.35rem);
  font-weight: 800; letter-spacing: -.035em; line-height: 1;
}
.creator-summary article.featured b { color: var(--red-hi); }
.creator-summary b span { font-size: .82rem; font-weight: 700; color: var(--muted); margin-left: 3px; letter-spacing: 0; }
.creator-summary strong { display: block; margin-top: 18px; font-size: .93rem; font-weight: 700; color: var(--text); }
.creator-summary em { display: block; margin-top: 5px; font-style: normal; font-size: .8rem; color: var(--muted); line-height: 1.5; }

/* ---------- range inputs ---------- */
.cp-range {
  -webkit-appearance: none; appearance: none; width: 100%; height: 5px; border-radius: 999px;
  background: linear-gradient(90deg, var(--red) var(--fill, 50%), #232833 var(--fill, 50%));
  outline: none; cursor: pointer; margin: 0; display: block;
}
.cp-range::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none; width: 19px; height: 19px; border-radius: 50%;
  background: #fff; border: 4px solid var(--red); cursor: pointer;
  box-shadow: 0 2px 8px rgba(0,0,0,.55); transition: transform .12s;
}
.cp-range::-webkit-slider-thumb:hover { transform: scale(1.12); }
.cp-range::-moz-range-thumb {
  width: 15px; height: 15px; border-radius: 50%; background: #fff;
  border: 4px solid var(--red); cursor: pointer; box-shadow: 0 2px 8px rgba(0,0,0,.55);
}
.cp-range::-moz-range-track { background: transparent; }

.cp-slider { margin-bottom: 32px; }
.cp-slider:last-of-type { margin-bottom: 26px; }
.cp-slider-top { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: 15px; }
.cp-slider-top label { font-size: .95rem; font-weight: 700; color: var(--text); }
.cp-slider-top strong { font-size: 1.12rem; font-weight: 800; letter-spacing: -.02em; }

/* ---------- calculator ---------- */
.creator-calc {
  display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
  background: var(--slab); border: 1px solid var(--edge); border-radius: 14px;
  overflow: hidden; margin-top: 36px;
}
.creator-sliders { padding: clamp(24px, 3vw, 36px); }
.creator-note {
  display: flex; align-items: flex-start; gap: 11px; margin: 0;
  color: var(--muted); font-size: .855rem; line-height: 1.65;
}
.creator-note svg { width: 15px; height: 15px; flex-shrink: 0; margin-top: 3px; }

.creator-result {
  padding: clamp(24px, 3vw, 36px);
  background: linear-gradient(180deg, #110D12, #0A090D);
  border-left: 1px solid var(--edge);
}
.cp-tier-row { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 18px; }
.cp-tier-row > span { font-size: .67rem; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; color: var(--muted); }
.cp-badge {
  background: var(--red); color: #fff; border-radius: 5px; padding: 5px 10px;
  font-size: .64rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; white-space: nowrap;
}
.cp-badge.is-off { background: var(--slab-3); color: var(--muted); }
.cp-rate {
  display: block; font-size: clamp(2.3rem, 3.4vw, 3rem); font-weight: 800;
  letter-spacing: -.045em; line-height: 1; margin-bottom: 24px;
}
.cp-rate small { font-size: .88rem; font-weight: 600; color: var(--text-2); letter-spacing: 0; margin-left: 5px; }
.cp-line { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 15px 0; border-top: 1px solid var(--edge); }
.cp-line > span { color: var(--text-2); font-size: .92rem; }
.cp-line .v { text-align: right; }
.cp-line strong { display: block; font-size: 1.12rem; font-weight: 800; letter-spacing: -.02em; }
.cp-line em { display: block; font-style: normal; font-size: .72rem; color: var(--muted); margin-top: 4px; }
.cp-line.is-projection strong { color: var(--red-hi); }
.creator-result > p { margin: 22px 0 0; color: var(--muted); font-size: .845rem; line-height: 1.68; }

/* ---------- rate table ---------- */
.creator-table-wrap { border: 1px solid var(--edge); border-radius: 12px; overflow: hidden; overflow-x: auto; margin-top: 32px; }
.creator-table { width: 100%; border-collapse: collapse; min-width: 760px; }
.creator-table thead th {
  background: #0F1218; padding: 15px 22px; text-align: left; border-bottom: 1px solid var(--edge);
  font-size: .655rem; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; color: var(--muted);
}
.creator-table td { padding: 18px 22px; border-bottom: 1px solid rgba(233,238,245,.05); color: var(--text-2); font-size: .93rem; }
.creator-table tbody tr:last-child td { border-bottom: 0; }
.creator-table tbody tr { transition: background .13s; }
.creator-table tbody tr:hover { background: rgba(233,238,245,.02); }
.creator-table td:first-child { color: var(--text); font-weight: 800; }
.creator-table td.rate { color: var(--text); font-weight: 800; }
.cp-bar { height: 5px; border-radius: 999px; background: #22262E; min-width: 160px; overflow: hidden; }
.cp-bar i { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, #8E2027, var(--red-hi)); }

/* ---------- what counts ---------- */
.creator-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-top: 32px; }
.creator-cards article {
  background: var(--slab); border: 1px solid var(--edge); border-radius: 12px;
  padding: 26px 22px; transition: border-color .15s, background .15s;
}
.creator-cards article:hover { border-color: #333B48; background: var(--slab-2); }
.creator-cards .ico { width: 26px; height: 26px; color: var(--red-hi); margin-bottom: 22px; }
.creator-cards h3 { margin: 0 0 11px; font-size: 1rem; font-weight: 800; letter-spacing: -.015em; }
.creator-cards p { margin: 0; color: var(--text-2); font-size: .895rem; line-height: 1.68; }

/* ---------- clips ---------- */
.creator-clips {
  display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1.35fr);
  gap: clamp(20px, 3vw, 42px); align-items: start; margin-top: 32px;
}
.cp-clipcalc {
  background: linear-gradient(180deg, #0F1217, #0A0C11); border: 1px solid var(--edge);
  border-radius: 12px; padding: clamp(22px, 2.6vw, 28px);
}
.cp-clipcalc .cp-slider { margin-bottom: 26px; }
.cp-cliprows { border-top: 1px solid var(--edge); margin-top: 4px; padding-top: 8px; }
.cp-cliprows div { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 9px 0; }
.cp-cliprows span { color: var(--text-2); font-size: .9rem; }
.cp-cliprows strong { color: var(--text); font-weight: 800; font-size: .95rem; }

.cp-clipfacts { display: grid; grid-template-columns: 1fr 1fr; }
.cp-clipfacts article { padding: 4px 28px 26px; border-left: 1px solid var(--edge); }
.cp-clipfacts article:nth-child(-n+2) { padding-bottom: 26px; }
.cp-clipfacts article:nth-child(n+3) { padding-top: 26px; border-top: 1px solid var(--edge); }
.cp-clipfacts h3 { display: flex; align-items: center; gap: 12px; margin: 0 0 11px; font-size: .97rem; font-weight: 800; letter-spacing: -.015em; }
.cp-clipfacts .ico { width: 19px; height: 19px; color: var(--red-hi); flex-shrink: 0; }
.cp-clipfacts p { margin: 0; color: var(--text-2); font-size: .885rem; line-height: 1.68; }

/* ---------- rules ---------- */
.creator-rules { display: grid; grid-template-columns: 1fr 1fr; column-gap: clamp(28px, 5vw, 62px); margin-top: 32px; }
.creator-rules article { position: relative; padding: 26px 0 26px 46px; border-top: 1px solid var(--edge); }
.creator-rules article > span {
  position: absolute; left: 0; top: 28px; font-family: var(--ff-mono);
  font-size: .78rem; font-weight: 600; color: #4B525F;
}
.creator-rules article:first-child > span { color: var(--red); }
.creator-rules h3 { margin: 0 0 9px; font-size: 1rem; font-weight: 800; letter-spacing: -.015em; }
.creator-rules p { margin: 0; color: var(--text-2); font-size: .9rem; line-height: 1.65; }

/* ---------- steps ---------- */
.creator-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(18px, 2.6vw, 34px); margin-top: 32px; }
.creator-steps article > span {
  display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; border-radius: 8px; margin-bottom: 20px;
  background: rgba(243,106,33,.13); border: 1px solid rgba(243,106,33,.34);
  color: var(--red-hi); font-weight: 800; font-size: .88rem;
}
.creator-steps h3 { margin: 0 0 10px; font-size: 1rem; font-weight: 800; letter-spacing: -.015em; }
.creator-steps p { margin: 0; color: var(--text-2); font-size: .895rem; line-height: 1.68; }

/* ---------- join CTA ---------- */
.creator-join {
  display: flex; align-items: center; justify-content: space-between; gap: clamp(24px, 4vw, 48px);
  padding: clamp(28px, 4vw, 46px); margin-top: clamp(40px, 5vw, 62px);
  border: 1px solid rgba(243,106,33,.26); border-radius: 14px;
  background: radial-gradient(ellipse 80% 150% at 12% 0, rgba(243,106,33,.15), transparent 62%), #0C0A0D;
}
.creator-join h2 { font-size: clamp(1.7rem, 3vw, 2.4rem); margin: 0 0 14px; }
.creator-join p { margin: 0; color: var(--text-2); max-width: 640px; font-size: .95rem; line-height: 1.7; }
.creator-join .btn { flex-shrink: 0; }

/* ---------- responsive ---------- */
@media (max-width: 1040px) {
  .creator-summary, .creator-cards, .creator-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .creator-clips { grid-template-columns: 1fr; }
  .cp-clipfacts article { padding-left: 0; border-left: 0; }
  .cp-clipfacts article:nth-child(2) { padding-left: 28px; border-left: 1px solid var(--edge); }
  .cp-clipfacts article:nth-child(4) { padding-left: 28px; border-left: 1px solid var(--edge); }
}
@media (max-width: 860px) {
  .creator-calc, .creator-rules { grid-template-columns: 1fr; }
  .creator-result { border-left: 0; border-top: 1px solid var(--edge); }
  .creator-join { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 620px) {
  .creator-summary, .creator-cards, .creator-steps, .cp-clipfacts { grid-template-columns: 1fr; }
  .cp-clipfacts article { padding: 24px 0; border-left: 0 !important; padding-left: 0 !important; border-top: 1px solid var(--edge); }
  .cp-clipfacts article:first-child { border-top: 0; padding-top: 4px; }
  .creator-actions .btn { width: 100%; justify-content: center; }
  .creator-join .btn { width: 100%; justify-content: center; }
}


/* =========================================================
   EXO Creator Program — Phase 2 account/admin dashboard
   ========================================================= */
.creator-account-panel{scroll-margin-top:84px}.creator-account-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:20px}.creator-account-head h2{font-size:1.8rem;margin:4px 0 6px}.creator-account-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.creator-mini-card{background:var(--slab-2);border:1px solid var(--edge);padding:16px;display:flex;flex-direction:column;gap:5px}.creator-mini-card>span{font-size:.62rem;text-transform:uppercase;letter-spacing:.11em;color:var(--muted);font-weight:800}.creator-mini-card>b{font-size:1.15rem}.creator-mini-card>small{color:var(--muted);font-size:.7rem;line-height:1.45}.creator-account-actions{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0 20px}.creator-account-actions .btn svg{width:15px;height:15px}.creator-account-split{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:16px}.creator-clip-form{display:grid;grid-template-columns:130px 1fr auto;gap:8px;margin-bottom:12px}.creator-clip-form select{background:var(--void);border:1px solid var(--edge);color:var(--text);padding:10px 12px;border-radius:var(--r)}.creator-clip-list{display:grid;gap:7px}.creator-clip-list>div{display:grid;grid-template-columns:80px 1fr auto;gap:10px;padding:10px 0;border-top:1px solid var(--edge-soft);font-size:.78rem}.creator-clip-list>div span{text-transform:uppercase;color:var(--red-hi);font-weight:800}.creator-clip-list>div em{font-style:normal;color:var(--muted)}.creator-empty{padding:22px;border:1px dashed var(--edge);background:var(--slab-2);display:flex;align-items:center;justify-content:space-between;gap:20px}.creator-empty p{margin:0;color:var(--text-2)}@media(max-width:980px){.creator-account-grid{grid-template-columns:repeat(2,1fr)}.creator-account-split{grid-template-columns:1fr}}@media(max-width:680px){.creator-account-head,.creator-empty{flex-direction:column}.creator-account-grid{grid-template-columns:1fr}.creator-clip-form{grid-template-columns:1fr}.creator-clip-list>div{grid-template-columns:1fr}.creator-account-actions .btn{width:100%}}

/* ---------- Creator Twitch live tracking v19 ---------- */
.creator-live-card{display:flex;align-items:center;gap:12px;margin:14px 0 18px;padding:13px 15px;border:1px solid var(--edge);border-radius:var(--r);background:var(--slab-2)}
.creator-live-card .creator-live-dot{width:9px;height:9px;border-radius:50%;background:var(--muted);box-shadow:0 0 0 0 rgba(110,119,135,0);flex-shrink:0}
.creator-live-card>div{display:flex;flex-direction:column;min-width:0}.creator-live-card b{font-size:.82rem}.creator-live-card small{color:var(--muted);font-size:.7rem;margin-top:2px}
.creator-live-card.is-live{border-color:rgba(243,106,33,.28);background:rgba(243,106,33,.045)}
.creator-live-card.is-live .creator-live-dot{background:var(--red-hi);box-shadow:0 0 0 5px rgba(243,106,33,.09)}
.creator-live-card.is-qualifying{border-color:rgba(62,207,124,.3);background:rgba(62,207,124,.045)}
.creator-live-card.is-qualifying .creator-live-dot{background:var(--live);box-shadow:0 0 0 5px rgba(62,207,124,.09)}


/* =========================================================
   EXO Creator Applications + Review Center — v20
   ========================================================= */
.creator-apply-form{border:1px solid var(--edge);background:linear-gradient(160deg,#10141a,#0a0d11);padding:24px;border-radius:var(--r-lg)}
.creator-apply-intro{margin-bottom:22px}.creator-apply-intro h3{font-size:1.35rem;margin:0 0 8px}.creator-apply-intro p{color:var(--text-2);margin:0;max-width:72ch}
.creator-application-status{border:1px solid var(--edge);border-left:3px solid var(--gold);background:var(--slab-2);padding:24px;border-radius:var(--r-lg)}
.creator-application-status h3{font-size:1.4rem;margin:7px 0 10px}.creator-application-status p{color:var(--text-2);max-width:78ch}.creator-application-status .btn{margin:10px 8px 0 0}
.creator-application-status.is-rejected{border-left-color:var(--red)}
.creator-review-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.creator-review-card{border:1px solid var(--edge);background:linear-gradient(160deg,#0f1319,#090c10);border-radius:var(--r-lg);padding:20px;min-width:0}
.creator-review-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:18px}
.creator-review-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--edge);border:1px solid var(--edge);margin-bottom:16px}
.creator-review-grid>div{background:var(--slab);padding:12px;min-width:0}.creator-review-grid span,.creator-review-about>span,.creator-review-note>span{display:block;color:var(--muted);font-size:.62rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;margin-bottom:4px}.creator-review-grid b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.84rem}
.creator-review-about,.creator-review-note{padding:14px 0;border-top:1px solid var(--edge-soft)}.creator-review-about p,.creator-review-note p{margin:0;color:var(--text-2);font-size:.86rem;line-height:1.55;white-space:pre-wrap}.creator-review-note p{color:var(--gold)}
.creator-review-meta{color:var(--muted);font-size:.7rem;padding:11px 0;border-top:1px solid var(--edge-soft)}
.creator-review-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}.creator-admin-subhead{margin-top:38px}.creator-admin-sessions{margin-top:46px}
.risk-pill{display:inline-flex;padding:3px 8px;border:1px solid var(--edge);border-radius:100px;font-size:.66rem;font-weight:800;color:var(--live);background:rgba(62,207,124,.07)}.risk-review{color:var(--gold);border-color:rgba(232,185,60,.3);background:var(--gold-dim)}.risk-high{color:var(--red-hi);border-color:rgba(243,106,33,.35);background:var(--red-dim)}
@media(max-width:900px){.creator-review-list{grid-template-columns:1fr}}
@media(max-width:620px){.creator-review-grid{grid-template-columns:1fr}.creator-review-actions .btn{flex:1}}


/* =========================================================
   EXO Creator Fraud Review — v21
   Risk scores are review signals, not automatic fraud verdicts.
   ========================================================= */
.session-review-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.session-review-card{border:1px solid var(--edge);border-left:3px solid var(--live);background:linear-gradient(155deg,#0f1318,#090c10);border-radius:var(--r-lg);padding:20px;scroll-margin-top:90px}
.session-review-card.risk-border-review{border-left-color:var(--gold)}.session-review-card.risk-border-high{border-left-color:var(--red-hi)}
.session-review-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:16px}.session-review-head h3{font-size:1.2rem;margin:4px 0}.session-review-head code{color:var(--muted);font-family:var(--ff-mono);font-size:.68rem}
.session-review-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--edge);border:1px solid var(--edge);margin-bottom:16px}.session-review-stats>div{background:var(--slab);padding:11px}.session-review-stats span{display:block;color:var(--muted);font-size:.59rem;text-transform:uppercase;letter-spacing:.1em}.session-review-stats b{display:block;margin-top:4px;font-size:.92rem}
.risk-flags{border-top:1px solid var(--edge-soft);border-bottom:1px solid var(--edge-soft);padding:10px 0;margin-bottom:14px}.risk-flags>div{display:grid;grid-template-columns:42px 1fr;gap:8px;padding:7px 0}.risk-flags>div b{color:var(--gold);font-family:var(--ff-mono);font-size:.75rem}.risk-flags>div span{color:var(--text-2);font-size:.78rem;line-height:1.45}
.session-review-actions{display:flex;gap:8px;flex-wrap:wrap}.session-status{font-size:.64rem;font-weight:800;letter-spacing:.08em}.status-approved{color:var(--live)}.status-held{color:var(--gold)}.status-rejected{color:var(--red-hi)}.status-pending{color:var(--text-2)}.status-tracking{color:#77b7ff}
@media(max-width:980px){.session-review-list{grid-template-columns:1fr}}@media(max-width:620px){.session-review-stats{grid-template-columns:repeat(2,1fr)}.session-review-actions .btn{flex:1}}

/* =========================================================
   EXO Creator Program — v22 payout center
   ========================================================= */
.creator-payout-profile {
  display:grid; grid-template-columns:minmax(0,1fr) minmax(360px,.9fr); gap:20px;
  margin:18px 0 22px; padding:20px; border:1px solid var(--edge); border-radius:var(--r-lg);
  background:linear-gradient(155deg,#0e1117,#0a0d11);
}
.creator-payout-profile h3 { margin:5px 0 7px; }
.creator-payout-profile p { margin:0; max-width:62ch; }
.creator-payout-profile>small { grid-column:1/-1; }
.creator-payout-form { display:grid; grid-template-columns:150px minmax(0,1fr) auto; gap:8px; align-items:center; }
.creator-payout-form select,.creator-payout-form input { width:100%; background:var(--void); border:1px solid var(--edge); color:var(--text); padding:10px 12px; border-radius:var(--r); font:inherit; }
.creator-payout-admin .payout-period-form { display:flex; align-items:end; gap:10px; margin:0 0 20px; }
.creator-payout-admin .payout-period-form label { display:flex; flex-direction:column; gap:6px; color:var(--muted); font-size:.72rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.creator-payout-admin input[type="month"] { width:auto; min-width:170px; }
.payout-stat-strip { margin-bottom:28px; }
.payout-history-head { margin-top:42px; }
.creator-payout-admin .data-table small { font-size:.68rem; }
@media(max-width:900px){
  .creator-payout-profile { grid-template-columns:1fr; }
  .creator-payout-profile>small { grid-column:auto; }
  .creator-payout-form { grid-template-columns:1fr; }
}


/* =========================================================
   EXO Admin Navigation — v23
   ========================================================= */
.admin-tabs{
  position:sticky;
  top:74px;
  z-index:55;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  padding:10px;
  margin:0 0 22px;
  background:rgba(3,8,18,.92);
  backdrop-filter:blur(12px);
  border:1px solid var(--edge);
  border-radius:var(--r-lg);
}
.admin-tabs a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:9px 14px;
  border:1px solid transparent;
  border-radius:6px;
  color:var(--text-2);
  font-size:.74rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  transition:.15s ease;
}
.admin-tabs a:hover{
  color:var(--text);
  background:var(--slab-2);
  border-color:var(--edge);
}
.admin-tabs a.is-active{
  color:#fff;
  background:var(--red);
  border-color:var(--red);
}
.admin-shortcuts{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  margin-bottom:22px;
}
.admin-shortcuts a{
  display:flex;
  flex-direction:column;
  gap:6px;
  min-height:102px;
  padding:18px;
  border:1px solid var(--edge);
  border-radius:var(--r-lg);
  background:linear-gradient(160deg,var(--slab),#0a0d11);
  transition:transform .15s,border-color .15s,background .15s;
}
.admin-shortcuts a:hover{
  transform:translateY(-2px);
  border-color:#343b47;
  background:var(--slab-2);
}
.admin-shortcuts span{
  color:var(--red-hi);
  font-size:.7rem;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.admin-shortcuts b{
  font-size:.95rem;
  line-height:1.35;
}
#servers,#kits,#products,#players{
  scroll-margin-top:150px;
}
@media(max-width:900px){
  .admin-shortcuts{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(max-width:620px){
  .admin-tabs{
    top:66px;
    overflow-x:auto;
    flex-wrap:nowrap;
  }
  .admin-tabs a{white-space:nowrap;}
  .admin-shortcuts{grid-template-columns:1fr;}
}

/* EXO Admin Separate Pages — v24 */
.admin-page-title{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:20px;
  margin:4px 0 24px;
  padding:8px 2px 20px;
  border-bottom:1px solid var(--edge);
}
.admin-page-title span{
  color:var(--red-hi);
  font-size:.67rem;
  font-weight:900;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.admin-page-title h2{
  font-size:clamp(1.8rem,3vw,2.6rem);
}


/* EXO Focused Admin Workspaces — v25 */
.admin-tabs + .admin-page-title{margin-top:4px}
.admin-page-title{margin-bottom:18px}


/* EXO Admin Button Color Fix — v26 */
.admin-actions .btn:not(.btn-danger),
.kit-editor-title .btn:not(.btn-danger){
  background:var(--slab-2);
  border-color:var(--edge);
  color:var(--text);
}
.admin-actions .btn:not(.btn-danger):hover,
.kit-editor-title .btn:not(.btn-danger):hover{
  background:var(--slab-3);
  border-color:var(--muted);
  color:#fff;
}
.admin-actions .btn-danger{
  background:transparent;
  border-color:rgba(243,106,33,.48);
  color:var(--red-hi);
}
.admin-actions .btn-danger:hover{
  background:var(--red-dim);
  color:#fff;
}

/* EXO Admin Team Accounts — v27 */
.team-create-box{margin:20px 0 26px;padding:20px;border:1px solid var(--edge);background:var(--slab-2);border-radius:var(--r-lg)}
.team-create-box h3{margin:0 0 16px}.team-permissions{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.team-permissions label{display:flex!important;flex-direction:row!important;align-items:center;gap:7px!important;padding:8px 11px;border:1px solid var(--edge);border-radius:6px;background:var(--void);color:var(--text-2)!important;font-size:.75rem!important}
.team-permissions input{width:auto!important;accent-color:var(--red)}
.team-user-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.team-user-card{padding:20px;border:1px solid var(--edge);border-radius:var(--r-lg);background:linear-gradient(160deg,var(--slab),#0a0d11)}
.team-user-card.owner-card{border-color:rgba(232,185,60,.3);display:flex;justify-content:space-between;gap:18px}
.team-user-head{display:flex;justify-content:space-between;gap:18px}.team-user-card h3{margin:5px 0 2px}.team-user-card code{font-family:var(--ff-mono);color:var(--muted);font-size:.75rem}
.team-role{color:var(--red-hi);font-size:.62rem;font-weight:900;letter-spacing:.13em}.owner-card .team-role{color:var(--gold)}
.team-perm-pills{display:flex;flex-wrap:wrap;gap:6px;margin:16px 0 10px}.team-perm-pills span{padding:4px 8px;border:1px solid var(--edge);background:var(--slab-2);border-radius:100px;color:var(--text-2);font-size:.65rem;font-weight:700;text-transform:uppercase}
@media(max-width:850px){.team-user-list{grid-template-columns:1fr}}


/* EXO YouTube Creator Integration — v28 */
.creator-account-actions .btn svg{width:16px;height:16px;flex:0 0 16px}
#creatorYouTubeStatus.is-live{border-color:rgba(255,0,0,.28)}
#creatorYouTubeStatus.is-live .creator-live-dot{background:#ff2d2d;box-shadow:0 0 0 4px rgba(255,45,45,.12)}


/* ==========================================================
   EXO 100X — sponsored competitive server + perk store
   ========================================================== */
.topbar nav a.nav-exo { color:#7eeeff; }
.topbar nav a.nav-exo:hover,.topbar nav a.nav-exo.is-active { background:rgba(243,106,33,.09); color:#a8f5ff; }

.exo-hero { position:relative; min-height:560px; overflow:hidden; border-bottom:1px solid rgba(85,210,255,.18); background:#030812; }
.exo-hero-bg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; opacity:.78; }
.exo-hero-shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(2,5,12,.98) 0%,rgba(2,6,16,.86) 36%,rgba(2,6,16,.42) 66%,rgba(2,5,12,.88) 100%),linear-gradient(0deg,#05070c 0%,transparent 44%); }
.exo-hero-content { position:relative; z-index:2; max-width:var(--shell); margin:0 auto; padding:118px var(--gut) 110px; }
.exo-hero-content h1 { font-family:var(--ff-cond); font-size:clamp(4.7rem,10vw,9rem); line-height:.77; letter-spacing:-.045em; margin:18px 0 26px; color:#edfaff; text-shadow:0 0 50px rgba(243,106,33,.13); }
.exo-hero-content h1 b { display:block; font-size:.26em; letter-spacing:.34em; color:#54dcff; margin-top:18px; }
.exo-hero-content p { max-width:610px; color:#a8b9c8; font-size:1.04rem; line-height:1.7; margin:0 0 30px; }
.exo-sponsored,.exo-kicker { display:inline-flex; align-items:center; gap:8px; color:#FF8A32; border:1px solid rgba(70,215,255,.28); background:rgba(15,120,165,.08); font:800 .67rem/1 var(--ff-mono); letter-spacing:.16em; padding:8px 11px; text-transform:uppercase; }
.exo-live-card { position:absolute; z-index:3; right:max(var(--gut),calc((100vw - var(--shell))/2 + var(--gut))); bottom:48px; width:min(390px,calc(100% - 2*var(--gut))); display:grid; grid-template-columns:1fr 1fr 1fr; gap:1px; background:rgba(44,190,235,.15); border:1px solid rgba(83,223,255,.24); backdrop-filter:blur(10px); }
.exo-live-card>.status { grid-column:1/-1; margin:14px 15px 4px; width:max-content; }
.exo-live-card>div { background:rgba(3,10,20,.89); padding:18px 15px; display:flex; flex-direction:column; }
.exo-live-card>div b { font:900 1.6rem/1 var(--ff-cond); color:#fff; }
.exo-live-card>div span { margin-top:5px; color:#698396; font-size:.65rem; text-transform:uppercase; letter-spacing:.1em; }

.exo-btn-primary,.exo-buy { background:linear-gradient(135deg,#B84318,#19d7ff); border:1px solid #46e5ff; color:#00141d !important; font-weight:900; box-shadow:0 8px 28px rgba(11,182,225,.15); }
.exo-btn-primary:hover,.exo-buy:hover { filter:brightness(1.13); transform:translateY(-1px); }
.exo-btn-ghost { border:1px solid rgba(92,220,255,.28); background:rgba(12,45,64,.28); color:#d9f9ff !important; }
.exo-btn-ghost:hover { border-color:rgba(99,229,255,.6); background:rgba(16,78,102,.35); }

.exo-section { --red:#F36A21; --red-hi:#FF9A45; }
.exo-section h2 { color:#edfaff; }
.exo-link { color:#65e6ff; }
.exo-mode-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; }
.exo-mode-card { min-height:132px; border:1px solid rgba(83,218,255,.17); background:linear-gradient(145deg,#07101c,#091927); padding:20px; display:flex; flex-direction:column; justify-content:flex-end; position:relative; overflow:hidden; }
.exo-mode-card::before { content:""; position:absolute; inset:auto -20px -35px auto; width:105px; height:105px; border:1px solid rgba(55,208,255,.15); transform:rotate(45deg); }
.exo-mode-card span { color:#55ddff; font:900 1.8rem/1 var(--ff-cond); }
.exo-mode-card b { margin-top:17px; color:#e9faff; font-size:.78rem; }
.exo-mode-card em { font-style:normal; color:#6f8799; font-size:.7rem; margin-top:3px; }

.exo-dark-band { border-top:1px solid rgba(73,211,255,.12); border-bottom:1px solid rgba(73,211,255,.12); background:linear-gradient(180deg,rgba(6,22,35,.7),rgba(4,8,14,.3)); }
.exo-feature-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); border:1px solid rgba(73,211,255,.12); }
.exo-feature-grid article { padding:25px; min-height:185px; border-right:1px solid rgba(73,211,255,.12); background:rgba(5,12,21,.55); }
.exo-feature-grid article:last-child { border-right:0; }
.exo-feature-grid article>span { color:#3edcff; font:700 .7rem var(--ff-mono); }
.exo-feature-grid h3 { margin:37px 0 10px; font-family:var(--ff-cond); font-size:1.35rem; }
.exo-feature-grid p { color:#71899b; font-size:.78rem; line-height:1.55; margin:0; }

.exo-cta { max-width:var(--shell); margin:0 auto 72px; padding:34px var(--gut); display:flex; justify-content:space-between; gap:28px; align-items:center; border:1px solid rgba(80,220,255,.18); background:linear-gradient(100deg,#06111e,#071b2a 55%,#05090f); }
.exo-cta span { color:#4bdfff; font:800 .66rem var(--ff-mono); letter-spacing:.13em; }
.exo-cta h2 { margin:8px 0 6px; }
.exo-cta p { color:#70899b; margin:0; }

.exo-perks-hero { max-width:var(--shell); margin:0 auto; padding:72px var(--gut) 38px; display:flex; align-items:flex-end; justify-content:space-between; gap:24px; }
.exo-perks-hero h1 { margin:14px 0 12px; font-family:var(--ff-cond); font-size:clamp(3.4rem,7vw,6.5rem); line-height:.85; letter-spacing:-.04em; color:#edfaff; }
.exo-perks-hero h1 span { color:#35dfff; }
.exo-perks-hero p { max-width:690px; margin:0; color:#788fa0; line-height:1.6; }

.exo-store-note { display:flex; align-items:flex-start; gap:20px; margin-bottom:18px; padding:15px 17px; border:1px solid rgba(63,211,255,.18); background:rgba(7,23,35,.5); }
.exo-store-note b { flex:0 0 auto; color:#50e0ff; font:.72rem var(--ff-mono); letter-spacing:.12em; }
.exo-store-note p { margin:0; color:#7891a1; font-size:.75rem; line-height:1.5; }
.exo-perk-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.exo-perk-card { position:relative; display:flex; flex-direction:column; min-height:490px; border:1px solid rgba(90,220,255,.15); background:linear-gradient(160deg,#07131f,#070b12 56%,#05080d); overflow:hidden; }
.exo-perk-card::before { content:""; position:absolute; inset:0 auto 0 0; width:3px; background:#24d8ff; box-shadow:0 0 25px rgba(36,216,255,.4); }
.exo-tier-blue::before { background:#4c7eff; }
.exo-tier-silver::before { background:#b7d3e7; }
.exo-tier-gold::before { background:#e8b93c; }
.exo-perk-top { display:flex; justify-content:space-between; align-items:center; padding:15px 16px; border-bottom:1px solid rgba(86,218,255,.1); }
.exo-perk-top span { color:#5ce4ff; font:.68rem var(--ff-mono); }
.exo-perk-top em { font-style:normal; color:#718698; font-size:.62rem; text-transform:uppercase; letter-spacing:.1em; }
.exo-perk-name { padding:25px 18px 17px; }
.exo-perk-name small { color:#47dcff; font:.64rem var(--ff-mono); letter-spacing:.15em; }
.exo-perk-name h3 { font-family:var(--ff-cond); font-size:2rem; margin:6px 0 10px; color:#f4fbff; }
.exo-perk-name p { color:#788d9b; font-size:.78rem; line-height:1.55; margin:0; min-height:73px; }
.exo-perk-list { padding:4px 18px 22px; display:grid; gap:9px; }
.exo-perk-list div { display:flex; gap:9px; align-items:flex-start; color:#b7c5ce; font-size:.75rem; }
.exo-perk-list i { color:#3bdfff; font-style:normal; font-weight:900; }
.exo-perk-foot { margin-top:auto; padding:16px 18px 18px; border-top:1px solid rgba(83,218,255,.12); }
.exo-price { display:flex; align-items:baseline; gap:6px; margin-bottom:13px; }
.exo-price b { font:900 2rem var(--ff-cond); color:#fff; }
.exo-price span { color:#657d8e; font-size:.68rem; }
.exo-perk-foot .btn { width:100%; }
.exo-perk-info { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.exo-perk-info article { border:1px solid rgba(83,218,255,.13); background:rgba(6,17,27,.55); padding:20px; }
.exo-perk-info b { color:#dffaff; }
.exo-perk-info p { color:#758c9c; font-size:.76rem; line-height:1.55; margin:8px 0 0; }
.exo-perk-info code { color:#57dfff; }

@media (max-width:980px){
  .exo-live-card { position:relative; right:auto; bottom:auto; margin:0 var(--gut) 35px; width:auto; }
  .exo-mode-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .exo-feature-grid,.exo-perk-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .exo-feature-grid article { border-bottom:1px solid rgba(73,211,255,.12); }
}
@media (max-width:620px){
  .exo-hero { min-height:auto; }
  .exo-hero-content { padding-top:78px; padding-bottom:50px; }
  .exo-live-card { grid-template-columns:1fr; }
  .exo-live-card>div { flex-direction:row; justify-content:space-between; align-items:center; }
  .exo-mode-grid,.exo-feature-grid,.exo-perk-grid,.exo-perk-info { grid-template-columns:1fr; }
  .exo-perks-hero,.exo-cta { flex-direction:column; align-items:flex-start; }
}


/* ===== EXO Gradient Name Builder ===== */
.exo-gradient-shell{position:relative;padding:28px;border:1px solid rgba(85,216,255,.16);border-radius:28px;background:radial-gradient(circle at top left,rgba(38,191,255,.12),transparent 38%),radial-gradient(circle at top right,rgba(125,92,255,.10),transparent 34%),linear-gradient(145deg,rgba(7,16,27,.94),rgba(5,9,15,.98));box-shadow:0 26px 80px rgba(0,0,0,.32);overflow:hidden}
.exo-gradient-shell::before{content:"";position:absolute;inset:auto -60px -100px auto;width:240px;height:240px;border-radius:999px;background:radial-gradient(circle,rgba(243,106,33,.18),transparent 68%);pointer-events:none}
.exo-gradient-shell::after{content:"";position:absolute;inset:0;border-radius:28px;pointer-events:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
.exo-gradient-head{position:relative;z-index:1;display:flex;align-items:flex-start;justify-content:space-between;gap:26px;margin-bottom:22px}
.exo-gradient-brand{display:flex;align-items:flex-start;gap:18px;max-width:860px}
.exo-gradient-icon{flex:0 0 62px;width:62px;height:62px;border-radius:18px;display:grid;place-items:center;border:1px solid rgba(97,228,255,.28);background:linear-gradient(145deg,rgba(18,33,56,.94),rgba(8,16,28,.92));box-shadow:0 18px 34px rgba(0,0,0,.22),inset 0 0 0 1px rgba(255,255,255,.02)}
.exo-gradient-icon span{font-size:1.4rem;line-height:1;color:#69e7ff;text-shadow:0 0 22px rgba(83,226,255,.45)}
.exo-gradient-head h2{margin:10px 0 8px;font-family:var(--ff-cond);font-size:clamp(2.2rem,4vw,3.25rem);letter-spacing:-.03em;color:#f1fbff}
.exo-gradient-head p{max-width:760px;color:#8aa0b0;line-height:1.65;margin:0}
.exo-gradient-access{min-width:245px;padding:18px 18px 16px;border-radius:18px;border:1px solid rgba(89,219,255,.16);background:linear-gradient(180deg,rgba(8,17,29,.86),rgba(6,10,17,.95));box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}
.exo-gradient-access span{display:block;color:#66e2ff;font:700 .64rem var(--ff-mono);letter-spacing:.16em;margin-bottom:8px}
.exo-gradient-access b{display:block;color:#f6fdff;font-size:1.05rem;line-height:1.2}
.exo-gradient-access small{display:block;color:#7390a2;font-size:.72rem;line-height:1.45;margin-top:7px}
.exo-gradient-access-active{border-color:rgba(74,224,255,.26);box-shadow:0 0 0 1px rgba(74,224,255,.04),0 12px 30px rgba(25,116,155,.12)}
.exo-gradient-access-locked{border-color:rgba(255,190,102,.18);background:linear-gradient(180deg,rgba(28,20,9,.78),rgba(12,10,12,.94))}
.exo-gradient-access-locked span{color:#ffc47b}
.exo-gradient-builder{position:relative;z-index:1;display:grid;grid-template-columns:1.02fr .98fr;gap:18px;padding:18px;border-radius:24px;border:1px solid rgba(78,213,255,.10);background:linear-gradient(145deg,rgba(5,10,17,.76),rgba(7,11,18,.92))}
.exo-gradient-controls,.exo-gradient-preview-panel{padding:0}
.exo-gradient-panel-head{margin-bottom:14px}
.exo-gradient-title{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-bottom:0;margin-bottom:6px;border-bottom:0}
.exo-gradient-title b{color:#d8fbff;font:.72rem var(--ff-mono);letter-spacing:.16em}
.exo-gradient-title span{color:#5d788b;font-size:.66rem;letter-spacing:.08em;text-transform:uppercase}
.exo-gradient-panel-head p{color:#6f8898;font-size:.77rem;line-height:1.55;margin:0}
.exo-gradient-card{padding:18px;border:1px solid rgba(85,216,255,.10);border-radius:20px;background:linear-gradient(180deg,rgba(10,17,27,.86),rgba(6,9,15,.94));box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}
.exo-gradient-card + .exo-gradient-card{margin-top:14px}
.exo-gradient-card-inputs{padding-bottom:14px}
.exo-gradient-minihead{margin-bottom:10px}
.exo-gradient-minihead span{color:#7893a5;font:700 .64rem var(--ff-mono);letter-spacing:.14em}
.exo-gradient-row{display:grid;grid-template-columns:46px minmax(0,1fr) 38px;gap:10px;align-items:center;margin-bottom:10px}
.exo-gradient-row input[type=color]{appearance:none;-webkit-appearance:none;width:46px;height:46px;padding:0;border:1px solid rgba(101,227,255,.18);border-radius:14px;background:#09111b;cursor:pointer;box-shadow:inset 0 0 0 4px rgba(255,255,255,.04)}
.exo-gradient-row input[type=color]::-webkit-color-swatch-wrapper{padding:0;border-radius:12px}
.exo-gradient-row input[type=color]::-webkit-color-swatch{border:0;border-radius:12px}
.exo-gradient-row input[type=color]::-moz-color-swatch{border:0;border-radius:12px}
.exo-gradient-hex,.exo-gradient-username input{width:100%;height:46px;border:1px solid rgba(99,224,255,.12);border-radius:14px;background:#050a11;color:#def7ff;padding:0 14px;font:800 .82rem var(--ff-mono);outline:none;transition:border-color .18s ease,box-shadow .18s ease,background .18s ease}
.exo-gradient-hex:focus,.exo-gradient-username input:focus{border-color:rgba(73,220,255,.50);box-shadow:0 0 0 4px rgba(49,193,255,.08);background:#07101a}
.exo-gradient-row button{height:38px;border:1px solid rgba(255,255,255,.07);border-radius:12px;background:#0b131d;color:#7f97a7;cursor:pointer;font-size:1rem;transition:border-color .18s ease,background .18s ease,color .18s ease}
.exo-gradient-row button:hover{border-color:rgba(103,225,255,.28);background:#101a25;color:#d8fbff}
.exo-add-color{margin-top:4px;width:100%;justify-content:center;border-style:dashed !important}
.exo-gradient-strip{height:42px;border-radius:16px;border:1px solid rgba(255,255,255,.12);margin:0 0 16px;box-shadow:inset 0 0 28px rgba(255,255,255,.05),0 12px 26px rgba(0,0,0,.16)}
.exo-gradient-username{display:grid;gap:8px}
.exo-gradient-username span{color:#7e97a8;font:700 .64rem var(--ff-mono);letter-spacing:.14em}
.exo-preview-stage{padding:18px 18px 20px;border:1px solid rgba(87,216,255,.12);border-radius:20px;background:linear-gradient(180deg,rgba(8,13,22,.92),rgba(4,7,12,.94));box-shadow:inset 0 1px 0 rgba(255,255,255,.03),0 16px 42px rgba(0,0,0,.22)}
.exo-preview-stage-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:14px}
.exo-preview-stage-top span,.exo-preview-stage-top b{font:700 .64rem var(--ff-mono);letter-spacing:.14em}
.exo-preview-stage-top span{color:#6d8697}
.exo-preview-stage-top b{color:#61e4ff;font-weight:800}
.exo-name-preview{display:flex;align-items:center;justify-content:center;min-height:132px;padding:14px 18px;border:1px solid rgba(70,215,255,.12);border-radius:18px;background-color:#04070b;background-size:100% 100%;background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-fill-color:transparent;font:900 clamp(2.2rem,5vw,3.45rem) var(--ff-cond);letter-spacing:.01em;text-align:center;text-shadow:none}
.exo-gradient-info-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:14px 0}
.exo-gradient-info-card{padding:16px;border:1px solid rgba(82,213,255,.10);border-radius:18px;background:rgba(6,12,20,.72)}
.exo-gradient-info-card span{display:block;color:#7590a2;font:700 .62rem var(--ff-mono);letter-spacing:.14em;margin-bottom:8px}
.exo-gradient-info-card b{display:block;color:#f2fbff;font-size:1rem;line-height:1.25}
.exo-gradient-info-card p{color:#738b9c;font-size:.74rem;line-height:1.55;margin:8px 0 0}
.exo-gradient-info-card code{color:#67e4ff}
.exo-gradient-action-stack .btn{width:100%;margin-top:0}
.exo-gradient-action-stack{display:grid;gap:10px}
.exo-gradient-status{margin:2px 0 0;color:#7d97a8;font-size:.74rem;line-height:1.5}
.exo-gradient-lock-card{padding:20px;border:1px solid rgba(255,190,102,.18);border-radius:20px;background:linear-gradient(180deg,rgba(30,21,10,.64),rgba(14,10,10,.84))}
.exo-gradient-lock-card b{display:block;color:#ffc47b;font-size:.82rem;letter-spacing:.08em}
.exo-gradient-lock-card p{color:#a38a72;line-height:1.6;font-size:.79rem;margin:10px 0 14px}
.exo-gradient-builder.is-locked .exo-gradient-controls{opacity:.58;pointer-events:none;filter:saturate(.82)}
@media (max-width: 980px){
  .exo-gradient-head{flex-direction:column}
  .exo-gradient-brand{max-width:none}
  .exo-gradient-access{width:100%}
  .exo-gradient-builder{grid-template-columns:1fr}
}
@media (max-width: 720px){
  .exo-gradient-shell{padding:18px;border-radius:22px}
  .exo-gradient-brand{flex-direction:column;gap:14px}
  .exo-gradient-icon{width:54px;height:54px;border-radius:16px}
  .exo-gradient-builder{padding:14px;border-radius:20px}
  .exo-gradient-card,.exo-preview-stage,.exo-gradient-lock-card{padding:15px}
  .exo-gradient-row{grid-template-columns:42px minmax(0,1fr) 36px}
  .exo-gradient-hex,.exo-gradient-username input,.exo-gradient-row input[type=color]{height:42px}
  .exo-gradient-info-grid{grid-template-columns:1fr}
}


/* ===== Website store credit / wallet ===== */
.wallet-balance-strip{
  display:grid;
  grid-template-columns:auto auto 1fr;
  gap:14px;
  align-items:center;
  margin:0 0 18px;
  padding:15px 17px;
  border:1px solid rgba(77,214,255,.16);
  border-radius:14px;
  background:linear-gradient(100deg,rgba(6,27,40,.75),rgba(8,12,19,.82));
}
.wallet-balance-strip>span{
  color:#68e5ff;
  font:800 .65rem var(--ff-mono);
  letter-spacing:.13em;
}
.wallet-balance-strip>b{
  color:#fff;
  font:900 1.45rem var(--ff-cond);
}
.wallet-balance-strip>small{
  color:#738c9d;
  font-size:.72rem;
  line-height:1.45;
}
.store-payment-actions{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:8px;
  width:100%;
}
.store-payment-actions.is-modal{
  grid-template-columns:1fr;
}
.store-kit-actions>.store-payment-actions{
  grid-column:1/-1;
  min-width:0;
}
.store-kit-actions>.store-payment-actions .btn{min-width:0;padding-left:10px;padding-right:10px;font-size:.72rem;letter-spacing:.045em;overflow:hidden;text-overflow:ellipsis;}
.btn-credit{
  border:1px solid rgba(102,230,255,.30);
  background:linear-gradient(135deg,#0b2736,#0c4257);
  color:#dffaff !important;
  font-weight:900;
  cursor:pointer;
}
.btn-credit:hover:not(:disabled){
  border-color:rgba(102,230,255,.62);
  background:linear-gradient(135deg,#0d3549,#11637e);
}
.btn-credit:disabled{
  opacity:.42;
  cursor:not-allowed;
  filter:saturate(.55);
}
.exo-payment-actions{
  grid-template-columns:1fr 1fr;
}
.wallet-panel{
  position:relative;
  overflow:hidden;
  border-color:rgba(75,214,255,.16) !important;
  background:radial-gradient(circle at top right,rgba(36,205,255,.12),transparent 52%),linear-gradient(145deg,#0c151e,#090c11) !important;
}
.wallet-panel::after{
  content:"";
  position:absolute;
  right:-32px;
  bottom:-54px;
  width:150px;
  height:150px;
  border-radius:999px;
  background:radial-gradient(circle,rgba(48,218,255,.14),transparent 68%);
  pointer-events:none;
}
.wallet-amount{
  color:#f5fdff;
  font:900 clamp(2.1rem,5vw,3.3rem) var(--ff-cond);
  letter-spacing:-.03em;
  margin:8px 0 10px;
}
.balance-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:74px;
  padding:7px 10px;
  border:1px solid rgba(83,218,255,.18);
  border-radius:999px;
  background:rgba(23,148,184,.08);
  color:#73e9ff;
  font:800 .72rem var(--ff-mono);
}
.wallet-history-panel .account-access-head{
  margin-bottom:14px;
}
.wallet-ledger .wallet-credit{
  color:#68dc8d;
  font-weight:800;
}
.wallet-ledger .wallet-debit{
  color:#ff9b8c;
  font-weight:800;
}
.admin-wallet-panel{
  border-color:rgba(78,216,255,.14) !important;
}
.wallet-admin-note{
  margin:14px 0 0;
}
@media(max-width:720px){
  .wallet-balance-strip{grid-template-columns:1fr;gap:6px}
  .store-payment-actions,.exo-payment-actions{grid-template-columns:1fr}
}


/* EXO 100X global polish */
.topbar{box-shadow:0 10px 32px rgba(0,0,0,.22)}
.hero::after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 -120px 140px rgba(3,8,18,.36)}
.panel,.feature,.wipe-card,.product-card,.kit-card{box-shadow:inset 0 1px 0 rgba(255,255,255,.025)}
.section.band{background:linear-gradient(180deg,rgba(6,17,27,.96),rgba(4,10,17,.96))}

/* =========================================================
   EXO Leaderboards — multi-mode competitive dashboard
   ========================================================= */
.exo-lb-hero{position:relative;overflow:hidden;border-bottom:1px solid var(--edge);min-height:245px;background:#06111b}
.exo-lb-hero-bg{position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,8,18,.96),rgba(3,12,25,.78) 45%,rgba(3,8,18,.74)),linear-gradient(0deg,rgba(3,8,18,.96),transparent 75%),url('/public/exo-website-header.png') center 42%/cover no-repeat;filter:saturate(.8)}
.exo-lb-hero-inner{position:relative;z-index:1;max-width:1440px;margin:auto;padding:34px var(--gut) 0}
.exo-lb-eyebrow{display:block;color:#89a7b9;font:700 .64rem var(--ff-mono);letter-spacing:.22em;text-transform:uppercase;margin-bottom:5px}
.exo-lb-hero h1{font-size:clamp(2.4rem,4vw,4rem);letter-spacing:-.05em}.exo-lb-hero h1 span{color:var(--red-hi)}
.exo-lb-hero p{margin:6px 0 20px;color:#9eb5c4;font-size:.9rem}
.exo-mode-tabs{display:flex;gap:5px;align-items:flex-end;overflow:auto}
.exo-mode-tabs a{min-width:145px;padding:12px 18px;border:1px solid rgba(83,216,255,.18);border-bottom:0;background:rgba(4,14,25,.74);border-radius:7px 7px 0 0;text-align:center}
.exo-mode-tabs a b{display:block;font-size:.86rem}.exo-mode-tabs a small{color:var(--muted);font-size:.61rem}
.exo-mode-tabs a.is-active{border-color:#F36A21;background:rgba(12,73,99,.62);box-shadow:inset 0 -3px 0 #F36A21,0 0 24px rgba(243,106,33,.09)}
.exo-mode-tabs a.is-active b{color:white}
.exo-lb-shell{max-width:1440px;margin:auto;padding:20px var(--gut) 58px}
.exo-lb-toolbar{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,420px) auto;gap:14px;align-items:center;margin-bottom:15px}
.exo-metric-tabs{display:flex;gap:7px;overflow:auto}.exo-metric-tabs a{white-space:nowrap;border:1px solid var(--edge);background:#07131f;color:#8fa9ba;border-radius:7px;padding:8px 13px;font-size:.7rem;font-weight:800}
.exo-metric-tabs a.is-active{color:#fff;border-color:#22dbff;background:#5A2A15;box-shadow:0 0 14px rgba(243,106,33,.12)}
.exo-lb-search{height:42px;display:flex;align-items:center;gap:10px;padding:0 13px;background:#06111b;border:1px solid var(--edge);border-radius:7px}.exo-lb-search svg{width:16px;fill:#8ca4b4}.exo-lb-search input{border:0!important;outline:0!important;background:transparent!important;color:white!important;padding:0!important;width:100%;font-size:.75rem}
.exo-wipe-chip{min-width:200px;padding:7px 11px;border:1px solid var(--edge);border-radius:7px;background:#071724;display:grid;grid-template-columns:1fr auto;gap:0 8px}.exo-wipe-chip span,.exo-wipe-chip small{color:var(--muted);font-size:.58rem}.exo-wipe-chip b{color:var(--gold);font-size:.75rem}
.exo-stat-cards{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin-bottom:14px}.exo-stat-cards article{min-height:86px;border:1px solid #6A351F;border-radius:7px;background:linear-gradient(145deg,#071724,#06111b);padding:14px;display:flex;gap:12px;align-items:center}.exo-stat-cards svg{width:28px;fill:#F36A21;filter:drop-shadow(0 0 8px rgba(243,106,33,.3))}.exo-stat-cards b{display:block;font-size:1.45rem;line-height:1}.exo-stat-cards span{display:block;color:#a7bdca;font-size:.68rem;margin-top:5px}.exo-stat-cards small{display:block;color:#FF8A32;font-size:.58rem;margin-top:2px}
.exo-lb-main-grid{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:14px;align-items:start}.exo-lb-primary,.exo-player-spotlight,.exo-mode-guide,.mode-mini-board{border:1px solid #4A2B1F;border-radius:7px;background:linear-gradient(155deg,#071520,#05101a)}
.exo-panel-head{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:13px 14px;border-bottom:1px solid var(--edge)}.exo-panel-head>div{display:flex;align-items:center;gap:10px}.exo-panel-head b{display:block;font-size:.76rem;letter-spacing:.06em}.exo-panel-head small,.exo-panel-head>span{display:block;color:var(--muted);font-size:.62rem}.exo-panel-icon{display:grid;place-items:center;color:#e8b93c}.exo-panel-icon svg{width:19px;fill:#e8b93c}
.exo-lb-table-wrap{border:0;border-radius:0;background:transparent}.exo-lb-table{min-width:900px}.exo-lb-table th{background:#261711}.exo-lb-table td{padding-block:9px}.mode-badge{display:inline-flex;padding:3px 7px;border-radius:4px;background:#102334;color:#a9c5d5;font-size:.6rem;font-weight:800}.mode-ffa{color:#ff8297}.mode-scrims{color:#7ee6ff}.mode-bedwars{color:#ffc969}.mode-creative{color:#8df0c1}
.exo-lb-side{display:grid;gap:14px}.exo-player-spotlight{overflow:hidden}.spotlight-player{display:flex;gap:11px;padding:14px;align-items:center;background:radial-gradient(circle at 85% 10%,rgba(243,106,33,.12),transparent 40%)}.spotlight-player img{width:62px;height:62px;border-radius:7px;object-fit:cover;border:1px solid #D76526}.spotlight-player h3{font-size:1rem;margin-bottom:2px}.spotlight-player code{display:block;color:var(--muted);font-size:.58rem}.spotlight-player .vip{display:inline-block;margin-top:6px}
.spotlight-stats{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--edge);border-bottom:1px solid var(--edge)}.spotlight-stats div{text-align:center;padding:10px 4px;border-right:1px solid var(--edge)}.spotlight-stats div:last-child{border:0}.spotlight-stats b{display:block;color:#78eaff;font-size:.9rem}.spotlight-stats span{color:var(--muted);font-size:.55rem}.spotlight-link{display:block;padding:11px 14px;color:#64e5ff;font-size:.65rem;font-weight:800}
.exo-mode-guide{padding:16px}.exo-mode-guide h3{font-size:1.1rem;margin:3px 0 7px}.exo-mode-guide p{margin:0;color:#8ea6b5;font-size:.7rem;line-height:1.55}
.exo-mode-board-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:12px}.mode-mini-board{overflow:hidden}.mode-mini-head{display:flex;justify-content:space-between;align-items:center;padding:11px;border-bottom:1px solid var(--edge)}.mode-mini-head>div{display:flex;gap:8px;align-items:center}.mode-mini-icon{width:27px;height:27px;display:grid;place-items:center;background:#0b3144;color:#FF9A45;border-radius:5px;font-weight:900}.mode-mini-head b{display:block;font-size:.65rem}.mode-mini-head small{display:block;color:var(--muted);font-size:.54rem}.mode-mini-head a{color:#FF9340;font-size:.55rem;font-weight:800}
.mode-mini-cols,.mode-mini-row{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(3,.6fr);align-items:center;gap:5px}.mode-mini-cols{padding:6px 9px;color:#6e899a;font-size:.49rem;text-transform:uppercase;letter-spacing:.08em}.mode-mini-cols span:not(:first-child),.mode-mini-row em{text-align:right}.mode-mini-row{padding:7px 9px;border-top:1px solid rgba(84,220,255,.07)}.mode-mini-row:hover{background:#0a1a27}.mode-mini-row>span{display:flex;align-items:center;gap:6px;min-width:0}.mode-mini-row img{width:22px;height:22px;border-radius:4px;object-fit:cover}.mode-mini-row b{font-size:.58rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mode-mini-row em{font-style:normal;font-size:.57rem;color:#c5d7e1}.mini-rank{font-style:normal;width:15px;color:#718a99;font-size:.54rem}.mini-rank-1{color:#e8b93c}.mini-rank-2{color:#c4d0d9}.mini-rank-3{color:#d57d42}.mode-mini-empty{padding:22px;text-align:center;color:var(--muted);font-size:.66rem}
@media(max-width:1180px){.exo-stat-cards{grid-template-columns:repeat(3,1fr)}.exo-lb-main-grid{grid-template-columns:1fr}.exo-lb-side{grid-template-columns:1fr 1fr}.exo-mode-board-grid{grid-template-columns:repeat(2,1fr)}.exo-lb-toolbar{grid-template-columns:1fr 1fr}.exo-wipe-chip{grid-column:1/-1}}
@media(max-width:760px){.exo-lb-hero-inner{padding-inline:18px}.exo-lb-shell{padding-inline:12px}.exo-mode-tabs a{min-width:115px}.exo-lb-toolbar{grid-template-columns:1fr}.exo-stat-cards{grid-template-columns:repeat(2,1fr)}.exo-lb-side,.exo-mode-board-grid{grid-template-columns:1fr}.exo-stat-cards article{min-height:75px}.exo-player-spotlight{order:-1}}


/* =========================================================
   EXO Leaderboards — full-width reference-match pass
   This intentionally avoids a narrow max-width so the page
   stays full at browser zoom levels below 100%.
   ========================================================= */
body:has(.exo-lb-shell) #main{width:100%;max-width:none!important;margin:0!important;padding:0!important}
body:has(.exo-lb-shell) .site-header .nav-inner,
body:has(.exo-lb-shell) .site-footer .footer-inner{width:min(96vw,2200px);max-width:none!important}

.exo-lb-hero{min-height:255px}
.exo-lb-hero-inner{
  width:min(96vw,2200px);
  max-width:none;
  padding-left:0;
  padding-right:0;
}
.exo-lb-shell{
  width:min(96vw,2200px);
  max-width:none;
  padding-left:0;
  padding-right:0;
}
.exo-lb-toolbar{
  grid-template-columns:minmax(700px,1.45fr) minmax(360px,.70fr) minmax(210px,.35fr);
}
.exo-stat-cards{grid-template-columns:repeat(6,minmax(0,1fr))}
.exo-stat-cards article{min-height:98px;padding:16px 18px}
.exo-stat-cards b{font-size:1.7rem}
.exo-stat-cards span{font-size:.75rem}
.exo-lb-main-grid{grid-template-columns:minmax(0,1fr) 390px;gap:16px}
.exo-lb-primary{min-width:0}
.exo-lb-table{min-width:1080px;width:100%}
.exo-lb-table th,.exo-lb-table td{padding-left:15px;padding-right:15px}
.exo-lb-side{gap:14px}
.exo-mode-board-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.mode-mini-board{min-height:260px}
.mode-mini-row{padding:9px 11px}
.mode-mini-row img{width:27px;height:27px}
.mode-mini-row b{font-size:.66rem}
.mode-mini-row em{font-size:.63rem}

/* richer hero like the approved concept */
.exo-lb-hero-bg{
  background:
    linear-gradient(90deg,rgba(2,8,16,.97),rgba(5,19,35,.77) 46%,rgba(2,8,16,.70)),
    linear-gradient(0deg,rgba(3,8,18,.97),transparent 72%),
    url('/public/exo-website-header.png') center 43%/cover no-repeat;
}
.exo-lb-hero h1{font-size:clamp(3rem,4.3vw,5.2rem);line-height:.96}
.exo-lb-hero p{font-size:1rem}
.exo-mode-tabs a{min-width:170px;padding:14px 22px}

/* Head-to-head block from the approved mockup */
.exo-head2head{
  border:1px solid #4A2B1F;border-radius:7px;
  background:linear-gradient(155deg,#071520,#05101a);overflow:hidden
}
.h2h-players{display:grid;grid-template-columns:1fr 38px 1fr;gap:7px;align-items:center;padding:13px}
.h2h-players>a{display:flex;align-items:center;gap:8px;background:#07131f;border:1px solid var(--edge);border-radius:6px;padding:8px;min-width:0}
.h2h-players img{width:32px;height:32px;border-radius:5px;object-fit:cover}
.h2h-players b{font-size:.68rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.h2h-players>span{text-align:center;color:#56dfff;font-weight:900;font-size:.7rem}
.h2h-row{padding:8px 13px;border-top:1px solid rgba(80,210,255,.08)}
.h2h-row>div:first-child{display:grid;grid-template-columns:.7fr 1fr .7fr;align-items:center}
.h2h-row b{font-size:.72rem}.h2h-row b:last-child{text-align:right}
.h2h-row span{text-align:center;color:var(--muted);font-size:.57rem}
.h2h-track{height:5px;background:#102536;border-radius:10px;margin-top:6px;overflow:hidden;display:flex}
.h2h-track i,.h2h-track em{height:100%;display:block;font-style:normal}
.h2h-track i{background:#22d9ff}.h2h-track em{background:#566d7d;margin-left:auto}

/* Use the viewport aggressively at 4K / zoomed-out desktop sizes. */
@media(min-width:1700px){
  .exo-lb-hero-inner,.exo-lb-shell{width:94vw}
  .exo-lb-main-grid{grid-template-columns:minmax(0,1fr) 420px}
  .exo-lb-table{min-width:1200px}
  .exo-panel-head{padding:15px 17px}
  .exo-panel-head b{font-size:.82rem}
}
@media(min-width:2300px){
  .exo-lb-hero-inner,.exo-lb-shell{width:92vw}
  .exo-lb-main-grid{grid-template-columns:minmax(0,1fr) 470px}
  .exo-stat-cards article{min-height:110px}
  .exo-stat-cards b{font-size:1.9rem}
}
@media(max-width:1180px){
  .exo-lb-hero-inner,.exo-lb-shell{width:96vw}
  .exo-lb-toolbar{grid-template-columns:1fr 1fr}
  .exo-lb-main-grid{grid-template-columns:1fr}
}

/* =========================================================
   EXO Leaderboards — design pass to match the approved mockup
   Scoped entirely to the leaderboard page classes.
   ========================================================= */

/* ---- hero ------------------------------------------------ */
.exo-lb-hero{min-height:225px}
.exo-lb-hero-inner{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;padding-top:30px}
.exo-lb-hero-copy{grid-column:1}
.exo-lb-hero h1{font-size:clamp(2.6rem,3.6vw,4.2rem);letter-spacing:-.045em}
.exo-lb-hero p{margin:8px 0 0;color:#93aec0}

.exo-lb-hero-tag{grid-column:2;grid-row:1;display:flex;flex-direction:column;gap:2px;padding-top:6px;text-align:left;border-left:1px solid rgba(94,206,255,.22);padding-left:14px}
.exo-lb-hero-tag b{font:800 .58rem/1.5 var(--ff-cond);letter-spacing:.3em;color:#bcd4e2;text-transform:uppercase}
.exo-lb-hero-tag small{margin-top:5px;font-size:.5rem;letter-spacing:.14em;color:#5d7a8c}

.exo-mode-tabs{grid-column:1/-1;margin-top:22px;gap:8px;align-items:stretch}
.exo-mode-tabs a{display:flex;align-items:center;justify-content:center;gap:9px;min-width:0;width:auto;flex:0 0 auto;
  padding:12px 22px;border:1px solid rgba(86,200,245,.22);border-bottom:1px solid rgba(86,200,245,.22);
  border-radius:9px 9px 0 0;background:rgba(6,18,30,.82);text-align:left}
.exo-mode-tabs a i{display:grid;place-items:center;line-height:0}
.exo-mode-tabs a i svg{width:17px;height:17px;fill:#7ea8bf;transition:fill .15s}
.exo-mode-tabs a b{font-size:.84rem;color:#c3d6e2}
.exo-mode-tabs a.is-active{border-color:#F36A21;background:linear-gradient(180deg,rgba(13,64,88,.72),rgba(8,36,52,.72));
  box-shadow:inset 0 -3px 0 #F36A21,0 -2px 22px rgba(243,106,33,.14)}
.exo-mode-tabs a.is-active i svg{fill:#4ee0ff}
.exo-mode-tabs a:hover i svg{fill:#4ee0ff}

/* ---- toolbar --------------------------------------------- */
.exo-lb-toolbar{align-items:stretch;gap:12px;margin:18px 0 14px}
.exo-metric-tabs{align-items:center;gap:8px}
.exo-metric-tabs a{padding:9px 16px;border-radius:9px;font-size:.72rem;letter-spacing:.02em;background:rgba(8,20,32,.9);border-color:rgba(72,150,190,.28)}
.exo-metric-tabs a.is-active{background:rgba(10,60,84,.85);border-color:#3fd8ff;color:#eafbff;box-shadow:0 0 0 1px rgba(63,216,255,.25),0 0 18px rgba(243,106,33,.14)}

.exo-lb-search{position:relative;display:flex;align-items:center;gap:10px;padding:0 14px;height:100%;min-height:44px;
  border:1px solid rgba(72,150,190,.30);border-radius:10px;background:rgba(8,20,32,.9)}
.exo-lb-search svg{width:16px;height:16px;fill:#5d8399;flex:0 0 auto}
.exo-lb-search input{flex:1;min-width:0;background:none;border:0;outline:0;color:var(--text);font-size:.82rem}
.exo-lb-search input::placeholder{color:#5f7d90}
.exo-search-clear{flex:0 0 auto;width:22px;height:22px;border:0;border-radius:5px;background:rgba(93,131,153,.18);color:#9fbccd;font-size:.9rem;line-height:1;cursor:pointer}
.exo-search-clear:hover{background:rgba(93,131,153,.32);color:#eafbff}

.exo-wipe-chip{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;
  min-width:0;padding:10px 14px;border-radius:10px;border:1px solid rgba(72,150,190,.30);background:rgba(8,20,32,.9)}
.exo-wipe-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:rgba(243,106,33,.10);border:1px solid rgba(243,106,33,.35)}
.exo-wipe-icon svg{width:17px;height:17px;fill:#38d6ff}
.exo-wipe-chip>div{display:grid;min-width:0}
.exo-wipe-chip span{color:#8fa9ba;font-size:.6rem;letter-spacing:.04em}
.exo-wipe-chip b{color:#eafbff;font-size:.95rem;font-weight:800;line-height:1.25;white-space:nowrap}
.exo-wipe-chip small{color:#63819a;font-size:.55rem}
.exo-wipe-btn{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;padding:8px 12px;border-radius:8px;
  border:1px solid rgba(63,216,255,.4);background:rgba(10,60,84,.6);color:#bdefff;font-size:.6rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em}
.exo-wipe-btn svg{width:12px;height:12px}
.exo-wipe-btn:hover{background:rgba(14,84,116,.8);color:#eafbff}

/* ---- stat cards ------------------------------------------ */
.exo-stat-cards{gap:12px}
.exo-stat-cards article{align-items:center;gap:14px;border-radius:10px;border-color:rgba(72,150,190,.28);
  background:linear-gradient(150deg,rgba(9,28,42,.96),rgba(6,16,26,.96));padding:15px 17px}
.exo-stat-icon{display:grid;place-items:center;width:42px;height:42px;flex:0 0 auto;border-radius:10px;
  background:rgba(243,106,33,.08);border:1px solid rgba(243,106,33,.22)}
.exo-stat-cards .exo-stat-icon svg{width:21px;height:21px;fill:#37d5ff;filter:none}
.exo-stat-cards>article>div{min-width:0}
.exo-stat-cards b{font-size:1.62rem;font-weight:800;letter-spacing:-.02em;white-space:nowrap}
.exo-stat-cards span{color:#9ab2c2;font-size:.72rem;margin-top:3px}
.exo-stat-cards small{display:flex;align-items:center;gap:5px;margin-top:4px;color:#e3b93f;font-size:.6rem;font-weight:700}
.exo-stat-cards small svg{width:11px;height:11px;fill:#e3b93f}
.exo-stat-cards small.is-muted{color:#63819a;font-weight:600}
.exo-stat-cards small.is-muted svg{fill:#63819a}

/* ---- panel head + pagination ------------------------------ */
.exo-panel-head{align-items:center}
.exo-panel-pager{display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:flex-end}
.exo-panel-pager>span{color:#7f9aad;font-size:.66rem;white-space:nowrap}
.exo-pager{display:flex;align-items:center;gap:4px}
.exo-pager a,.exo-pager-gap{display:grid;place-items:center;min-width:28px;height:28px;padding:0 6px;border-radius:7px;
  border:1px solid rgba(72,150,190,.26);background:rgba(8,20,32,.85);color:#9fbccd;font-size:.68rem;font-weight:700}
.exo-pager-gap{border-color:transparent;background:none;color:#5d7a8c}
.exo-pager a:hover{border-color:rgba(63,216,255,.5);color:#eafbff}
.exo-pager a.is-active{background:rgba(12,74,102,.9);border-color:#3fd8ff;color:#eafbff}
.exo-pager-arrow svg{width:13px;height:13px}
.exo-pager-arrow:first-child svg{transform:rotate(180deg)}
.exo-pager-arrow.is-off{opacity:.35;pointer-events:none}

/* ---- table ------------------------------------------------ */
.exo-lb-table thead th{font-size:.62rem;letter-spacing:.14em;color:#7d97a9;text-transform:uppercase;padding-top:12px;padding-bottom:12px}
.exo-lb-table tbody td{padding-top:9px;padding-bottom:9px;font-size:.8rem}
.exo-lb-table tbody tr{border-top:1px solid rgba(72,150,190,.12)}
.exo-lb-table tbody tr:hover{background:rgba(23,80,110,.16)}
.exo-lb-table .c-rank{width:58px}
.exo-lb-table td.num.is-sorted{color:#4ae08a;font-weight:800}
.exo-lb-table th.num.is-sorted{color:#4ee0ff}

.exo-lb-table .rank-num{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;font-size:.72rem;font-weight:800;color:#8ba4b5;background:none}
.exo-lb-table .rank-num.rank-1{background:linear-gradient(160deg,#F3D06A,#C6952A);color:#25190a;box-shadow:0 0 12px rgba(232,185,60,.28)}
.exo-lb-table .rank-num.rank-2{background:linear-gradient(160deg,#E2ECF3,#9DB0BE);color:#16222b}
.exo-lb-table .rank-num.rank-3{background:linear-gradient(160deg,#E7A469,#B06A2C);color:#22150a}

.exo-lb-table .player-cell img{width:31px;height:31px;border-radius:7px}
.exo-lb-table .player-meta b{font-size:.8rem}
.exo-lb-table .player-meta code{font-size:.58rem;color:#5f7d90}
.exo-lb-table .vip{margin-left:8px;font-size:.55rem}
.row-compare{margin-left:10px;padding:3px 8px;border-radius:6px;border:1px solid rgba(63,216,255,.4);color:#8fe4ff;font-size:.56rem;font-weight:800}
.row-compare:hover{background:rgba(12,74,102,.8);color:#eafbff}
.exo-lb-table .mode-badge{display:inline-block;padding:4px 10px;border-radius:6px;font-size:.58rem;font-weight:800;letter-spacing:.04em;
  background:rgba(243,106,33,.09);border:1px solid rgba(243,106,33,.22);color:#8fd8f2}
.streak-cell{display:inline-flex;align-items:center;gap:5px;justify-content:flex-end}
.streak-cell i{font-style:normal;font-size:.78rem;filter:saturate(1.1)}

/* ---- player spotlight ------------------------------------- */
.exo-player-spotlight{position:relative}
.spotlight-player{position:relative;gap:13px;padding:16px;
  background:linear-gradient(105deg,rgba(7,24,38,.94) 38%,rgba(10,44,66,.5) 68%,rgba(28,84,112,.28)),
             radial-gradient(circle at 88% 14%,rgba(243,106,33,.18),transparent 46%)}
.spotlight-player::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:url('/public/exo-website-header.png') right center/cover no-repeat;opacity:.13;mix-blend-mode:screen}
.spotlight-player img{position:relative;z-index:1;width:66px;height:66px;border-radius:9px;border-color:#2f9fc4}
.spotlight-id{position:relative;z-index:1;min-width:0}
.spotlight-player h3{font-size:1.02rem}
.spotlight-player code{font-size:.56rem;margin-top:1px}
.spotlight-tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}
.spotlight-tags .tag{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;border-radius:6px;
  font-size:.55rem;font-weight:800;font-style:normal;letter-spacing:.03em;white-space:nowrap}
.spotlight-tags .tag svg{width:10px;height:10px}
.tag-gold{background:rgba(232,185,60,.14);border:1px solid rgba(232,185,60,.45);color:#f0cf74}
.tag-gold svg{fill:#f0cf74}
.tag-cyan{background:rgba(243,106,33,.12);border:1px solid rgba(243,106,33,.42);color:#7fe3ff}
.tag-cyan svg{fill:#7fe3ff}
.tag-violet{background:rgba(150,120,255,.14);border:1px solid rgba(150,120,255,.42);color:#b7a4ff}
.tag-violet svg{fill:#b7a4ff}
.tag-vip{background:rgba(62,207,124,.12);border:1px solid rgba(62,207,124,.4);color:#7fe0a5}

.spotlight-stats{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(72,150,190,.16)}
.spotlight-stats>div{padding:12px 6px;text-align:center;border-left:1px solid rgba(72,150,190,.12)}
.spotlight-stats>div:first-child{border-left:0}
.spotlight-stats b{display:block;font-size:1.02rem;font-weight:800}
.spotlight-stats span{display:block;margin-top:3px;color:#7f9aad;font-size:.56rem;letter-spacing:.06em;text-transform:uppercase}
.spotlight-link{display:flex;align-items:center;gap:6px;justify-content:center;padding:11px;border-top:1px solid rgba(72,150,190,.16);
  color:#54ddff;font-size:.64rem;font-weight:800}
.spotlight-link svg{width:12px;height:12px}

/* ---- head to head ----------------------------------------- */
.h2h-players{grid-template-columns:1fr auto 1fr;gap:9px;padding:14px}
.h2h-chip{display:flex;align-items:center;gap:8px;min-width:0;padding:8px 9px;border-radius:8px;
  border:1px solid rgba(72,150,190,.28);background:rgba(8,20,32,.9)}
.h2h-chip img{width:28px;height:28px;border-radius:6px;object-fit:cover;flex:0 0 auto}
.h2h-chip b{flex:1;min-width:0;font-size:.7rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.h2h-chip.is-empty{justify-content:center;border-style:dashed}
.h2h-chip.is-empty span{color:#5f7d90;font-size:.62rem}
.h2h-clear{flex:0 0 auto;width:18px;height:18px;display:grid;place-items:center;border-radius:5px;
  background:rgba(93,131,153,.18);color:#9fbccd;font-size:.78rem;line-height:1}
.h2h-clear:hover{background:rgba(226,51,58,.25);color:#ffd7d9}
.h2h-vs{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;
  background:rgba(243,106,33,.08);border:1px solid rgba(243,106,33,.3);color:#54ddff;font-weight:900;font-size:.62rem}
.h2h-hint{padding:0 14px 15px;color:#5f7d90;font-size:.62rem}
.h2h-row b{font-size:.76rem;font-weight:800}
.h2h-row span{font-size:.56rem;letter-spacing:.06em;text-transform:uppercase}
.h2h-track i{background:linear-gradient(90deg,#27b7ff,#5ce4ff)}
.h2h-track em{background:#4a6577}

/* ---- mini mode boards ------------------------------------- */
.mode-mini-head{padding:12px 13px}
.mode-mini-icon{width:28px;height:28px;border-radius:7px;background:rgba(243,106,33,.1);border:1px solid rgba(243,106,33,.25);color:#54ddff}
.mode-mini-head b{font-size:.66rem;letter-spacing:.06em}
.mode-mini-head small{font-size:.55rem}
.mode-mini-head a{display:inline-flex;align-items:center;gap:4px;padding:5px 9px;border-radius:6px;
  border:1px solid rgba(63,216,255,.28);color:#7fe3ff;font-size:.55rem}
.mode-mini-head a:hover{background:rgba(12,74,102,.7);color:#eafbff}

@media(max-width:1180px){
  .exo-lb-hero-inner{grid-template-columns:1fr}
  .exo-lb-hero-tag{display:none}
  .exo-panel-pager{justify-content:flex-start}
}
@media(max-width:760px){
  .exo-mode-tabs a{padding:10px 14px}
  .exo-wipe-chip{grid-template-columns:auto 1fr;row-gap:8px}
  .exo-wipe-btn{grid-column:1/-1;justify-content:center}
  .spotlight-stats{grid-template-columns:repeat(2,1fr)}
}

/* ---- leaderboard toolbar fit-ups -------------------------- */
.exo-lb-toolbar{grid-template-columns:minmax(0,1.3fr) minmax(300px,.78fr) minmax(296px,.44fr)}
.exo-lb-search input[type=search]::-webkit-search-cancel-button,
.exo-lb-search input[type=search]::-webkit-search-decoration{-webkit-appearance:none;appearance:none;display:none}
.exo-wipe-chip b.cd-inline{color:#eafbff}
.exo-stat-cards b.cd-inline{color:var(--text)}
.exo-mode-tabs{margin-bottom:-1px}
@media(max-width:1420px){
  .exo-lb-toolbar{grid-template-columns:minmax(0,1fr) minmax(260px,.8fr);grid-auto-rows:auto}
  .exo-wipe-chip{grid-column:1/-1}
}
.exo-wipe-chip{gap:10px;padding:9px 12px}
.exo-wipe-chip small{white-space:nowrap;font-size:.52rem}
.exo-wipe-btn{padding:7px 10px;font-size:.55rem;letter-spacing:.05em}

/* ---- density pass: match the mockup's proportions --------- */
.exo-lb-hero{min-height:200px}
.exo-lb-hero-inner{padding-top:24px}
.exo-lb-hero h1{font-size:clamp(2.1rem,2.9vw,3.25rem)}
.exo-lb-hero p{font-size:.86rem;margin-top:6px}
.exo-lb-hero-tag b{font-size:.54rem;line-height:1.45}
.exo-mode-tabs{margin-top:18px}
.exo-mode-tabs a{padding:10px 20px}
.exo-mode-tabs a b{font-size:.78rem}

.exo-lb-shell{padding-top:16px}
.exo-lb-toolbar{margin:0 0 12px}
.exo-metric-tabs a{padding:8px 14px;font-size:.68rem}
.exo-lb-search{min-height:40px}
.exo-stat-cards article{min-height:84px;padding:13px 15px;gap:12px}
.exo-stat-icon{width:38px;height:38px;border-radius:9px}
.exo-stat-cards .exo-stat-icon svg{width:19px;height:19px}
.exo-stat-cards b{font-size:1.44rem}
.exo-stat-cards span{font-size:.68rem}

.exo-lb-table thead th{padding-top:10px;padding-bottom:10px;font-size:.58rem}
.exo-lb-table tbody td{padding-top:6px;padding-bottom:6px;font-size:.76rem}
.exo-lb-table .player-cell img{width:28px;height:28px;border-radius:6px}
.exo-lb-table .player-meta b{font-size:.76rem}
.exo-lb-table .player-meta code{font-size:.55rem}
.exo-lb-table .rank-num{width:23px;height:23px;font-size:.66rem}
.exo-lb-table .mode-badge{padding:3px 9px;font-size:.55rem}

.spotlight-player{padding:14px}
.spotlight-player img{width:58px;height:58px}
.spotlight-player h3{font-size:.94rem}
.spotlight-stats>div{padding:10px 6px}
.spotlight-stats b{font-size:.94rem}
.exo-panel-head{padding:12px 14px}

/* active nav item, as in the mockup */
.topbar nav a.is-active{color:#eafbff;box-shadow:inset 0 -2px 0 #F36A21}
.exo-lb-hero h1{font-size:clamp(2.4rem,3.4vw,3.7rem)}
/* let the hero artwork read through, as in the mockup */
.exo-lb-hero-bg{
  background:
    linear-gradient(90deg,rgba(2,8,16,.90) 0%,rgba(3,12,22,.62) 48%,rgba(2,8,16,.42) 100%),
    linear-gradient(0deg,rgba(3,8,18,.94),transparent 66%),
    url('/public/exo-website-header.png') center 43%/cover no-repeat;
  filter:saturate(.9)
}
.mode-mini-icon svg{width:15px;height:15px;fill:#54ddff}
.mini-rank{display:grid;place-items:center;width:19px;height:19px;border-radius:50%;font-style:normal;font-size:.58rem;font-weight:800;color:#8ba4b5}
.mini-rank-1{background:linear-gradient(160deg,#F3D06A,#C6952A);color:#25190a}
.mini-rank-2{background:linear-gradient(160deg,#E2ECF3,#9DB0BE);color:#16222b}
.mini-rank-3{background:linear-gradient(160deg,#E7A469,#B06A2C);color:#22150a}


/* =========================================================
   EXO Server page — expanded live network view
   ========================================================= */
.server-page-hero{position:relative;min-height:360px;overflow:hidden;border-bottom:1px solid var(--edge);background:#040b13}
.server-page-hero-bg{position:absolute;inset:0;background:
linear-gradient(90deg,rgba(3,8,16,.97),rgba(3,15,27,.78) 52%,rgba(3,8,16,.78)),
linear-gradient(0deg,#040b13 2%,transparent 55%),
url('/public/exo-website-header.png') center 45%/cover no-repeat;opacity:.92}
.server-page-hero-inner{position:relative;z-index:1;width:min(92vw,1750px);margin:auto;padding:56px 0 46px;display:grid;grid-template-columns:minmax(0,1fr) 430px;gap:55px;align-items:center}
.server-page-copy h1{font-size:clamp(3rem,5vw,5.5rem);letter-spacing:-.055em;line-height:.96;margin:8px 0 12px}
.server-page-copy>p{max-width:760px;color:#a0b5c4;font-size:1rem;line-height:1.6}
.server-hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.server-connect-command{display:inline-block;margin-top:13px;padding:8px 11px;border:1px solid rgba(74,216,255,.16);background:rgba(2,10,17,.74);color:#6ee7ff;border-radius:5px;font-size:.7rem}
.server-page-live-card{background:linear-gradient(150deg,rgba(8,27,41,.96),rgba(5,14,23,.96));border:1px solid #15516c;border-radius:10px;padding:20px;box-shadow:0 18px 60px rgba(0,0,0,.28)}
.live-card-top{display:flex;justify-content:space-between;align-items:center;color:#7894a7;font-size:.66rem;text-transform:uppercase;letter-spacing:.08em}
.live-card-pop{display:grid;grid-template-columns:auto 1fr auto;align-items:end;gap:9px;margin-top:22px}.live-card-pop>b{font-size:3.3rem;line-height:.85;color:white}.live-card-pop>span{font-size:.72rem;color:#9eb3c0;padding-bottom:5px}.live-card-pop>em{font-style:normal;color:#54ddff;font-size:.7rem;padding-bottom:6px}
.server-big-bar{display:block;height:7px;background:#0b2232;border-radius:999px;overflow:hidden;margin:16px 0 18px}.server-big-bar i{display:block;height:100%;background:linear-gradient(90deg,#22dafd,#68f3c1);border-radius:inherit}
.live-card-grid{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--edge)}.live-card-grid>div{padding:13px 5px;border-bottom:1px solid var(--edge)}.live-card-grid>div:nth-child(odd){border-right:1px solid var(--edge)}.live-card-grid span{display:block;color:#6f8797;font-size:.58rem;text-transform:uppercase;letter-spacing:.08em}.live-card-grid b{display:block;margin-top:3px;color:#fff;font-size:.85rem}
.server-page-shell{width:min(92vw,1750px);margin:auto;padding:22px 0 70px}
.server-overview-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:-42px;position:relative;z-index:3}
.server-overview-cards article{display:flex;gap:14px;min-height:106px;padding:18px;background:linear-gradient(145deg,#071724,#06101a);border:1px solid #134762;border-radius:8px;box-shadow:0 14px 35px rgba(0,0,0,.24)}
.server-overview-cards article>span{width:40px;height:40px;display:grid;place-items:center;border-radius:7px;background:#0b3145}.server-overview-cards svg{width:22px;fill:#37ddff}.server-overview-cards b{display:block;font-size:1.45rem}.server-overview-cards small{display:block;color:#dce8ee;font-size:.67rem;font-weight:800;margin-top:2px}.server-overview-cards p{color:#728b9a;font-size:.58rem;line-height:1.45;margin:4px 0 0}
.server-section-head{margin:52px 0 18px}.server-section-head h2{font-size:2rem;margin:3px 0 6px}.server-section-head p{max-width:750px;color:#809baa;font-size:.75rem}.server-section-head .eyebrow,.server-info-panel .eyebrow,.server-panel-head .eyebrow{color:#56ddff;font:.700 .62rem var(--ff-mono);letter-spacing:.15em;text-transform:uppercase}
.server-section-spaced{margin-top:48px}
.server-mode-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.server-mode-card{position:relative;overflow:hidden;min-height:250px;padding:18px;border:1px solid #14445c;border-radius:8px;background:linear-gradient(150deg,#081a27,#050e17)}
.server-mode-card:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 85% 5%,rgba(36,211,255,.14),transparent 40%);pointer-events:none}
.mode-card-icon{position:relative;width:42px;height:42px;display:grid;place-items:center;border-radius:8px;background:#0a3043;color:#43ddff;margin-bottom:14px}.mode-card-icon svg{width:21px;height:21px;fill:#43ddff}
.mode-card-copy{position:relative}.mode-card-copy>span{color:#55dfff;font-size:.58rem;text-transform:uppercase;letter-spacing:.1em;font-weight:800}.mode-card-copy h3{font-size:1.45rem;margin:2px 0 7px}.mode-card-copy p{color:#849eae;font-size:.68rem;line-height:1.55;min-height:62px}
.mode-card-stats{position:relative;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--edge);border-bottom:1px solid var(--edge);margin-top:12px}.mode-card-stats div{text-align:center;padding:10px 3px}.mode-card-stats div+div{border-left:1px solid var(--edge)}.mode-card-stats b{display:block;color:#eef8fb;font-size:.8rem}.mode-card-stats span{color:#617d8e;font-size:.51rem}
.mode-card-link{position:relative;display:inline-block;margin-top:13px;color:#55ddff;font-size:.62rem;font-weight:800}
.server-info-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(320px,.65fr);gap:14px;margin-top:46px}.server-info-stack{display:grid;gap:14px}
.server-info-panel{border:1px solid #123e55;background:linear-gradient(155deg,#071520,#050f18);border-radius:8px;padding:17px}.server-list-panel{padding:0;overflow:hidden}.server-panel-head{display:flex;align-items:center;justify-content:space-between;padding:17px;border-bottom:1px solid var(--edge)}.server-panel-head h3{font-size:1.2rem;margin:2px 0 0}.server-panel-head>span{color:#59defa;font-size:.66rem;font-weight:800}.server-list-panel .region-group{margin:0;border:0;border-radius:0}.server-list-panel .region-head{padding:11px 16px;margin:0}.server-list-panel .srow{margin:0;border-radius:0;border-left:0;border-right:0}
.server-info-panel>h3{font-size:1.2rem;margin:4px 0 13px}.server-feature-list{display:grid;gap:0}.server-feature-list div{padding:11px 0;border-top:1px solid rgba(84,216,255,.09)}.server-feature-list div:first-child{border-top:0}.server-feature-list b{display:block;font-size:.72rem}.server-feature-list span{display:block;color:#7794a5;font-size:.62rem;margin-top:2px;line-height:1.45}
.join-panel ol{list-style:none;counter-reset:join;margin:0;padding:0}.join-panel li{counter-increment:join;position:relative;padding:10px 0 10px 38px;border-top:1px solid rgba(84,216,255,.09)}.join-panel li:before{content:counter(join);position:absolute;left:0;top:9px;width:25px;height:25px;display:grid;place-items:center;border:1px solid #1e7897;border-radius:50%;color:#51ddff;font-size:.6rem;font-weight:900}.join-panel li b{display:block;font-size:.7rem}.join-panel li span{display:block;color:#7993a3;font-size:.61rem;margin-top:2px;line-height:1.45}.join-panel code{color:#5bdfff}.join-panel .full{width:100%;margin-top:12px}
.server-detail-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.server-detail-grid article{min-height:170px;padding:18px;border:1px solid #123f56;border-radius:8px;background:#06121d}.server-detail-grid article>span{width:36px;height:36px;display:grid;place-items:center;background:#0a3043;border-radius:7px}.server-detail-grid svg{width:19px;fill:#42ddff}.server-detail-grid h3{font-size:1rem;margin:15px 0 6px}.server-detail-grid p{color:#7893a2;font-size:.64rem;line-height:1.5;min-height:47px}.server-detail-grid a{color:#55dfff;font-size:.62rem;font-weight:800}

/* Leaderboard: keep mode-specific filters legible if a mode has fewer tabs. */
.exo-metric-tabs{flex-wrap:wrap}
.exo-metric-tabs a{display:inline-flex;align-items:center;justify-content:center}
.mode-creative + .num{font-variant-numeric:tabular-nums}

@media(max-width:1100px){
  .server-page-hero-inner{grid-template-columns:1fr;width:94vw}
  .server-page-live-card{max-width:650px}
  .server-page-shell{width:94vw}
  .server-overview-cards,.server-mode-grid,.server-detail-grid{grid-template-columns:repeat(2,1fr)}
  .server-info-grid{grid-template-columns:1fr}
}
@media(max-width:680px){
  .server-page-hero-inner{padding-top:38px}
  .server-page-copy h1{font-size:2.7rem}
  .server-overview-cards{grid-template-columns:1fr;margin-top:-24px}
  .server-mode-grid,.server-detail-grid{grid-template-columns:1fr}
  .server-hero-actions .btn{width:100%}
}


/* EXO 100X brand restoration */
.brand{display:inline-flex;align-items:center;min-width:118px}
.brand-logo{display:block;width:auto;height:44px;max-width:168px;object-fit:contain;filter:drop-shadow(0 0 16px rgba(243,106,33,.16))}
.footer-logo{display:block;width:auto;height:62px;max-width:210px;object-fit:contain;margin-bottom:14px;filter:drop-shadow(0 0 20px rgba(243,106,33,.14))}
@media (max-width:760px){.brand-logo{height:36px;max-width:136px}.footer-logo{height:52px;max-width:180px}}


/* EXO simple leaderboard */
.exo-simple-lb-hero .exo-lb-hero-inner{padding-bottom:32px}
.exo-simple-lb-hero .exo-lb-hero-copy{max-width:760px}
.exo-simple-lb{max-width:1240px}
.exo-lb-summary{grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:16px}
.exo-lb-card{overflow:hidden}
.exo-lb-head{min-height:70px}
.exo-lb-tools{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,430px);gap:14px;align-items:center;padding:14px 16px;border-bottom:1px solid var(--edge);background:rgba(8,9,12,.58)}
.exo-lb-card .table-wrap{border:0;border-radius:0;background:transparent}
.exo-lb-card .leaderboard-table{min-width:780px}
.exo-lb-card .leaderboard-table th{background:#17100c}
.exo-lb-card .leaderboard-table td{padding-top:12px;padding-bottom:12px}
@media(max-width:850px){.exo-lb-summary{grid-template-columns:repeat(2,1fr)}.exo-lb-tools{grid-template-columns:1fr}}


/* ---------- Clan Cores ---------- */
.cc-home-section{padding-top:26px}.cc-home-shell{position:relative;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr);min-height:540px;border:1px solid rgba(255,102,0,.18);background:linear-gradient(110deg,#07090c 0%,#0b0e12 58%,#11151b 100%);overflow:hidden}.cc-home-shell:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 62% 50%,rgba(255,102,0,.13),transparent 36%);pointer-events:none}.cc-home-copy{position:relative;z-index:2;padding:46px 38px}.cc-home-copy h2{font-size:clamp(34px,4vw,58px);margin:12px 0 12px}.cc-home-copy>p{max-width:680px;color:var(--muted);font-size:15px;line-height:1.7}.cc-home-art{min-height:540px;position:relative;overflow:hidden}.cc-home-art:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0a0d11 0%,rgba(10,13,17,.15) 38%,rgba(5,7,10,.20) 100%),linear-gradient(0deg,rgba(5,7,10,.50),transparent 48%)}.cc-home-banner{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.95) contrast(1.06)}.cc-home-logo{position:absolute;z-index:2;right:6%;bottom:5%;width:min(42%,360px);height:auto!important;object-fit:contain!important;filter:drop-shadow(0 12px 28px rgba(0,0,0,.65))}.cc-feature-row{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:28px 0}.cc-feature-row div{padding:14px 12px;border-top:2px solid var(--orange);background:rgba(255,255,255,.025)}.cc-feature-row b,.cc-feature-row span{display:block}.cc-feature-row b{text-transform:uppercase;font-size:11px}.cc-feature-row span{margin-top:5px;color:var(--muted);font-size:10px}.cc-home-summary,.cc-page-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.cc-summary{position:relative;min-height:110px;padding:16px 18px;border:1px solid rgba(255,255,255,.08);background:rgba(10,13,18,.88)}.cc-summary:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--orange)}.cc-summary span,.cc-summary b,.cc-summary strong{display:block}.cc-summary span{text-transform:uppercase;font-size:9px;color:#8b929d}.cc-summary b{margin-top:12px;font-size:19px}.cc-summary strong{margin-top:4px;font-size:10px;color:#b7bdc7}.cc-summary em{position:absolute;right:14px;bottom:14px;font-style:normal;color:var(--orange);font-weight:800}.cc-summary.cc-blue:before{background:#4d9fff}.cc-summary.cc-blue em{color:#4d9fff}.cc-summary.cc-gold:before{background:#ffd56a}.cc-summary.cc-gold em{color:#ffd56a}.cc-home-button{margin-top:20px}.cc-page-hero{position:relative;min-height:330px;border-bottom:1px solid rgba(255,102,0,.18);overflow:hidden}.cc-page-art{position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,8,12,.98) 0%,rgba(5,8,12,.72) 44%,rgba(5,8,12,.12) 82%),url('/public/clan-cores-banner.png') center 48%/cover no-repeat;filter:saturate(.97) contrast(1.04)}.cc-page-copy{position:relative;z-index:2;max-width:1180px;margin:auto;padding:86px 28px}.cc-page-copy h1{font-size:clamp(52px,7vw,92px);margin:8px 0}.cc-page-copy p{max-width:650px;color:#c1c7d0;line-height:1.7}.cc-page-section{padding-top:32px}.cc-page-summary{margin-bottom:38px}.cc-live-label{text-transform:uppercase;font-size:10px;color:#8b929d}.cc-table-wrap{border:1px solid rgba(255,255,255,.08);background:#090c10}.cc-table th{font-size:9px;text-transform:uppercase;color:#9299a4}.cc-table td{font-size:11px}.cc-table td:nth-child(3) b{color:var(--orange)}.cc-clan-link{color:#f6f8fb;font-weight:800;text-decoration:none}.cc-clan-link:hover{color:var(--orange)}.cc-core-live{color:#5ee27b!important;font-weight:800}.cc-table tr.is-selected{outline:1px solid rgba(255,102,0,.55);background:rgba(255,102,0,.06)}.cc-empty{padding:44px;border:1px solid rgba(255,255,255,.08);text-align:center;background:#0a0d11}.cc-empty b,.cc-empty span{display:block}.cc-empty span{margin-top:8px;color:var(--muted)}.cc-profile{margin-top:30px;padding:26px;border:1px solid rgba(255,102,0,.35);background:linear-gradient(145deg,#0b0e13,#080a0e)}.cc-profile-head{display:flex;align-items:center;justify-content:space-between;gap:16px}.cc-profile-head span{font-size:9px;color:var(--orange);text-transform:uppercase}.cc-profile-head h2{margin:4px 0;font-size:34px}.cc-profile-head p{color:var(--muted);margin:0}.cc-profile-stats{display:grid;grid-template-columns:repeat(9,1fr);gap:8px;margin:22px 0}.cc-profile-stats div{padding:12px;background:#10141a;border:1px solid rgba(255,255,255,.06);text-align:center}.cc-profile-stats span,.cc-profile-stats b{display:block}.cc-profile-stats span{font-size:8px;color:#8c939d;text-transform:uppercase}.cc-profile-stats b{margin-top:6px;font-size:14px}.cc-members-head h3{font-size:18px}.cc-members-head em{font-style:normal;color:var(--orange)}.cc-members{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.cc-member{display:flex;align-items:center;gap:12px;padding:12px;background:#10141a;border:1px solid rgba(255,255,255,.06)}.cc-member img{width:46px;height:46px;object-fit:cover;border-radius:4px}.cc-member b,.cc-member span{display:block}.cc-member span{font-size:10px;color:#7e8793;margin-top:3px}.cc-no-members{color:var(--muted)}
@media(max-width:900px){.cc-home-shell{grid-template-columns:1fr}.cc-home-art{min-height:300px;order:-1}.cc-feature-row{grid-template-columns:repeat(2,1fr)}.cc-home-summary,.cc-page-summary{grid-template-columns:1fr}.cc-profile-stats{grid-template-columns:repeat(3,1fr)}.cc-members{grid-template-columns:1fr}}@media(max-width:560px){.cc-home-copy{padding:28px 20px}.cc-feature-row{grid-template-columns:1fr}.cc-profile-head{align-items:flex-start;flex-direction:column}.cc-profile-stats{grid-template-columns:repeat(2,1fr)}}

.cc-page-logo{width:150px;max-width:28vw;height:auto;display:block;margin:0 0 12px;filter:drop-shadow(0 10px 24px rgba(0,0,0,.55))}
.cc-profile-identity{display:flex;align-items:center;gap:16px}
.cc-profile-identity>img{width:74px;height:74px;object-fit:contain;filter:drop-shadow(0 8px 20px rgba(0,0,0,.45))}
@media(max-width:900px){
  .cc-home-shell{grid-template-columns:1fr}.cc-home-art{min-height:360px}.cc-home-logo{width:min(46%,280px)}
  .cc-page-logo{width:120px}.cc-profile-identity>img{width:58px;height:58px}
}

/* Clan Cores hero polish v3 */
.cc-page-hero{min-height:360px!important}
.cc-page-copy{padding:92px 28px 70px!important;max-width:1180px!important}
.cc-page-copy h1{font-size:clamp(46px,6vw,78px)!important;margin:8px 0 10px!important}
.cc-page-copy p{max-width:560px!important;font-size:14px!important}
.cc-page-section{padding-top:22px!important}
.cc-page-summary{margin-bottom:28px!important}
.cc-home-logo{width:260px!important;max-width:40%!important;height:auto!important}
.cc-profile-identity>img{width:70px!important;height:70px!important}
@media(max-width:900px){.cc-home-logo{width:210px!important;max-width:48%!important}.cc-page-hero{min-height:320px!important}.cc-page-copy{padding:72px 20px 52px!important}}

/* EXO website-to-game kit publication status */
.exo-kit-sync-status{margin:20px 0;padding:18px 20px;border:1px solid #653718;border-left:4px solid #ff6600;background:#151a22;display:grid;gap:7px;line-height:1.5}
.exo-kit-sync-status b{color:#ff994d}.exo-kit-sync-status span{color:#e3e8ef;overflow-wrap:anywhere}.exo-kit-sync-status small{color:#acb6c5}
.exo-kit-sync-status.is-synced{border-left-color:#6fcf97}.exo-kit-sync-status.is-synced b{color:#6fcf97}
.kit-editor-shell input[readonly]{opacity:.65}.kit-editor-shell .checkbox{align-items:center}

/* Keep the kit editor readable independently of the compact five-column admin grids. */
.kit-editor-shell .admin-form{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
.kit-editor-shell .admin-form>.span-2{grid-column:1 / -1}
.kit-editor-shell .admin-form input,.kit-editor-shell .admin-form select,.kit-editor-shell .admin-form textarea{min-width:0;max-width:100%}
.kit-editor-shell .admin-form label{line-height:1.5}
@media(max-width:680px){.kit-editor-shell .admin-form{grid-template-columns:minmax(0,1fr)}.kit-editor-shell .admin-form>.span-2{grid-column:1}}

.kit-editor-shell{scroll-margin-top:160px}