/* ============================================================================
   AMAADOR ACADEMY 4.0 — "CUPERTINO INK"  ·  Apple-grade identity layer
   Loads LAST (after amaador-design-system.css → academy.css →
   amaador-academy-overrides.css) and therefore owns the final look.
   System: SF-adjacent system font stack (no webfonts except Tajawal for
   Arabic), pure neutral surfaces (#F5F5F7 / #1D1D1F family), ONE accent
   (Apple blue: #0071E3 light / #0A84FF dark), a single radius scale
   (8/12/16/20/pill), soft layered shadows, hairline borders, quiet motion.
   Three themes: light (default) / dark / pitch (OLED true black).
   The old amaador-academy-overrides.css (Design-3.0 monochrome) is retired
   to a stub; every still-needed guard from it lives here now.
   ============================================================================ */

/* ---------------------------------------------------------------- TOKENS -- */
:root, html[data-theme="light"]{
  /* surfaces */
  --bg:#F5F5F7; --bg2:#FFFFFF; --bg3:#E8E8ED;
  --window:#FFFFFF; --surface:#F5F5F7; --surface2:#E8E8ED;
  --glass:rgba(255,255,255,.72); --glass-strong:rgba(255,255,255,.88);
  /* ink ladder */
  --ink:#1D1D1F; --ink2:#3A3A3C; --txt:#3A3A3C; --muted:#6E6E73; --mut:#6E6E73; --faint:#AEAEB2;
  /* hairlines */
  --line:rgba(0,0,0,.08); --line2:rgba(0,0,0,.14); --line3:rgba(0,0,0,.22); --hair:rgba(0,0,0,.06);
  /* dark chip (brand cap, step numbers) — stays dark in every theme */
  --navy:#1D1D1F; --navy2:#2C2C2E; --on-navy:#FFFFFF;
  /* the one accent (+fill variant: filled-button surface, AA with white ink) */
  --acc:#0071E3; --acc2:#0077ED; --acc-rgb:0,113,227;
  --acc-fill:#0071E3; --acc-fill2:#0077ED;
  --acc-dim:rgba(0,113,227,.10); --acc-soft:#E8F2FE;
  /* certificate gold (brand element, certificates only) */
  --gold:#8F6F26; --gold2:#C9A75A;
  /* semantic */
  --good:#1B7E3F; --bad:#D70015;
  /* legacy pastel tokens → flat neutral tints */
  --p-lav:rgba(0,0,0,.03); --p-blue:rgba(0,0,0,.03); --p-blue2:rgba(0,0,0,.03);
  --p-pink:rgba(0,0,0,.03); --p-green:rgba(0,0,0,.03); --p-purple:rgba(0,0,0,.03);
  /* one radius scale */
  --r:8px; --r-md:12px; --r-lg:16px; --r-xl:20px; --pill:999px; --r-pill:999px;
  /* soft layered shadows */
  --shadow-sm:0 1px 2px rgba(0,0,0,.05), 0 3px 10px rgba(0,0,0,.04);
  --shadow:0 2px 6px rgba(0,0,0,.04), 0 12px 28px rgba(0,0,0,.08);
  --shadow-lg:0 8px 20px rgba(0,0,0,.06), 0 28px 60px rgba(0,0,0,.12);
  /* type: system SF stack everywhere; Tajawal joins for Arabic below */
  --font-sys:-apple-system,BlinkMacSystemFont,'SF Pro Display','SF Pro Text','Segoe UI Variable Display','Segoe UI',Roboto,'Helvetica Neue',Arial,'Noto Sans',sans-serif;
  --font:var(--font-sys); --font-display:var(--font-sys);
  --font-title:var(--font-sys); --font-head:var(--font-sys);
  /* shared-core token remaps (amaador-design-system.css reads these) */
  --font-body:var(--font-sys); --font-mono:ui-monospace,'SF Mono','Cascadia Code',Menlo,Consolas,monospace;
  --font-arabic:'Tajawal',sans-serif;
  --bg-void:#F5F5F7; --bg-base:#F5F5F7; --bg-raised:#FFFFFF; --bg-elevated:#FFFFFF; --bg-overlay:#FFFFFF;
  --border-subtle:rgba(0,0,0,.08); --border-default:rgba(0,0,0,.14); --border-strong:rgba(0,0,0,.22); --border-focus:#0071E3;
  --text-primary:#1D1D1F; --text-secondary:#3A3A3C; --text-tertiary:#6E6E73;
  --chrome-dim:#8E8E93; --chrome-mid:#6E6E73; --chrome-bright:#3A3A3C; --chrome-shine:#1D1D1F;
  --surface-sm:rgba(0,0,0,.04); --surface-md:rgba(0,0,0,.06);
  --accent:#0071E3;
  /* motion */
  --ease-out:cubic-bezier(.25,1,.4,1); --ease-in-out:cubic-bezier(.6,0,.2,1);
  --dur-fast:150ms; --dur:250ms; --dur-slow:450ms;
  color-scheme:light;
}
html[lang="ar"], [dir="rtl"]{
  --font:'Tajawal',var(--font-sys); --font-display:'Tajawal',var(--font-sys);
  --font-title:'Tajawal',var(--font-sys); --font-head:'Tajawal',var(--font-sys);
  --font-body:'Tajawal',var(--font-sys);
}

html[data-theme="dark"]{
  --bg:#151517; --bg2:#1A1A1E; --bg3:#232327;
  --window:#1E1E22; --surface:#26262B; --surface2:#2E2E34;
  --glass:rgba(24,24,27,.72); --glass-strong:rgba(28,28,32,.88);
  --ink:#F5F5F7; --ink2:#D6D6DB; --txt:#C7C7CC; --muted:#98989F; --mut:#98989F; --faint:#636368;
  --line:rgba(255,255,255,.10); --line2:rgba(255,255,255,.16); --line3:rgba(255,255,255,.26); --hair:rgba(255,255,255,.07);
  --navy:#2C2C2E; --navy2:#3A3A3C; --on-navy:#F5F5F7;
  /* #0A84FF stays for links/rings (AA on dark surfaces); filled buttons use the
     deeper --acc-fill so white label ink holds 4.5:1 (0A84FF+white is only 3.65) */
  --acc:#0A84FF; --acc2:#3395FF; --acc-rgb:10,132,255;
  --acc-fill:#0071E3; --acc-fill2:#005FC4;
  --acc-dim:rgba(10,132,255,.16); --acc-soft:rgba(10,132,255,.14);
  --gold:#C9A75A; --gold2:#E0C387;
  --good:#30D158; --bad:#FF6961;
  --p-lav:rgba(255,255,255,.05); --p-blue:rgba(255,255,255,.05); --p-blue2:rgba(255,255,255,.05);
  --p-pink:rgba(255,255,255,.05); --p-green:rgba(255,255,255,.05); --p-purple:rgba(255,255,255,.05);
  --shadow-sm:0 1px 2px rgba(0,0,0,.5), 0 4px 14px rgba(0,0,0,.35);
  --shadow:0 2px 8px rgba(0,0,0,.5), 0 16px 36px rgba(0,0,0,.5);
  --shadow-lg:0 10px 24px rgba(0,0,0,.5), 0 32px 70px rgba(0,0,0,.6);
  --bg-void:#151517; --bg-base:#151517; --bg-raised:#1E1E22; --bg-elevated:#26262B; --bg-overlay:#26262B;
  --border-subtle:rgba(255,255,255,.10); --border-default:rgba(255,255,255,.16); --border-strong:rgba(255,255,255,.26); --border-focus:#0A84FF;
  --text-primary:#F5F5F7; --text-secondary:#D6D6DB; --text-tertiary:#98989F;
  --chrome-dim:#636368; --chrome-mid:#98989F; --chrome-bright:#D6D6DB; --chrome-shine:#F5F5F7;
  --surface-sm:rgba(255,255,255,.06); --surface-md:rgba(255,255,255,.09);
  --accent:#0A84FF;
  color-scheme:dark;
}

