/* TheNexus UI v2 "Ink & Signal" - additive restyle layer (docs/UI_UX_V2_2026-10.md).
 * Loaded LAST, and only while body.nx-ui-v2 exists (layout/ui-v2.php: ON by default since 2026-10-21; NEXUS_UI_V2=0 is the kill switch, ?ui=off shows the previous look in one browser).
 * Pure restyle of existing class names: no markup is required, nothing is hidden waiting for JS, no font or request is added.
 * Direction: neutral ink surfaces and hairlines, ONE signal green reserved for price, selection and the primary action,
 * real game art as the only colour, numbers that read first. Replaces the green-tinted fog + boxes-in-boxes of the Arena layer.
 * Every selector is scoped under .nx-ui-v2 (specificity beats the page files without !important); the few !important below answer
 * an existing !important in the Rift Lab / product files and are capped by tests/vnext_ui_v2_contracts.php. */

/* ---- 1. tokens: new names (--nxv2-*) and the legacy tokens re-pointed so existing rules follow ------------------------- */
body.nx-ui-v2{
  /* 2026-10-23 (owner: "I don't like this dark colour, look at the green next to it, the WHOLE site"): ONE soft dark-green-tinted surface system.
     The neutral greys (#0E1013 / #14171B / #1B2025) were the flat "olive-grey" cards; every surface, hairline and secondary text colour below now carries the
     brand-green hue, and the legacy --nx-* names are re-pointed so every page file that reads them follows. Contrast is pinned by tests/vnext_ui_v2_contracts.php. */
  --nxv2-ink-0:#050B07; --nxv2-ink-1:#0C1511; --nxv2-ink-2:#121E18; --nxv2-ink-3:#1A2A21;
  --nxv2-line:rgba(110,255,170,.13); --nxv2-line-2:rgba(110,255,170,.26);
  --nxv2-text:#F2F6F3; --nxv2-text-2:#C4CFC8; --nxv2-text-3:#A2B0A8;     /* 3 = 7.4:1 on ink-1, 6.7:1 on ink-2, 6.1:1 on ink-3; 2 = 11:1 on ink-2 */
  --nxv2-signal:#45F882; --nxv2-signal-ink:#04140A; --nxv2-signal-edge:rgba(69,248,130,.5); --nxv2-signal-wash:rgba(69,248,130,.09);
  --nxv2-amber:#FFBE18;
  --nxv2-panel:linear-gradient(180deg,rgba(69,248,130,.055),rgba(69,248,130,0) 260px),#0C1511;
  /* status language (payment, order, support): waiting = calm green, detected / confirming = amber, confirmed = solid green, failed / expired = red */
  --nxv2-st-wait:#45F882; --nxv2-st-wait-bg:rgba(69,248,130,.08); --nxv2-st-wait-line:rgba(69,248,130,.32);
  --nxv2-st-detect:#FFBE18; --nxv2-st-detect-bg:rgba(255,190,24,.1); --nxv2-st-detect-line:rgba(255,190,24,.42);
  --nxv2-st-done:#45F882; --nxv2-st-done-ink:#04140A;
  --nxv2-st-fail:#FF8A94; --nxv2-st-fail-bg:rgba(255,92,108,.1); --nxv2-st-fail-line:rgba(255,92,108,.45);
  --nxv2-off-bg:rgba(69,248,130,.07); --nxv2-off-line:rgba(110,255,170,.22); --nxv2-off-fg:#A2B6AA;   /* disabled control: still a button, still readable (6.4:1), never a dead grey slab */
  --nxv2-r-sm:6px; --nxv2-r-md:8px; --nxv2-r-lg:12px; --nxv2-r-pill:999px;
  --nxv2-t-fast:120ms; --nxv2-t-base:200ms; --nxv2-t-slow:320ms; --nxv2-ease:cubic-bezier(.2,.7,.2,1);
  --nxv2-fs-xs:12px; --nxv2-fs-sm:14px; --nxv2-fs-md:16px; --nxv2-fs-lg:18px; --nxv2-fs-xl:22px; --nxv2-fs-2xl:28px;
  --nxv2-fs-hero:clamp(34px,2.2vw + 24px,60px);
  --nxv2-lift:0 18px 36px -22px rgba(0,0,0,.85);
  /* legacy tokens: re-pointed to the green-tinted ink so every existing rule that reads them follows at once */
  --nx-bg:#050B07; --nx-s1:#0C1511; --nx-s2:#121E18; --nx-s3:#1A2A21;
  --nx-line:rgba(110,255,170,.13); --nx-line-strong:rgba(110,255,170,.26);
  --nx-surface-tint:rgba(69,248,130,.055); --nx-panel:linear-gradient(180deg,rgba(69,248,130,.055),rgba(69,248,130,0) 260px) #0C1511; --nx-panel-line:rgba(69,248,130,.2);
  --nx-field:#08110C; --nx-field-line:rgba(110,255,170,.28);
  --nx-text:#F2F6F3; --nx-text-2:#C4CFC8; --nx-text-3:#A2B0A8;
  --nx-signal-tint:rgba(69,248,130,.1);
  --nx-r-card:12px; --nx-r-control:8px;
  --nx-ring:0 0 0 2px #050B07,0 0 0 4px #6BFF9C;
  background-color:var(--nxv2-ink-0);
}
/* Backdrop (owner, 2026-10-21: "the new design is fine, bring the OLD background back on all pages"): v2 keeps the one site backdrop
   from nexus-bg.css untouched: the fixed nexus-green glow layer (body::before), the 64px grid and the constellation canvas (#nx-bg),
   and the static fallback for low-end devices. v2 used to hide all three; it now only keeps its own surfaces from covering them
   (header translucent, hero art and rail fade out instead of ending in a solid page-colour band). */
