/* ═══════════════════════════════════════════════════════════════════════════
   rd-chrome.css?v=rdc2 — THE REDDENDA SCENE-AWARE CHROME + CANONICAL LOCKUP
   (site-wide; 2026-07-14, RESCOPED 2026-07-19 for the FUSION scene model)

   §7.4 RESCOPE: the homepage bespoke nav (header#nav.nav) graphite/glass block is
   NO LONGER always-on. It is kept but SCOPED to [data-scene="night"] header#nav.nav
   so the light shell renders a paper bar and the night acts wear the graphite
   instrument chrome. The early <link> stays in head + the substring "rd-chrome.css"
   is preserved so brand-lockup.js still skips late injection (flash-kill intact).
   The shared .th-nav dark chrome (interior pages) is UNCHANGED.

   The one dark graphite/glass nav chrome that frames the light content on
   every page (Tempus instrument-chrome pattern), carrying the REAL canonical
   lockup: the crystalline data-gem chip (cropped at 1x/2x/3x from
   reddenda-lockup-dark.png), the designed "reddenda" word render, and the
   HEALTHCARE INTELLIGENCE INFRASTRUCTURE micro-label in IBM Plex Mono.

   Injected by global-nav.js (ensureCss) and by brand-lockup.js, idempotently.
   Covers BOTH nav systems:
     • .th-nav        — the shared nav th-nav-shared.js injects on every page
     • header#nav.nav — the homepage's bespoke inline nav (light-home.html)
   plus the mobile sheets, the launchpad overlay, and footer .brand lockups.

   Written to WIN the cascade against th-hero.css / global-nav.css regardless
   of injection order (specificity-bumped selectors, no reliance on ordering).
   ═══════════════════════════════════════════════════════════════════════════ */

:root{
  /* motion tokens (Linear-measured): instant-in, 150ms-out asymmetry */
  --rdc-quick:.1s;
  --rdc-regular:.25s;
  --rdc-out-quad:cubic-bezier(.25,.46,.45,.94);
  --rdc-out-cubic:cubic-bezier(.215,.61,.355,1);
  /* graphite glass plate */
  --rdc-plate:rgba(8,12,19,.82);
  --rdc-plate-solid:rgba(6,9,15,.94);
  --rdc-sheen:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,0) 52%);
  --rdc-hair:rgba(151,187,222,.16);
  --rdc-hair-strong:rgba(151,187,222,.24);
  --rdc-ink:#F2F6FA;
  --rdc-body:rgba(219,229,241,.82);
  --rdc-mute:rgba(172,190,209,.85);
  --rdc-hover:rgba(255,255,255,.07);
  --rdc-cyan:#22D3EE;
  --rdc-mono:'IBM Plex Mono',ui-monospace,'SF Mono',Menlo,monospace;
}

/* ── THE CANONICAL LOCKUP PARTS (painted by brand-lockup.js v2.1) ───────────
   .rbl       — the lockup row (gets .rbl--dark / .rbl--light per surface)
   .rbl__img  — the data-gem chip (PNG, exact 1x/2x/3x mips, never fractional)
   .rbl__word — the designed "reddenda" word render (PNG, 1x/2x/3x)
   .rbl__tag  — the live micro-label (crisper than any raster at 8.5px)
   .rd-gem / .rd-word are aliases for any statically-baked pair.              */
.rbl{display:inline-flex;align-items:center;gap:10px;text-decoration:none;line-height:0;flex:none}
img.rbl__img,img.rd-gem{display:block;flex:none;width:34px;height:34px;border-radius:9.5px;
  box-shadow:0 0 0 1px rgba(126,190,255,.10),0 2px 12px rgba(28,120,255,.28),0 0 24px rgba(34,211,238,.16);
  transition:box-shadow var(--rdc-regular) var(--rdc-out-quad)}
a:hover img.rbl__img,a:focus-visible img.rbl__img,
a:hover img.rd-gem,a:focus-visible img.rd-gem{
  box-shadow:0 0 0 1px rgba(126,190,255,.20),0 2px 14px rgba(28,120,255,.42),0 0 30px rgba(34,211,238,.30)}
