/* Nexus Lab V3 design system (docs/NEXUS_LAB_V3_DESIGN_SYSTEM_2026-10.md). Shell + components for every Lab page, both games, EN + AR.
   Scope: every rule lives under .nxl3 (root of the shell, api/lib/nexus_lab3.php) or uses an nxl3- class; no !important; logical properties only, so the
   /ar/ twin mirrors with no extra rules. Page-level file: in the rift-lab bundle (tools/build-v158-assets.mjs) and loaded on its own by the Lab 2 pages. */
.nxl3{
--l3-ink-0:#050B07;--l3-ink-1:#09110D;--l3-ink-2:#0E1712;--l3-ink-3:#15211A;--l3-ink-4:#1D2C23;
--l3-line:rgba(150,255,190,.09);--l3-line-2:rgba(150,255,190,.17);--l3-line-3:rgba(150,255,190,.3);
--l3-text:#EEF4F0;--l3-text-2:#BAC7BF;--l3-text-3:#A5B4AB;
--l3-signal:#45F882;--l3-signal-hi:#6BFF9C;--l3-signal-ink:#04140A;--l3-signal-wash:rgba(69,248,130,.1);--l3-signal-edge:rgba(69,248,130,.45);
--l3-amber:#FFBE18;--l3-amber-wash:rgba(255,190,24,.1);--l3-danger:#FF8A94;
--l3-display:var(--nx-font-display,inherit);
--l3-fs-xs:12px;--l3-fs-sm:13.5px;--l3-fs-md:15.5px;--l3-fs-lg:18px;--l3-fs-xl:22px;--l3-fs-2xl:28px;--l3-fs-h1:clamp(30px,1.6vw + 20px,44px);
--l3-r-sm:6px;--l3-r-md:8px;--l3-r-lg:12px;
--l3-hdr:0px;--l3-top:0px;--l3-bar:60px;--l3-rail:248px;--l3-gut:16px;--l3-max:1240px;--l3-target:44px;
--l3-t1:120ms;--l3-t2:200ms;--l3-t3:320ms;--l3-ease:cubic-bezier(.2,.7,.2,1);
--l3-e2:0 24px 48px -18px rgba(0,0,0,.9);
position:relative;display:grid;grid-template-columns:minmax(0,1fr);background:var(--l3-ink-0);color:var(--l3-text);font-family:var(--nx-font,Rubik,ui-sans-serif,system-ui,sans-serif);font-size:var(--l3-fs-md);line-height:1.55;isolation:isolate;--rl37-font:var(--nx-font,Rubik,ui-sans-serif,system-ui,sans-serif)}
@media (min-width:600px){.nxl3{--l3-gut:24px}}
@media (min-width:1100px){.nxl3{grid-template-columns:var(--l3-rail) minmax(0,1fr);--l3-gut:32px}}
@media (min-width:1024px){.nxl3{--l3-hdr:var(--nx-header-h,64px)}}
@media (max-width:899px){.nxl3{--l3-bar:56px}}
@media (prefers-reduced-motion:reduce){.nxl3{--l3-t1:0ms;--l3-t2:0ms;--l3-t3:0ms}}
.nxl3 *,.nxl3 *::before,.nxl3 *::after{box-sizing:border-box}
.nxl3 :where(h1,h2,h3,p,dl,dd,figure){margin:0}
.nxl3 :where(ul,ol){margin:0;padding:0;list-style:none}
.nxl3 :where(a){color:inherit;text-decoration:none}
.nxl3 :focus-visible{outline:2px solid var(--l3-signal-hi);outline-offset:2px;border-radius:var(--l3-r-sm)}
.nxl3 ::selection{background:rgba(69,248,130,.32);color:#fff}
.nxl3 :where(input,select,button){font:inherit;color:inherit}
.nxl3 .nxl3-sr{position:absolute;inline-size:1px;block-size:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.nxl3 .nxl3-i{inline-size:18px;block-size:18px;flex:none;fill:none;stroke:currentColor}
[dir=rtl] .nxl3-dir{transform:scaleX(-1)}
.nxl3 .nxl3-skip{position:fixed;inset-inline-start:12px;inset-block-start:12px;z-index:90;padding:10px 14px;border-radius:var(--l3-r-md);background:var(--l3-signal);color:var(--l3-signal-ink);font-weight:700;transform:translateY(-200%);opacity:0;pointer-events:none}
.nxl3 .nxl3-skip:focus{transform:none;opacity:1;pointer-events:auto}/* ---------------------------------------------------------------- rail (desktop) = sheet (phones) */


.nxl3 .nxl3-rail{background:var(--l3-ink-1);border-inline-end:1px solid var(--l3-line);z-index:60}
.nxl3 .nxl3-rail__in{display:flex;flex-direction:column;gap:18px;padding:18px 12px 24px;min-block-size:100%}
.nxl3 .nxl3-rail__head{display:flex;align-items:center;justify-content:space-between;padding-inline:8px}
.nxl3 .nxl3-rail__brand{display:inline-flex;align-items:center;gap:10px;font:800 17px/1 var(--l3-display);letter-spacing:-.01em}
.nxl3 .nxl3-rail__brand .nxl3-i{color:var(--l3-signal);inline-size:20px;block-size:20px}
.nxl3 .nxl3-rail .nxl3-rail__close{display:none}
.nxl3 .nxl3-rail__lbl{padding:0 10px 6px;font-size:var(--l3-fs-xs);font-weight:600;color:var(--l3-text-3)}
.nxl3 .nxl3-rail__grp ul{display:grid;gap:2px}
.nxl3 .nxl3-nav{display:flex;align-items:center;gap:12px;min-block-size:40px;padding:8px 10px;border-radius:var(--l3-r-md);color:var(--l3-text-2);font-size:14.5px;font-weight:500;transition:background var(--l3-t1),color var(--l3-t1)}
.nxl3 .nxl3-nav .nxl3-i{color:var(--l3-text-3);transition:color var(--l3-t1)}
.nxl3 .nxl3-nav__t{display:grid;flex:1;min-inline-size:0}
.nxl3 .nxl3-nav__t small{font-size:11.5px;font-weight:500;color:var(--l3-text-3);line-height:1.3}
.nxl3 .nxl3-nav__ext{inline-size:14px;block-size:14px;opacity:.6}
.nxl3 a.nxl3-nav:hover{background:var(--l3-ink-3);color:var(--l3-text)}
.nxl3 a.nxl3-nav:hover .nxl3-i{color:var(--l3-text-2)}
.nxl3 .nxl3-nav.is-on{background:var(--l3-signal-wash);color:var(--l3-text);font-weight:700}
.nxl3 .nxl3-nav.is-on .nxl3-i{color:var(--l3-signal)}
.nxl3 .nxl3-nav.is-off{opacity:.62;cursor:not-allowed}
.nxl3 .nxl3-rail__foot{margin-block-start:auto;padding:14px 10px 0;border-block-start:1px solid var(--l3-line);font-size:12.5px;color:var(--l3-text-3)}
.nxl3 .nxl3-rail__foot a{color:var(--l3-text-2);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--l3-line-3)}
.nxl3 .nxl3-rail__switch{display:none}
@media (min-width:1100px){
.nxl3 .nxl3-rail{position:sticky;inset-block-start:var(--l3-hdr);block-size:calc(100vh - var(--l3-hdr));block-size:calc(100dvh - var(--l3-hdr));overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--l3-ink-4) transparent;grid-row:1 / span 2;max-block-size:calc(100vh - var(--l3-hdr));max-block-size:calc(100dvh - var(--l3-hdr));overscroll-behavior:contain}
}
@media (min-width:1100px) and (max-height:940px){
.nxl3 .nxl3-rail__in{gap:12px;padding-block:12px 14px}
.nxl3 .nxl3-rail__lbl{padding-block-end:3px}
.nxl3 .nxl3-nav{min-block-size:34px;padding-block:5px}
.nxl3 .nxl3-rail__foot{padding-block-start:10px}
}
@media (min-width:1100px) and (max-height:700px){
.nxl3 .nxl3-rail__in{gap:8px}
.nxl3 .nxl3-nav{min-block-size:30px;padding-block:3px;font-size:14px}
.nxl3 .nxl3-nav__t small{display:none}
}
@media (max-width:1099px){
.nxl3 .nxl3-rail{position:fixed;inset-inline:0;inset-block-end:0;max-block-size:86vh;max-block-size:86dvh;overflow-y:auto;border:0;border-block-start:1px solid var(--l3-line-2);border-radius:16px 16px 0 0;box-shadow:var(--l3-e2);transform:translateY(105%);visibility:hidden;transition:transform var(--l3-t3) var(--l3-ease),visibility 0s linear var(--l3-t3)}
.nxl3.is-sheet .nxl3-rail{transform:none;visibility:visible;transition:transform var(--l3-t3) var(--l3-ease)}
.nxl3 .nxl3-rail__in{padding-block-end:calc(24px + env(safe-area-inset-bottom,0px))}
.nxl3 .nxl3-rail .nxl3-rail__close{display:inline-flex}
.nxl3 .nxl3-rail__switch{display:block}
.nxl3 .nxl3-rail__grp ul{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.nxl3 .nxl3-rail__head::before{content:"";position:absolute;inset-inline:0;margin-inline:auto;inset-block-start:7px;inline-size:40px;block-size:4px;border-radius:4px;background:var(--l3-line-3)}
}
.nxl3 .nxl3-scrim{position:fixed;inset:0;z-index:55;background:rgba(3,7,5,.72)}
.nxl3 .nxl3-scrim[hidden]{display:none}
/* the site header over a Lab page is one solid bar: nothing of the page shows through it */
html body:has(.nxl3) .nx4-header{background:#060a08;-webkit-backdrop-filter:none;backdrop-filter:none}/* ---------------------------------------------------------------- top bar */


.nxl3 .nxl3-col{min-inline-size:0}
.nxl3 .nxl3-top{position:relative;z-index:40;background:var(--l3-ink-1);border-block-end:1px solid var(--l3-line)}
.nxl3 .nxl3-top__in{display:flex;align-items:center;gap:12px;block-size:var(--l3-bar);padding-inline:var(--l3-gut);max-inline-size:calc(var(--l3-max) + 2 * var(--l3-gut))}
.nxl3 .nxl3-iconbtn{display:inline-flex;align-items:center;justify-content:center;inline-size:var(--l3-target);block-size:var(--l3-target);flex:none;border:1px solid var(--l3-line-2);border-radius:var(--l3-r-md);background:var(--l3-ink-2);color:var(--l3-text);cursor:pointer;transition:background var(--l3-t1),border-color var(--l3-t1)}
.nxl3 .nxl3-iconbtn:hover{background:var(--l3-ink-3);border-color:var(--l3-line-3)}
.nxl3 .nxl3-top__menu,.nxl3 .nxl3-top__find{display:none}
@media (max-width:1099px){.nxl3 .nxl3-top__menu{display:inline-flex}}/* game switch: segmented, two real links */

.nxl3 .nxl3-seg{display:inline-flex;flex:none;padding:3px;gap:2px;border:1px solid var(--l3-line-2);border-radius:10px;background:var(--l3-ink-1)}
.nxl3 .nxl3-seg__o{display:inline-flex;align-items:center;min-block-size:36px;padding-inline:14px;border-radius:7px;font-size:14px;font-weight:600;color:var(--l3-text-2);white-space:nowrap;transition:background var(--l3-t1),color var(--l3-t1)}
.nxl3 .nxl3-seg__o:not(.is-on):hover{background:var(--l3-ink-3);color:var(--l3-text)}
.nxl3 .nxl3-seg__o.is-on{background:var(--l3-signal);color:var(--l3-signal-ink);font-weight:800}
.nxl3 .nxl3-seg__s{display:none}
.nxl3 .nxl3-seg--rail{display:flex}.nxl3 .nxl3-seg--rail .nxl3-seg__o{flex:1;justify-content:center}
@media (max-width:599px){.nxl3 .nxl3-seg--top .nxl3-seg__l{display:none}.nxl3 .nxl3-seg--top .nxl3-seg__s{display:inline}.nxl3 .nxl3-seg--top .nxl3-seg__o{padding-inline:11px}}/* patch chip */

.nxl3 .nxl3-patch{display:inline-flex;align-items:center;gap:8px;flex:none;min-block-size:36px;padding-inline:12px;border:1px solid var(--l3-line-2);border-radius:999px;font-size:13px;color:var(--l3-text-2);white-space:nowrap;margin-inline-start:auto;transition:border-color var(--l3-t1)}
.nxl3 a.nxl3-patch:hover{border-color:var(--l3-line-3);color:var(--l3-text)}
.nxl3 .nxl3-patch b{font-weight:700;color:var(--l3-text)}
.nxl3 .nxl3-patch__dot{inline-size:7px;block-size:7px;border-radius:50%;background:var(--l3-signal);box-shadow:0 0 0 3px rgba(69,248,130,.16)}
.nxl3 .nxl3-patch__next{padding-inline-start:8px;border-inline-start:1px solid var(--l3-line-2);font-variant-numeric:tabular-nums}
@media (max-width:899px){.nxl3 .nxl3-patch__next{display:none}}
@media (max-width:599px){.nxl3 .nxl3-top .nxl3-patch{display:none}}/* global search */

.nxl3 .nxl3-search{position:relative;flex:1 1 auto;min-inline-size:0;max-inline-size:560px}
.nxl3 .nxl3-search__box{position:relative;display:flex;align-items:center}
.nxl3 .nxl3-search__i{position:absolute;z-index:1;inset-inline-start:13px;color:var(--l3-text-3);pointer-events:none}
.nxl3 .nxl3-search input{inline-size:100%;block-size:var(--l3-target);padding-inline:40px 40px;border:1px solid var(--l3-line-2);border-radius:var(--l3-r-md);background:var(--l3-ink-1);font-size:15px;transition:border-color var(--l3-t1),background var(--l3-t1)}
.nxl3 .nxl3-search input::placeholder{color:var(--l3-text-3);opacity:1}
.nxl3 .nxl3-search input:hover{border-color:var(--l3-line-3)}
.nxl3 .nxl3-search input:focus{outline:none;border-color:var(--l3-signal-edge);background:var(--l3-ink-2)}
.nxl3 .nxl3-search input::-webkit-search-cancel-button{filter:grayscale(1) brightness(1.6)}
.nxl3 .nxl3-kbd{position:absolute;z-index:1;inset-inline-end:10px;display:inline-grid;place-items:center;min-inline-size:22px;block-size:22px;padding-inline:6px;border:1px solid var(--l3-line-2);border-radius:5px;font:600 12px/1 inherit;color:var(--l3-text-3)}
.nxl3 .nxl3-search input:focus ~ .nxl3-kbd{display:none}
.nxl3 .nxl3-search__pop{position:absolute;inset-inline:0;inset-block-start:calc(100% + 6px);z-index:50;max-block-size:min(64vh,520px);overflow-y:auto;padding:6px;border:1px solid var(--l3-line-2);border-radius:var(--l3-r-lg);background:var(--l3-ink-2);box-shadow:var(--l3-e2);animation:nxl3-pop var(--l3-t2) var(--l3-ease)}
.nxl3 .nxl3-search__pop[hidden]{display:none}
@keyframes nxl3-pop{from{opacity:0;transform:translateY(-4px)}}
.nxl3 .nxl3-search__g{padding:10px 10px 4px;font-size:var(--l3-fs-xs);font-weight:600;color:var(--l3-text-3)}
.nxl3 .nxl3-search__list a{display:flex;align-items:center;gap:12px;min-block-size:44px;padding:6px 10px;border-radius:var(--l3-r-md)}
.nxl3 .nxl3-search__list [aria-selected=true] a,.nxl3 .nxl3-search__list a:hover{background:var(--l3-ink-4)}
.nxl3 .nxl3-search__list .nxl3-plate{inline-size:32px;border-radius:6px}
.nxl3 .nxl3-search__list b{font-weight:600}
.nxl3 .nxl3-search__list small{margin-inline-start:auto;font-size:12px;color:var(--l3-text-3);white-space:nowrap}
.nxl3 .nxl3-search__msg{padding:14px 10px;font-size:14px;color:var(--l3-text-2)}
@media (max-width:1099px){
.nxl3 .nxl3-top .nxl3-search{display:none}
.nxl3 .nxl3-top__find{display:inline-flex;margin-inline-start:auto}
.nxl3 .nxl3-top.is-finding .nxl3-search{display:block;flex:1}
.nxl3 .nxl3-top.is-finding .nxl3-seg,.nxl3 .nxl3-top.is-finding .nxl3-patch,.nxl3 .nxl3-top.is-finding .nxl3-top__menu{display:none}
.nxl3 .nxl3-top.is-finding .nxl3-top__find{margin-inline-start:0}
.nxl3 .nxl3-top .nxl3-kbd{display:none}
}
@media (min-width:600px) and (max-width:1099px){.nxl3 .nxl3-top__find{margin-inline-start:0}.nxl3 .nxl3-top .nxl3-patch{margin-inline-start:auto}.nxl3 .nxl3-top__in{gap:10px}}/* ---------------------------------------------------------------- main column, crumbs, headers, buttons */


.nxl3 .nxl3-main{display:block;padding:18px var(--l3-gut) 72px;max-inline-size:calc(var(--l3-max) + 2 * var(--l3-gut));outline:0}
/* 2026-10-30 (owner screenshot, 1905 px): the capped column sat against the rail and left a wide empty band on the end side; centre it in the space beside the rail */
@media (min-width:1100px){.nxl3 .nxl3-main,.nxl3 .nxl3-top__in{margin-inline:auto}}
@media (max-width:1099px){.nxl3 .nxl3-main{padding-block-end:calc(96px + env(safe-area-inset-bottom,0px))}}
.nxl3 ol.nxl3-crumbs{display:flex;flex-wrap:wrap;gap:2px 8px;font-size:13px;color:var(--l3-text-3)}
.nxl3 .nxl3-crumbs li{display:inline-flex;align-items:center;gap:8px}
.nxl3 .nxl3-crumbs li+li::before{content:"";inline-size:5px;block-size:5px;border-block-start:1.5px solid var(--l3-text-3);border-inline-end:1.5px solid var(--l3-text-3);transform:rotate(45deg);opacity:.7}
[dir=rtl] .nxl3-crumbs li+li::before{transform:rotate(-135deg)}
.nxl3 .nxl3-crumbs a{display:inline-flex;align-items:center;min-block-size:32px}
.nxl3 .nxl3-crumbs a:hover{color:var(--l3-text);text-decoration:underline;text-underline-offset:3px}
.nxl3 .nxl3-crumbs [aria-current]{color:var(--l3-text-2)}
.nxl3 .nxl3-h1{font:800 var(--l3-fs-h1)/1.08 var(--l3-display);letter-spacing:-.02em;text-wrap:balance}
.nxl3 .nxl3-h2{font:800 var(--l3-fs-xl)/1.2 var(--l3-display);letter-spacing:-.01em;text-wrap:balance}
.nxl3 .nxl3-lead{max-inline-size:66ch;margin-block-start:12px;color:var(--l3-text-2);font-size:16.5px;line-height:1.6}
.nxl3 .nxl3-note{max-inline-size:72ch;color:var(--l3-text-3);font-size:var(--l3-fs-sm);margin-block-start:6px}
.nxl3 .nxl3-note a,.nxl3 .nxl3-foot a{color:var(--l3-text-2);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--l3-line-3)}
.nxl3 .nxl3-ph{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px 24px;padding-block:14px 22px}
.nxl3 .nxl3-ph__meta{display:flex;flex-wrap:wrap;gap:8px;margin-block-start:14px}
.nxl3 .nxl3-ph__act{display:flex;flex-wrap:wrap;gap:8px}
.nxl3 .nxl3-sh{display:flex;align-items:flex-end;justify-content:space-between;gap:12px 20px;margin-block:52px 18px;flex-wrap:wrap}
.nxl3 .nxl3-more{display:inline-flex;align-items:center;gap:6px;min-block-size:40px;font-size:14px;font-weight:600;color:var(--l3-text-2);white-space:nowrap}
.nxl3 .nxl3-more:hover{color:var(--l3-signal-hi)}
.nxl3 .nxl3-more .nxl3-i{inline-size:16px;block-size:16px}
.nxl3 .nxl3-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-block-size:var(--l3-target);padding-inline:18px;border:1px solid var(--l3-line-2);border-radius:var(--l3-r-md);background:var(--l3-ink-2);color:var(--l3-text);font-size:14.5px;font-weight:700;cursor:pointer;transition:background var(--l3-t1),border-color var(--l3-t1),transform var(--l3-t1)}
.nxl3 .nxl3-btn:hover{background:var(--l3-ink-3);border-color:var(--l3-line-3)}
.nxl3 .nxl3-btn:active{transform:translateY(1px)}
.nxl3 .nxl3-btn--primary{background:var(--l3-signal);border-color:var(--l3-signal);color:var(--l3-signal-ink)}
.nxl3 .nxl3-btn--primary:hover{background:var(--l3-signal-hi);border-color:var(--l3-signal-hi)}
.nxl3 .nxl3-btn--quiet{background:transparent}
.nxl3 .nxl3-btn .nxl3-i{inline-size:16px;block-size:16px}/* ---------------------------------------------------------------- badge, chips, filter bar, select, tooltip */


