/* Nexus by Ansab 5.0.0-alpha.1 - LOOK ENGINE. Original look = no data-look attribute = this file does nothing.
   Rules: colours, radius, shadow, type and tab shape only. NEVER size/position/display of existing layout (no jump when a look changes). */
html[data-look]{--k-font:"Segoe UI",system-ui,-apple-system,Roboto,Tahoma,sans-serif;--k-hf:var(--k-font);--k-tkbg:var(--k-hd);--k-tktx:var(--k-hdtx);--k-clkbg:#0c1119;--k-bsh:none;--k-tabsh:none;--k-fx:none}
/* TAB FIX (all looks AND the original): the old sliding indicator drifted away from the selected tab (it is placed from a stale position when the strip scrolls or badges load).
   The selected tab now paints its own fill, bottom line and tick, so it is always exactly where it should be. */
body .tabs .nx-ind{display:none!important}
body .tabs button.on,body .tabs.nx-ready button.on,body .tabs.nx-ready button.on:hover{background-color:var(--tab-on,var(--em))!important;background-image:none!important;color:#fff!important;opacity:1!important;font-weight:700;box-shadow:inset 0 -3px 0 var(--gd)!important}
body .tabs button.on::before{content:"\2713";margin-right:6px;font-weight:900}
/* ---- 6 looks: tokens only ---- */
html[data-look=navy-classic]{--k-bg:#eef2f9;--k-bg2:linear-gradient(180deg,#e7edf8,#f4f7fc 320px);--k-card:#fff;--k-tx:#14213d;--k-mut:#4a5873;--k-ac:#0f2557;--k-actx:#fff;--k-hd:#0f2557;--k-hdtx:#fff;--k-bd:#c9d4e8;--k-r:12px;--k-rs:8px;--k-sh:0 2px 8px rgba(15,37,87,.10);--k-tabbg:#dbe4f4;--k-tabtx:#1d2d52;--k-tabon:#0f2557;--k-tabontx:#fff;--k-tabln:#e0b030;--k-btn:#0f2557;--k-btntx:#fff;--k-ok:#0b6b4a;--k-oktx:#fff;--k-no:#b3261e;--k-notx:#fff;--k-gd:#e0b030;--k-gdtx:#1b1500;--k-in:#fff;--k-sel:#e3ecfb;--k-hf:Georgia,"Times New Roman",serif;--k-tabr:999px}
html[data-look=fluent-light]{--k-bg:#f3f3f3;--k-bg2:#f3f3f3;--k-card:#fff;--k-tx:#1b1b1b;--k-mut:#505050;--k-ac:#005fb8;--k-actx:#fff;--k-hd:#fff;--k-hdtx:#1b1b1b;--k-bd:#d6d6d6;--k-r:8px;--k-rs:4px;--k-sh:0 1px 2px rgba(0,0,0,.12);--k-tabbg:#e9e9e9;--k-tabtx:#1b1b1b;--k-tabon:#fff;--k-tabontx:#003f7d;--k-tabln:#005fb8;--k-btn:#005fb8;--k-btntx:#fff;--k-ok:#0f7b0f;--k-oktx:#fff;--k-no:#c42b1c;--k-notx:#fff;--k-gd:#fce100;--k-gdtx:#1b1b1b;--k-in:#fff;--k-sel:#e5f1fb;--k-tabr:6px;--k-tkbg:#e9e9e9;--k-tktx:#1b1b1b}
@supports (color:AccentColor){html[data-look=fluent-light]{--k-ac:AccentColor;--k-actx:AccentColorText;--k-btn:AccentColor;--k-btntx:AccentColorText;--k-tabln:AccentColor}}
html[data-look=midnight-pro]{--k-bg:#0d1117;--k-bg2:#0d1117;--k-card:#161b22;--k-tx:#e6edf3;--k-mut:#a7b4c4;--k-ac:#2fd08f;--k-actx:#04251a;--k-hd:#161b22;--k-hdtx:#e6edf3;--k-bd:#30363d;--k-r:10px;--k-rs:6px;--k-sh:0 0 0 1px #30363d;--k-tabbg:#10151c;--k-tabtx:#c3cfdd;--k-tabon:#0f7a52;--k-tabontx:#fff;--k-tabln:#2fd08f;--k-btn:#21262d;--k-btntx:#e6edf3;--k-ok:#0f7a52;--k-oktx:#fff;--k-no:#b42318;--k-notx:#fff;--k-gd:#d4a017;--k-gdtx:#1a1300;--k-in:#0d1117;--k-sel:#12382b;--k-tabr:8px;--k-dark:1}
html[data-look=aurora-glass]{--k-bg:#101a3a;--k-bg2:linear-gradient(135deg,#1b1146 0%,#0b3b5c 55%,#0e6e6e 100%) fixed;--k-card:rgba(255,255,255,.12);--k-tx:#f4f7ff;--k-mut:#c9d6ee;--k-ac:#7de3ff;--k-actx:#06142e;--k-hd:rgba(10,15,42,.55);--k-hdtx:#f4f7ff;--k-bd:rgba(255,255,255,.28);--k-r:20px;--k-rs:12px;--k-sh:0 8px 28px rgba(0,0,0,.28);--k-tabbg:rgba(255,255,255,.10);--k-tabtx:#eaf1ff;--k-tabon:#5b6cff;--k-tabon-img:linear-gradient(135deg,#8b7bff,#22d3ee);--k-tabontx:#06142e;--k-tabln:#fff;--k-btn:rgba(255,255,255,.18);--k-btntx:#fff;--k-ok:#12805c;--k-oktx:#fff;--k-no:#c23b32;--k-notx:#fff;--k-gd:#ffd166;--k-gdtx:#2a1d00;--k-in:rgba(6,20,46,.55);--k-sel:rgba(125,227,255,.25);--k-tabr:999px;--k-dark:1;--k-fx:blur(14px)}
html[data-look=paper-ink]{--k-bg:#fbfaf7;--k-bg2:#fbfaf7;--k-card:#fff;--k-tx:#111;--k-mut:#3d3d3d;--k-ac:#111;--k-actx:#fff;--k-hd:#fff;--k-hdtx:#111;--k-bd:#111;--k-r:3px;--k-rs:2px;--k-sh:none;--k-tabbg:#fff;--k-tabtx:#111;--k-tabon:#111;--k-tabontx:#fff;--k-tabln:#111;--k-btn:#111;--k-btntx:#fff;--k-ok:#0a5c2e;--k-oktx:#fff;--k-no:#a31515;--k-notx:#fff;--k-gd:#f2c200;--k-gdtx:#111;--k-in:#fff;--k-sel:#ececec;--k-hf:Georgia,"Times New Roman",serif;--k-tabr:2px;--k-tkbg:#111;--k-tktx:#fff}
html[data-look=sage-calm]{--k-bg:#eaf1ec;--k-bg2:linear-gradient(180deg,#e2ece6,#f1f6f2 360px);--k-card:#f9fcfa;--k-tx:#1f2d26;--k-mut:#4a5e53;--k-ac:#2f6f55;--k-actx:#fff;--k-hd:#2f6f55;--k-hdtx:#fff;--k-bd:#c6d9ce;--k-r:22px;--k-rs:14px;--k-sh:0 6px 18px rgba(47,111,85,.12);--k-tabbg:#d9e7de;--k-tabtx:#23382d;--k-tabon:#2f6f55;--k-tabontx:#fff;--k-tabln:#f2c14e;--k-btn:#2f6f55;--k-btntx:#fff;--k-ok:#1f7a4d;--k-oktx:#fff;--k-no:#b23a3a;--k-notx:#fff;--k-gd:#f2c14e;--k-gdtx:#2a2000;--k-in:#fff;--k-sel:#dcefe3;--k-tabr:999px}
/* Windows follows its own setting: Fluent turns dark when Windows is dark */
@media (prefers-color-scheme:dark){html[data-look=fluent-light]{--k-bg:#202020;--k-bg2:#202020;--k-card:#2b2b2b;--k-tx:#f5f5f5;--k-mut:#c8c8c8;--k-hd:#2b2b2b;--k-hdtx:#f5f5f5;--k-bd:#454545;--k-tabbg:#2f2f2f;--k-tabtx:#f5f5f5;--k-tabon:#3a3a3a;--k-tabontx:#fff;--k-in:#1c1c1c;--k-sel:#0f3a5f;--k-sh:0 0 0 1px #454545;--k-tkbg:#2f2f2f;--k-tktx:#f5f5f5;--k-dark:1}}
/* ---- shared mapping (one code path, tested once) ---- */
html[data-look] body{--bg:var(--k-bg);--card:var(--k-card);--tx:var(--k-tx);--ac:var(--k-ac);--em:var(--k-ok);--gd:var(--k-gd);--bd:var(--k-bd);--h1:var(--k-hd);--h2:var(--k-hd);background:var(--k-bg2);color:var(--k-tx);font-family:var(--k-font);color-scheme:light}
html[data-look] body,html[data-look] .card,html[data-look] .card *:not(button):not(.stl):not(.pill):not(.qnew26):not(a){color:inherit}
html[data-look] .card small,html[data-look] small,html[data-look] .note{color:var(--k-mut)}
html[data-look] main h1,html[data-look] main h2,html[data-look] main h3,html[data-look] .pop h2,html[data-look] .pop h3{font-family:var(--k-hf);color:var(--k-tx)}
html[data-look] header h1,html[data-look] .hero h1,html[data-look] .hero h2,html[data-look] .hero h3{font-family:var(--k-hf);color:var(--k-hdtx)}
html[data-look] header,html[data-look] .bis{background:var(--k-hd);color:var(--k-hdtx);border-color:var(--k-bd)}
html[data-look] header *,html[data-look] .bis,html[data-look] .bis *{color:var(--k-hdtx)}
html[data-look] header button{background:transparent;color:var(--k-hdtx);border:1px solid var(--k-bd);box-shadow:none;background-image:none}
html[data-look] .tk{background:var(--k-tkbg);color:var(--k-tktx);border-color:var(--k-bd)}html[data-look] .tk *{color:var(--k-tktx)}
html[data-look] .hero{background:var(--k-hd);color:var(--k-hdtx);border-radius:var(--k-r)}html[data-look] .hero *{color:var(--k-hdtx)}
html[data-look] .card{background:var(--k-card);color:var(--k-tx);border:1px solid var(--k-bd);border-radius:var(--k-r);box-shadow:var(--k-sh);background-image:none;-webkit-backdrop-filter:var(--k-fx);backdrop-filter:var(--k-fx)}
html[data-look] .card .card{box-shadow:none}
html[data-look] footer{color:var(--k-mut)}
/* neon clock bar: every look keeps the neon clock, set in a look-specific capsule */
html[data-look] #nxclock{background:var(--k-clkbg);border-bottom:1px solid var(--k-bd)}
html[data-look=navy-classic] #nxclock{border-bottom:2px solid #e0b030}html[data-look=aurora-glass] #nxclock{background:rgba(6,10,30,.72);border-bottom-color:rgba(125,227,255,.5)}html[data-look=paper-ink] #nxclock{border-bottom:3px double #fff}html[data-look=sage-calm] #nxclock{background:#16251d}
/* tabs: selected tab is shape + fill + line + tick (never colour alone) */
html[data-look] .tabs,html[data-look] .tabs.card{background:var(--k-tabbg);border-radius:var(--k-r);border:1px solid var(--k-bd);box-shadow:none}
html[data-look] .tabs button{background:transparent;background-image:none;color:var(--k-tabtx);border:1px solid transparent;border-radius:var(--k-tabr);box-shadow:none;font-weight:600;text-shadow:none}
html[data-look] .tabs button:hover{background:var(--k-sel)}
html[data-look] body .tabs button.on,html[data-look] body .tabs.nx-ready button.on,html[data-look] body .tabs.nx-ready button.on:hover{background-color:var(--k-tabon)!important;background-image:var(--k-tabon-img,none)!important;color:var(--k-tabontx)!important;font-weight:800;box-shadow:inset 0 -3px 0 var(--k-tabln)!important}
html[data-look] .tabs button.on::before{content:"\2713";font-weight:900;margin-right:6px}
html[data-look] .tabs button .ic{color:inherit;stroke:currentColor}
/* buttons */
html[data-look] button{background:var(--k-btn);background-image:none;color:var(--k-btntx);border:1px solid transparent;border-radius:var(--k-rs);box-shadow:var(--k-bsh);text-shadow:none;font-family:var(--k-font)}
html[data-look] button.g{background:var(--k-ok);color:var(--k-oktx)}html[data-look] button.r{background:var(--k-no);color:var(--k-notx)}html[data-look] button.q{background:var(--k-gd);color:var(--k-gdtx)}
html[data-look=aurora-glass] button:not(.g):not(.r):not(.q){border-color:rgba(255,255,255,.35)}html[data-look=paper-ink] button{border:2px solid #111}html[data-look=paper-ink] button.g,html[data-look=paper-ink] button.r,html[data-look=paper-ink] button.q{border-color:#111}
html[data-look] button:hover{filter:brightness(1.08)}html[data-look] button:active{filter:brightness(.94)}
html[data-look] button:focus-visible,html[data-look] input:focus-visible,html[data-look] select:focus-visible,html[data-look] textarea:focus-visible,html[data-look] a:focus-visible{outline:3px solid var(--k-tabln);outline-offset:2px}
html[data-look] button:disabled{opacity:.55}
/* fields + tables */
html[data-look] input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]),html[data-look] select,html[data-look] textarea{background:var(--k-in);color:var(--k-tx);border:1px solid var(--k-bd);border-radius:var(--k-rs);box-shadow:none}
html[data-look] input::placeholder,html[data-look] textarea::placeholder{color:var(--k-mut);opacity:.9}
html[data-look] input[type=checkbox],html[data-look] input[type=radio]{accent-color:var(--k-ac)}
html[data-look] table{color:var(--k-tx)}html[data-look] th{background:var(--k-sel);color:var(--k-tx);border-color:var(--k-bd)}html[data-look] td{border-color:var(--k-bd)}
html[data-look] a{color:var(--k-ac)}html[data-look=aurora-glass] a,html[data-look=midnight-pro] a{color:var(--k-ac)}
html[data-look] hr{border-color:var(--k-bd)}
/* pop-ups, pills, status, progress */
html[data-look] .pop>div{background:var(--k-card);color:var(--k-tx);border:1px solid var(--k-bd);border-radius:var(--k-r);box-shadow:0 18px 48px rgba(0,0,0,.35)}html[data-look=aurora-glass] .pop>div{background:#14224a}
html[data-look] .pill{background:var(--k-sel);color:var(--k-tx);border:1px solid var(--k-bd)}
html[data-look] .pb{background:var(--k-bd)}html[data-look] .pb i{background:var(--k-ok)}
/* STUDENT EXAM: options, palette, question number - same sizes as the original, only colours change */
html[data-look] .opt{background:var(--k-card);color:var(--k-tx);border:2px solid var(--k-bd);border-radius:var(--k-rs);box-shadow:none}
html[data-look] .opt.sel{background:var(--k-sel);border-color:var(--k-ac);color:var(--k-tx);box-shadow:inset 5px 0 0 var(--k-ac)}
html[data-look] .opt.sel::after{content:" \2713";font-weight:900}
html[data-look] .qn{color:var(--k-ac)}
html[data-look] .pal button{background:var(--k-tabbg);color:var(--k-tabtx);border:1px solid var(--k-bd);box-shadow:none}
html[data-look] .pal button.a{background:var(--k-ok);color:var(--k-oktx)}
html[data-look] .pal button.c{background-color:var(--k-tabon);background-image:var(--k-tabon-img,none);color:var(--k-tabontx);outline:3px solid var(--k-gd)}
html[data-look] body.nx-exam .card,html[data-look] body.nx-exam header,html[data-look] .nx-exam .tabs{-webkit-backdrop-filter:none;backdrop-filter:none;transition:none}
/* exam banner + option letter + header sub-lines (found by the contrast audit) */
html[data-look] .xh1 .xt,html[data-look] .xh1 .xs{color:var(--k-hdtx)!important}
html[data-look] .opt .ol{background:var(--k-sel)!important;color:var(--k-tx)!important}html[data-look] .opt.sel .ol{background:var(--k-ac)!important;color:var(--k-actx)!important}
html[data-look] header *,html[data-look] .tk *{color:inherit}
html[data-look] header div,html[data-look] header small,html[data-look] header span,html[data-look] header b,html[data-look] header h1{color:var(--k-hdtx)!important}
html[data-look=navy-classic] header div[style*="color"],html[data-look=sage-calm] header div[style*="color"],html[data-look=midnight-pro] header div[style*="color"],html[data-look=aurora-glass] header div[style*="color"]{color:#fff0b3!important}
html[data-look] .xh{background:var(--k-hd);background-image:none;color:var(--k-hdtx);border:1px solid var(--k-bd)}html[data-look] .xh *{color:var(--k-hdtx)!important}
html[data-look] .xst,html[data-look] .xst *{color:var(--k-hdtx)!important}html[data-look] .xb{background:rgba(127,127,127,.16);border:1px solid var(--k-bd)}
html[data-look] body.nx-exam #app .xst .xb>*:first-child{color:var(--k-hdtx)!important;opacity:.9!important}
/* motion: look changes are instant (no re-layout, no flash); respect reduced motion */
@media (prefers-reduced-motion:reduce){html[data-look] *{transition:none!important;animation-duration:.001ms!important}}
/* Windows high-contrast / forced colours: let the system colours win, keep selected state obvious */
@media (forced-colors:active){html[data-look] .tabs button.on{background:Highlight;color:HighlightText;forced-color-adjust:none;border-color:HighlightText}html[data-look] button{border:1px solid ButtonText}}

/* v5.2 no layout jump on PC load: reserve the 28 px neon-clock bar until the clock is inserted (browsers without :has() ignore this rule and behave as before) */
@media (min-width:761px){body:not(:has(#nxclock))::before{content:"";display:block;height:28px;background:linear-gradient(#0c1119,#161d29)}}
/* v5.2 the news ticker line is 37 px tall once its text arrives; keep that height from the first paint so nothing below it moves */
@media (min-width:761px){.tk{min-height:37px;box-sizing:border-box}}
/* v5.2 no width jump on big screens: v2_6.js used to inject the full-width layout ~350 ms AFTER first paint (page widened from 1290 to 1910 px on a 1920 screen).
   The same rules now arrive with the first stylesheet, so the first paint is already the final layout. Identical to the v2_6.js rules. */
main,body.wide22 main{max-width:100%!important;width:100%;margin:12px 0!important;padding:0 14px!important;box-sizing:border-box}
.card{max-width:100%;box-sizing:border-box}
@media (max-width:760px){main,body.wide22 main{padding:0 6px!important;margin:8px 0!important}}

/* v5.2 (alpha.6) contrast: the selected option letter in the ORIGINAL look was white on #0f8a5f (4.4:1). Same green family, a touch deeper: 5.5:1. */
html body .opt.sel .ol{background:#0b7550;background:color-mix(in srgb,var(--em) 82%,#000);color:#fff}

/* v5.2 (alpha.6) status colours of the new lines/cards: dark enough on light looks, light enough on dark looks (no colour is set inline any more) */
#sv55{color:#55627a}#sv55[data-s=ok]{color:#0a6b43}#sv55[data-s=warn]{color:#8a5200}
.ok55{color:#0a6b43}.er55{color:#b3261e}#sh54 .rq54,#qm51 .rq{color:#b3261e}
html[data-look=midnight-pro] #sv55,html[data-look=aurora-glass] #sv55{color:#b9c6d8}
html[data-look=midnight-pro] #sv55[data-s=ok],html[data-look=aurora-glass] #sv55[data-s=ok],html[data-look=midnight-pro] .ok55,html[data-look=aurora-glass] .ok55{color:#5fe3a8}
html[data-look=midnight-pro] #sv55[data-s=warn],html[data-look=aurora-glass] #sv55[data-s=warn]{color:#ffc766}
html[data-look=midnight-pro] .er55,html[data-look=aurora-glass] .er55,html[data-look=midnight-pro] #sh54 .rq54,html[data-look=aurora-glass] #sh54 .rq54,html[data-look=midnight-pro] #qm51 .rq,html[data-look=aurora-glass] #qm51 .rq{color:#ff9c94}
@media (prefers-color-scheme:dark){html[data-look=fluent-light] #sv55{color:#b9c6d8}html[data-look=fluent-light] #sv55[data-s=ok],html[data-look=fluent-light] .ok55{color:#5fe3a8}html[data-look=fluent-light] #sv55[data-s=warn]{color:#ffc766}html[data-look=fluent-light] .er55,html[data-look=fluent-light] #sh54 .rq54,html[data-look=fluent-light] #qm51 .rq{color:#ff9c94}}