.rbl--light img.rbl__img{box-shadow:0 1px 8px rgba(10,20,40,.20)}
img.rbl__word,img.rd-word{display:block;height:20px;width:auto}
.rbl__tx,.rd-lock__tx{display:inline-flex;flex-direction:column;align-items:flex-start;line-height:1;min-width:0;gap:4px}
.rbl__tag,.rd-tag{font-family:var(--rdc-mono);font-weight:500;font-size:8.5px;line-height:1;
  letter-spacing:.145em;text-transform:uppercase;color:var(--rdc-mute);white-space:nowrap}
.rbl--light .rbl__tag{color:#5B6166}
/* beat the homepage's `.brand img{height:30px}` and any legacy logo sizing */
.brand img.rbl__img,.th-brand img.rbl__img{width:34px;height:34px}
.brand img.rbl__word,.th-brand img.rbl__word{height:20px;width:auto}
/* the th-nav hides its tagline under 1001px (matches .th-brand__tag rule) */
@media (max-width:1000px){.th-brand .rbl__tag{display:none}}

/* ── DARK CHROME: the shared th-nav (injected on every secondary page) ───── */
html .th-nav{
  background:var(--rdc-sheen),var(--rdc-plate);
  -webkit-backdrop-filter:blur(18px) saturate(150%);backdrop-filter:blur(18px) saturate(150%);
  border-bottom:1px solid var(--rdc-hair)}
html .th-nav.is-solid{
  background:var(--rdc-sheen),var(--rdc-plate-solid);
  border-bottom-color:var(--rdc-hair-strong);
  box-shadow:0 18px 40px -24px rgba(2,8,16,.7)}
/* container color first: th-hero's `#th-root a{color:inherit}` (ID specificity)
   would otherwise resolve anchors to the page ink — inherit now resolves to
   the chrome body color. The ID-scoped rules below beat it for the states. */
html .th-nav{color:var(--rdc-body)}
html .th-nav .th-nav__btn,html .th-nav .th-nav__lnk{color:var(--rdc-body)}
#th-root .th-nav a.th-nav__lnk,#th-root .th-nav a.th-nav__signin{color:var(--rdc-body)}
html .th-nav .th-nav__btn:hover,html .th-nav .th-nav__lnk:hover,
html .th-nav .th-nav__btn[aria-expanded="true"],
#th-root .th-nav a.th-nav__lnk:hover,#th-root .th-nav a.th-nav__signin:hover{color:var(--rdc-ink);background:var(--rdc-hover)}
html .th-nav a.is-active,#th-root .th-nav a.is-active{color:#7DE8F7}
html .th-nav .th-nav__signin{color:var(--rdc-body)}
html .th-nav .th-nav__signin:hover{color:var(--rdc-ink);background:var(--rdc-hover)}
html .th-nav .th-nav__burger{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.15);color:var(--rdc-ink)}
html .th-nav .th-nav__burger:hover{background:rgba(255,255,255,.11)}
/* text fallbacks (until/if the lockup imgs are in) stay legible on the chrome */
html .th-nav .th-brand__wm{color:var(--rdc-ink)}
html .th-nav .th-brand__tag{color:var(--rdc-mute)}

/* mobile sheet: dark chrome header strip over the light content body */
html .th-sheet__top{background:var(--rdc-sheen),#0A0F16;border-bottom:1px solid var(--rdc-hair)}
html .th-sheet__top .th-brand__wm{color:var(--rdc-ink)}
html .th-sheet__top .th-sheet__x{color:var(--rdc-ink)}
html .th-sheet__top .th-sheet__x:hover{background:rgba(255,255,255,.09)}

/* ── DARK CHROME: the homepage bespoke nav (light-home.html header#nav) ────
   The chrome is ALWAYS on (the instrument frame), not scroll-gated; .stuck
   only deepens opacity + shadow. All recolors are scoped to header#nav.nav,
   which exists only on the homepage.                                         */
/* §7.4: the night chrome DROPS backdrop-filter — a continuous blur re-filtering over the animating
   #field descent canvas (and the ceremony gauge) is a mid-tier paint flood at the cinematic peak.
   A near-opaque solid plate replaces it (halved radii are not sufficient per §7.4). */
[data-scene="night"] header#nav.nav .nav__bg{opacity:1;
  background:var(--rdc-sheen),var(--rdc-plate-solid);
  -webkit-backdrop-filter:none;backdrop-filter:none}