.nxl3 .nxl3-badge{display:inline-flex;align-items:center;gap:6px;min-block-size:24px;padding-inline:9px;border-radius:999px;border:1px solid var(--l3-line-2);font-size:12px;font-weight:600;color:var(--l3-text-2);white-space:nowrap;vertical-align:middle}
.nxl3 .nxl3-badge::before{content:"";inline-size:6px;block-size:6px;border-radius:50%;background:currentColor}
.nxl3 .nxl3-badge--measured{color:var(--l3-signal-hi);border-color:var(--l3-signal-edge)}
.nxl3 .nxl3-badge--estimate{color:var(--l3-amber);border-color:rgba(255,190,24,.42);background:var(--l3-amber-wash)}
.nxl3 .nxl3-badge--estimate::before{background:transparent;border:1.5px solid currentColor;inline-size:7px;block-size:7px}
.nxl3 .nxl3-badge--wronly{color:var(--l3-text-3)}
.nxl3 .nxl3-fbar{position:sticky;inset-block-start:calc(var(--l3-hdr) + var(--l3-top));z-index:30;margin-inline:calc(-1 * var(--l3-gut));padding:10px var(--l3-gut);background:var(--l3-ink-0);border-block-end:1px solid var(--l3-line)}
.nxl3 .nxl3-fbar__in{display:flex;flex-wrap:wrap;align-items:center;gap:10px 12px}
.nxl3 .nxl3-chips{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;flex:1 1 320px;min-inline-size:0;padding-block:2px}
.nxl3 .nxl3-chips::-webkit-scrollbar{display:none}
.nxl3 .nxl3-chip{display:inline-flex;align-items:center;gap:7px;flex:none;min-block-size:38px;padding-inline:13px;border:1px solid var(--l3-line-2);border-radius:999px;background:transparent;font-size:14px;font-weight:600;color:var(--l3-text-2);cursor:pointer;transition:background var(--l3-t1),color var(--l3-t1),border-color var(--l3-t1)}
.nxl3 .nxl3-chip small{font-size:12px;font-weight:600;color:var(--l3-text-3);font-variant-numeric:tabular-nums}
.nxl3 .nxl3-chip:hover{border-color:var(--l3-line-3);color:var(--l3-text)}
.nxl3 .nxl3-chip[aria-pressed=true]{background:var(--l3-text);border-color:var(--l3-text);color:var(--l3-ink-0)}
.nxl3 .nxl3-chip[aria-pressed=true] small{color:#3d4a42}
.nxl3 .nxl3-find{position:relative;display:flex;align-items:center;flex:0 1 240px;min-inline-size:160px}
.nxl3 .nxl3-find .nxl3-i{position:absolute;z-index:1;inset-inline-start:12px;color:var(--l3-text-3);inline-size:16px;block-size:16px;pointer-events:none}
.nxl3 .nxl3-find input{inline-size:100%;block-size:40px;padding-inline:36px 12px;border:1px solid var(--l3-line-2);border-radius:var(--l3-r-md);background:var(--l3-ink-1);font-size:14.5px}
.nxl3 .nxl3-find input:focus{outline:none;border-color:var(--l3-signal-edge)}
.nxl3 .nxl3-find input::placeholder{color:var(--l3-text-3);opacity:1}
.nxl3 .nxl3-sort{display:inline-flex;align-items:center;gap:2px;flex:none;padding:3px;border:1px solid var(--l3-line-2);border-radius:10px;font-size:13px;color:var(--l3-text-3)}
.nxl3 .nxl3-sort>span{padding-inline:8px 6px}
.nxl3 .nxl3-sort button{min-block-size:34px;padding-inline:11px;border:0;border-radius:7px;background:none;font-size:13.5px;font-weight:600;color:var(--l3-text-2);cursor:pointer;white-space:nowrap;transition:background var(--l3-t1),color var(--l3-t1)}
.nxl3 .nxl3-sort button:hover{color:var(--l3-text);background:var(--l3-ink-3)}
.nxl3 .nxl3-sort button[aria-pressed=true]{background:var(--l3-ink-4);color:var(--l3-text)}
@media (max-width:599px){.nxl3 .nxl3-find{flex:1 1 100%}.nxl3 .nxl3-chips{flex-basis:100%;order:3}.nxl3 .nxl3-sort{margin-inline-start:auto}}
.nxl3 .nxl3-tip{position:relative;display:inline-flex;vertical-align:middle}
.nxl3 .nxl3-tip__b{display:inline-grid;place-items:center;inline-size:28px;block-size:28px;border:0;border-radius:50%;background:transparent;color:var(--l3-text-3);cursor:help}
.nxl3 .nxl3-tip__b .nxl3-i{inline-size:16px;block-size:16px}
.nxl3 .nxl3-tip__t{position:absolute;inset-block-end:calc(100% + 6px);inset-inline-start:50%;z-index:20;inline-size:max-content;max-inline-size:260px;padding:8px 10px;border-radius:var(--l3-r-md);background:var(--l3-ink-4);border:1px solid var(--l3-line-2);font-size:12.5px;color:var(--l3-text);line-height:1.45;opacity:0;visibility:hidden;transform:translate(-50%,4px);transition:opacity var(--l3-t2),transform var(--l3-t2),visibility 0s linear var(--l3-t2);pointer-events:none}
[dir=rtl] .nxl3-tip__t{transform:translate(50%,4px)}
.nxl3 .nxl3-tip:hover .nxl3-tip__t,.nxl3 .nxl3-tip__b:focus-visible+.nxl3-tip__t{opacity:1;visibility:visible;transform:translate(-50%,0);transition:opacity var(--l3-t2),transform var(--l3-t2)}
[dir=rtl] .nxl3-tip:hover .nxl3-tip__t,[dir=rtl] .nxl3-tip__b:focus-visible+.nxl3-tip__t{transform:translate(50%,0)}/* ---------------------------------------------------------------- art plate (fixed ratio, monogram underneath, image on top) */


.nxl3 .nxl3-plate{position:relative;display:block;overflow:hidden;aspect-ratio:1;border-radius:10px;background:linear-gradient(160deg,var(--l3-ink-4),var(--l3-ink-2))}
.nxl3 .nxl3-plate--wide{aspect-ratio:16/9}
.nxl3 .nxl3-plate--tall{aspect-ratio:11/20}
.nxl3 .nxl3-plate__fb{position:absolute;inset:0;display:grid;place-items:center;font:800 clamp(16px,30%,44px)/1 var(--l3-display);color:var(--l3-text-3)}
.nxl3 .nxl3-plate img{position:absolute;inset:0;inline-size:100%;block-size:100%;object-fit:cover;color:transparent;transition:transform var(--l3-t3) var(--l3-ease)}
.nxl3 .nxl3-plate.is-broken img{display:none}/* ---------------------------------------------------------------- champion gallery + tile */


.nxl3 .nxl3-gal__count{margin-block:16px 12px;font-size:13.5px;color:var(--l3-text-3);font-variant-numeric:tabular-nums}
.nxl3 .nxl3-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:22px 16px}
@media (max-width:599px){.nxl3 .nxl3-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 10px}}
.nxl3 .nxl3-ct a{position:relative;display:grid;gap:3px;border-radius:12px;outline-offset:4px}
.nxl3 .nxl3-ct .nxl3-plate{margin-block-end:7px;box-shadow:inset 0 0 0 1px var(--l3-line)}
.nxl3 .nxl3-ct .nxl3-plate::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);pointer-events:none}
.nxl3 .nxl3-ct__n{font-size:15px;font-weight:700;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:color var(--l3-t1)}
.nxl3 .nxl3-ct__s{font-size:12.5px;color:var(--l3-text-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nxl3 .nxl3-ct__tag{position:absolute;inset-block-start:8px;inset-inline-end:8px;min-inline-size:30px;padding:3px 7px;border-radius:6px;background:rgba(5,11,7,.82);font:800 12px/1.1 var(--l3-display);color:var(--l3-amber);text-align:center}
@media (hover:hover){.nxl3 .nxl3-ct a:hover .nxl3-plate img{transform:scale(1.06)}.nxl3 .nxl3-ct a:hover .nxl3-ct__n{color:var(--l3-signal-hi)}}
.nxl3 .nxl3-ct[hidden]{display:none}/* ---------------------------------------------------------------- skin tiles */


.nxl3 .nxl3-skinrow{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px}
@media (max-width:599px){.nxl3 .nxl3-skinrow{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:calc(-1 * var(--l3-gut));padding-inline:var(--l3-gut);scrollbar-width:none}.nxl3 .nxl3-skinrow::-webkit-scrollbar{display:none}.nxl3 .nxl3-skinrow>li{flex:0 0 78%;scroll-snap-align:start}}
.nxl3 .nxl3-skin{display:grid;grid-template-rows:auto 1fr;border:1px solid var(--l3-line);border-radius:var(--l3-r-lg);background:var(--l3-ink-1);overflow:hidden;transition:border-color var(--l3-t2)}
.nxl3 .nxl3-skin:hover{border-color:var(--l3-line-3)}
.nxl3 .nxl3-skin .nxl3-plate{border-radius:0}
@media (hover:hover){.nxl3 .nxl3-skin:hover .nxl3-plate img{transform:scale(1.04)}}
.nxl3 .nxl3-skin__b{display:grid;align-content:start;gap:6px;padding:12px 14px 14px}
.nxl3 .nxl3-skin__n{font-weight:700;line-height:1.3}
.nxl3 .nxl3-skin__n:hover{color:var(--l3-signal-hi)}
.nxl3 .nxl3-skin__m{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;font-size:13px;color:var(--l3-text-3)}
.nxl3 .nxl3-skin__unit{font-variant-numeric:tabular-nums;color:var(--l3-text-2)}
.nxl3 .nxl3-skin__buy{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-block-start:6px;min-block-size:40px;padding:6px 12px;border-radius:var(--l3-r-md);background:var(--l3-signal-wash);border:1px solid var(--l3-signal-edge);font-size:13.5px;font-weight:600;transition:background var(--l3-t1)}
.nxl3 .nxl3-skin__buy:hover{background:rgba(69,248,130,.18)}
.nxl3 .nxl2-gem{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;font-weight:600;color:var(--l3-text-2)}
.nxl3 .nxl2-gem__i{inline-size:12px;block-size:12px;flex:none}
.nxl3 .nxl2-gem--epic{color:#45F882}.nxl3 .nxl2-gem--legendary{color:#FFBE18}.nxl3 .nxl2-gem--rare{color:#9FE3BB}.nxl3 .nxl2-gem--ultimate,.nxl3 .nxl2-gem--mythic,.nxl3 .nxl2-gem--exalted,.nxl3 .nxl2-gem--transcendent{color:#F2F6F3}
.nxl3 .nxl3-price,.nxl3 .nxl2-price{color:var(--l3-signal);font:800 16px/1 var(--l3-display);font-variant-numeric:tabular-nums lining-nums;white-space:nowrap}/* ---------------------------------------------------------------- stat bar, table, state, skeleton */


.nxl3 .nxl3-stat{display:grid;grid-template-columns:minmax(80px,auto) 1fr auto;align-items:center;gap:12px;min-block-size:32px;font-size:14px}
.nxl3 .nxl3-stat__l{color:var(--l3-text-2)}
.nxl3 .nxl3-stat__bar{block-size:6px;border-radius:6px;background:var(--l3-ink-4);overflow:hidden}
.nxl3 .nxl3-stat__bar i{display:block;block-size:100%;border-radius:inherit;background:var(--l3-text-2)}
.nxl3 .nxl3-stat__v{font-variant-numeric:tabular-nums;font-weight:700}
.nxl3 .nxl3-stat__v small{margin-inline-start:4px;font-weight:500;color:var(--l3-text-3)}
.nxl3 .nxl3-tbl{overflow-x:auto;border:1px solid var(--l3-line);border-radius:var(--l3-r-lg)}
.nxl3 .nxl3-tbl table{inline-size:100%;border-collapse:collapse;font-size:14px}
.nxl3 .nxl3-tbl caption{padding:12px 14px;text-align:start;font-weight:700}
.nxl3 .nxl3-tbl th,.nxl3 .nxl3-tbl td{padding:10px 14px;text-align:start;border-block-start:1px solid var(--l3-line)}
.nxl3 .nxl3-tbl thead th{font-size:12.5px;font-weight:600;color:var(--l3-text-3);background:var(--l3-ink-1)}
.nxl3 .nxl3-tbl tbody th{font-weight:600}
.nxl3 .nxl3-tbl .is-num{text-align:end;font-variant-numeric:tabular-nums}
.nxl3 .nxl3-tbl tbody tr:hover{background:var(--l3-ink-1)}
.nxl3 .nxl3-state{display:grid;justify-items:center;gap:8px;padding:44px 20px;border:1px dashed var(--l3-line-2);border-radius:var(--l3-r-lg);text-align:center}
.nxl3 .nxl3-state[hidden]{display:none}
.nxl3 .nxl3-state>.nxl3-i{inline-size:24px;block-size:24px;color:var(--l3-text-3)}
.nxl3 .nxl3-state__t{font-weight:700;font-size:16.5px}
.nxl3 .nxl3-state__p{color:var(--l3-text-3);font-size:14px;margin-block-end:6px}
.nxl3 .nxl3-state--error>.nxl3-i{color:var(--l3-danger)}
.nxl3 .nxl3-skel{display:grid;gap:10px}
.nxl3 .nxl3-skel span{display:block;block-size:12px;border-radius:6px;background:var(--l3-ink-3)}/* ---------------------------------------------------------------- champion hero + ability tabs */


.nxl3 .nxl3-hero{position:relative;margin-block:8px 8px;margin-inline:calc(-1 * var(--l3-gut));padding:clamp(28px,4vw,56px) var(--l3-gut) 26px;overflow:hidden;border-block-end:1px solid var(--l3-line)}
.nxl3 .nxl3-hero__art{position:absolute;inset:0;z-index:-1;background:var(--l3-ink-1)}
.nxl3 .nxl3-hero__art img{position:absolute;inset-block:0;inset-inline-end:0;inline-size:min(100%,1180px);block-size:100%;object-fit:cover;object-position:60% 22%;opacity:.88;animation:nxl3-art 700ms var(--l3-ease) both}
.nxl3 .nxl3-hero__art::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--l3-ink-0) 0%,rgba(5,11,7,.92) 30%,rgba(5,11,7,.42) 62%,rgba(5,11,7,.1) 100%),linear-gradient(0deg,var(--l3-ink-0) 0%,rgba(5,11,7,0) 46%)}
[dir=rtl] .nxl3-hero__art::after{background:linear-gradient(270deg,var(--l3-ink-0) 0%,rgba(5,11,7,.92) 30%,rgba(5,11,7,.42) 62%,rgba(5,11,7,.1) 100%),linear-gradient(0deg,var(--l3-ink-0) 0%,rgba(5,11,7,0) 46%)}
[dir=rtl] .nxl3-hero__art img{transform:scaleX(-1)}
.nxl3 .nxl3-hero__art.is-broken img{display:none}
@keyframes nxl3-art{from{opacity:0;transform:translateX(18px)}}
[dir=rtl] .nxl3-hero__art img{animation-name:nxl3-art-rtl}
@keyframes nxl3-art-rtl{from{opacity:0;transform:scaleX(-1) translateX(18px)}to{transform:scaleX(-1)}}
@media (prefers-reduced-motion:reduce){.nxl3 .nxl3-hero__art img{animation:none}}
.nxl3 .nxl3-hero__in{display:grid;gap:30px;max-inline-size:var(--l3-max)}
@media (min-width:1100px){.nxl3 .nxl3-hero__in{grid-template-columns:minmax(0,1fr) minmax(360px,440px);align-items:end}}
.nxl3 .nxl3-hero__id{max-inline-size:620px}
.nxl3 .nxl3-hero__chips{display:flex;flex-wrap:wrap;gap:6px;margin-block-end:14px}
.nxl3 .nxl3-hero__chips li{padding:4px 10px;border-radius:999px;background:rgba(5,11,7,.7);border:1px solid var(--l3-line-2);font-size:12.5px;font-weight:600;color:var(--l3-text-2)}
.nxl3 .nxl3-hero__h{display:grid;gap:8px}
.nxl3 .nxl3-hero__h .rl-detail-h1-name{font:800 clamp(46px,5vw + 16px,92px)/.92 var(--l3-display);letter-spacing:-.03em;color:var(--l3-text)}
.nxl3 .nxl3-hero__h .rl-detail-h1-kind{font-size:15px;font-weight:600;color:var(--l3-signal-hi);letter-spacing:0}
.nxl3 .nxl3-hero__title{margin-block-start:10px;font-size:18px;color:var(--l3-text-2);text-transform:capitalize}
.nxl3 .nxl3-facts{display:flex;flex-wrap:wrap;gap:0;margin-block-start:22px;border:1px solid var(--l3-line-2);border-radius:var(--l3-r-lg);background:rgba(5,11,7,.62);inline-size:fit-content;max-inline-size:100%}
.nxl3 .nxl3-facts>div{display:grid;gap:3px;padding:10px 16px;min-inline-size:110px}
.nxl3 .nxl3-facts>div+div{border-inline-start:1px solid var(--l3-line)}
.nxl3 .nxl3-facts dt{font-size:12px;color:var(--l3-text-3)}
.nxl3 .nxl3-facts dd{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-weight:700;font-variant-numeric:tabular-nums}
.nxl3 .nxl3-hero__act{display:flex;flex-wrap:wrap;gap:8px;margin-block-start:20px}
.nxl3 .nxl3-hero__ab{border:1px solid var(--l3-line-2);border-radius:var(--l3-r-lg);background:rgba(9,17,13,.86);padding:14px}
.nxl3 .nxl3-ab__tabs{display:flex;gap:8px}
.nxl3 .nxl3-ab__tab{position:relative;flex:1 1 0;max-inline-size:72px;padding:0;border:0;background:none;cursor:pointer;border-radius:10px}
.nxl3 .nxl3-ab__tab .nxl3-plate{border-radius:10px;box-shadow:inset 0 0 0 1px var(--l3-line-2);opacity:.62;transition:opacity var(--l3-t1),box-shadow var(--l3-t1)}
.nxl3 .nxl3-ab__tab:hover .nxl3-plate{opacity:.9}
.nxl3 .nxl3-ab__tab[aria-selected=true] .nxl3-plate{opacity:1;box-shadow:0 0 0 2px var(--l3-signal)}
.nxl3 .nxl3-ab__tab kbd{position:absolute;inset-block-end:-6px;inset-inline-end:-4px;display:grid;place-items:center;min-inline-size:22px;block-size:22px;padding-inline:4px;border-radius:6px;background:var(--l3-ink-0);border:1px solid var(--l3-line-2);font:800 11.5px/1 var(--l3-display);color:var(--l3-text)}
.nxl3 .nxl3-ab__tab[aria-selected=true] kbd{background:var(--l3-signal);border-color:var(--l3-signal);color:var(--l3-signal-ink)}
.nxl3 .nxl3-ab__p{padding-block-start:16px;min-block-size:150px}
.nxl3 .nxl3-ab__p:not([hidden]){animation:nxl3-fade var(--l3-t2) var(--l3-ease)}
@keyframes nxl3-fade{from{opacity:0}}
.nxl3 .nxl3-ab__slot{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;color:var(--l3-text-3)}
.nxl3 .nxl3-ab__slot kbd{font:800 11.5px/1 var(--l3-display);padding:3px 6px;border-radius:5px;background:var(--l3-ink-4);color:var(--l3-text)}
.nxl3 .nxl3-ab__n{margin-block:6px 6px;font:800 19px/1.25 var(--l3-display)}
.nxl3 .nxl3-ab__d{font-size:14.5px;color:var(--l3-text-2);line-height:1.6}
.nxl3 .nxl3-ab__meta{display:flex;flex-wrap:wrap;gap:6px 18px;margin-block-start:10px;font-size:13px}
.nxl3 .nxl3-ab__meta div{display:flex;gap:6px}.nxl3 .nxl3-ab__meta dt{color:var(--l3-text-3)}.nxl3 .nxl3-ab__meta dd{font-weight:600;font-variant-numeric:tabular-nums}
.nxl3 .nxl3-ab__clip{margin-block-start:12px;min-block-size:38px;padding-inline:12px;font-size:13.5px}
.nxl3 .nxl3-ab__v{display:block;inline-size:100%;margin-block-start:12px;border-radius:var(--l3-r-md);background:#000;aspect-ratio:16/9}
.nxl3 .nxl3-ab__src{margin-block-start:12px;padding-block-start:10px;border-block-start:1px solid var(--l3-line);font-size:12px;color:var(--l3-text-3)}
.nxl3 .nxl3-ab:not(.is-ready) .nxl3-ab__p[hidden]{display:block}
.nxl3 .nxl3-ab:not(.is-ready) .nxl3-ab__p+.nxl3-ab__p{border-block-start:1px solid var(--l3-line);margin-block-start:12px}
@media (max-width:599px){.nxl3 .nxl3-hero{padding-block-start:150px}.nxl3 .nxl3-hero__art img{inline-size:100%;block-size:280px;object-position:50% 20%;opacity:.9}.nxl3 .nxl3-hero__art::after{background:linear-gradient(0deg,var(--l3-ink-0) 40%,rgba(5,11,7,.2) 75%,rgba(5,11,7,.05))}.nxl3 .nxl3-facts>div{min-inline-size:0;flex:1 1 33%}}/* ---------------------------------------------------------------- store rail */


.nxl3 .nxl3-store__l{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.nxl3 .nxl3-store__i{display:flex;align-items:center;gap:12px;min-block-size:64px;padding:12px 14px;border:1px solid var(--l3-line);border-radius:var(--l3-r-lg);background:var(--l3-ink-1);transition:border-color var(--l3-t1),background var(--l3-t1)}
.nxl3 .nxl3-store__i:hover{border-color:var(--l3-signal-edge);background:var(--l3-ink-2)}
.nxl3 .nxl3-store__ic{inline-size:20px;block-size:20px;color:var(--l3-text-3)}
.nxl3 .nxl3-store__t{display:grid;flex:1;min-inline-size:0}
.nxl3 .nxl3-store__t b{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nxl3 .nxl3-store__t small{font-size:12.5px;color:var(--l3-text-3)}/* ---------------------------------------------------------------- Lab home */


/* the Lab home hero: text only, over the page layer (nxl3-bg: the featured champion / skin of the current update) */
.nxl3 .nxl3-land{position:relative;padding:clamp(20px,4vw,56px) 0 26px}
.nxl3 .nxl3-land__main{position:relative;z-index:5}
.nxl3 .nxl3-land__in{display:grid;gap:28px;max-inline-size:var(--l3-max)}
@media (min-width:1100px){.nxl3 .nxl3-land__in{grid-template-columns:minmax(0,1fr) 320px;align-items:end}}
.nxl3 .nxl3-land__main{max-inline-size:680px}
.nxl3 .nxl3-land__h{font-size:clamp(44px,4vw + 18px,80px);line-height:.95;letter-spacing:-.035em}
.nxl3 .nxl3-land .nxl3-lead{font-size:17px;max-inline-size:56ch}
.nxl3 .nxl3-search--hero{max-inline-size:none;margin-block-start:26px}
.nxl3 .nxl3-search--hero input{block-size:60px;padding-inline:52px 18px;border-radius:12px;font-size:17px;background:rgba(9,17,13,.92);border-color:var(--l3-line-3)}
.nxl3 .nxl3-search--hero .nxl3-search__i{inset-inline-start:18px;inline-size:20px;block-size:20px;color:var(--l3-text-2)}
.nxl3 .nxl3-jump{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-block-start:16px;font-size:13.5px;color:var(--l3-text-3)}
.nxl3 .nxl3-jump ul{display:flex;flex-wrap:wrap;gap:8px}
.nxl3 .nxl3-jump a{display:inline-flex;align-items:center;gap:8px;min-block-size:40px;padding:4px 12px 4px 4px;border-radius:999px;background:rgba(9,17,13,.8);border:1px solid var(--l3-line-2);color:var(--l3-text);font-weight:600;font-size:14px;transition:border-color var(--l3-t1)}
[dir=rtl] .nxl3-jump a{padding:4px 4px 4px 12px}
.nxl3 .nxl3-jump a:hover{border-color:var(--l3-signal-edge)}
.nxl3 .nxl3-jump .nxl3-plate{inline-size:30px;border-radius:50%}
.nxl3 .nxl3-jump .nxl3-plate__fb{font-size:13px}
.nxl3 .nxl3-pc{display:grid;gap:10px;padding:18px;border:1px solid var(--l3-line-2);border-radius:var(--l3-r-lg);background:rgba(9,17,13,.9)}
.nxl3 .nxl3-pc__k{font-size:13px;font-weight:600;color:var(--l3-text-3)}
.nxl3 .nxl3-pc__v{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.nxl3 .nxl3-pc__v b{font:800 34px/1 var(--l3-display);letter-spacing:-.02em}
.nxl3 .nxl3-pc__v span,.nxl3 .nxl3-pc__n{font-size:14px;color:var(--l3-text-2)}
.nxl3 .nxl3-pc__n{display:grid;gap:4px;padding-block:10px;border-block:1px solid var(--l3-line)}
.nxl3 .nxl3-pc__d{font-size:14px;color:var(--l3-text-2)}
.nxl3 .nxl3-pc__d b{font:800 28px/1 var(--l3-display);color:var(--l3-signal);font-variant-numeric:tabular-nums}
.nxl3 .nxl3-pc__src{font-size:12.5px;color:var(--l3-text-3)}
.nxl3 .nxl3-pc__src a{text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--l3-line-3)}
.nxl3 .nxl3-pc .nxl3-btn{justify-self:start}
.nxl3 .nxl3-tools{margin-block-start:40px}
.nxl3 .nxl3-tools .nxl3-h2{margin-block-end:14px}
.nxl3 .nxl3-tools__l{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));border-block-start:1px solid var(--l3-line)}
.nxl3 .nxl3-tool{display:flex;align-items:center;gap:14px;min-block-size:72px;padding:14px 6px;border-block-end:1px solid var(--l3-line);transition:background var(--l3-t1)}
.nxl3 .nxl3-tool:hover{background:var(--l3-ink-1)}
.nxl3 .nxl3-tool__ic{inline-size:22px;block-size:22px;color:var(--l3-signal)}
.nxl3 .nxl3-tool__t{display:grid;gap:2px;flex:1;min-inline-size:0}
.nxl3 .nxl3-tool__t b{font-weight:700}
.nxl3 .nxl3-tool__t small{font-size:13px;color:var(--l3-text-3);line-height:1.4}
.nxl3 .nxl3-tool__go{inline-size:16px;block-size:16px;color:var(--l3-text-3);transition:transform var(--l3-t1)}
.nxl3 .nxl3-tool:hover .nxl3-tool__go{transform:translateX(3px)}
[dir=rtl] .nxl3-tool:hover .nxl3-tool__go{transform:scaleX(-1) translateX(3px)}
@media (min-width:700px){.nxl3 .nxl3-tools__l{column-gap:28px}}
.nxl3 .nxl3-feat__note{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-block:-8px 18px}
.nxl3 .nxl3-grid--feat{grid-template-columns:repeat(auto-fill,minmax(118px,1fr))}
@media (max-width:599px){.nxl3 .nxl3-grid--feat{grid-template-columns:repeat(3,minmax(0,1fr))}}
.nxl3 .nxl3-two{display:grid;gap:8px 40px;margin-block-start:12px}
.nxl3 .nxl3-two .nxl3-h2{margin-block:52px 14px}
@media (min-width:900px){.nxl3 .nxl3-two{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}}
.nxl3 .nxl3-rows{border-block-start:1px solid var(--l3-line)}
.nxl3 .nxl3-rows a{display:flex;align-items:center;gap:12px;min-block-size:54px;padding:10px 4px;border-block-end:1px solid var(--l3-line);font-weight:600}
.nxl3 .nxl3-rows a:hover span{color:var(--l3-signal-hi)}
.nxl3 .nxl3-rows small{margin-inline-start:auto;font-size:12.5px;font-weight:500;color:var(--l3-text-3)}
.nxl3 .nxl3-rows .nxl3-i{inline-size:16px;block-size:16px;color:var(--l3-text-3)}
.nxl3 .nxl3-faq{border-block-start:1px solid var(--l3-line)}
.nxl3 .nxl3-faq details{border-block-end:1px solid var(--l3-line)}
.nxl3 .nxl3-faq summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-block-size:54px;padding:12px 4px;font-weight:600;cursor:pointer;list-style:none}
.nxl3 .nxl3-faq summary::-webkit-details-marker{display:none}
.nxl3 .nxl3-faq summary:hover{color:var(--l3-signal-hi)}
.nxl3 .nxl3-faq__i{inline-size:16px;block-size:16px;color:var(--l3-text-3);transition:transform var(--l3-t2)}
.nxl3 .nxl3-faq details[open] .nxl3-faq__i{transform:rotate(180deg)}
.nxl3 .nxl3-faq details p{padding:0 4px 16px;color:var(--l3-text-2);max-inline-size:70ch}
.nxl3 .nxl3-foot{display:grid;gap:8px;margin-block-start:48px;padding-block-start:18px;border-block-start:1px solid var(--l3-line);font-size:13px;color:var(--l3-text-3)}
.nxl3 .nxl3-foot p{margin:0}
.nxl3 .nxl3-foot .nxl2-foot a{margin-inline-start:6px}
@media (max-width:599px){.nxl3 .nxl3-search--hero input{block-size:54px;font-size:16px}}/* ---------------------------------------------------------------- bottom tab bar (phones) */