.nx-ui-v2 .nx4-hero{border-bottom-color:var(--nxv2-line)}
.nx-ui-v2 :where(h1,h2,h3){text-wrap:balance}
.nx-ui-v2 :focus-visible{outline:2px solid #6BFF9C;outline-offset:2px}

/* ---- 2. header: one opaque bar, a hairline, a clear current-section mark --------------------------------------------- */
.nx-ui-v2 .nx4-nav-list>li>a,.nx-ui-v2 .nx4-nav-list>li>button{font-size:var(--nxv2-fs-sm);font-weight:500;letter-spacing:0;color:var(--nxv2-text-2);transition:color var(--nxv2-t-fast) var(--nxv2-ease)}
.nx-ui-v2 .nx4-nav-list>li>a:hover,.nx-ui-v2 .nx4-nav-list>li>button:hover,.nx-ui-v2 .nx4-nav-list>li>a[aria-current],.nx-ui-v2 .nx4-nav-list>li>button[aria-expanded="true"]{color:var(--nxv2-text)}

/* ---- 3. buttons: the green fill is the only chromatic control; secondary is a hairline ----------------------------------- */
.nx-ui-v2 .nxh-btn,.nx-ui-v2 .th-btn,.nx-ui-v2 .bf-btn,.nx-ui-v2 .nxbi-btn{border-radius:var(--nxv2-r-md);font-weight:600;letter-spacing:0;transition:background-color var(--nxv2-t-fast) var(--nxv2-ease),border-color var(--nxv2-t-fast) var(--nxv2-ease),color var(--nxv2-t-fast) var(--nxv2-ease),transform 90ms var(--nxv2-ease)}
.nx-ui-v2 .nxh-btn--primary{background:var(--nxv2-signal);border-color:var(--nxv2-signal);color:var(--nxv2-signal-ink);box-shadow:none}
.nx-ui-v2 .nxh-btn--primary:hover{background:#6BFF9C;border-color:#6BFF9C;box-shadow:none}
.nx-ui-v2 .nxh-btn:not(.nxh-btn--primary){background:transparent;border:1px solid var(--nxv2-line-2);color:var(--nxv2-text)}
.nx-ui-v2 .nxh-btn:not(.nxh-btn--primary):hover{background:var(--nxv2-signal-wash);border-color:var(--nxv2-signal-edge)}
.nx-ui-v2 .nxh-btn:active,.nx-ui-v2 .th-btn:active{transform:translateY(1px)}

/* ---- 4. home hero: copy on a neutral scrim, a command-bar search, the art left alone -------------------------------------- */
.nx-ui-v2 .nxh-hero h1{font-family:var(--nx-font-display);font-weight:800;font-size:var(--nxv2-fs-hero);line-height:1.04;letter-spacing:-.022em;text-transform:none;text-wrap:balance;max-width:9.7em}
/* Perf wave 2 (CLS): 9.7em = 15 x the width of a 0 in Exo 2 800 (0.646em). The old 15ch took its width from whichever face was ready, so the hero title re-wrapped (CLS 0.10 on /ar/) when the display face arrived; Changa 700 is 0.663em, hence 9.95em in Arabic. */
.nx-ui-v2 .nxh-hero h1:lang(ar){max-width:9.95em}
.nx-ui-v2 .nxh-hero-sub{color:var(--nxv2-text-2);font-size:var(--nxv2-fs-lg);line-height:1.5;max-width:44ch}
@media (min-width:900px){
  .nx-ui-v2 .nxh-hero::before{background:linear-gradient(90deg,rgba(6,10,8,.92) 0,rgba(6,10,8,.7) 38%,rgba(6,10,8,0) 72%)}
  [dir="rtl"] .nx-ui-v2 .nxh-hero::before{background:linear-gradient(270deg,rgba(6,10,8,.92) 0,rgba(6,10,8,.7) 38%,rgba(6,10,8,0) 72%)}
}
.nx-ui-v2 .nxh-hero-search{background:var(--nxv2-ink-1);border:1px solid var(--nxv2-line-2);border-radius:var(--nxv2-r-md);color:var(--nxv2-text-2);transition:border-color var(--nxv2-t-fast) var(--nxv2-ease)}
.nx-ui-v2 .nxh-hero-search:hover{border-color:var(--nxv2-signal-edge);color:var(--nxv2-text)}
.nx-ui-v2 .nxh-quick-label{color:var(--nxv2-text-3);font-size:var(--nxv2-fs-xs);letter-spacing:0;text-transform:none}
.nx-ui-v2 .nxh-quick a{background:var(--nxv2-ink-1);border:1px solid var(--nxv2-line);border-radius:var(--nxv2-r-md);color:var(--nxv2-text);font-weight:500;transition:border-color var(--nxv2-t-fast) var(--nxv2-ease)}
.nx-ui-v2 .nxh-quick a:hover{border-color:var(--nxv2-line-2)}

/* ---- 5. section heads: one display heading and one hairline (the tick bar and the green rule are gone) ----------------------- */
.nx-ui-v2 .nxh-head{padding-block-end:var(--nx-sp-3);align-items:baseline}
.nx-ui-v2 .nxh-head::after{background:var(--nxv2-line)}
.nx-ui-v2 .nxh-head h2,.nx-ui-v2 .nxh-card h2{font-size:var(--nxv2-fs-xl);line-height:1.2;font-weight:800;letter-spacing:-.01em;gap:0}
.nx-ui-v2 .nxh-head h2::before{content:none}
.nx-ui-v2 .nxh-more{color:var(--nxv2-text-2);font-size:var(--nxv2-fs-sm);font-weight:500;transition:color var(--nxv2-t-fast) var(--nxv2-ease)}
.nx-ui-v2 .nxh-more:hover{color:var(--nxv2-signal)}
.nx-ui-v2 .nxh-head-note{color:var(--nxv2-text-3);font-size:var(--nxv2-fs-sm)}

/* ---- 6. game and gift tiles: art first, one hover language (lift 2px, brighter hairline, a cursor spotlight) ---------------- */
.nx-ui-v2 .nxt-art{border-radius:var(--nxv2-r-lg);border:1px solid var(--nxv2-line);background:var(--nxv2-ink-2);box-shadow:none;transition:border-color var(--nxv2-t-base) var(--nxv2-ease),transform var(--nxv2-t-base) var(--nxv2-ease),box-shadow var(--nxv2-t-base) var(--nxv2-ease)}
.nx-ui-v2 .nxt-art::after{height:34%;background:linear-gradient(180deg,rgba(6,10,8,0),rgba(6,10,8,.5))}
.nx-ui-v2 .nxt-art::before,.nx-ui-v2 .nxv2-spot::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;opacity:0;border-radius:inherit;background:radial-gradient(180px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.13),transparent 62%);transition:opacity var(--nxv2-t-base) var(--nxv2-ease)}
.nx-ui-v2 .nxt-name{font-size:15px;font-weight:600;letter-spacing:0;color:var(--nxv2-text)}
.nx-ui-v2 .nxt-meta{font-size:var(--nxv2-fs-xs);color:var(--nxv2-text-3)}
@media (hover:hover){
  .nx-ui-v2 .nxt-link:hover .nxt-art{border-color:var(--nxv2-line-2);box-shadow:var(--nxv2-lift);transform:translateY(-2px)}
  .nx-ui-v2 .nxt-link:hover .nxt-name{color:var(--nxv2-text)}
  .nx-ui-v2 .nxt-link:hover .nxt-art::before,.nx-ui-v2 .nxv2-spot:hover::before{opacity:1}
}
.nx-ui-v2 .nxt-link:focus-visible .nxt-art{border-color:var(--nxv2-signal)}

/* ---- 7. the three steps: a ruled row, not three boxes; the numbers are a real sequence so they stay ------------------------- */
.nx-ui-v2 .nxh-steps{gap:0}
.nx-ui-v2 .nxh-steps li{background:none;border:0;border-top:1px solid var(--nxv2-line);border-radius:0;padding:var(--nx-sp-4) 0}
.nx-ui-v2 .nxh-steps li::after{inset-block-start:var(--nx-sp-4);inset-inline-end:0;color:var(--nxv2-text-3)}
.nx-ui-v2 .nxh-step-n{background:var(--nxv2-ink-2);color:var(--nxv2-signal);border:1px solid var(--nxv2-line);border-radius:var(--nxv2-r-md)}
@media (min-width:768px){.nx-ui-v2 .nxh-steps{gap:var(--nx-sp-8)}.nx-ui-v2 .nxh-steps li{padding:var(--nx-sp-5) 0 0}}

