/* ============================================================================
   AMAADOR PERSONAL STRATEGY — site override (exitstrategycalculator.com) · Design 3.0
   Loads AFTER amaador-design-system.css AND base.css.
   1) Sets the site accent (#5C1A2A, used sparingly).
   2) Remaps base.css's token vocabulary (--bg-base/--cyan/--violet/...) onto the
      monochrome Design 3.0 palette so every token-driven rule + inline style
      re-skins at once. Colored jewel accents become chrome — no color left driving UI.
   ============================================================================ */
:root { --accent: #5C1A2A; } /* Deep burgundy — reserved for rare focal moments */

/* Theme-toggle icon swap. The rule for this lives in assets/css/academic-ink.css
   (.theme-toggle .th-ic{display:none} + a conditional display:inline-flex per
   theme), but that file is NOT linked on this page's actual stylesheet chain
   (only amaador-design-system.css + this override are) — so both the moon and
   sun icons were showing at once, at their default inline <span> display, with
   no swap ever applying. Restated here since this file IS loaded. (2026-07-04g) */
.theme-toggle .th-ic{ display:none; }
html[data-theme="dark"] .theme-toggle .th-moon,
html[data-theme="light"] .theme-toggle .th-sun{ display:inline-flex; }

:root, html, html[data-theme="dark"]{
  /* backgrounds → monochrome */
  --bg-base:#07080F; --bg-deep:#040508;
  --glass-bg:rgba(12,13,24,.62); --glass-bg-strong:rgba(17,18,32,.72);
  /* borders */
  --glass-border:rgba(255,255,255,.09); --glass-edge:rgba(255,255,255,.16);
  /* ink */
  --text-primary:#F2F3FA; --text-secondary:#B8BAD0; --text-muted:#6E7090;
  /* brand/accent jewels → chrome (monochrome). No colored fills. */
  --cyan:#C8CAD8; --cyan-deep:#9496AA;
  --violet:#C8CAD8; --violet-deep:#9496AA;
  --accent-glow:rgba(255,255,255,.14);
  /* status stays semantic but desaturated toward neutral */
  --green:#9db4a6; --amber:#c9c3a8; --red:#c9a8a8;
  /* fonts → Design 3.0 */
  --font-body:'Poppins',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;
  --font-display:'Lora','Georgia',serif;
}

/* Pitch (OLED true-black) theme counterpart — background-only refinement of the
   dark block above. Mirrors the AMAADOR 99 DOORS fix: only push the void/base
   backgrounds and first/second raised surfaces to near-true-black; every other
   token (ink/line/accent-jewel/status/font) is copied verbatim from the dark
   block, unchanged. html[data-theme="pitch"] beats the bare :root, html
   selector on specificity alone, so append-only, no reordering needed. */
html[data-theme="pitch"]{
  --bg-base:#000000; --bg-deep:#000000;
  --glass-bg:rgba(5,5,5,.62); --glass-bg-strong:rgba(10,10,10,.72);
  --glass-border:rgba(255,255,255,.07); --glass-edge:rgba(255,255,255,.18);
  --text-primary:#F2F3FA; --text-secondary:#B8BAD0; --text-muted:#6E7090;
  --cyan:#C8CAD8; --cyan-deep:#9496AA;
  --violet:#C8CAD8; --violet-deep:#9496AA;
  --accent-glow:rgba(255,255,255,.14);
  --green:#9db4a6; --amber:#c9c3a8; --red:#c9a8a8;
  --font-body:'Poppins',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;
  --font-display:'Lora','Georgia',serif;
}

/* Light theme counterpart (2026-07-04 toggle fix) — base.css's token vocabulary
   (--bg-base/--glass-bg/--text-primary/...) has no built-in light variant of its
   own, so the block above used to reassert dark literals unconditionally via a
   bare :root, which also matched html[data-theme="light"] and made the toggle a
   no-op. This gives the same token names real light-mode values (warm off-white
   surfaces, dark ink) so body/.glass/nav/etc. actually flip when toggled. */
html[data-theme="light"]{
  --bg-base:#F2F1EC; --bg-deep:#EAE8E1;
  --glass-bg:rgba(255,255,255,.62); --glass-bg-strong:rgba(255,255,255,.78);
  --glass-border:rgba(10,10,15,.12); --glass-edge:rgba(10,10,15,.18);
  --text-primary:#14151C; --text-secondary:#43465A; --text-muted:#75778C;
  --cyan:#3D3F52; --cyan-deep:#6B6E85;
  --violet:#3D3F52; --violet-deep:#6B6E85;
  --accent-glow:rgba(10,10,15,.10);
  --green:#4d6e5c; --amber:#8a7c4a; --red:#8a4a4a;
}

/* --- Fonts: base.css hardcodes 'Inter' on body/headings; retarget to Design 3.0 --- */
body{ font-family:'Poppins',system-ui,-apple-system,'Segoe UI',Arial,sans-serif; }
h1,h2,h3,h4,.hero h1,.card h3{ font-family:'Lora','Georgia',serif; }

/* --- Neutralize the colored gradients base.css hardcodes (cyan/violet/magenta) --- */
/* Hero gradient wordmark → chrome metal.
   2026-07-04 narrowing: this used to also list the wildcard h1[class*="gradient"]
   and a speculative .grad-text class. Neither is used anywhere on this site (no
   element ships a class containing "gradient", and .grad-text doesn't exist in
   any page) — they were dead weight that could silently start matching an
   unrelated element the moment someone added a class like "gradient-text" or
   "grad-text-sm" to a non-heading (e.g. .brand-pill, .panel-desc), painting an
   opaque gray gradient box over plain copy instead of chrome heading text.
   Scoped to exactly the one intended heading now, with an explicit exclusion
   as a second guard rail in case .hero ever wraps another element. */
.hero h1:not(.panel-desc):not(.brand-pill){
  background:linear-gradient(100deg,#E8EAF0,#C8CAD8 55%,#9496AA) !important;
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent;
}

/* Brand pill: swap cyan tint for chrome tint */
.brand-pill{
  color:#C8CAD8 !important;
  background:linear-gradient(165deg,rgba(255,255,255,.10),rgba(255,255,255,.03)) !important;
  border-color:rgba(255,255,255,.16) !important;
}

/* Primary CTA / glossy buttons → chrome-on-dark, white text */
.glossy-btn--primary{
  color:#FFFFFF !important;
  background:linear-gradient(170deg,rgba(255,255,255,.16) 0%,rgba(255,255,255,.06) 55%,rgba(2,4,8,.35) 100%) !important;
  border-color:rgba(255,255,255,.26) !important;
}

/* Range slider thumb & other jewel accents → chrome */
input[type="range"]::-webkit-slider-thumb{ background:linear-gradient(150deg,#E8EAF0,#9496AA) !important; box-shadow:0 0 14px rgba(255,255,255,.18),0 3px 9px rgba(2,4,8,.45) !important; }
input[type="range"]::-moz-range-thumb{ background:linear-gradient(150deg,#E8EAF0,#9496AA) !important; }

/* Timeline rail & score dials that hardcode cyan/violet */
.timeline::before{ background:linear-gradient(180deg,#C8CAD8,#6E7090) !important; }


/* ===== 2026-07-04 glossy-monochrome polish =====
   Static analysis pass. Loaded LAST → wins.
   Scope: index.html loads base.css (the only jewel-color source on this site);
   404/brand/privacy load design-system + this override only. academic-ink.css /
   design2.css / design2-bridge.css are NOT linked by any page here — skipped.

   base.css remaps its TOKENS (--cyan/--violet/--accent) upstream, but ~90 rules
   HARDCODE the raw jewel literals rgba(34,211,238)=cyan, rgba(139,92,246)/
   rgba(167,139,250)=violet, rgba(248,113,113)=red, rgba(74,222,128)=green,
   rgba(251,191,36)=amber, plus hex #22d3ee/#a78bfa/#c44fe0/#dbeafe/#3b6dff.
   Those bypass the token remap and are the real leaks — neutralized below to the
   monochrome ladder (white-alpha tints / chrome greys / --bg-* surfaces).
   ============================================================================ */

/* -- legacy token fallbacks (brand.html / any --acc-driven inline style whose
   defining sheet isn't linked here) → chrome, never colored/undefined -- */
:root{
  --acc:#C8CAD8; --acc2:#9496AA; --acc-rgb:200,202,216;
  --acc-dim:rgba(255,255,255,.10); --acc-soft:rgba(255,255,255,.06);
  --glass:rgba(12,13,24,.62); --glass-strong:rgba(17,18,32,.72);
  --window:#0C0D18; --surface:#0C0D18; --surface2:#111220;
  --ink:#F2F3FA; --ink2:#F2F3FA; --txt:#B8BAD0; --muted:#6E7090; --faint:#6E7090;
  --navy:#F2F3FA; --navy2:#C8CAD8; --on-navy:#04050A;
  --line:rgba(255,255,255,.09); --line2:rgba(255,255,255,.16); --hair:rgba(255,255,255,.08);
  --good:#9db4a6; --bad:#c9a8a8; --gold:#C8CAD8; --gold2:#9496AA;
}

/* -- legacy token fallbacks: LIGHT-MODE counterpart (2026-07-04 toggle fix) --
   The :root block above is unscoped and always wins its own cascade layer, so
   html[data-theme="light"] never got values for this second, later-declared
   token family (--acc/--ink/--navy/--gold/etc — distinct from the --bg-base/
   --text-primary family fixed earlier). Cards/panels/buttons/brand.html swatches
   that consume THESE tokens (see .bp-card/.bp-spec/.bp-dl/.card a.get above,
   plus brand.html's var(--acc)/var(--txt)/var(--glass)/var(--window) inline
   styles) stayed dark-literal under light theme. Higher source-order than the
   bare :root block above → wins on identical specificity. */
html[data-theme="light"]{
  /* brand burgundy is theme-invariant by design (see :root at top of file —
     "reserved for rare focal moments"); #5C1A2A is dark enough to keep
     adequate contrast on the new light canvas too, so it is restated here
     unchanged rather than left to fall through from the unscoped :root. */
  --accent:#5C1A2A;
  /* accent/brand chrome: darken so it stays visible on the new light canvas */
  --acc:#3D3F52; --acc2:#6B6E85; --acc-rgb:61,63,82;
  --acc-dim:rgba(10,10,15,.10); --acc-soft:rgba(10,10,15,.05);
  /* surfaces: warm off-white / white ladder, mirrors dark-mode's depth relationship */
  --glass:rgba(255,255,255,.62); --glass-strong:rgba(255,255,255,.78);
  --window:#FFFFFF; --surface:#FFFFFF; --surface2:#F2F1EC;
  /* ink ladder: darkest = most important, mirrors dark-mode contrast order inverted */
  --ink:#14151C; --ink2:#14151C; --txt:#43465A; --muted:#75778C; --faint:#B4B6C4;
  /* navy/on-navy: CTA fill flips to dark-on-white per shared-core "white CTA vanishes
     on light canvas" logic; on-navy (text sitting on that fill) flips to white */
  --navy:#14151C; --navy2:#3D3F52; --on-navy:#FFFFFF;
  /* borders: black-based tints, same alpha scale as the dark mode's white-based one */
  --line:rgba(10,10,15,.10); --line2:rgba(10,10,15,.18); --hair:rgba(10,10,15,.08);
  /* status: restrained/desaturated, slightly higher-contrast than dark mode's tones */
  --good:#3f5c4d; --bad:#5c3f3f; --gold:#3D3F52; --gold2:#6B6E85;
}

/* -- 1. MONOCHROME ENFORCEMENT: kill the hardcoded jewel literals in base.css -- */

/* nav active pill (cyan tint bg) → white-alpha */
.nav-links a.is-active{ background:rgba(255,255,255,.09) !important; color:#F2F3FA !important; }

/* aurora atmosphere blobs + backdrop (cyan/violet radial tints) → neutral white/near-black.
   Theme-scoped to dark/default only (2026-07-04h) — this was a bare, unscoped
   rule that forced the dark hazy backdrop behind EVERY page regardless of
   html[data-theme], undermining the light toggle fixed earlier in this file
   (.aurora is a fixed, full-viewport decorative layer behind all content, see
   base.css). html[data-theme="light"] now gets its own light backdrop below,
   matching the 404 body-background fix pattern further down this file. */
html[data-theme="dark"] .aurora::before,
html:not([data-theme]) .aurora::before{
  background:
    radial-gradient(ellipse 60% 50% at 12% -5%, rgba(255,255,255,.05) 0%, transparent 55%),
    radial-gradient(ellipse 50% 45% at 95% 12%, rgba(255,255,255,.035) 0%, transparent 52%),
    radial-gradient(ellipse 55% 45% at 50% 105%, rgba(255,255,255,.025) 0%, transparent 48%),
    linear-gradient(180deg,#07080F 0%,#040508 45%,#040508 100%) !important;
}
html[data-theme="light"] .aurora::before{
  background:
    radial-gradient(ellipse 60% 50% at 12% -5%, rgba(10,10,15,.035) 0%, transparent 55%),
    radial-gradient(ellipse 50% 45% at 95% 12%, rgba(10,10,15,.025) 0%, transparent 52%),
    radial-gradient(ellipse 55% 45% at 50% 105%, rgba(10,10,15,.018) 0%, transparent 48%),
    linear-gradient(180deg,#F2F1EC 0%,#EAE8E1 45%,#EAE8E1 100%) !important;
}
.aurora .blob--cyan,
.aurora .blob--violet{ background:radial-gradient(circle, rgba(255,255,255,.10), transparent 65%) !important; }

/* brand pill / hero wordmark drop-shadow (already handled above; enforce no color glow) */
.brand-pill{ background:linear-gradient(165deg,rgba(255,255,255,.10),rgba(255,255,255,.04)) !important; border-color:rgba(255,255,255,.16) !important; }
.hero h1{ filter:none !important; }

/* icon tiles / gradient chips (cyan→violet fills) → chrome white-alpha */
.panel-icon,
.card .card-ico,
.affiliate-card .aff-icon,
.net-ico,
.segmented button.active{
  background:linear-gradient(150deg,rgba(255,255,255,.14),rgba(255,255,255,.05)) !important;
  border-color:rgba(255,255,255,.14) !important;
}
.segmented button.active{ color:#F2F3FA !important; }

/* glossy buttons: colored hover glow/border → chrome */
.glossy-btn:hover{ border-color:rgba(255,255,255,.36) !important; box-shadow:0 14px 34px rgba(2,6,16,.55),0 0 28px rgba(255,255,255,.10),inset 0 1px 0 rgba(255,255,255,.28) !important; }
.glossy-btn--primary{ background:linear-gradient(170deg,rgba(255,255,255,.16) 0%,rgba(255,255,255,.06) 55%,rgba(2,4,8,.35) 100%) !important; border-color:rgba(255,255,255,.26) !important; }
.glossy-btn--primary:hover{ border-color:rgba(255,255,255,.42) !important; box-shadow:0 16px 38px rgba(2,6,16,.55),0 0 36px rgba(255,255,255,.12),inset 0 1px 0 rgba(255,255,255,.3) !important; }

/* inputs / search focus rings (cyan) → chrome */
.input-glass:focus,
.idx-search:focus{ border-color:rgba(255,255,255,.45) !important; box-shadow:inset 0 2px 7px rgba(2,6,16,.3),0 0 0 3px rgba(255,255,255,.13),0 0 22px rgba(255,255,255,.08) !important; }

/* score dial ring + escape-date box (cyan/violet gradient fill+border) → chrome */
.score-dial,
.escape-date-box{
  background:linear-gradient(150deg,rgba(255,255,255,.07),rgba(255,255,255,.02) 55%,rgba(2,4,8,.28)) !important;
  border-color:rgba(255,255,255,.14) !important;
}

/* metric-card value: --accent(burgundy) would go dark-on-dark → chrome sheen text.
   deficit/surplus red/green literals → chrome (keep only shape, drop hue). */
.metric-card .metric-value{ color:#E8EAF0 !important; text-shadow:0 0 32px rgba(255,255,255,.14) !important; }
.metric-card.deficit .metric-value,
.metric-card.surplus .metric-value{ color:#C8CAD8 !important; text-shadow:0 0 28px rgba(255,255,255,.12) !important; }

/* callouts (urgent=red / good=green / help=violet tints) → neutral white-alpha */
.callout.urgent,
.callout.good,
.callout.help{
  border-color:rgba(255,255,255,.16) !important;
  background:linear-gradient(170deg,rgba(255,255,255,.06),rgba(2,4,8,.22)) !important;
}

/* comparison band track (red→amber→green gradient) → chrome greyscale ramp */
.band-track{ background:linear-gradient(90deg,rgba(255,255,255,.10),rgba(255,255,255,.22) 50%,rgba(255,255,255,.34)) !important; border-color:rgba(255,255,255,.12) !important; }
.band-cell.is-emph{ border-color:rgba(255,255,255,.24) !important; box-shadow:0 0 22px rgba(255,255,255,.10) !important; }

/* hover/border jewel glows on cards, resources, feed, threads, net-links */
.card:hover{ border-color:rgba(255,255,255,.22) !important; box-shadow:var(--shadow-window),0 0 36px rgba(255,255,255,.06) !important; }
.res-list li a:hover,
.idx-link:hover,
.net-link.interactive:hover,
.thread[open]{ border-color:rgba(255,255,255,.22) !important; }
.feed-item:hover{ border-color:rgba(255,255,255,.22) !important; }
.feed-filter button.active{ color:#C8CAD8 !important; border-color:rgba(255,255,255,.3) !important; background:rgba(255,255,255,.08) !important; }
.net-link.is-current{ background:rgba(255,255,255,.07) !important; border-color:rgba(255,255,255,.22) !important; }

/* badges / pills that hardcode green/violet fills → chrome */
.tag-live,
.best-badge{ color:#C8CAD8 !important; background:rgba(255,255,255,.08) !important; border-color:rgba(255,255,255,.24) !important; }
.board-pill{ color:#C8CAD8 !important; background:rgba(255,255,255,.08) !important; border-color:rgba(255,255,255,.24) !important; }
.chip{ background:rgba(255,255,255,.08) !important; border-color:rgba(255,255,255,.20) !important; }

/* share-toast success-green edge → chrome */
.share-toast{ border-color:rgba(255,255,255,.24) !important; }

/* range thumb glow (uses --accent-glow) already chrome via token; enforce here */
input[type="range"]::-webkit-slider-thumb{ box-shadow:0 0 14px rgba(255,255,255,.18),0 3px 9px rgba(2,4,8,.45) !important; }

/* focus-visible ring on FABs (cyan) → chrome */
.fab:focus-visible{ box-shadow:0 0 0 3px rgba(255,255,255,.4),0 12px 30px rgba(2,6,16,.5) !important; }

/* -- 1b. 404.html inline-style leaks (override link loads after the inline <style>,
   equal element/class specificity → source order wins; !important for safety).
   Theme-scoped to dark/default only (2026-07-04 toggle fix) — this used to be a
   bare, unscoped `body{...}` that forced the dark 404 backdrop on EVERY page
   regardless of html[data-theme], which is what made the light toggle a no-op
   here. html[data-theme="light"] now gets its own light backdrop below. -- */
html[data-theme="dark"] body,
html:not([data-theme]) body{ background:
    radial-gradient(ellipse 60% 50% at 12% -5%, rgba(255,255,255,.05) 0%, transparent 55%),
    radial-gradient(ellipse 50% 45% at 95% 12%, rgba(255,255,255,.035) 0%, transparent 52%),
    linear-gradient(180deg,#07080F 0%,#040508 60%,#040508 100%) !important; }
html[data-theme="light"] body{ background:
    radial-gradient(ellipse 60% 50% at 12% -5%, rgba(10,10,15,.035) 0%, transparent 55%),
    radial-gradient(ellipse 50% 45% at 95% 12%, rgba(10,10,15,.025) 0%, transparent 52%),
    linear-gradient(180deg,#F2F1EC 0%,#EAE8E1 60%,#EAE8E1 100%) !important; }
.card h1,
h1{ } /* (hero h1 chrome handled by earlier .hero h1 / h1[class*] rule) */
.card a,
a.get{ /* 404 CTA + brand download btn: colored gradients → chrome */
  background:linear-gradient(170deg,rgba(255,255,255,.16) 0%,rgba(255,255,255,.06) 55%,rgba(2,4,8,.35) 100%) !important;
  border-color:rgba(255,255,255,.26) !important; color:#FFFFFF !important;
}

/* -- 2. FORCE DARK (STALE NOTE, superseded 2026-07-04): base.css's token
   vocabulary now HAS a light counterpart — see the html[data-theme="light"]
   block near the top of this file. This site's :root remap was rescoped to
   :root, html, html[data-theme="dark"] so it no longer re-forces dark values
   onto html[data-theme="light"]. -- */

/* -- 3. GLOSS REINFORCEMENT: layered white-sheen over the dark surfaces (loads
   last → wins). background-image sits over the existing dark background/gradient
   set by base.css shorthand, so no legitimate bg is wiped. -- */
.card,
.panel,
.metric-card,
.affiliate-card,
.escape-date-box,
.score-dial,
.faq-item,
.thread,
.thread-vote,
.bp-card,
.bp-spec,
.bp-chip{
  background-image:linear-gradient(158deg,rgba(255,255,255,.06) 0%,rgba(255,255,255,.015) 55%,transparent 100%) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 8px 32px rgba(0,0,0,.5) !important;
}

/* -- 4. SELECTOR OVER-MATCH: layout wrappers that merely contain "card" must NOT
   inherit the core's glass/blur/shadow. Reset just those props. -- */
.card-grid,
.cards-grid,
.card-list,
.card-row,
.bp-grid,
.bp-rules{
  background:none !important; background-image:none !important;
  backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
  box-shadow:none !important; border:0 !important; padding:0 !important;
}

/* -- 5. CONTRAST / READABILITY: dark-white ladder on inputs, placeholders,
   muted copy, footer. -- */
.input-glass,
.idx-search,
select.input-glass,
input, textarea, select{
  background:#0C0D18 !important; color:#F2F3FA !important;
}
.input-glass::placeholder,
.idx-search::placeholder,
input::placeholder, textarea::placeholder{ color:#8A8CA6 !important; opacity:1 !important; }
select.input-glass option,
.lang-switch option{ background:#0C0D18 !important; color:#F2F3FA !important; }
.footer-legal,
.disclaimer-strip,
.section-lead,
.panel .panel-desc,
.card p{ color:#B8BAD0 !important; }
.post-avatar{ color:#04050A !important; } /* avatar initials on light chrome disc stay dark = legible */

/* ===== 2026-07-04b round-2 polish =====
   Second static pass after the shared core was upgraded (pill nav, glossy-white
   .btn--solid/cta, header sheen, forced-chrome eyebrows/active-nav). Kills the
   residual jewel leaks round-1 missed — the ones hiding in per-page inline
   <style> blocks (404 gradient-text + hover glow, privacy indigo links) and in
   decorative classes the token remap can't reach (the .fab--* set, which
   HARDCODES cyan/violet on border/background/hover-glow). Also promotes the real
   hero CTA to glossy WHITE per the mandate, resets the logo out of the pill
   treatment, and de-crowds the in-page TOC nav. Loads LAST → beats inline
   !important-less rules by cascade + wins the override layer.
   ============================================================================ */

/* -- 1. RESIDUAL COLOR-LEAK KILL (9 distinct leaks round-1 missed) ------------ */

/* (1) 404.html bare <h1> gradient-text (#fff→#22d3ee→#a78bfa cyan/violet).
   Round-1's .hero h1 / h1[class*=gradient] rule can't reach a plain <h1>. */
.card h1{
  background:linear-gradient(100deg,#E8EAF0,#C8CAD8 55%,#9496AA) !important;
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent !important;
}

/* (2) 404.html .card a:hover — cyan box-shadow glow → chrome */
.card a:hover{
  box-shadow:0 14px 34px rgba(2,6,16,.55),0 0 28px rgba(255,255,255,.12),inset 0 1px 0 rgba(255,255,255,.28) !important;
}

/* (3)(4)(5)(6) privacy-policy.html is a self-contained LIGHT legal page; keep it
   light + readable but strip the saturated indigo (#4f46e5) links/rules + the
   slate (#94a3b8) eyebrow. Scoped to privacy-only wrappers so the dark pages
   (which also use .container) are untouched: index uses <main.container>,
   privacy uses <div.container>. */
div.container a,
.footer-nav a{ color:#3A3C52 !important; text-decoration-color:rgba(58,60,82,.5) !important; }
div.container a:hover,
.footer-nav a:hover{ color:#04050A !important; }
.highlight-box{ border-left-color:#9496AA !important; }
.page-header .brand{ color:#C8CAD8 !important; }

/* (7)(8)(9) Floating FAB dock — base.css HARDCODES cyan on .fab--explore,
   violet on .fab--services, and a violet→cyan GRADIENT FILL on .fab--donate,
   plus colored hover glows. All → chrome glass on the dark surface. */
.fab--explore{ border-color:rgba(255,255,255,.28) !important; }
.fab--explore .fab-ico,
.fab--services .fab-ico{ color:#C8CAD8 !important; }
.fab--explore:hover,
.services-wrap.open .fab--explore{ border-color:rgba(255,255,255,.5) !important; box-shadow:0 18px 40px rgba(2,6,16,.55),0 0 36px rgba(255,255,255,.14),inset 0 1px 0 rgba(255,255,255,.28) !important; }
.fab--services{ border-color:rgba(255,255,255,.28) !important; }
.fab--services:hover,
.services-wrap.open .fab--services{ border-color:rgba(255,255,255,.5) !important; box-shadow:0 18px 40px rgba(2,6,16,.55),0 0 36px rgba(255,255,255,.14),inset 0 1px 0 rgba(255,255,255,.26) !important; }
.fab--donate{
  border-color:rgba(255,255,255,.5) !important;
  background:linear-gradient(170deg,rgba(255,255,255,.18) 0%,rgba(255,255,255,.06) 60%,rgba(2,6,16,.30) 100%) !important;
}
.fab--donate:hover{ border-color:rgba(255,255,255,.62) !important; box-shadow:0 18px 40px rgba(2,6,16,.6),0 0 42px rgba(255,255,255,.16) !important; }

/* -- 2. PRIMARY CTA → GLOSSY WHITE ------------------------------------------- */
/* THIS site's hero action is #plan-btn = .glossy-btn.glossy-btn--primary
   ("Build my transition plan"). type="button" so the core's button[type=submit]
   whitening never reaches it, and round-1 left it translucent-chrome. The
   mandate now wants the primary CTA glossy WHITE. Radius/padding preserved
   (untouched → inherited from base.css .glossy-btn). Also covers the 404/brand
   .get download button. */
.glossy-btn--primary,
a.get,
.bp-dl a.get{
  background:#FFFFFF !important;
  background-image:linear-gradient(180deg,#FFFFFF 0%,#EDEFF5 100%) !important;
  color:#04050A !important;
  border-color:#FFFFFF !important;
  text-shadow:none !important;
}
.glossy-btn--primary:hover,
a.get:hover,
.bp-dl a.get:hover{
  background-image:linear-gradient(180deg,#FFFFFF 0%,#E4E7F0 100%) !important;
  border-color:#FFFFFF !important;
  box-shadow:0 16px 38px rgba(2,6,16,.5),0 4px 24px rgba(255,255,255,.20),inset 0 1px 0 rgba(255,255,255,.6) !important;
}

/* -- 3. HEADER + NAV BUTTON REFINEMENT --------------------------------------- */
/* (3a) LOGO must NOT inherit the core's nav-pill padding/hover. On this site the
   logo is .amaador-brand-logo; reset it (defensive — also covers any page that
   nests it inside <nav>). */
.amaador-brand-logo,
[class*="brand-logo"],
[class*="nav-logo"]{
  padding:0 !important; background:none !important; background-image:none !important;
  box-shadow:none !important; border:0 !important; border-radius:0 !important;
}
.amaador-brand-logo:hover,
[class*="brand-logo"]:hover{ background:none !important; box-shadow:none !important; }

/* (3b) The core turns EVERY nav a into an 8px-14px pill. The hero's "On this
   page" TOC is a <nav> with 5 inline-flow anchors + "·" separators → the pill
   padding crowds/wraps them. De-pill just this in-page TOC nav back to quiet
   inline links; keep the top-nav pills intact. */
nav[aria-label="On this page"] a{
  padding:0 !important; background:none !important; box-shadow:none !important;
  border-radius:0 !important; color:var(--text-secondary) !important;
}
nav[aria-label="On this page"] a:hover{
  background:none !important; box-shadow:none !important; color:#F2F3FA !important;
  text-decoration:underline; text-underline-offset:3px;
}
/* active top-nav item = clean chrome pill, never a jewel underline (belt-and-suspenders
   over core + round-1's .nav-links a.is-active) */
.nav-links a.is-active,
nav a.active,
nav a[aria-current="page"]{
  border-bottom:none !important;
  background:rgba(255,255,255,.09) !important; color:#F2F3FA !important;
}

/* -- 4. CHOICE CHIPS / SEGMENTED / FILTER BUTTONS ---------------------------- */
/* .segmented is this site's unique segmented toggle the core's chip/pill globs
   miss (it's <button> inside .segmented, no chip/pill/tag in the class). Polish
   to monochrome glossy pills: idle = dark glass, hover = chrome, selected =
   white-filled (matches the core's selected-chip = white convention). */
.segmented button{
  color:#B8BAD0 !important;
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,0)) !important;
  transition:color 180ms var(--ease-smooth),background 180ms var(--ease-smooth),box-shadow 180ms var(--ease-smooth) !important;
}
.segmented button:hover{
  color:#F2F3FA !important;
  background:rgba(255,255,255,.08) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08) !important;
}
.segmented button.active{
  color:#04050A !important;
  background:linear-gradient(180deg,#FFFFFF 0%,#EDEFF5 100%) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 2px 10px rgba(255,255,255,.10) !important;
}
/* feed-filter selected = filled chrome pill (round-1 left it as an outline);
   align it with the white-selected convention */
.feed-filter button.active{
  color:#04050A !important;
  background:linear-gradient(180deg,#FFFFFF 0%,#EDEFF5 100%) !important;
  border-color:#FFFFFF !important;
}

/* ===== 2026-07-04d footer network: icons only, no visible text =====
   Task: the sister-site row in the footer should read as a clean row of icon
   chips (name/description are still present as title + aria-label on each
   link for tooltip + a11y/SEO), not a stacked icon+name+desc list. This is
   scoped to the .footer-network row only — the floating "Our Services" panel
   keeps its full icon+name+description layout untouched (different surface,
   more room, users expect a legend there). Markup: site.js's networkLinks()
   emits <a class="net-link net-link--icon">, dropping the .net-tx/.net-arr
   spans for this variant. -- */
.footer-network .net-grid{
  grid-template-columns:none !important;
  display:flex !important; flex-wrap:wrap; gap:.5rem;
}
.net-link--icon{
  display:inline-flex !important; align-items:center; justify-content:center;
  width:42px; height:42px; padding:0 !important;
  border-radius:11px;
  border:1px solid rgba(255,255,255,.10) !important;
  background:rgba(255,255,255,.03) !important;
  transition:border-color 180ms var(--ease-smooth),background 180ms var(--ease-smooth),
             box-shadow 180ms var(--ease-smooth),transform 180ms var(--ease-smooth);
}
.net-link--icon .net-ico{
  width:auto; height:auto; background:none !important; border:0 !important;
  font-size:1.05rem;
}
.net-link--icon.interactive:hover,
.net-link--icon.interactive:focus-visible{
  border-color:rgba(255,255,255,.30) !important;
  background:rgba(255,255,255,.09) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 6px 18px rgba(2,6,16,.35) !important;
  transform:translateY(-1px) !important;
}
.net-link--icon:focus-visible{
  outline:2px solid rgba(255,255,255,.55); outline-offset:2px;
}
.net-link--icon.is-current{
  border-color:rgba(255,255,255,.24) !important;
  background:rgba(255,255,255,.07) !important;
}