.nxl3 .nxl3-tabbar{display:none}
@media (max-width:1099px){
.nxl3 .nxl3-tabbar{display:block;position:fixed;inset-inline:0;inset-block-end:0;z-index:50;background:rgba(9,17,13,.98);border-block-start:1px solid var(--l3-line-2);padding-block-end:env(safe-area-inset-bottom,0px)}
.nxl3 .nxl3-tabbar ul{display:grid;grid-template-columns:repeat(5,1fr);max-inline-size:640px;margin-inline:auto}
.nxl3 .nxl3-tabbar :is(a,button){display:grid;justify-items:center;gap:3px;inline-size:100%;min-block-size:58px;padding:8px 2px;border:0;background:none;font-size:11.5px;font-weight:600;color:var(--l3-text-3);cursor:pointer}
.nxl3 .nxl3-tabbar .nxl3-i{inline-size:21px;block-size:21px}
.nxl3 .nxl3-tabbar .is-on{color:var(--l3-text)}
.nxl3 .nxl3-tabbar .is-on .nxl3-i{color:var(--l3-signal)}
body:has(.nxl3-tabbar){--nx-dock-offset:62px}
}/* ---------------------------------------------------------------- legacy Lab blocks inside the shell (champion pages of both games) */


.nxl3 .riftlab-body{background:none;padding:0}
.nxl3 .riftlab-body>.container,.nxl3 .nxl-after>.container,.nxl3 .nxl3-main .container{max-inline-size:none;padding-inline:0;margin-inline:0}
.nxl3 .rl54-champion-cinematic{display:none}
.nxl3 .rl49-champion-tabs{position:sticky;inset-block-start:calc(var(--l3-hdr) + var(--l3-top));z-index:25;display:flex;gap:4px;margin:0 calc(-1 * var(--l3-gut)) 22px;padding:0 var(--l3-gut);overflow-x:auto;scrollbar-width:none;background:var(--l3-ink-0);border:0;border-block-end:1px solid var(--l3-line);border-radius:0;box-shadow:none}
.nxl3 .rl49-champion-tabs::-webkit-scrollbar{display:none}
.nxl3 .rl49-champion-tabs button{position:relative;flex:none;min-block-size:50px;padding:0 14px;border:0;border-radius:0;background:none;box-shadow:none;font-size:14.5px;font-weight:600;color:var(--l3-text-2);cursor:pointer}
.nxl3 .rl49-champion-tabs button:hover{color:var(--l3-text);background:none}
.nxl3 .rl49-champion-tabs button.on{color:var(--l3-text);background:none}
.nxl3 .rl49-champion-tabs button.on::after{content:"";position:absolute;inset-inline:10px;inset-block-end:-1px;block-size:2px;border-radius:2px;background:var(--l3-signal)}
.nxl3[data-nxl3] :is(.rl-detail-block,.rl-hub)>h2{font:800 var(--l3-fs-xl)/1.2 var(--l3-display);letter-spacing:-.01em}
.nxl3[data-nxl3] :is(.riftlab-panel,.nxl-after .rl-detail,.rl-seo-faq,.rl-patch-history){background:none;border:0;box-shadow:none;padding-inline:0;margin-inline:0}
.nxl3[data-nxl3] .riftlab-panel{padding:0;margin-block:0}
.nxl3[data-nxl3] .nxl-after{padding:0;margin:0;background:none}
.nxl3[data-nxl3] .rl49-champion-page{margin-block-start:0}
.nxl3[data-nxl3] :is(h1,h2,h3,.nxl3-h1,.nxl3-h2){--rl37-font:var(--l3-display)}
.nxl3 .nxl3-tool:hover b{color:var(--l3-signal-hi)}
.nxl3[lang=ar] .nxl3-hero__h .rl-detail-h1-name,.nxl3[lang=ar] .nxl3-land__h{line-height:1.2;letter-spacing:0}
.nxl3[lang=ar] .nxl3-h1{line-height:1.3;letter-spacing:0}
@media (max-width:599px){.nxl3 .nxl3-hero__art::after{background:linear-gradient(0deg,var(--l3-ink-0) 46%,rgba(5,11,7,.62) 72%,rgba(5,11,7,.25))}}
.nxl3 .nxl3-credit .nxl2-credit,.nxl3 .nxl3-foot .nxl2-credit,.nxl3 .nxl3-foot .nxl2-foot{margin:0;font-size:inherit;color:inherit;max-inline-size:none}
.nxl3 .nxl3-ph--art{position:relative;margin-inline:calc(-1 * var(--l3-gut));padding:28px var(--l3-gut) 26px;overflow:hidden}
.nxl3 .nxl3-ph__art{position:absolute;inset:0;z-index:-1}
.nxl3 .nxl3-ph__art img{position:absolute;inset-block:0;inset-inline-end:0;inline-size:min(70%,900px);block-size:100%;object-fit:cover;object-position:50% 22%;opacity:.5;animation:nxl3-art 800ms var(--l3-ease) both}
[dir=rtl] .nxl3-ph__art img{transform:scaleX(-1);animation-name:nxl3-art-rtl}
.nxl3 .nxl3-ph__art::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--l3-ink-0) 30%,rgba(5,11,7,.6) 62%,rgba(5,11,7,.2)),linear-gradient(0deg,var(--l3-ink-0),rgba(5,11,7,0) 50%)}
[dir=rtl] .nxl3-ph__art::after{background:linear-gradient(270deg,var(--l3-ink-0) 30%,rgba(5,11,7,.6) 62%,rgba(5,11,7,.2)),linear-gradient(0deg,var(--l3-ink-0),rgba(5,11,7,0) 50%)}
.nxl3 .nxl3-ph--art .nxl3-ph__txt{position:relative}
@media (max-width:599px){.nxl3 .nxl3-ph__art img{inline-size:100%;opacity:.35}}
@media (prefers-reduced-motion:reduce){.nxl3 .nxl3-ph__art img{animation:none}}
.nxl3 .nxl3-also{display:flex;flex-wrap:wrap;align-items:center;gap:4px 14px;font-size:13.5px;color:var(--l3-text-3)}
.nxl3 .nxl3-also a{color:var(--l3-text-2);font-weight:600;text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--l3-line-3)}
.nxl3 .nxl3-also a:hover{color:var(--l3-signal-hi)}
.nxl3 .nxl3-fbar .nxl3-chips{flex:1 1 100%;order:3}
.nxl3 .nxl3-fbar .nxl3-sort{margin-inline-start:auto}
@media (min-width:900px){.nxl3 .nxl3-fbar .nxl3-chips{flex-wrap:wrap;overflow:visible}}
.nxl3[data-nxl3] .rl-detail-crumbs,.nxl3[data-nxl3] .rl-detail-crumbs a,.nxl3[data-nxl3] .rl-detail-crumbs span{text-transform:none;letter-spacing:normal;font-size:13px;font-weight:500}
.nxl3[data-nxl3] #rl-gift-skins{margin-block-start:52px;padding:0;border:0;background:none;box-shadow:none}
.nxl3[data-nxl3] #rl-gift-skins .rl-detail-block{padding:0;border:0;background:none;box-shadow:none}
.nxl3[data-nxl3] #rl-gift-skins .rl-detail-block>p{max-inline-size:72ch;color:var(--l3-text-3);font-size:var(--l3-fs-sm)}
.nxl3[data-nxl3] #rl-gift-skins .rgs-grid{gap:14px}
.nxl3[data-nxl3] #rl-gift-skins .rgs-grid>li,.nxl3[data-nxl3] #rl-gift-skins .rgs-grid>article{border-color:var(--l3-line);background:var(--l3-ink-1);border-radius:var(--l3-r-lg)}
.nxl3[data-nxl3] #rl-gift-skins .rgs-btn{min-block-size:40px;background:var(--l3-signal-wash);border:1px solid var(--l3-signal-edge);color:var(--l3-text);box-shadow:none}
.nxl3[data-nxl3] #rl-gift-skins .rgs-btn:hover{background:rgba(69,248,130,.18)}
.nxl3[data-nxl3] #rl-gift-skins .rgs-btn--ghost{background:transparent;border-color:var(--l3-line-2);color:var(--l3-text-2)}
.nxl3[data-nxl3] #rl-gift-skins .rgs-price{color:var(--l3-signal);font-family:var(--l3-display)}
.nxl3[lang=ar] .nxl3-hero__h{gap:18px}.nxl3[lang=ar] .nxl3-hero__h .rl-detail-h1-name{line-height:1.3}
@media (max-width:599px){.nxl3 .nxl3-facts{inline-size:100%}.nxl3 .nxl3-facts>div:first-child{flex-basis:100%;border-block-end:1px solid var(--l3-line)}.nxl3 .nxl3-facts>div:nth-child(2){border-inline-start:0}}
/* ---------------------------------------------------------------- phones (owner, iPhone 2026-10-27): only the bottom tab bar is fixed. The Lab top bar and every filter bar scroll
   away with the page (no bar stacks under the site header or over the content); --l3-top is 0 so what stays sticky (none of the Lab's own bars) never leaves a gap. */
@media (max-width:767px){
.nxl3{--l3-top:0px}
.nxl3 .nxl3-top{position:relative;inset-block-start:auto;z-index:40}
.nxl3 .nxl3-top__in{block-size:56px}
.nxl3 .nxl3-fbar{position:relative;inset-block-start:auto;z-index:auto;margin-inline:0;padding:4px 0 8px;background:none;border-block-end:0}
.nxl3 .nxl3-tbl thead th{position:static}
.nxl3 .rl49-champion-tabs{position:relative;inset-block-start:auto}
.nxl3 .nxl3-main{padding-block-end:calc(84px + env(safe-area-inset-bottom,0px))}
}