/* ---- 9. trust row and reviews: quiet, no containers ------------------------------------------------------------------------- */
.nx-ui-v2 .nxh-trust-list{background:none;border:0;border-top:1px solid var(--nxv2-line);border-radius:0;padding:var(--nx-sp-5) 0 0}
.nx-ui-v2 .nxh-trust-list .nx-i{color:var(--nxv2-signal)}
.nx-ui-v2 .nxh-rev{background:var(--nxv2-ink-1);border:1px solid var(--nxv2-line);border-radius:var(--nxv2-r-lg)}

/* ---- 10. game hub and product: panels become ruled sections; the price row is a table of numbers ---------------------------- */
.nx-ui-v2 :is(.nx4b-step,#prod-view .nx4b-box,.nx4b-head,#prod-view .nx4b-info>*,#prod-view .prod-account-specs,.nx4-pre-box,.prod-section-shell){background:var(--nxv2-ink-1)!important;border:1px solid var(--nxv2-line)!important;border-radius:var(--nxv2-r-lg)!important;box-shadow:none!important}
.nx-ui-v2 .nx4b-step-h{font-size:var(--nxv2-fs-lg);font-weight:700;letter-spacing:-.005em}
.nx-ui-v2 .nx4b-num{background:var(--nxv2-ink-3);color:var(--nxv2-text);border:1px solid var(--nxv2-line-2)}
.nx-ui-v2 :is(#wc-region-config,#nx4-pregrid) .nx4-pack{background:var(--nxv2-ink-2)!important;border-color:var(--nxv2-line)!important;border-radius:10px!important;box-shadow:none;transition:border-color var(--nxv2-t-fast) var(--nxv2-ease),background-color var(--nxv2-t-fast) var(--nxv2-ease)}
.nx-ui-v2 :is(#wc-region-config,#nx4-pregrid) .nx4-pack:hover{background:var(--nxv2-ink-3)!important;border-color:var(--nxv2-line-2)!important}
.nx-ui-v2 :is(#wc-region-config,#nx4-pregrid) .nx4-pack:is(.on,[aria-checked="true"]){background:var(--nxv2-signal-wash)!important;border-color:var(--nxv2-signal)!important;box-shadow:0 0 0 1px var(--nxv2-signal)!important}
.nx-ui-v2 :is(#wc-region-config,#nx4-pregrid) .nx4-pack-name{font-size:var(--nxv2-fs-lg);line-height:1.25;font-weight:700;letter-spacing:-.005em}
.nx-ui-v2 :is(#wc-region-config,#nx4-pregrid) .nx4-pack-unit{font-size:var(--nxv2-fs-xs);font-weight:500;color:var(--nxv2-text-3)}
.nx-ui-v2 :is(#wc-region-config,#nx4-pregrid) .nx4-pack-type{color:var(--nxv2-text-3);font-size:var(--nxv2-fs-xs)}
.nx-ui-v2 :is(.nx64-product-page,.nx-game-hub,body) :is(#wc-region-config,#nx4-pregrid) .nx4-pack-price{font-size:var(--nxv2-fs-lg);font-weight:800;letter-spacing:-.01em;margin-top:2px!important}
.nx-ui-v2 :is(#wc-region-config,#nx4-pregrid) .nx4-pack-badge{border-radius:var(--nxv2-r-sm);background:var(--nxv2-amber);color:#1a1200;font-weight:800;font-size:11px}
.nx-ui-v2 .nx4-seg-btn[aria-pressed="true"],.nx-ui-v2 .nx4-seg-btn.is-on{background:var(--nxv2-ink-3);border-color:var(--nxv2-signal-edge);color:var(--nxv2-text)}

/* ---- 11. blog: ruled cards, one featured, text that reads --------------------------------------------------------------------- */
.nx-ui-v2 .bh-card{position:relative;background:var(--nxv2-ink-1);border:1px solid var(--nxv2-line);border-radius:var(--nxv2-r-lg);box-shadow:none;overflow:hidden;transition:border-color var(--nxv2-t-base) var(--nxv2-ease),transform var(--nxv2-t-base) var(--nxv2-ease)}
.nx-ui-v2 .bh-card .body h3{font-size:var(--nxv2-fs-lg);line-height:1.3;font-weight:700;letter-spacing:-.005em}
.nx-ui-v2 .bh-card--feature .body h3{font-size:var(--nxv2-fs-2xl);line-height:1.18;letter-spacing:-.012em}
.nx-ui-v2 .bh-card .meta{color:var(--nxv2-text-3);font-size:var(--nxv2-fs-xs)}
.nx-ui-v2 .bh-card .cat{color:var(--nxv2-text-2);background:var(--nxv2-ink-3);border-radius:var(--nxv2-r-sm);letter-spacing:0;text-transform:none}
.nx-ui-v2 .bh-card .read{color:var(--nxv2-signal);font-weight:600}
@media (hover:hover){.nx-ui-v2 .bh-card:hover{border-color:var(--nxv2-line-2);transform:translateY(-2px)}.nx-ui-v2 .bh-card:hover::before{opacity:1}}
.nx-ui-v2 .bh-card::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;opacity:0;border-radius:inherit;background:radial-gradient(220px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.07),transparent 62%);transition:opacity var(--nxv2-t-base) var(--nxv2-ease)}
.nx-ui-v2 .nxbi-chip{background:var(--nxv2-ink-1);border:1px solid var(--nxv2-line);border-radius:var(--nxv2-r-md)}
.nx-ui-v2 .nxbi-chip.is-on,.nx-ui-v2 .nxbi-chip[aria-current="true"],.nx-ui-v2 .nxbi-chip.active{border-color:var(--nxv2-signal-edge);background:var(--nxv2-signal-wash)}

/* ---- 12. Rift Lab hub: the champion grid is the best surface on the site, so it keeps its art and gains readable type ------------ */
.nx-ui-v2 .riftlab-panel,.nx-ui-v2 .rl-hub,.nx-ui-v2 .rl-lol-panel{background:var(--nxv2-ink-1)!important;border:1px solid var(--nxv2-line);border-radius:var(--nxv2-r-lg);box-shadow:none}
.nx-ui-v2 .rl-champion-toolbar{background:var(--nxv2-ink-1);-webkit-backdrop-filter:none;backdrop-filter:none}
.nx-ui-v2 .rl-searchbox{background:var(--nxv2-ink-0);border-color:var(--nxv2-line-2);border-radius:var(--nxv2-r-md)}
.nx-ui-v2 .rl-searchbox:focus-within{border-color:var(--nxv2-signal-edge)}
.nx-ui-v2 .rl-role-filters button{background:var(--nxv2-ink-2);border-color:var(--nxv2-line);color:var(--nxv2-text-2);font-size:13px;font-weight:600;border-radius:var(--nxv2-r-md)}
.nx-ui-v2 .rl-role-filters button.on,.nx-ui-v2 .rl-role-filters button:hover{background:var(--nxv2-signal);color:var(--nxv2-signal-ink);border-color:var(--nxv2-signal)}
.nx-ui-v2 .rl-champion-card{position:relative;background:var(--nxv2-ink-2)!important;border-color:var(--nxv2-line)!important;border-radius:10px!important}
.nx-ui-v2 .rl-champion-card b{font-size:13px!important;font-weight:700;line-height:1.25}
.nx-ui-v2 .rl-champion-card small{font-size:11px!important;color:var(--nxv2-text-3)!important}
.nx-ui-v2 .rl-champion-card>em{font-size:12px!important;color:var(--nxv2-signal)!important}
@media (hover:hover){.nx-ui-v2 .rl-champion-card:hover{border-color:var(--nxv2-line-2)!important;box-shadow:var(--nxv2-lift)}}
.nx-ui-v2 .rl-champion-card::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;opacity:0;border-radius:inherit;background:radial-gradient(150px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.12),transparent 62%);transition:opacity var(--nxv2-t-base) var(--nxv2-ease)}
@media (hover:hover){.nx-ui-v2 .rl-champion-card:hover::before{opacity:1}}

/* ---- 13. footer: quiet columns, headings in sentence case ------------------------------------------------------------------------- */
.nx-ui-v2 .nxf{background:var(--nxv2-ink-0);border-top:1px solid var(--nxv2-line)}
.nx-ui-v2 .nxf-h{font-size:var(--nxv2-fs-sm);font-weight:700;letter-spacing:0;text-transform:none;color:var(--nxv2-text)}
.nx-ui-v2 .nxf-col a{color:var(--nxv2-text-2);transition:color var(--nxv2-t-fast) var(--nxv2-ease)}
.nx-ui-v2 .nxf-col a:hover{color:var(--nxv2-signal)}
.nx-ui-v2 .nxf-news{background:var(--nxv2-ink-1);border:1px solid var(--nxv2-line);border-radius:var(--nxv2-r-lg);box-shadow:none}
.nx-ui-v2 .nxf-bottom,.nx-ui-v2 .nxf-fine{color:var(--nxv2-text-3)}

/* ---- 14. game logo rail (layout/ui-v2-rail.php): a calm row of the games we serve; it only moves when it is wider than the screen ---- */
.nx-ui-v2 .nxv2-rail{--nxv2-rail-dur:70s;position:relative;padding:0;margin:0;overflow:hidden;border-block:1px solid var(--nxv2-line);background:rgba(6,10,8,.4);-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.nx-ui-v2 .nxv2-rail-track{display:flex;width:max-content;gap:12px;margin:0;padding:14px 6px;list-style:none}
.nx-ui-v2 .nxv2-rail-track li{flex:none}
.nx-ui-v2 .nxv2-rail a{display:flex;align-items:center;gap:10px;padding:6px 14px 6px 8px;border:1px solid var(--nxv2-line);border-radius:var(--nxv2-r-md);color:var(--nxv2-text-2);font-size:var(--nxv2-fs-sm);font-weight:500;text-decoration:none;white-space:nowrap;transition:color var(--nxv2-t-fast) var(--nxv2-ease),border-color var(--nxv2-t-fast) var(--nxv2-ease)}
.nx-ui-v2 .nxv2-rail a:hover{color:var(--nxv2-text);border-color:var(--nxv2-line-2)}
.nx-ui-v2 .nxv2-rail img{width:28px;height:28px;border-radius:var(--nxv2-r-sm);object-fit:cover;display:block}
@media (hover:hover) and (prefers-reduced-motion:no-preference){
  .nx-ui-v2 .nxv2-rail-track{animation:nxv2-rail var(--nxv2-rail-dur) linear infinite}
  .nx-ui-v2 .nxv2-rail:hover .nxv2-rail-track,.nx-ui-v2 .nxv2-rail:focus-within .nxv2-rail-track{animation-play-state:paused}
}
@keyframes nxv2-rail{to{transform:translateX(-50%)}}
[dir="rtl"] .nx-ui-v2 .nxv2-rail-track{animation-direction:reverse}
/* the second copy of the list exists only for the loop; without motion it is hidden so nothing is read twice */
@media (hover:none),(prefers-reduced-motion:reduce){.nx-ui-v2 .nxv2-rail{overflow-x:auto;-webkit-mask-image:none;mask-image:none;scrollbar-width:none}.nx-ui-v2 .nxv2-rail-track{animation:none}.nx-ui-v2 .nxv2-rail-dup{display:none}}

/* ---- 15. motion safety and high-contrast fallbacks ---------------------------------------------------------------------------------- */
@media (prefers-reduced-motion:reduce){
  .nx-ui-v2 *,.nx-ui-v2 *::before,.nx-ui-v2 *::after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
  .nx-ui-v2 .nxt-link:hover .nxt-art,.nx-ui-v2 .bh-card:hover{transform:none}
}
@media (forced-colors:active){
  .nx-ui-v2 .nx4-pack[aria-checked="true"],.nx-ui-v2 .nxt-link:focus-visible .nxt-art{outline:2px solid Highlight}
  .nx-ui-v2 .nxh-btn--primary{border:1px solid ButtonText}
}

/* ---- 16. default-on consistency pass (2026-10-21, docs/UI_UX_V2_2026-10.md "Default-on") -------------------------------------------------
   Found by rendering every public page type with the layer on: the pages the first two phases never reached still carried the legacy rhythm,
   tick bars and eyebrow pills. One vertical rhythm, no tick bars, quiet eyebrows, calm error page. */
/* one section rhythm: the legacy global `section{padding:100px 0!important}` (70px under 992px) made every un-themed band 200px apart; a class rule with its own value still wins (this one is :where, specificity 0,1,0) */
.nx-ui-v2 :where(main section,main .space,main .space-top,main .space-bottom){padding-block:clamp(36px,4.5vw,64px)!important}
.nx-ui-v2 .breadcumb-wrapper{padding-block:72px 44px!important;min-height:0}
/* tick bars: the 3-4px green bar before a heading is gone on every template (home and hubs lost it in phase 1) */
.nx-ui-v2 #prod-view .nx4b-info .nx4-sec-h,.nx-ui-v2 #prod-view .nx4b-info .nxg-faq h2,.nx-ui-v2 .nx4-about .nx4-about-text h2,.nx-ui-v2 .nx4-about .nx4-about-facts h3,.nx-ui-v2 .nxg-all-panel h2,.nx-ui-v2 .nexus-article-content h2{padding-inline-start:0;border-inline-start:0}
.nx-ui-v2 #prod-view .nx4b-info .nx4-sec-h::before,.nx-ui-v2 .bsh-head h2::before{content:none}
/* eyebrow pills ("# Competitive hub", "# Verified accounts"): plain quiet text, no pill, no side rules */
.nx-ui-v2 .sec-subtitle{display:block!important;padding:0!important;border:0!important;border-radius:0!important;background:none!important;color:var(--nxv2-text-3)!important;font-size:var(--nxv2-fs-sm)!important;font-weight:500!important;letter-spacing:.02em!important;text-transform:none!important}
.nx-ui-v2 .sec-subtitle::before,.nx-ui-v2 .sec-subtitle::after{content:none}
/* one control corner: every button-like control reads 8px (the 9-14px variants on checkout, contact, accounts and the product page were set page by page) */
.nx-ui-v2 :is(.th-btn,.ck-submit-btn,.ck-coupon-apply,.ck-cart-btn,.prod-qa-submit,.nxg-gift-entry-cta,.acc-buy,.btn.ghost,.nxch-live-primary,.prod-related-prev,.prod-related-next),.nx-ui-v2 .nxch-switch button,.nx-ui-v2 .nxch-live-actions :is(a,button){border-radius:var(--nxv2-r-md)}
.nx-ui-v2 :is(#prod-view,.prod-checkout) :is(.ck-submit-btn,.ck-cart-btn,.ck-coupon-apply),.nx-ui-v2 .prod-qa-submit{border-radius:var(--nxv2-r-md)!important}
/* the home trio copy was clamped to 2 lines under 768px; at 320px the end of the sentence (the part that says what the card does) was hidden behind the ellipsis. Show the whole sentence. */
.nx-ui-v2 .nxh-trio .nxh-card-copy>span:not(.nxh-eyebrow){display:block;overflow:visible;-webkit-line-clamp:unset;line-clamp:unset}
@media (prefers-reduced-motion:reduce){.nx-ui-v2 :is(#newsletter-email,.nxsup-loader,input,select,textarea,img){transition:none!important}.nx-ui-v2 :is(.pri,.sec,.actions a){transition:none}}
/* no one-sided accent borders (the 3px green / red / amber bar down the side of a card is decoration standing in for hierarchy): key takeaways, patch rows, patch champion blocks and callouts get a full hairline; the status stays in the BUFF / NERF pill and the callout icon */
.nx-ui-v2 .nxb2-take{border:1px solid var(--nxv2-line);background:var(--nxv2-ink-1)}
.nx-ui-v2 .nxpd-row,.nx-ui-v2 .nxpp-block,.nx-ui-v2 .nx-callout{border:1px solid var(--nxv2-line)}
.nx-ui-v2 :is(.nxpd-row,.nxpp-block).nxpd-buff,.nx-ui-v2 .nxpp-block.nxpp-buff{border-color:rgba(69,248,130,.28)}
.nx-ui-v2 :is(.nxpd-row,.nxpp-block).nxpd-nerf,.nx-ui-v2 .nxpp-block.nxpp-nerf{border-color:rgba(255,107,120,.3)}
.nx-ui-v2 .nx-callout--info{border-color:rgba(127,184,255,.32)}
.nx-ui-v2 .nx-callout--warn{border-color:rgba(255,199,86,.34)}
/* Nexus Lab search result counter: axe measured it under 4.5:1 on the dark searchbox */
.nx-ui-v2 .rl-searchbox>span{color:var(--nxv2-text-2)}
/* sign-in: the "Forgot password?" link was a bare inline link (axe target-size) */
.nx-ui-v2 #forgotLink{display:inline-flex;align-items:center;min-height:44px;padding-inline:6px}
/* more one-sided accent bars (found by the kit slop gate): the boosting game cards carried a 3px brand-colour bar (top on desktop, side on mobile): the art is the colour, the body gets the hairline; the takeaway list items lose their 2px green rail */
.nx-ui-v2 .bsh-body{border:0;border-top:1px solid var(--nxv2-line)}
.nx-ui-v2 .nxb2-take li{padding-inline-start:0;border-inline-start:0}
.nx-ui-v2 .legal-note{border:1px solid var(--nxv2-line);border-radius:var(--nxv2-r-md);background:var(--nxv2-ink-1);color:var(--nxv2-text-2)}
/* reading measure: long prose (FAQ answers, trust copy, steps, articles) stops at about 70 characters per line (the taste gate measured 80+ on FAQ, boosting, rank-boost, reviews, gift cards and articles) */
.nx-ui-v2 :is(details p,.rb-trust p,.rv-faq p,.nxpg-faq p,.bsh-fold p,.bs-steps li,.nexus-article-content p,.nexus-article-content li){max-width:70ch}

/* ---- 17. ONE green surface system (2026-10-23, owner: "the dark grey is rejected, look at the green next to it, the WHOLE site") ------------------
   The tokens in section 1 carry the hue (ink-0..3, hairlines, text-2/3); this section covers what no page file reads from a token:
   framework tables / modals / menus, placeholders, loading text, disabled controls, the home trio accents (blue and brown cards read as another brand)
   and the status language shared by the order and support screens. Statuses: waiting green, detected amber, confirmed solid green, failed red. */
.nx-ui-v2 ::placeholder{color:var(--nxv2-text-3);opacity:1}
.nx-ui-v2 .nxg-loading,.nx-ui-v2 .nxg-loading span{color:var(--nxv2-text-2)}
.nx-ui-v2 .table{--bs-table-color:var(--nxv2-text);--bs-table-bg:transparent;--bs-table-striped-bg:rgba(69,248,130,.04);--bs-table-hover-bg:rgba(69,248,130,.07);--bs-table-border-color:var(--nxv2-line)}
.nx-ui-v2 :is(.modal-content,.dropdown-menu,.offcanvas){background:var(--nxv2-ink-1);border:1px solid var(--nxv2-line-2);color:var(--nxv2-text)}
.nx-ui-v2 :is(.form-control,.form-select,input[type="text"],input[type="email"],input[type="tel"],input[type="password"],input[type="search"],textarea,select){background-color:var(--nx-field);border-color:var(--nxv2-line-2);color:var(--nxv2-text)}
.nx-ui-v2 :is(.form-control,.form-select,input,textarea,select):focus{border-color:var(--nxv2-signal-edge);box-shadow:0 0 0 3px rgba(69,248,130,.16)}
.nx-ui-v2 :is(details>summary){color:var(--nxv2-text)}
/* the accent colours of the three home cards were blue (Nexus Lab) and brown (Tournaments): one accent, the signal green */
.nx-ui-v2 .nxh-trio .nxh-card{--acc:var(--nxv2-signal);--acc-rgb:69,248,130;background:var(--nxv2-panel);border-color:var(--nxv2-line-2)}
.nx-ui-v2 .nxh-trio .nxh-card :is(.nxh-eyebrow,.nxh-card-icon){color:var(--nxv2-signal)}
/* a disabled control is still a button: a calm green-tinted pill with readable text, never a dead grey slab */
.nx-ui-v2 :is(.th-btn,.nxh-btn,.owg-btn,.ck-submit-btn,.btn,.bf-btn):disabled,.nx-ui-v2 :is(.th-btn,.nxh-btn,.owg-btn,.ck-submit-btn,.btn,.bf-btn)[aria-disabled="true"]{background:var(--nxv2-off-bg);border-color:var(--nxv2-off-line);color:var(--nxv2-off-fg);box-shadow:none;opacity:1;cursor:not-allowed}
/* status chips (order, payment, support): the same four tones everywhere */
.nx-ui-v2 :is(.is-wait,[data-tone="wait"]){background:var(--nxv2-st-wait-bg);border-color:var(--nxv2-st-wait-line);color:var(--nxv2-text)}
.nx-ui-v2 :is(.is-detect,[data-tone="detect"]){background:var(--nxv2-st-detect-bg);border-color:var(--nxv2-st-detect-line);color:var(--nxv2-text)}
.nx-ui-v2 :is(.is-fail,.is-danger,[data-tone="fail"]){background:var(--nxv2-st-fail-bg);border-color:var(--nxv2-st-fail-line);color:var(--nxv2-text)}

/* ---- 18. ONE segmented-control family (2026-10-26, owner: "the Top-up / Boosting / Accounts pills look basic") ---------------------------------
   Every row of switch pills on the public site (game section bar, Store mega menu and mobile drawer, region / delivery choosers, boosting and
   account tabs, contact switch, order filters) is the same component: a recessed track, quiet items, and ONE active mark that is a sliding indicator
   (assets/js/nx-ui-v2.js section 3; it moves with transform only) with a soft green inner glow. Without the script the active item keeps the same
   fill statically, so nothing depends on JS. Underline tabs (product page, boosting service) share the indicator as a 2px bar.
   Items: hover wash, press (scale .97), focus ring inside the track; counts via [data-count]; icons via [data-ic]; on narrow screens a row scrolls
   with snap and fades at the edges (the script writes --nxv2-fs / --nxv2-fe); RTL is mirrored because the indicator uses physical offsets
   of the same box the items sit in. Classes for new rows: .nxv2-seg (pills) and .nxv2-line (underline). */
body.nx-ui-v2{--nxv2-fs:0px;--nxv2-fe:0px;--nxv2-act:linear-gradient(180deg,rgba(69,248,130,.26),rgba(69,248,130,.12));--nxv2-act-ring:inset 0 0 0 1px var(--nxv2-signal-edge),inset 0 0 16px rgba(69,248,130,.24);--nxv2-t-ind:260ms}
.nx-ui-v2 :is(.nxg-sectionbar,.nx4-mega-tabs,.nx4-seg,.rb-tabs,.acc-tabs,.acc-ord-tabs,.nxch-switch,.nxbi-lang,.rl-game-switch,.nxv2-seg){--sr:999px;--sri:999px;position:relative;isolation:isolate;gap:2px;padding:4px;border:1px solid var(--nxv2-line);border-radius:var(--sr);background:linear-gradient(180deg,rgba(5,11,7,.8),rgba(12,21,17,.8));box-shadow:inset 0 1px 3px rgba(0,0,0,.4)}
.nx-ui-v2 :is(.nx4-seg,.acc-tabs,.acc-ord-tabs,.nxch-switch,.rb-tabs){--sr:14px;--sri:10px}
.nx-ui-v2 :is(.nxg-sectionbar,.nx4-mega-tabs,.acc-ord-tabs,.nxch-switch,.rb-tabs){flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,transparent 0,#000 var(--nxv2-fs,0px),#000 calc(100% - var(--nxv2-fe,0px)),transparent);mask-image:linear-gradient(to right,transparent 0,#000 var(--nxv2-fs,0px),#000 calc(100% - var(--nxv2-fe,0px)),transparent)}
.nx-ui-v2 :is(.nxg-sectionbar,.nx4-mega-tabs,.acc-ord-tabs,.nxch-switch,.rb-tabs)::-webkit-scrollbar{display:none}
.nx-ui-v2 .acc-ord-tabs{display:flex}
.nx-ui-v2 .rl-game-switch{-webkit-backdrop-filter:none;backdrop-filter:none}
.nx-ui-v2 :is(.nxg-sectionbar,.nx4-mega-tabs,.nx4-seg,.rb-tabs,.acc-tabs,.acc-ord-tabs,.nxch-switch,.nxbi-lang,.rl-game-switch,.nxv2-seg)>:not(.nxv2-ind){position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:40px;padding:0 18px;border:0;border-radius:var(--sri,999px);background:transparent;box-shadow:none;color:var(--nxv2-text-2);font:600 14px/1.15 var(--nx-font,Poppins,sans-serif);letter-spacing:0;text-transform:none;text-decoration:none;white-space:nowrap;cursor:pointer;scroll-snap-align:center;-webkit-tap-highlight-color:transparent;transition:color var(--nxv2-t-base) var(--nxv2-ease),background-color var(--nxv2-t-base) var(--nxv2-ease),box-shadow var(--nxv2-t-base) var(--nxv2-ease),transform var(--nxv2-t-fast) var(--nxv2-ease)}
@media (hover:hover){.nx-ui-v2 :is(.nxg-sectionbar,.nx4-mega-tabs,.nx4-seg,.rb-tabs,.acc-tabs,.acc-ord-tabs,.nxch-switch,.nxbi-lang,.rl-game-switch,.nxv2-seg)>:not(.nxv2-ind):not([aria-selected="true"],[aria-checked="true"],[aria-pressed="true"],[aria-current="page"],.on,.active,.is-active,.is-on):hover{color:var(--nxv2-text);background:rgba(69,248,130,.08)}}
.nx-ui-v2 :is(.nxg-sectionbar,.nx4-mega-tabs,.nx4-seg,.rb-tabs,.acc-tabs,.acc-ord-tabs,.nxch-switch,.nxbi-lang,.rl-game-switch,.nxv2-seg)>:not(.nxv2-ind):active{transform:scale(.97);transition-duration:var(--nxv2-t-fast)}
.nx-ui-v2 :is(.nxg-sectionbar,.nx4-mega-tabs,.nx4-seg,.rb-tabs,.acc-tabs,.acc-ord-tabs,.nxch-switch,.nxbi-lang,.rl-game-switch,.nxv2-seg)>:not(.nxv2-ind):focus-visible{outline:2px solid #6BFF9C;outline-offset:-3px;box-shadow:none}
.nx-ui-v2 :is(.nxg-sectionbar,.nx4-mega-tabs,.nx4-seg,.rb-tabs,.acc-tabs,.acc-ord-tabs,.nxch-switch,.nxbi-lang,.rl-game-switch,.nxv2-seg)>:not(.nxv2-ind):is([aria-selected="true"],[aria-checked="true"],[aria-pressed="true"],[aria-current="page"],.on,.active,.is-active,.is-on){color:#fff;background:var(--nxv2-act);box-shadow:var(--nxv2-act-ring);text-shadow:none}
.nx-ui-v2 :is(.nxg-sectionbar,.nx4-mega-tabs,.nx4-seg,.rb-tabs,.acc-tabs,.acc-ord-tabs,.nxch-switch,.nxbi-lang,.rl-game-switch,.nxv2-seg).nxv2-ready>:not(.nxv2-ind):is([aria-selected="true"],[aria-checked="true"],[aria-pressed="true"],[aria-current="page"],.on,.active,.is-active,.is-on){background:transparent;box-shadow:none}
.nx-ui-v2 .nxv2-ind{position:absolute;z-index:0;inset-inline-start:0;top:0;width:var(--iw,0);height:var(--ih,0);border-radius:var(--sri,999px);pointer-events:none;transform:translate(var(--ix,0),var(--iy,0));background:var(--nxv2-act);box-shadow:var(--nxv2-act-ring),0 6px 18px -10px rgba(69,248,130,.7)}
.nx-ui-v2 .nxv2-anim>.nxv2-ind{transition:transform var(--nxv2-t-ind) var(--nxv2-ease),width var(--nxv2-t-ind) var(--nxv2-ease),height var(--nxv2-t-ind) var(--nxv2-ease)}
/* icon + label and optional count */
.nx-ui-v2 [data-ic]::before{content:"";width:16px;height:16px;flex:none;background:currentColor;-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
.nx-ui-v2 [data-ic="topup"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linejoin='round'%3E%3Cpath d='M13 2 4 14h7l-1 8 9-12h-7z'/%3E%3C/svg%3E")}
.nx-ui-v2 [data-ic="gift"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 12v9H4v-9M2 7h20v5H2zM12 21V7M12 7H7.5a2.5 2.5 0 1 1 0-5C11 2 12 7 12 7zM12 7h4.5a2.5 2.5 0 1 0 0-5C13 2 12 7 12 7z'/%3E%3C/svg%3E")}
.nx-ui-v2 [data-ic="items"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2 3 7v10l9 5 9-5V7zM3 7l9 5 9-5M12 12v10'/%3E%3C/svg%3E")}
.nx-ui-v2 [data-ic="boost"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 18 6-6 6 6M6 11l6-6 6 6'/%3E%3C/svg%3E")}
.nx-ui-v2 [data-ic="accounts"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21a8 8 0 0 1 16 0'/%3E%3C/svg%3E")}
.nx-ui-v2 [data-count]::after{content:attr(data-count);min-width:20px;padding:2px 6px;border-radius:999px;background:rgba(255,255,255,.08);font-size:11px;font-weight:700;line-height:1.2;text-align:center;font-variant-numeric:tabular-nums}
.nx-ui-v2 :is([aria-selected="true"],[aria-current="page"],.on,.active,.is-on)[data-count]::after{background:rgba(69,248,130,.3)}
/* the game strip: the track is visible, the accent is always the signal green (the game colour only tints the hairline above) */
.nx-ui-v2 .nxg-gamestrip .nxg-gamestrip-nav{background:linear-gradient(180deg,rgba(12,21,17,.98),rgba(7,13,10,.99));border-top-color:var(--nxv2-line-2);border-bottom-color:var(--nxv2-line)}
.nx-ui-v2 .nxg-gamestrip .nxg-sectionbar{justify-content:flex-start;max-width:100%}
.nx-ui-v2 :is(.nx4-mega-tabs,.nxg-sectionbar) [data-ic]{opacity:.9}
/* underline tabs (product page, boosting service): same indicator, drawn as a 2px bar on the item's bottom edge */
.nx-ui-v2 :is(.nxt-tablist,.rb-service-tabs,.nxv2-line){position:relative}
.nx-ui-v2 :is(.nxt-tablist,.rb-service-tabs,.nxv2-line).nxv2-ready>*{border-block-end-color:transparent}
.nx-ui-v2 .nxv2-ind-u{height:2px;border-radius:2px;background:var(--nxv2-signal);box-shadow:0 0 12px rgba(69,248,130,.55);transform:translate(var(--ix,0),calc(var(--iy,0px) + var(--ih,0px) - 2px))}
.nx-ui-v2 :is(.nxt-tab,.rb-service-tab){transition:color var(--nxv2-t-base) var(--nxv2-ease),background-color var(--nxv2-t-base) var(--nxv2-ease)}
@media (hover:hover){.nx-ui-v2 :is(.nxt-tab,.rb-service-tab):hover{color:var(--nxv2-text);background:rgba(69,248,130,.06)}}
.nx-ui-v2 .rb-service-tab.active{color:var(--nxv2-signal)}
@media (pointer:coarse){.nx-ui-v2 :is(.nxg-sectionbar,.nx4-mega-tabs,.nx4-seg,.rb-tabs,.acc-tabs,.acc-ord-tabs,.nxch-switch,.nxbi-lang,.rl-game-switch,.nxv2-seg)>:not(.nxv2-ind){min-height:44px}}
@media (max-width:640px){
  .nx-ui-v2 :is(.nxg-sectionbar,.nx4-mega-tabs,.nx4-seg,.rb-tabs,.acc-tabs,.acc-ord-tabs,.nxch-switch,.nxbi-lang,.rl-game-switch,.nxv2-seg)>:not(.nxv2-ind){padding:0 14px;font-size:13px}
  .nx-ui-v2 [data-ic]::before{content:none}
  .nx-ui-v2 .nxg-gamestrip .nxg-sectionbar{width:100%;justify-content:safe center}
  .nx-ui-v2 .nxg-gamestrip .nxg-sectionbar>a{flex:1 0 auto}
}
@media (forced-colors:active){.nx-ui-v2 :is([aria-selected="true"],[aria-checked="true"],[aria-pressed="true"],[aria-current="page"],.on,.active,.is-active,.is-on):is(.nxg-sectionbar,.nx4-mega-tabs,.nx4-seg,.rb-tabs,.acc-tabs,.acc-ord-tabs,.nxch-switch,.nxbi-lang,.rl-game-switch,.nxv2-seg)>:not(.nxv2-ind){outline:2px solid Highlight}}

/* ---- 19. motion language: three durations (120 press / 200 hover and colour / 320 enter and exit) and ONE easing, from the tokens in section 1 ---------
   Buttons press and lift, cards lift, the dropdown panel and the accordion body ease in (opacity + transform only), the header gains a hairline and a
   shadow once the page has scrolled (.nxv2-stuck, set by nx-ui-v2.js). Section 15 switches every transition and animation off under prefers-reduced-motion. */
@keyframes nxv2-in{from{opacity:.01;transform:translateY(-6px) scale(.985)}to{opacity:1;transform:none}}
.nx-ui-v2 :is(.nxh-btn,.th-btn,.bf-btn,.nxbi-btn,.ck-submit-btn,.owg-btn,.acc-buy,.btn,.nx-toast-act){transition-property:background-color,border-color,color,box-shadow,transform;transition-duration:var(--nxv2-t-base);transition-timing-function:var(--nxv2-ease)}
@media (hover:hover){
  .nx-ui-v2 :is(.nxh-btn,.th-btn,.bf-btn,.nxbi-btn,.ck-submit-btn,.owg-btn,.acc-buy):hover:not(:disabled,[aria-disabled="true"]){transform:translateY(-1px)}
  .nx-ui-v2 :is(.nxh-btn--primary,.ck-submit-btn,.acc-buy):hover:not(:disabled,[aria-disabled="true"]){box-shadow:0 10px 24px -12px rgba(69,248,130,.75)}
  .nx-ui-v2 :is(.nxh-card,.bsh-card,.rs-card,.nx-order-card,.nx4-mega-link,.nxbi-chip){transition:transform var(--nxv2-t-base) var(--nxv2-ease),border-color var(--nxv2-t-base) var(--nxv2-ease),background-color var(--nxv2-t-base) var(--nxv2-ease),box-shadow var(--nxv2-t-base) var(--nxv2-ease)}
  .nx-ui-v2 :is(.nxh-card,.bsh-card,.rs-card,.nx-order-card,.nx4-mega-link,.nxbi-chip):hover{transform:translateY(-2px);border-color:var(--nxv2-line-2)}
}
.nx-ui-v2 :is(.nxh-btn,.th-btn,.bf-btn,.nxbi-btn,.ck-submit-btn,.owg-btn,.acc-buy,.btn):active:not(:disabled,[aria-disabled="true"]){transform:translateY(0) scale(.98);transition-duration:var(--nxv2-t-fast)}
.nx-ui-v2 .nx-select.open .nx-select-panel,.nx-ui-v2 .dropdown-menu.show{animation:nxv2-in var(--nxv2-t-base) var(--nxv2-ease)}
.nx-ui-v2 .nx-select-caret{transition:transform var(--nxv2-t-base) var(--nxv2-ease)}
.nx-ui-v2 details>summary{transition:color var(--nxv2-t-base) var(--nxv2-ease)}
.nx-ui-v2 details[open]>summary~*{animation:nxv2-in var(--nxv2-t-slow) var(--nxv2-ease)}
.nx-ui-v2 .nx4-header{transition:transform var(--nx-t-menu,200ms) var(--nxv2-ease),box-shadow var(--nxv2-t-base) var(--nxv2-ease),border-color var(--nxv2-t-base) var(--nxv2-ease)}
.nx-ui-v2 .nx4-header.nxv2-stuck{border-bottom-color:var(--nxv2-line-2);box-shadow:0 12px 28px -20px rgba(0,0,0,.95)}
.nx-ui-v2 #nx-toast-host .nx-toast{transition:opacity var(--nxv2-t-base) var(--nxv2-ease),transform var(--nxv2-t-slow) var(--nxv2-ease)}

/* ---- 20. the remaining basic controls join the family: green focus and selection, no framework blue, tinted skeletons / empty states / chips / pagination ---- */
.nx-ui-v2 :is(input[type="checkbox"],input[type="radio"],input[type="range"],progress){accent-color:#45F882}
.nx-ui-v2 :is(.btn:focus,.btn-close:focus){box-shadow:0 0 0 3px rgba(69,248,130,.28)}
.nx-ui-v2 .btn-primary{background:var(--nxv2-signal);border-color:var(--nxv2-signal);color:var(--nxv2-signal-ink)}
.nx-ui-v2 .btn-primary:is(:hover,:focus,:active,.active){background:#6BFF9C;border-color:#6BFF9C;color:var(--nxv2-signal-ink)}
.nx-ui-v2 .btn-primary:disabled,.nx-ui-v2 .btn-primary.disabled{background:var(--nxv2-off-bg);border-color:var(--nxv2-off-line);color:var(--nxv2-off-fg)}
.nx-ui-v2 :is(.dropdown-item.active,.dropdown-item:active,.list-group-item.active){background:var(--nxv2-signal-wash);color:#fff;border-color:var(--nxv2-signal-edge)}
.nx-ui-v2 .bg-primary{background-color:var(--nxv2-signal)!important;color:var(--nxv2-signal-ink)}
.nx-ui-v2 .bg-info{background-color:var(--nxv2-ink-3)!important}
.nx-ui-v2 :is(.link-primary,.link-info){color:var(--nxv2-signal)!important}
.nx-ui-v2 :is(.link-primary,.link-info):is(:hover,:focus){color:#6BFF9C!important}
.nx-ui-v2 .form-control:focus{border-color:var(--nxv2-signal-edge)}
.nx-ui-v2 :is(.nx-skeleton-img,.nx-skeleton-line){background-image:linear-gradient(90deg,rgba(69,248,130,.04) 25%,rgba(69,248,130,.11) 50%,rgba(69,248,130,.04) 75%)}
.nx-ui-v2 :is(.nx-skeleton-card,.nx-empty-state,.nxg-empty,.nxg-loading){border-color:var(--nxv2-line);background-color:rgba(69,248,130,.03)}
.nx-ui-v2 .nx-empty-state{border-style:dashed;border-radius:var(--nxv2-r-lg);color:var(--nxv2-text-2)}
.nx-ui-v2 .nxbi-chip{transition-property:transform,border-color,background-color,color,box-shadow}
.nx-ui-v2 .nxbi-chip:is(.is-on,.active,[aria-current="true"],[aria-current="page"]){background:var(--nxv2-act);border-color:var(--nxv2-signal-edge);box-shadow:inset 0 0 16px rgba(69,248,130,.2);color:#fff}
.nx-ui-v2 .nxbi-chip:focus-visible,.nx-ui-v2 .nx-pagination a:focus-visible{outline:2px solid #6BFF9C;outline-offset:2px}
.nx-ui-v2 .nx-pagination a{background:var(--nxv2-ink-1);border-color:var(--nxv2-line);border-radius:var(--nxv2-r-md);transition:border-color var(--nxv2-t-base) var(--nxv2-ease),background-color var(--nxv2-t-base) var(--nxv2-ease),transform var(--nxv2-t-fast) var(--nxv2-ease)}
.nx-ui-v2 .nx-pagination a:hover{border-color:var(--nxv2-signal-edge);background:var(--nxv2-signal-wash)}
.nx-ui-v2 .nx-pagination a:active{transform:scale(.96)}
.nx-ui-v2 .nx-pagination a.active{background:var(--nxv2-act);border-color:var(--nxv2-signal-edge);box-shadow:inset 0 0 12px rgba(69,248,130,.2);color:#fff}
.nx-ui-v2 .table>tbody>tr{transition:background-color var(--nxv2-t-base) var(--nxv2-ease)}
.nx-ui-v2 :is([role="tooltip"],.tooltip-inner,[data-tip]::after){background:var(--nxv2-ink-3);color:var(--nxv2-text);border:1px solid var(--nxv2-line-2);border-radius:var(--nxv2-r-md);box-shadow:var(--nxv2-lift)}
.nx-ui-v2 :is(.badge,.nx-badge,.nxg-chip){border-radius:var(--nxv2-r-sm);letter-spacing:0}
.nx-ui-v2 :is(table,.table,.bs-table-wrap){border-color:var(--nxv2-line)}
.nx-ui-v2 :is(.bs-table th,.bs-table td){border-bottom-color:var(--nxv2-line)}