[data-scene="night"] header#nav.nav.stuck .nav__bg{background:var(--rdc-sheen),var(--rdc-plate-solid);
  box-shadow:0 18px 40px -24px rgba(2,8,16,.7)}
[data-scene="night"] header#nav.nav .nav__hair{opacity:1;background:var(--rdc-hair)}
[data-scene="night"] header#nav.nav.stuck .nav__hair{background:var(--rdc-hair-strong)}
[data-scene="night"] header#nav.nav .nav__lnk{color:var(--rdc-body)}
[data-scene="night"] header#nav.nav .nav__lnk:hover,[data-scene="night"] header#nav.nav .nav__item[data-open="true"] .nav__lnk{color:var(--rdc-ink)}
[data-scene="night"] header#nav.nav .nav__signin{color:var(--rdc-mute)}
[data-scene="night"] header#nav.nav .nav__signin:hover{color:var(--rdc-ink)}
[data-scene="night"] header#nav.nav .ink{background:var(--rdc-cyan)}
[data-scene="night"] header#nav.nav .ring line{stroke:rgba(255,255,255,.22)}
[data-scene="night"] header#nav.nav .ring line.on{stroke:var(--rdc-cyan)}
[data-scene="night"] header#nav.nav .ring:hover line.on{stroke:#7DE8F7}
[data-scene="night"] header#nav.nav .burger{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.15)}
[data-scene="night"] header#nav.nav .burger i,[data-scene="night"] header#nav.nav .burger i::before,[data-scene="night"] header#nav.nav .burger i::after{background:var(--rdc-ink)}

/* launchpad overlay lockup row */
.rd-lp-lockrow{display:flex;align-items:center;gap:12px}

/* legacy typeset lockups that survive anywhere: theme-correct on BOTH themes
   (fixes the white-on-white footer word on light pages) */
html[data-theme="light"] .rb-brand__word{color:#0A0B0C}
html[data-theme="light"] .rb-brand__tag{color:#5B6166}

/* ── ACCESSIBILITY ── */
html .th-nav a:focus-visible,html .th-nav button:focus-visible,
[data-scene="night"] header#nav.nav a:focus-visible,[data-scene="night"] header#nav.nav button:focus-visible,
.th-sheet a:focus-visible,.th-sheet button:focus-visible{
  outline:2px solid var(--rdc-cyan);outline-offset:2px;border-radius:10px}

/* ── PERF / DEVICE FALLBACKS ──
   Solid plate replaces live blur exactly where the estate already does it
   (low-perf devices; iOS coarse-pointer tile-drop guard in th-hero.css).
   Specificity-bumped so the dark plate beats the old white overrides.        */
html.low-perf .th-nav.th-nav,html.low-perf .th-nav.th-nav.is-solid{
  -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
  background:var(--rdc-plate-solid)!important}
html.low-perf[data-scene="night"] header#nav.nav .nav__bg{
  -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
  background:var(--rdc-plate-solid)!important}
@media (hover:none) and (pointer:coarse){
  html #th-root .th-nav,html #th-root .th-nav.is-solid,
  html .th-nav.th-nav,html .th-nav.th-nav.is-solid{
    -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
    background:rgba(6,9,15,.96)!important}
  [data-scene="night"] header#nav.nav .nav__bg{
    -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
    background:rgba(6,9,15,.96)!important}
}

/* ── REDUCED MOTION ── */
@media (prefers-reduced-motion:reduce){
  img.rd-gem{transition:none!important}
}

/* ── MOBILE SIZING (matches brand-lockup.js's 600px step-down) ── */
@media (max-width:600px){
  img.rbl__img,.brand img.rbl__img,.th-brand img.rbl__img,
  img.rd-gem,.brand img.rd-gem,.th-brand img.rd-gem{width:30px;height:30px;border-radius:8.5px}
  img.rbl__word,.brand img.rbl__word,.th-brand img.rbl__word,
  img.rd-word,.brand img.rd-word,.th-brand img.rd-word{height:18px}
  .rbl__tag,.rd-tag{display:none}
}