/* pitch = same dark palette on OLED true black; hairlines slightly stronger */
html[data-theme="pitch"]{
  --bg:#000000; --bg2:#0A0A0C; --bg3:#141416;
  --window:#0E0E10; --surface:#161618; --surface2:#1E1E21;
  --glass:rgba(8,8,10,.72); --glass-strong:rgba(12,12,14,.9);
  --ink:#F5F5F7; --ink2:#D6D6DB; --txt:#C7C7CC; --muted:#98989F; --mut:#98989F; --faint:#636368;
  --line:rgba(255,255,255,.12); --line2:rgba(255,255,255,.18); --line3:rgba(255,255,255,.28); --hair:rgba(255,255,255,.09);
  --navy:#2C2C2E; --navy2:#3A3A3C; --on-navy:#F5F5F7;
  --acc:#0A84FF; --acc2:#3395FF; --acc-rgb:10,132,255;
  --acc-fill:#0071E3; --acc-fill2:#005FC4;
  --acc-dim:rgba(10,132,255,.16); --acc-soft:rgba(10,132,255,.14);
  --gold:#C9A75A; --gold2:#E0C387;
  --good:#30D158; --bad:#FF6961;
  --p-lav:rgba(255,255,255,.05); --p-blue:rgba(255,255,255,.05); --p-blue2:rgba(255,255,255,.05);
  --p-pink:rgba(255,255,255,.05); --p-green:rgba(255,255,255,.05); --p-purple:rgba(255,255,255,.05);
  --shadow-sm:0 1px 2px rgba(0,0,0,.6), 0 4px 14px rgba(0,0,0,.45);
  --shadow:0 2px 8px rgba(0,0,0,.6), 0 16px 36px rgba(0,0,0,.6);
  --shadow-lg:0 10px 24px rgba(0,0,0,.6), 0 32px 70px rgba(0,0,0,.7);
  --bg-void:#000000; --bg-base:#000000; --bg-raised:#0E0E10; --bg-elevated:#161618; --bg-overlay:#161618;
  --border-subtle:rgba(255,255,255,.12); --border-default:rgba(255,255,255,.18); --border-strong:rgba(255,255,255,.28); --border-focus:#0A84FF;
  --text-primary:#F5F5F7; --text-secondary:#D6D6DB; --text-tertiary:#98989F;
  --chrome-dim:#636368; --chrome-mid:#98989F; --chrome-bright:#D6D6DB; --chrome-shine:#F5F5F7;
  --surface-sm:rgba(255,255,255,.07); --surface-md:rgba(255,255,255,.10);
  --accent:#0A84FF;
  color-scheme:dark;
}

/* ------------------------------------------------------------------ BASE -- */
/* one flat canvas per theme — kills academy.css's Aurora pastels (light) and
   indigo glows (dark) in a single rule; loads last + !important wins all */
body{
  background:var(--bg) !important; background-image:none !important;
  color:var(--txt); font-family:var(--font);
}
::selection{ background:rgba(var(--acc-rgb),.25) !important; color:var(--ink) !important; }
::-webkit-scrollbar-thumb{ background:var(--line3) !important; border-color:transparent !important; }
html{ scrollbar-color:var(--line3) transparent !important; }

/* typography: SF voice — tight display tracking, calm body */
h1,h2,h3,h4,.h1,.h2,.h3{ font-family:var(--font-display) !important; color:var(--ink); }
h1,.h1{ font-weight:700; letter-spacing:-.02em; }
h2,.h2,.sec-t{ font-weight:700; letter-spacing:-.017em; }
h3,.h3{ font-weight:600; letter-spacing:-.01em; }
h1,h2,h3{ text-wrap:balance; }
p{ text-wrap:pretty; }
.brand-main{ font-family:var(--font-display) !important; font-weight:700; letter-spacing:-.01em; color:var(--ink); }
.lead{ color:var(--muted); }
.sec-t{ font-size:clamp(1.7rem,3.2vw,2.35rem); }

/* gradient text retired site-wide → solid ink (hero photo copy re-whitened below) */
.gx{
  background:none !important; -webkit-background-clip:initial !important; background-clip:initial !important;
  -webkit-text-fill-color:currentColor !important; color:inherit !important;
}
.motto-band h2{
  background:none !important; -webkit-text-fill-color:currentColor !important; color:var(--ink) !important;
  font-family:var(--font-display) !important; letter-spacing:-.015em;
}
.motto-band:before{ background:var(--line2) !important; }

/* focus */
:focus-visible{ outline:2px solid var(--acc) !important; outline-offset:2px; }
.skip-link{ background:var(--acc) !important; color:#fff !important; }

/* -------------------------------------------------------------- GUARDS ---- */
/* the shared core's substring selectors over-match; neutralize (ex-overrides) */
.paths-grid,.tr-grid,.hub-fieldgrid,.disc-squares,.dash-stats,.foot-network-grid,
.tr-ws-grid,.tr-embeds,.cert-qrs{
  background:none !important; background-image:none !important; border:0 !important;
  box-shadow:none !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
  padding:0 !important;
}
.fab-label,.dfab-label{ font-size:inherit !important; text-transform:none !important; letter-spacing:.01em !important; }
.dash-stats,.dash-stat,.ha-stat,.stat,.static-seo-block,.static-seo-intro,
.static-seo-subhead,.static-seo-modules,.static-seo-objectives,.static-seo-courselist{
  font-size:inherit; letter-spacing:normal;
}
.dash-stat span,.stat .stat-l,.ha-stat span{ font-size:.76rem !important; letter-spacing:.04em !important; }
.brand,.brand-lockup,a.brand,[class*="logo"]{
  padding:0 !important; background:none !important; background-image:none !important;
  box-shadow:none !important; border:0 !important; border-radius:0 !important;
}
.brand:hover,a.brand:hover{ background:none !important; box-shadow:none !important; }
/* suite chrome that doesn't belong to this identity */
.d2-atmos,.d2-grain,#neon-grid,#neon-scan,.d2-orbit-band,.d2-footer{ display:none !important; }

/* ------------------------------------------------------------------ HEADER */
.site-head{
  background:var(--glass) !important;
  -webkit-backdrop-filter:blur(20px) saturate(1.8) !important; backdrop-filter:blur(20px) saturate(1.8) !important;
  border-bottom:1px solid var(--hair) !important;
  box-shadow:none !important;
}
/* the core's [class*="nav-wrap"] catch-all paints a second bar — flatten it */
.site-head .nav-wrap,.nav-wrap{
  background:none !important; border:0 !important; box-shadow:none !important;
  -webkit-backdrop-filter:none !important; backdrop-filter:none !important;
}
.nav-wrap{ height:64px !important; gap:18px; }
.brand-cap{ background:var(--navy) !important; color:#fff !important; border-radius:12px !important; box-shadow:none !important; }
.brand-sub{ color:var(--muted) !important; }
/* quiet text links, pill hover — Apple nav voice (desktop) */
.nav-links{ background:none !important; border:0 !important; box-shadow:none !important;
  -webkit-backdrop-filter:none !important; backdrop-filter:none !important; }
.nav-links>a,.nav-drop-btn{
  border:0 !important; background:none !important; box-shadow:none !important;
  padding:8px 13px !important; border-radius:var(--pill) !important;
  font-size:.92rem; font-weight:500; color:var(--txt) !important; height:auto;
  transition:background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}
.nav-links>a:hover,.nav-drop-btn:hover{ background:var(--surface-md) !important; color:var(--ink) !important; box-shadow:none !important; }
.nav-links>a.active,.nav-links>a[aria-current="page"]{
  background:var(--surface-md) !important; color:var(--ink) !important;
  border:0 !important; box-shadow:none !important; padding-bottom:8px !important;
}
.nav-drop-btn .caret{ opacity:.55; font-size:.72em; }
.nav-sep{ background:var(--line) !important; }
/* dropdown panels */
.nav-drop-menu,.fields-menu{
  background:var(--window) !important; border:1px solid var(--hair) !important;
  border-radius:var(--r-lg) !important; box-shadow:var(--shadow-lg) !important;
  -webkit-backdrop-filter:none !important; backdrop-filter:none !important;
}
.nav-drop-menu.simple a:hover,.fields-menu a:hover{ background:var(--surface) !important; }
.fm-group-h{ color:var(--muted) !important; }
/* donate = the row's ONE filled action */
.nav-donate{
  height:36px; border-radius:var(--pill) !important; border:0 !important;
  background-color:var(--acc-fill,var(--acc)) !important; background-image:none !important; color:#fff !important;
  font-weight:600; padding:0 16px !important; box-shadow:none !important;
  transition:background-color var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out);
}
.nav-donate:hover{ background-color:var(--acc-fill2,var(--acc2)) !important; }
.nav-donate:active{ transform:scale(.97); }
.nav-donate svg{ width:15px; height:15px; }
/* sign-in: neutral bordered pill (Google mark keeps its white tile).
   Layout lives here now — loginBtn() in academy.js no longer inlines it. */
.acct-login{
  display:inline-flex; align-items:center; gap:8px; padding:0 14px;
  cursor:pointer; font:inherit; font-size:.9rem;
  height:36px; border-radius:var(--pill) !important;
  background:var(--window) !important; color:var(--ink) !important;
  border:1px solid var(--line2) !important; font-weight:600;
  transition:border-color var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out);
}
.acct-login:hover{ border-color:var(--line3) !important; background:var(--surface) !important; }
.acct-chip{ background:var(--window) !important; border:1px solid var(--hair) !important; border-radius:var(--pill) !important; }
.acct-ava{ background:var(--navy) !important; color:#fff !important; }
/* theme toggle: borderless icon button */
.theme-toggle{
  width:36px !important; height:36px !important; border-radius:var(--pill) !important;
  border:0 !important; background:none !important; color:var(--txt) !important;
  display:inline-flex !important; align-items:center !important; justify-content:center !important; padding:0 !important;
}
.theme-toggle::after{ content:none !important; }
.theme-toggle:hover{ background:var(--surface-md) !important; color:var(--ink) !important; }
.theme-toggle .th-ic{ position:static !important; opacity:1 !important; }
/* pitch switch: quiet caption (core's [class*=label] rule would shout it) */
.pitch-switch{ height:36px; }
.pitch-switch__label{ text-transform:none !important; letter-spacing:normal !important; font-size:.8rem !important; color:var(--muted) !important; }
/* language: Apple segmented control */
.lang-switch{
  background:var(--surface2) !important; border:0 !important; border-radius:var(--pill) !important;
  padding:2px !important; gap:2px !important; height:36px; box-sizing:border-box;
}
.lang-btn{
  color:var(--muted) !important; border-radius:var(--pill) !important; border:0 !important;
  background:none !important; background-image:none !important; padding:5px 11px !important;
  font-size:.78rem !important; font-weight:600;
}
.lang-btn:hover{ color:var(--ink) !important; }
.lang-btn.on{ background:var(--window) !important; color:var(--ink) !important; box-shadow:var(--shadow-sm) !important; }
/* mobile menu (breakpoint set in academy.css @1120px; header is 64px now) */
@media(max-width:1120px){
  .nav-links{ inset:64px 0 auto 0 !important; background:var(--window) !important; border-bottom:1px solid var(--line) !important; }
  .nav-links>a,.nav-drop-btn{ border-radius:var(--r-md) !important; }
  .lang-switch:before{ content:none !important; }
  .nav-toggle span{ background:var(--ink) !important; }
}

/* ----------------------------------------------------------------- BUTTONS */
.btn{
  background-color:var(--acc-fill,var(--acc)) !important; background-image:none !important;
  color:#fff !important; border:0 !important; border-color:transparent !important;
  border-radius:var(--pill) !important; box-shadow:none !important;
  font-family:var(--font) !important; font-weight:600;
  transition:background-color var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out);
}
.btn:hover{ background-color:var(--acc-fill2,var(--acc2)) !important; transform:none !important; box-shadow:none !important; }
.btn:active{ transform:scale(.97) !important; }
.btn.ghost{
  background-color:var(--surface2) !important; background-image:none !important; color:var(--ink) !important; border:0 !important; box-shadow:none !important;
}
.btn.ghost:hover{ background-color:var(--bg3) !important; color:var(--ink) !important; }
.btn.gold{ background-color:var(--gold) !important; background-image:none !important; color:#fff !important; border:0 !important; box-shadow:none !important; }
html[data-theme="dark"] .btn.gold,html[data-theme="pitch"] .btn.gold{ color:#1D1D1F !important; }
/* text-link CTA (hero "How it works →") */
.text-cta{ display:inline-flex; align-items:center; gap:8px; font-family:var(--font-head); font-weight:600; font-size:.94rem;
  color:var(--acc); text-decoration:none; }
.text-cta span:last-child{ display:inline-block; transition:transform var(--dur-fast) var(--ease-out); }
.text-cta:hover span:last-child{ transform:translateX(3px); }

/* ------------------------------------------------------- CARDS & SURFACES */
/* strip the core's glossy-glass treatment from every real Academy surface,
   then restate the flat Cupertino card */
.card,.tr-card,.tr-form,.path-card,.rm-card,.dash-stat,.dash-res,.dash-path,
.tr-hero,.tr-coursecard,.exam-q,.tr-q,.tr-picto,.tr-flow-step,.tr-cycle .seg,
.disc-square,.tr-pricecard,.motto-band,.tr-ws,.fab-pop,.stat,.ha-card,
.soon-chip,.foot-net,.faq-item,.tr-refs,.tr-video,.tr-sq,.tr-cta,.tr-summary,
.hub-domgroup,.exam-timer,.tr-gatecard,.path-ring{
  background-image:none !important;
  -webkit-backdrop-filter:none !important; backdrop-filter:none !important;
}
.card,.tr-card,.path-card,.rm-card,.dash-stat,.dash-res,.dash-path,.tr-hero,
.tr-coursecard,.exam-q,.disc-square,.tr-pricecard,.motto-band,.stat,.ha-card,.tr-form,
.tr-refs,.tr-video,.tr-sq,.tr-cta,.tr-summary,.tr-ws,.soon-chip{
  background-color:var(--window) !important;
  border-color:var(--hair) !important;
  box-shadow:var(--shadow-sm) !important;
}
.card,.disc-square,.ha-card,.tr-coursecard,.path-card,.tr-hero,.tr-pricecard,
.motto-band,.tr-cta,.tr-summary{ border-radius:var(--r-lg) !important; }
.card.glow:hover,.tr-coursecard:hover,.path-card-link:hover .path-card{
  box-shadow:var(--shadow) !important; border-color:var(--line) !important;
}
/* pastel stat tiles → flat window */
.stat:nth-child(1),.stat:nth-child(2),.stat:nth-child(3),.stat:nth-child(4),
.ha-stat:nth-child(1),.ha-stat:nth-child(2),
.dash-stat.s1,.dash-stat.s2,.dash-stat.s3,.dash-stat.s4{
  background:var(--window) !important; border:1px solid var(--hair) !important;
}
/* icon tiles: soft accent-tinted rounded squares (accepts per-category --acc) */
.card .ico,.disc-square .ds-ic,.fields-menu .fm-ic,.field-hero .fh-ic,
.tr-domhead-ic,.tr-subic,.tr-pic,.tr-domic,.hub-domhead-ic,.path-ic,
.dash-path-ic,.rm-hero-ic,.tr-hero-pic,.tr-cc-ic,.tr-ws-ic{
  background:color-mix(in srgb, var(--acc) 11%, var(--window)) !important;
  border:1px solid color-mix(in srgb, var(--acc) 18%, transparent) !important;
  border-radius:12px !important; color:var(--ink) !important; box-shadow:none !important;
}
/* top-stripe accents → hairline (accent lives in the icon tile) */
.tr-sq,.tr-coursecard,.tr-flow-step,.path-card{ border-top-width:1px !important; border-top-color:var(--hair) !important; }
.tr-coursecard.pro{ border-top-color:var(--hair) !important; }
/* side-stripe accents → quiet full hairline */
.dash-res,.dash-path,.rm-card,.rm-goalcard,.exam-expl{
  border-inline-start-width:1px !important; border-inline-start-color:var(--hair) !important;
}
.dash-path{ background:var(--window) !important; }
/* chips: neutral pills, accent when selected */
.chip,.field-other .chip,.tr-chip,.tr-pill,.tr-tag{
  background-color:var(--window) !important; background-image:none !important;
  border:1px solid var(--line) !important; color:var(--txt) !important;
  border-radius:var(--pill) !important; box-shadow:none !important;
  transition:border-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out), background-color var(--dur-fast) var(--ease-out) !important;
}
.chip:hover,.field-other .chip:hover,.tr-chip:hover{ border-color:var(--line3) !important; color:var(--ink) !important; box-shadow:none !important; }
.chip.active,.chip[aria-selected="true"],.chip.on,.field-other .chip.active,.tr-chip.on,.tr-pill.on{
  background-color:var(--ink) !important; color:var(--bg2) !important; border-color:var(--ink) !important;
}
.chip-dot{ display:none !important; }
/* field-chip rows align into a clean grid (kept from Academic Ink) */
.field-other{ display:grid !important; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)) !important; gap:12px !important; }
.chip{ justify-content:center; min-height:40px; box-sizing:border-box; white-space:normal !important; text-align:center;
  font-family:var(--font-head) !important; font-size:.86rem !important; letter-spacing:normal !important; }
@media(max-width:520px){ .field-other{ grid-template-columns:1fr !important; } }
/* forms */
input,select,textarea,.foot-news-form input,.fab-pop-search input{
  background:var(--window) !important; color:var(--ink) !important;
  border:1px solid var(--line2) !important; border-radius:10px !important; box-shadow:none !important;
}
input::placeholder,textarea::placeholder{ color:var(--muted) !important; }
input:focus,select:focus,textarea:focus{ outline:none !important; border-color:var(--acc) !important;
  box-shadow:0 0 0 3px rgba(var(--acc-rgb),.18) !important; }
input[type="checkbox"],input[type="radio"]{ accent-color:var(--acc) !important; }
/* progress bars: flat accent, no violet gradient */
.tr-progress-bar,.tr-bars .tr-bar .fill,.dash-path-bar div{ background-color:var(--acc) !important; background-image:none !important; }
.dash-path-bar{ background-color:var(--surface2) !important; }
.tr-donut{ --c:var(--acc) !important; }
/* steps */
.step .step-n{ background:var(--navy) !important; color:#fff !important; border-radius:12px !important; box-shadow:none !important; }

/* ------------------------------------------------------------- PHOTO HERO */
.photo-hero{ position:relative; overflow:hidden; min-height:min(88vh,820px); display:flex; flex-direction:column; justify-content:flex-end; }
.ph-media{ position:absolute; inset:0; z-index:0; }
.ph-media img{ width:100%; height:100%; object-fit:cover; display:block; filter:saturate(.42) contrast(1.02) brightness(.9); }
.ph-scrim{ position:absolute; inset:0; z-index:1;
  background:
    linear-gradient(90deg, rgba(10,10,12,.94) 0%, rgba(10,10,12,.7) 42%, rgba(10,10,12,.38) 68%, rgba(10,10,12,.58) 100%),
    linear-gradient(0deg, rgba(8,8,10,.9) 0%, transparent 42%); }
.ph-wrap{ position:relative; z-index:2; display:grid; grid-template-columns:180px 1fr; gap:40px; padding-top:clamp(72px,10vw,110px); }
/* the suite-wide `nav,header{background:...}` catch-all matches this <nav> —
   keep it transparent over the photo */
.ph-rail{ display:flex; flex-direction:column; gap:5px; padding-top:10px; border-top:1px solid rgba(255,255,255,.28);
  background:none !important; border-bottom:none !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; box-shadow:none !important; }
.ph-idx{ font-family:var(--font-head); font-size:.72rem; letter-spacing:.08em; color:rgba(255,255,255,.55); }
.ph-rail b{ font-family:var(--font-head); font-weight:600; font-size:.86rem; color:#fff; margin:6px 0 4px; }
.ph-rail a{ font-size:.82rem; color:rgba(255,255,255,.62); text-decoration:none; padding:2px 0; transition:color var(--dur-fast) var(--ease-out); }
.ph-rail a:hover{ color:#fff; }
@media(max-width:900px){ .ph-wrap{ grid-template-columns:1fr; } .ph-rail{ display:none; } }
.ph-copy{ max-width:640px; padding-bottom:clamp(40px,6vw,64px); }
.ph-copy h1{ font-family:var(--font-display) !important; font-weight:700; font-size:clamp(2.5rem,5.6vw,4.1rem); line-height:1.02; letter-spacing:-.022em; color:#fff; margin:0 0 .3em; }
.ph-copy h1 .gx{ -webkit-text-fill-color:#fff !important; color:#fff !important; font-style:italic; padding-bottom:.06em; }
.ph-copy .sub{ font-size:1.05rem; color:rgba(255,255,255,.75); max-width:44ch; margin-bottom:22px; }
.ph-ctas{ display:flex; align-items:center; gap:22px; flex-wrap:wrap; }
.ph-ctas .text-cta{ color:#fff; text-decoration:underline; text-underline-offset:4px; text-decoration-color:rgba(255,255,255,.4); }
.ph-ctas .text-cta:hover{ text-decoration-color:#fff; }
@media(prefers-reduced-motion:no-preference){
  .ph-copy>.reveal{ animation:quietUp .42s var(--ease-out) both; }
  .ph-copy>h1{ animation-delay:0ms; }
  .ph-copy>.sub{ animation-delay:40ms; }
  .ph-copy>.ph-ctas{ animation-delay:80ms; }
  .ph-rail{ animation:quietUp .42s var(--ease-out) both; }
}
@keyframes quietUp{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } }
/* hero bottom bar */
.ph-bar{ position:relative; z-index:2; border-top:1px solid rgba(255,255,255,.16); background:rgba(8,8,10,.55);
  -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); }
.ph-bar-in{ display:grid; grid-template-columns:1.4fr 1fr; gap:32px; padding-block:22px; }
@media(max-width:760px){ .ph-bar-in{ grid-template-columns:1fr; } }
.ph-lb{ display:block; font-family:var(--font-head); font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.6); margin-bottom:10px; }
.ph-fd{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px 28px; }
@media(max-width:520px){ .ph-fd{ grid-template-columns:1fr; } }
.ph-fd a{ color:#fff; text-decoration:none; font-family:var(--font-head); font-weight:600; font-size:.92rem; }
.ph-fd a small{ display:block; font-weight:400; font-size:.76rem; color:rgba(255,255,255,.55); margin-top:2px; }
.ph-cert-prev{ display:flex; align-items:center; gap:14px; text-decoration:none; }
.pc-thumb{ width:52px; height:38px; border-radius:6px; flex:none; position:relative; background:linear-gradient(135deg,#F5F5F7,#D6D6DB); }
.pc-thumb::after{ content:""; position:absolute; inset:6px; border:1px solid rgba(0,0,0,.3); border-radius:2px; }
.pc-tx b{ display:block; color:#fff; font-family:var(--font-head); font-weight:600; font-size:.88rem; }
.pc-tx small{ color:rgba(255,255,255,.6); font-size:.76rem; }

/* ------------------------------------------------------------------ BENTO */
.bento-grid{ display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:150px; gap:14px; }
@media(max-width:760px){ .bento-grid{ grid-template-columns:repeat(2,1fr); } .bento-img{ grid-column:span 2 !important; grid-row:span 2 !important; } }
.bento-cell{ border-radius:var(--r-lg); border:1px solid var(--hair); background:var(--window); box-shadow:var(--shadow-sm); text-decoration:none; overflow:hidden; position:relative; }
.bento-img{ grid-column:span 2; grid-row:span 2; padding:0; }
.bento-img img{ width:100%; height:100%; object-fit:cover; display:block; filter:grayscale(.2) contrast(1.05); transition:filter var(--dur) var(--ease-out); }
.bento-img:hover img{ filter:grayscale(0) contrast(1.06); }
.bento-stat{ display:flex; flex-direction:column; justify-content:center; padding:16px; }
.bento-stat b{ font-family:var(--font-head); font-weight:700; font-size:1.6rem; color:var(--ink); line-height:1; letter-spacing:-.01em; }
.bento-stat span{ margin-top:6px; font-size:.76rem; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; }
.bento-stat b[data-i18n="home.kicker"]{ font-size:.9rem; text-transform:none; letter-spacing:0; color:var(--muted); font-weight:600; }
.bento-wide{ display:flex; flex-direction:column; justify-content:center; gap:8px; padding:16px;
  background:color-mix(in srgb, var(--acc) 6%, var(--window)); }
.bento-wide span:first-child{ font-family:var(--font-head); font-weight:700; font-size:1.35rem; color:var(--ink); }
.bento-wide span:first-child small{ display:block; font-weight:500; font-size:.7rem; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; }
.bento-wide .text-cta{ font-size:.82rem; }

/* --------------------------------------------------------- HOME SECTIONS -- */
/* field cards: tight and calm */
.disc-square{ padding:16px !important; }
.disc-square .ds-ic{ width:38px !important; height:38px !important; font-size:1.05rem !important; }
.disc-square h3{ margin:10px 0 3px !important; font-size:.95rem !important; }
.disc-square p{ margin:0 0 10px !important; font-size:.74rem !important; font-weight:500 !important; text-transform:none !important; letter-spacing:0 !important; line-height:1.4 !important; color:var(--muted) !important; }
.disc-square .ds-go{ font-size:.78rem !important; color:var(--acc) !important; }
.disc-square:before{ background:none !important; }
/* soon chips */
.soon-chip{ border-style:solid !important; }
.soon-chip .soon-tag{ color:var(--acc) !important; background:var(--acc-soft) !important; border:0 !important; }
/* kicker eyebrows: quieter */
.kicker{ color:var(--muted); letter-spacing:.08em; }
.kicker .dot{ background:var(--line3); }
/* course-hub domain clusters */
.hub-domgroup{ margin:0 0 40px !important; padding:20px !important; border-radius:var(--r-lg); background:var(--window) !important; border:1px solid var(--hair); }
.hub-domhead{ border-bottom:1px solid var(--line) !important; padding-bottom:14px !important; margin-bottom:18px !important; }
.hub-domhead-t{ font-family:var(--font-head) !important; text-transform:none !important; letter-spacing:-.01em !important; font-size:1.05rem !important; font-weight:700; }
.hub-domhead-n{ background:var(--surface2) !important; color:var(--muted) !important; }
/* faq */
.faq-item{ background:var(--window) !important; border:1px solid var(--hair) !important; border-radius:var(--r-md) !important; }

/* ------------------------------------------------------ TRAINING CONTENT -- */
.tr-gatecard{ position:static !important; }
/* course accents route to the theme accent unless a category color is set inline */
.tr-stage,.cert,.tr-pricecard{ --tr-acc:var(--acc); }
.tr-body h3{ color:var(--ink) !important; }
.tr-body th{ background:var(--surface) !important; color:var(--ink) !important; }
.tr-body th,.tr-body td{ border-color:var(--line) !important; }
/* callouts: hairline card + soft semantic tint; type carried by title color */
.tr-callout{ border:1px solid var(--line) !important; border-inline-start-width:1px !important; border-radius:var(--r-md) !important; }
.c-formula{ background:color-mix(in srgb,#5E5CE6 7%,var(--window)) !important; border-color:color-mix(in srgb,#5E5CE6 22%,transparent) !important; color:var(--txt) !important; }
.c-formula .ttl{ color:#4644C9 !important; }
.c-standard{ background:color-mix(in srgb,#0A84FF 7%,var(--window)) !important; border-color:color-mix(in srgb,#0A84FF 22%,transparent) !important; color:var(--txt) !important; }
.c-standard .ttl{ color:#0060BF !important; }
.c-legal{ background:color-mix(in srgb,#FF453A 7%,var(--window)) !important; border-color:color-mix(in srgb,#FF453A 22%,transparent) !important; color:var(--txt) !important; }
.c-legal .ttl{ color:#C22B22 !important; }
.c-best{ background:color-mix(in srgb,#30D158 8%,var(--window)) !important; border-color:color-mix(in srgb,#30D158 26%,transparent) !important; color:var(--txt) !important; }
.c-best .ttl{ color:#1B7E3F !important; }
.c-tip{ background:color-mix(in srgb,#FF9F0A 8%,var(--window)) !important; border-color:color-mix(in srgb,#FF9F0A 28%,transparent) !important; color:var(--txt) !important; }
.c-tip .ttl{ color:#9A6400 !important; }
.c-warn{ background:color-mix(in srgb,#FF6961 8%,var(--window)) !important; border-color:color-mix(in srgb,#FF6961 26%,transparent) !important; color:var(--txt) !important; }
.c-warn .ttl{ color:#B4372E !important; }
.c-proc{ background:color-mix(in srgb,#BF5AF2 7%,var(--window)) !important; border-color:color-mix(in srgb,#BF5AF2 22%,transparent) !important; color:var(--txt) !important; }
.c-proc .ttl{ color:#8944AB !important; }
html[data-theme="dark"] .c-formula .ttl,html[data-theme="pitch"] .c-formula .ttl{ color:#9C9AF0 !important; }
html[data-theme="dark"] .c-standard .ttl,html[data-theme="pitch"] .c-standard .ttl{ color:#6EB4FF !important; }
html[data-theme="dark"] .c-legal .ttl,html[data-theme="pitch"] .c-legal .ttl{ color:#FF8A80 !important; }
html[data-theme="dark"] .c-best .ttl,html[data-theme="pitch"] .c-best .ttl{ color:#5CE083 !important; }
html[data-theme="dark"] .c-tip .ttl,html[data-theme="pitch"] .c-tip .ttl{ color:#FFC15C !important; }
html[data-theme="dark"] .c-warn .ttl,html[data-theme="pitch"] .c-warn .ttl{ color:#FF9C94 !important; }
html[data-theme="dark"] .c-proc .ttl,html[data-theme="pitch"] .c-proc .ttl{ color:#D9A0F5 !important; }
/* video card + play button */
.tr-video-play{ background:var(--ink) !important; color:var(--bg2) !important; border:0 !important; box-shadow:var(--shadow-sm) !important; }
/* exam surfaces */
.exam-timer{ background:var(--glass) !important; -webkit-backdrop-filter:blur(12px) !important; backdrop-filter:blur(12px) !important;
  border:1px solid var(--hair) !important; box-shadow:var(--shadow-sm) !important; }
.exam-opt{ background:var(--window) !important; border-color:var(--line2) !important; }
.exam-opt:hover{ border-color:var(--acc) !important; background:color-mix(in srgb,var(--acc) 5%,var(--window)) !important; }
.exam-opt.sel{ border-color:var(--acc) !important; background:color-mix(in srgb,var(--acc) 10%,var(--window)) !important; }
.exam-opt.correct{ border-color:var(--good) !important; background:color-mix(in srgb,var(--good) 9%,var(--window)) !important; }
.exam-opt.wrong{ border-color:var(--bad) !important; background:color-mix(in srgb,var(--bad) 8%,var(--window)) !important; }
.exam-score.ok{ color:var(--good) !important; } .exam-score.no{ color:var(--bad) !important; }
.exam-expl{ background:var(--surface) !important; color:var(--txt) !important; }
/* roadmap nodes */
.rm-node{ background:var(--window) !important; border-color:var(--line2) !important; color:var(--muted) !important; }
.rm-step.done .rm-node{ background:var(--good) !important; border-color:var(--good) !important; color:#fff !important; }
.rm-step.next .rm-node{ background:var(--acc) !important; border-color:var(--acc) !important; color:#fff !important;
  box-shadow:0 0 0 5px rgba(var(--acc-rgb),.18) !important; }
.rm-goal .rm-node.rm-goal{ background:var(--gold2) !important; border-color:var(--gold) !important; color:#1D1D1F !important; }
.rm-goalcard{ background:var(--window) !important; }
.roadmap:before{ background:var(--line2) !important; }

/* -------------------------------------------------- FABS · COUNTER · MODAL */
.dfab,.fab-btn{
  background-color:var(--glass-strong) !important; background-image:none !important;
  color:var(--ink) !important; border:1px solid var(--hair) !important;
  -webkit-backdrop-filter:blur(16px) !important; backdrop-filter:blur(16px) !important;
  box-shadow:var(--shadow) !important;
}
.dfab:hover,.fab-btn:hover{ box-shadow:var(--shadow-lg) !important; }
.fab-pop{ background:var(--window) !important; border:1px solid var(--hair) !important;
  border-radius:var(--r-lg) !important; box-shadow:var(--shadow-lg) !important; }
.fab-pop-x:hover{ background:var(--surface2) !important; color:var(--ink) !important; }
.fab-sec-h:hover,.fab-ci-row:hover,.fab-feat-row:hover,.fab-pop-all:hover,.fab-net-row:hover{ background:var(--surface) !important; }
.fab-sec-n{ background:var(--surface2) !important; color:var(--muted) !important; border:0 !important; }
/* visitors counter: quiet glass chip; live dot stays green (semantic) */
.sc-float{
  background:var(--glass-strong) !important; border:1px solid var(--hair) !important;
  border-radius:var(--r-lg) !important; box-shadow:var(--shadow) !important;
}
.sc-ring{ display:none !important; }
.sc-num{ background:none !important; -webkit-background-clip:initial !important; background-clip:initial !important;
  -webkit-text-fill-color:currentColor !important; color:var(--ink) !important; }
.sc-label{ color:var(--muted) !important; }
.sc-ic{ filter:none !important; color:var(--acc); }
.sc-ic svg{ display:block; }
/* donate modal (markup injected by academy.js with hardcoded light CSS) */
.dn-overlay{ background:rgba(0,0,0,.45) !important; -webkit-backdrop-filter:blur(8px) !important; backdrop-filter:blur(8px) !important; }
.dn-modal{ background:var(--window) !important; color:var(--ink) !important; border-radius:var(--r-xl) !important; box-shadow:var(--shadow-lg) !important; }
.dn-modal .dn-x{ color:var(--muted) !important; }
.dn-head p,.dn-or,.dn-lab,.dn-foot{ color:var(--muted) !important; }
.dn-heart{ color:var(--bad) !important; background:none !important; }
.dn-card-btn{ background-color:var(--acc-fill,var(--acc)) !important; background-image:none !important; color:#fff !important; box-shadow:none !important; border-radius:var(--pill) !important; }
.dn-card-btn:hover{ background-color:var(--acc-fill2,var(--acc2)) !important; }
.dn-acct,.dn-row{ background:var(--surface) !important; border-color:var(--hair) !important; }
.dn-val{ color:var(--ink) !important; }
.dn-copy{ background:var(--window) !important; color:var(--muted) !important; border:1px solid var(--line) !important; }
.dn-copy:hover{ color:var(--acc) !important; border-color:var(--acc) !important; }

/* ------------------------------------------------------------------ FOOTER */
.site-foot{ background:var(--bg2) !important; border-top:1px solid var(--hair) !important; }
.foot-col h4,.foot-col-dd summary{ color:var(--muted) !important; }
.foot-col a{ color:var(--txt) !important; }
.foot-col a:hover{ color:var(--acc) !important; }
.foot-mail a{ color:var(--acc) !important; }
.foot-motto{ color:var(--muted); font-style:italic; }
/* footer disclosure patterns (kept) */
.foot-fields-more{ margin-top:4px; }
.foot-fields-more summary{ cursor:pointer; font-family:var(--font-head); font-weight:600; font-size:.86rem; color:var(--acc); list-style:none; }
.foot-fields-more summary::-webkit-details-marker{ display:none; }
.foot-fields-more summary::after{ content:"▾"; display:inline-block; margin-inline-start:6px; transition:transform var(--dur-fast) var(--ease-out); }
.foot-fields-more[open] summary::after{ transform:rotate(180deg); }
.foot-fields-more a{ display:block; margin-top:8px; }
.foot-col-dd{ margin:0; }
.foot-col-dd summary{ cursor:pointer; list-style:none; font-size:.76rem; text-transform:uppercase; letter-spacing:.1em; margin-bottom:14px; }
.foot-col-dd summary::-webkit-details-marker{ display:none; }
.foot-col-dd summary::after{ content:"▾"; display:inline-block; margin-inline-start:6px; font-size:.9em; transition:transform var(--dur-fast) var(--ease-out); }
.foot-col-dd[open] summary::after{ transform:rotate(180deg); }
.foot-col-dd[open] summary{ margin-bottom:8px; }
/* network band: icon-only tight row */
.foot-network-grid{ display:flex !important; flex-wrap:nowrap !important; gap:8px !important; max-width:100%; overflow-x:auto; padding-bottom:2px; }
.foot-net{ justify-content:center; padding:9px !important; border-radius:12px !important; flex:0 0 auto; width:42px; height:42px;
  background:var(--window) !important; border:1px solid var(--hair) !important; box-shadow:none !important; }
.foot-net:hover{ border-color:var(--line3) !important; box-shadow:var(--shadow-sm) !important; }
.foot-net.is-current{ border-color:var(--acc) !important; background:var(--acc-soft) !important; }
.foot-net-ic{ font-size:1.2rem !important; }
.foot-net-tx{ display:none !important; }
.foot-network-kick svg{ width:14px; height:14px; vertical-align:-2px; }
.nd-ic{ display:inline-flex; margin-inline-end:6px; }
.nd-ic svg{ display:block; }
.nav-donate{ display:inline-flex; align-items:center; }
.dn-heart svg{ display:block; }
.tr-cc-go svg{ width:14px; height:14px; vertical-align:-2px; }
.sc-ic svg{ width:18px; height:18px; }

/* ---------------------------------------------------------------- MOBILE -- */
@media(max-width:600px){
  .sc-float{ border-radius:var(--r-md) !important; }
}

/* ------------------------------------------------------------ RTL GUARDS -- */
[dir="rtl"],[lang="ar"],.arabic{ direction:rtl; line-height:1.85; }
[dir="rtl"] .nav-links>a,[dir="rtl"] .nav-drop-btn,
[dir="rtl"] .chip,[dir="rtl"] .tr-chip,[dir="rtl"] .tr-pill{ white-space:normal !important; text-align:center; }
[dir="rtl"] .brand,[dir="rtl"] a.brand{ padding:0 !important; }

/* ------------------------------------------- CASCADE COUNTERS (post-review)
   academy.css keeps retired-palette literals (Aurora pastels, Design-3 indigo
   rgba(130,138,244,x), old emerald/rose/gold) on selectors the token remap
   can't reach. All counters below are UNSCOPED + token-routed so they hold in
   light, dark AND pitch (academy.css's dark block never matches pitch). ---- */
/* course progress chrome (sticky .tr-bar header, tracks, dots, donut) */
.tr-progress,.tr-bars .tr-bar .track,.tr-bar .track,.tr-dot{ background:var(--surface2) !important; }
.tr-dot.on{ background:var(--acc) !important; }
.tr-bar{ background:var(--glass) !important; -webkit-backdrop-filter:blur(12px) !important; backdrop-filter:blur(12px) !important; border-bottom:1px solid var(--hair) !important; }
.tr-bars .tr-bar{ background:none !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; border:0 !important; }
.tr-donut{ background:conic-gradient(var(--c) calc(var(--p)*1%), var(--surface2) 0) !important; }
.tr-donut:before{ background:var(--window) !important; }
/* success / result message */
.tr-ok{ background:color-mix(in srgb,var(--good) 10%,var(--window)) !important; border-color:color-mix(in srgb,var(--good) 30%,var(--window)) !important; color:var(--good) !important; }
/* price comparison + savings banner */
.tr-price-here,.tr-savedwin{ background:color-mix(in srgb,var(--good) 8%,var(--window)) !important; border-color:color-mix(in srgb,var(--good) 26%,transparent) !important; }
.tr-price-else{ background:color-mix(in srgb,var(--bad) 7%,var(--window)) !important; border-color:color-mix(in srgb,var(--bad) 22%,transparent) !important; }
.tr-price-here .tr-price-lbl,.tr-price-free,.tr-price-save,.tr-savedwin b{ color:var(--good) !important; }
.tr-price-amt{ color:var(--bad) !important; }
.tr-price-sub{ color:var(--muted) !important; }
.tr-savedwin{ color:var(--txt) !important; }
/* do / don't compare blocks */
.tr-do{ background:color-mix(in srgb,var(--good) 8%,var(--window)) !important; border-color:color-mix(in srgb,var(--good) 26%,transparent) !important; }
.tr-dont{ background:color-mix(in srgb,var(--bad) 8%,var(--window)) !important; border-color:color-mix(in srgb,var(--bad) 26%,transparent) !important; }
.tr-do h4{ color:var(--good) !important; }
.tr-dont h4{ color:var(--bad) !important; }
/* affiliate / partner blocks: gold stays (brand carry-over), tokenized */
.tr-aff,.tr-partner{ background:color-mix(in srgb,var(--gold) 7%,var(--window)) !important; border-color:color-mix(in srgb,var(--gold) 25%,transparent) !important; }
.tr-aff-tag{ background:color-mix(in srgb,var(--gold) 10%,var(--window)) !important; border-color:color-mix(in srgb,var(--gold) 30%,transparent) !important; color:var(--gold) !important; }
.tr-aff .tr-rel-list a{ background:var(--window) !important; border-color:color-mix(in srgb,var(--gold) 25%,transparent) !important; }
.tr-partner:before{ background:radial-gradient(circle,color-mix(in srgb,var(--gold) 18%,transparent),transparent 70%) !important; }
/* homepage hero-art mock (bars, badges, float chip) */
.ha-bars i,.ha-bars i:nth-child(odd){ background:color-mix(in srgb,var(--acc) 22%,var(--surface2)) !important; background-image:none !important; opacity:1 !important; }
.ha-bars i:nth-child(even){ background:var(--acc) !important; background-image:none !important; opacity:1 !important; }
.ha-stat .ha-up{ color:var(--good) !important; background:color-mix(in srgb,var(--good) 12%,var(--window)) !important; }
.ha-chart .ha-ttl span{ color:var(--bad) !important; background:color-mix(in srgb,var(--bad) 10%,var(--window)) !important; }
.ha-float{ background:var(--navy) !important; color:var(--on-navy) !important; }
.ha-float .ha-dot{ background:var(--good) !important; }
/* score / pass / fail / timer status text */
.tr-score,.tr-fail h2,.exam-timer .warn{ color:var(--bad) !important; }
.tr-score.ok,.tr-pass h2,.dash-res-score{ color:var(--good) !important; }
.tr-err{ color:var(--bad) !important; background:color-mix(in srgb,var(--bad) 10%,var(--window)) !important; border-color:color-mix(in srgb,var(--bad) 30%,var(--window)) !important; }
/* interactive hover / selected states (in-lesson quiz, path steps, filters) */
.tr-opt{ background:var(--window) !important; border-color:var(--line2) !important; }
.tr-opt:hover{ background:color-mix(in srgb,var(--acc) 5%,var(--window)) !important; border-color:var(--acc) !important; }
.path-step:hover{ background:color-mix(in srgb,var(--acc) 6%,var(--window)) !important; }
.tr-check:has(input:checked){ background:var(--acc-dim) !important; border-color:var(--acc) !important; color:var(--acc) !important; }
/* certificate verification result cards */
.vr-ok{ background:color-mix(in srgb,var(--good) 8%,var(--window)) !important; border-color:color-mix(in srgb,var(--good) 30%,transparent) !important; }
.vr-bad{ background:color-mix(in srgb,var(--gold) 10%,var(--window)) !important; border-color:color-mix(in srgb,var(--gold) 35%,transparent) !important; }
.vr-badge{ background:var(--good) !important; border-color:var(--good) !important; color:#fff !important; }
.vr-badge.no{ background:var(--bad) !important; border-color:var(--bad) !important; }
/* roadmap badges + trainer availability + misc */
.rm-pro,.rm-goalbadge{ background:color-mix(in srgb,var(--gold) 10%,var(--window)) !important; border-color:color-mix(in srgb,var(--gold) 28%,transparent) !important; color:var(--gold) !important; }
.rm-done{ background:color-mix(in srgb,var(--good) 12%,var(--window)) !important; color:var(--good) !important; }
.tr-av{ color:var(--good) !important; background:color-mix(in srgb,var(--good) 10%,var(--window)) !important; border-color:color-mix(in srgb,var(--good) 28%,transparent) !important; }
.tr-domcount{ border-color:color-mix(in srgb,var(--acc) 28%,transparent) !important; }
.acct-out:hover{ color:var(--bad) !important; background:color-mix(in srgb,var(--bad) 10%,transparent) !important; }
.dfab-label{ background:var(--navy) !important; color:var(--on-navy) !important; border-color:rgba(255,255,255,.08) !important; box-shadow:var(--shadow) !important; }
/* WCAG: white ink fails on the bright dark-mode green — use dark ink there */
html[data-theme="dark"] .rm-step.done .rm-node,
html[data-theme="pitch"] .rm-step.done .rm-node{ color:#1D1D1F !important; }

/* --------------------------------------------------------- REDUCED MOTION */
@media(prefers-reduced-motion:reduce){
  .btn,.nav-donate,.acct-login,.text-cta span:last-child{ transition:none !important; }
  .ph-copy>.reveal,.ph-rail{ animation:none !important; }
}