:root {
  --lavender: #b7aed8;
  --lavender-soft: #eee9f8;
  --plum: #7a67a4;
  --plum-ink: #5f5296;
  --blush: #f2a8c1;
  --cream: #f8f1e7;
  --mint: #a6d8bf;
  --ink: #302a41;
  --ink-2: #514a63;
  /* ⛔ --muted and --line RESTORED to the locked comp's values 2026-08-14 (A0b).
     They read #706985 and #e6dcf2 here — nowhere else, and matching nothing.
     app/mockups/study-room.html (2026-07-08, the locked look/feel comp, plan
     §10 / D14) declares #6f6785 and #eadff7, and study.css carries them
     verbatim; this file was hand-typed on 07-21 and drifted a digit each.
     Measured before changing: ΔE 1.45 and 1.60 — under the ~2.3 just-noticeable
     threshold, and the two sets are never co-visible (different pages), so no
     one could ever have seen the difference. That is what makes this a defect
     to repair rather than a taste call to spend on someone: there was no
     decision here to respect, only a typo with two survivors. */
  --muted: #6f6785;
  --line: #eadff7;
  --paper: #fffdfd;
  --bg: #f7f3fd;
  --warning: #74495c;
  --warning-bg: #fff1f5;
  --s2: 10px;

  /* Promoted here by appearance/A0 (2026-08-14). Every value below was already
     a raw literal in a rule — four in this file, nine in account.css — so none
     of it is a new colour and none of it moves a pixel; `scripts/a0-token-gate.mjs`
     proves that rather than this sentence.

     ⚠ THE ACCOUNT SCREENS' TOKENS LIVE HERE, AND THAT IS DELIBERATE.
     account.css has no :root and does not need one: it never loads on its own —
     all three account pages link this file first, and its own header already
     says "legal.css owns the palette". Giving it a second :root would have added
     a third global token block to a product that is trying to end up with as few
     as possible. Two of these (--blush-line, --lavender-wash) are used by BOTH
     files, which is the same argument from the other side. */

  /* Washes and tints — backgrounds that sit just off --paper/--bg. */
  --wash-blush: #fbeef3;      /* body radial gradient */
  --paper-tint: #fffafd;      /* .hero gradient start, into --cream */
  --lavender-wash: #faf7fe;   /* .callout here, .consent on the account pages */

  /* Soft blush edge — .draft-banner here; .status .bad and .confirm-limit there. */
  --blush-line: #f4cbd8;

  /* Account-screen semantics. ⚠ --ok-ink is NOT study.css's --mint-ink
     (#2f7d59): these are two different greens that have never been reconciled,
     and A0 records that rather than quietly picking one. */
  --ok-ink: #2f5e49;
  --ok-bg: #eaf7f1;
  --founder-ink: #4a3d78;
  --tag-bg: #f3f0f8;
  --danger-hover: #5d3a49;
  --shadow: 0 18px 55px rgba(95, 82, 150, 0.12);

  /* ── Promoted by appearance/A1 (2026-08-14). ────────────────────────────
     A0's "zero raw hex outside :root" counted `#rrggbb` and never counted
     `rgba()`. These two were the universe-B half of that blind spot, both in
     account.css, both on the delete-confirmation dialog — i.e. the one surface
     in this product that appears over a darkened page, which is exactly where
     a hardcoded scrim is least survivable. */
  --confirm-shadow: 0 24px 60px rgba(58, 42, 78, 0.22);
  --confirm-backdrop: rgba(38, 28, 52, 0.44);

  /* Native controls, scrollbars, the UA canvas. This file hardcoded
     `color-scheme: light`, so every native control in universe B would have
     stayed light at night — an A1 finding, and the reason this is a token. */
  --color-scheme: light;

  /* ── The brand mark ───────────────────────────────────────────────────────
     Universe B used to load the mark as `<img src="../brand/nurseal-logo.svg">`,
     and an <img> can never be themed at all — no token, no mode and no theme
     reaches inside a referenced document. The mark is now inline SVG here too,
     from the same canonical source as the six study pages, so all twelve pages
     carry one mark with one set of colours. `scripts/a1-sync.mjs` owns it.

     ⚠ These names and their day values are IDENTICAL to study.css's on
     purpose — the mark is one piece of artwork, not two. The sync gate asserts
     the two universes agree, because two copies of a palette is precisely how
     `--line` and `--muted` drifted apart here in the first place. */
  /* The theme picker's swatches (A3-T) — the OTHER profile's accent as
     rendered in the current mode, so the chip stays legible on the button. */
  --swatch-seal: #5f5296; --swatch-sapphire: #2b5390;

  --mark-tile: #f2ecfa;                 /* the rounded app-icon plate behind him */
  --mark-ring-1: #b89ce0; --mark-ring-2: #7b6ab8;
  --mark-plate: #fbf9ff;
  --mark-flipper: #b0a7d6;
  --mark-body: var(--lavender);
  --mark-belly: #f8f1e7;
  --mark-cord: #4a3663;
  --mark-chrome: #d8d8e4; --mark-chrome-line: #7d7d92; --mark-chrome-lit: #ececf3;
  --mark-eye: #40395e; --mark-glint: #ffffff;
  --mark-cheek: #f2bcd3;
  --mark-muzzle: #7a5570; --mark-smile: #5f4a63;
  --mark-cap: #ffffff; --mark-cap-line: #e7ddf3; --mark-cross: #ef9dbe;

  --serif: ui-serif, Georgia, Cambria, "Times New Roman", serif;
  /* Same restoration; the comp's stack, verbatim. ⚠ Expect NO pixel change from
     this one and do not read that as the edit failing: on her MacBook
     `-apple-system` wins in both stacks, and on Windows both fall through to
     Segoe UI, so BlinkMacSystemFont vs the "Helvetica Neue", Arial tail is
     unobservable on either platform this product runs on. The static gate sees
     the declaration move and the pixel gate correctly sees nothing — two
     instruments disagreeing because they measure different things. */
  --sans: -apple-system, "Segoe UI", system-ui, "Helvetica Neue", Arial, sans-serif;
}

/* ══════════════════════════════════════════════════════════════════════════
   THE TWO AXES — universe B's half. The full rationale, the specificity
   arithmetic and the reason the mode axis is `data-scheme` rather than
   `data-mode` are written once at the top of app/study/study.css; this file
   carries the same four blocks for its own token vocabulary and must not fork
   that explanation.

     :root                                              (0,1,0)  seal · day
     :root[data-scheme="night"]                         (0,2,0)  seal · night
     :root[data-theme="sapphire"][data-scheme="day"]    (0,3,0)  sapphire · day
     :root[data-theme="sapphire"][data-scheme="night"]  (0,3,0)  sapphire · night

   ⚠ THE MARK TOKENS ARE INTENTIONALLY IDENTICAL TO study.css's. Everything
   else here is universe B's own vocabulary (`--paper`, not `--card`), which is
   the drift hazard A0b measured — so the sync gate asserts the mark half
   matches byte-for-byte and leaves the rest alone.
   ══════════════════════════════════════════════════════════════════════════ */

:root[data-scheme="night"] {
  --lavender: #b7aed8; --lavender-soft: #221d33;
  --plum: #b3a0e2; --plum-ink: #cdbdf5;
  --blush: #f2a8c1; --cream: #241e2a; --mint: #a6d8bf;
  --mark-belly: #f8f1e7;
  --ink: #f4f1fb; --ink-2: #d6cfe8; --muted: #aba2c4; --line: #272235;
  --paper: #1a1724; --bg: #0d0b13;
  --warning: #f0aec2; --warning-bg: #2a1a22;
  --wash-blush: #221421; --paper-tint: #1e1a29; --lavender-wash: #1d1a29;
  --blush-line: #402833;
  --ok-ink: #86dab0; --ok-bg: #16291f;
  --founder-ink: #c5b5f5; --tag-bg: #231e33; --danger-hover: #f4bccc;
  --shadow: 0 18px 55px rgba(0, 0, 0, 0.6);
  --confirm-shadow: 0 24px 60px rgba(0, 0, 0, 0.66);
  --confirm-backdrop: rgba(4, 3, 7, 0.62);
  --color-scheme: dark;
  --swatch-seal: #cdbdf5; --swatch-sapphire: #9dbdea;
  --mark-tile: #221d33;
  --mark-ring-1: #b3a0e2; --mark-ring-2: #6f5fa6;
  --mark-plate: #1e1a2b; --mark-flipper: #6f6396;
}

:root[data-theme="sapphire"][data-scheme="day"] {
  --lavender: #a7c0e2; --lavender-soft: #e8eefa;
  --plum: #3d6bae; --plum-ink: #2b5390;
  --blush: #c9743f; --cream: #f4efe6; --mint: #93cfb4;
  --mark-belly: #f4efe6;
  --ink: #26303f; --ink-2: #465264; --muted: #5c6879; --line: #dde7f5;
  --paper: #fdfeff; --bg: #f3f6fd;
  --warning: #7a4a54; --warning-bg: #fdf0f4;
  --wash-blush: #f7eee8; --paper-tint: #fbfdff; --lavender-wash: #f4f8fd;
  --blush-line: #efd2da;
  --ok-ink: #1f6a4c; --ok-bg: #e4f4ec;
  --founder-ink: #2f4a75; --tag-bg: #eef3fb; --danger-hover: #5f3b46;
  --shadow: 0 18px 55px rgba(43, 83, 144, 0.14);
  --confirm-shadow: 0 24px 60px rgba(26, 44, 76, 0.24);
  --confirm-backdrop: rgba(18, 30, 52, 0.46);
  --color-scheme: light;
  --swatch-seal: #5f5296; --swatch-sapphire: #2b5390;
  --mark-tile: #e8eefa;
  --mark-ring-1: #7ba4dd; --mark-ring-2: #2b5390;
  --mark-plate: #f7fafe; --mark-flipper: #93a9c9;
}

:root[data-theme="sapphire"][data-scheme="night"] {
  --lavender: #a7c0e2; --lavender-soft: #182130;
  --plum: #7ba4dd; --plum-ink: #9dbdea;
  --blush: #e59f78; --cream: #1e1a16; --mint: #93cfb4;
  --mark-belly: #f4efe6;
  --ink: #eef3fa; --ink-2: #c9d4e2; --muted: #98a6b8; --line: #222b38;
  --paper: #151b25; --bg: #080b12;
  --warning: #e8a9bd; --warning-bg: #26191d;
  --wash-blush: #1d1712; --paper-tint: #18202b; --lavender-wash: #18202b;
  --blush-line: #3b272d;
  --ok-ink: #79cfa9; --ok-bg: #12291f;
  --founder-ink: #a9c4ee; --tag-bg: #1a2230; --danger-hover: #f0b6c8;
  --shadow: 0 18px 55px rgba(0, 0, 0, 0.6);
  --confirm-shadow: 0 24px 60px rgba(0, 0, 0, 0.66);
  --confirm-backdrop: rgba(2, 4, 8, 0.62);
  --color-scheme: dark;
  --swatch-seal: #cdbdf5; --swatch-sapphire: #9dbdea;
  --mark-tile: #182130;
  --mark-ring-1: #7ba4dd; --mark-ring-2: #4a6f9e;
  --mark-plate: #18202b; --mark-flipper: #5b7192;
}

* { box-sizing: border-box; }

html {
  color-scheme: var(--color-scheme);
  scroll-behavior: smooth;
}

body {
  margin: 0;
  color: var(--ink);
  font: 16px/1.7 var(--sans);
  background:
    radial-gradient(850px 420px at 8% -8%, var(--lavender-soft), transparent 62%),
    radial-gradient(720px 360px at 100% 0, var(--wash-blush), transparent 58%),
    var(--bg);
}

a { color: var(--plum-ink); text-underline-offset: 3px; }
a:hover { color: var(--plum); }
/* ⚖ N8b (2026-08-24) — see the long note at account.css's .btn:focus-visible for
   the whole case. Short version: --blush read 1.86:1 on the paper and 1.72:1 on
   the page ground at seal/day, the DEFAULT theme, against SC 1.4.11's 3.0 bar —
   a shipped accessibility failure, not a taste call. a is already --plum-ink, so
   this is N8's own "the ring takes the colour this element already has". */
a:focus-visible { outline: 3px solid var(--plum-ink); outline-offset: 3px; border-radius: 4px; }

.shell { width: min(900px, calc(100% - 32px)); margin: 0 auto; padding: 24px 0 72px; }

.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 28px;
}

.brand {
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--ink);
  text-decoration: none;
}

/* ⛔ WAS `<img src="../brand/nurseal-logo.svg">` UNTIL A1/A2 (2026-08-14), AND
   AN <img> IS UNREACHABLE BY EVERY MECHANISM THIS LANE BUILDS — a referenced
   document has its own tree, so no token, no `data-theme` and no
   `data-scheme` can touch a colour inside it. The `object-fit: cover` on that
   rule was cropping the 680×400 logo file down to its badge; the inline mark
   IS that badge, drawn at its own size, sitting on the same rounded plate the
   logo file paints behind it (`--mark-tile`). */
.brand .brand-mark {
  width: 54px; height: 54px; flex: none; display: block;
  border-radius: 15px; background: var(--mark-tile);
}

/* The right-hand group of the topbar: the back link (where there is one) and
   the day/night control. .topbar is space-between, so without a wrapper a
   third child would spread the three across the row instead of pinning two
   right. callback.html has no back link and gets a group holding only the
   control, which is why this is a wrapper rather than a margin. */
.topbar-end { display: flex; align-items: center; gap: 10px; }

/* ── the day/night control ─────────────────────────────────────────────────
   Identical contract to universe A's (app/study/study.css), and the markup is
   byte-identical because scripts/a1-sync.mjs writes both. Hidden until the
   pre-paint seed has written `data-scheme`, so scripting-off never renders a
   button that cannot answer a click. */
.scheme-toggle { display: none; }
:root[data-scheme] .scheme-toggle {
  display: inline-flex; align-items: center; justify-content: center;
  -webkit-appearance: none; appearance: none;
  width: 44px; height: 44px; min-height: 44px; padding: 0;
  border: 1px solid var(--line); border-radius: 13px;
  background: var(--paper); color: var(--ink-2);
  cursor: pointer;
  transition: border-color 0.15s ease, color 0.15s ease;
}
.scheme-toggle:hover { border-color: var(--lavender); color: var(--plum-ink); }
/* ⚖ N8b — this control has NO colour of its own to inherit (border is --line, a
   hairline that would fail the bar outright), so the tie-break is the identical
   control in the other universe: study.css:545 .scheme-toggle:focus-visible has
   been --plum-ink all along. The two universes now agree, which is the same
   property a1-sync already protects for the mark. */
.scheme-toggle:focus-visible { outline: 3px solid var(--plum-ink); outline-offset: 3px; }
.scheme-toggle svg {
  width: 20px; height: 20px; display: block;
  fill: none; stroke: currentColor; stroke-width: 1.8;
  stroke-linecap: round; stroke-linejoin: round;
}
.scheme-toggle .ic-sun { display: none; }
:root[data-scheme="night"] .scheme-toggle .ic-sun { display: block; }
:root[data-scheme="night"] .scheme-toggle .ic-moon { display: none; }

/* The theme picker (A3-T) — same contract as universe A's; the markup is
   byte-identical because scripts/a1-sync.mjs writes both. */
.theme-toggle { display: none; }
:root[data-scheme] .theme-toggle {
  display: inline-flex; align-items: center; justify-content: center;
  -webkit-appearance: none; appearance: none;
  width: 44px; height: 44px; min-height: 44px; padding: 0;
  border: 1px solid var(--line); border-radius: 13px;
  background: var(--paper); cursor: pointer;
  transition: border-color 0.15s ease;
}
.theme-toggle:hover { border-color: var(--lavender); }
/* ⚖ N8b — same tie-break as .scheme-toggle above: study.css:573 already paints
   this identical control's ring --plum-ink. */
.theme-toggle:focus-visible { outline: 3px solid var(--plum-ink); outline-offset: 3px; }
.theme-toggle .sw {
  width: 18px; height: 18px; border-radius: 999px; display: block;
  border: 1.5px solid var(--line);
}
.theme-toggle .sw-sapphire { background: var(--swatch-sapphire); }
.theme-toggle .sw-seal { background: var(--swatch-seal); display: none; }
:root[data-theme="sapphire"] .theme-toggle .sw-seal { display: block; }
:root[data-theme="sapphire"] .theme-toggle .sw-sapphire { display: none; }

/* The appearance pair reserves both 44px slots at rest. One shared hover
   ancestor covers the controls and their gap, so the swatch remains reachable
   while the pointer travels from the day/night button. */
.appearance { position: relative; display: inline-flex; align-items: center; gap: var(--s2); }
.appearance .theme-toggle {
  opacity: 0; pointer-events: none;
  transform: translateX(-4px) scale(.94);
  transition: opacity .16s ease, transform .16s ease;
}
.appearance:hover .theme-toggle,
.appearance[data-reveal] .theme-toggle,
.appearance .theme-toggle:focus-visible {
  opacity: 1; pointer-events: auto; transform: none;
}
@media (prefers-reduced-motion: reduce) {
  .appearance .theme-toggle { transition: none; transform: none; }
}

/* ── the reserved swatch slot, unreserved on a touch viewport ────────────────
 * ⛔ THE SLOT COSTS A NAV LINE WHERE IT BUYS NOTHING (rung 102). `.appearance
 * .theme-toggle` is laid out at `opacity:0`, so it holds its 41px whether or
 * not it is revealed. MEASURED on this tree, not inferred: the topbar is 76px
 * at 320px AND at 360px against 54px at 390px — 22px, one extra line of nav —
 * and the 320px horizontal overflow goes with it (scrollWidth 338 -> 320),
 * which the rung had recorded as pre-existing and untouched by this.
 * ⚖ THE SLOT IS NOT WRONG, IT IS WRONG *HERE*. It exists because a width or
 * display change moves the day/night button out from under the cursor
 * mid-reveal, dropping the hover and starting a flicker loop. That failure
 * needs a POINTER, so the query asks for the capability the argument rests on
 * — no hover, a coarse pointer — and NOT for a width that merely correlates
 * with it. A narrow DESKTOP window is 320px with a mouse and keeps the slot.
 * ⛔ AND IT TAKES THE TOGGLE OUT OF FLOW RATHER THAN SETTING `display:none`,
 * WHICH THE FIRST VERSION DID. `display` is the property the reveal rules
 * themselves switch (`.theme-toggle` is `display:none` until
 * `:root[data-scheme]` turns it on), so overriding it here put this block in
 * the middle of the reveal mechanism and made "is the control still reachable
 * on a phone?" a question that had to be answered by probe. It could not be:
 * the probe never actually fired the page's own handler — `data-scheme` never
 * flipped — so it was reporting on hover, not on reveal, in BOTH directions.
 * 🔑 Out-of-flow changes only FLOW PARTICIPATION. `.appearance` is already
 * `position:relative`, so the toggle keeps its `display`, its `opacity`, its
 * `pointer-events` and every reveal selector untouched, and stops reserving
 * width. The reachability question does not need a probe because the mechanism
 * is not in the change.
 * ⛔ DO NOT "fix" the nav wrap by shortening the label instead: the label is
 * shared by 14 pages and the wrap is the symptom, not the cause. */
@media (max-width: 360px) and (hover: none) and (pointer: coarse) {
  /* ⚠ COLLAPSED IN PLACE, NOT MOVED OUT OF THE BOX — and both alternatives
   * were measured before this one was kept. `position:absolute; left:100%`
   * pins it past the container and REINTRODUCES horizontal overflow
   * (scrollWidth 320 -> 359 at 320px), which is the very thing this block also
   * fixes; `right:100%` parks it on the far side, so revealing it makes the
   * swatch jump the width of the bar under her thumb. Collapsing to zero width
   * keeps it in flow, reserves nothing, overflows nothing, and grows back
   * exactly where it already sat.
   * ⚠ The row's `gap` has to go with it — a zero-width child still gets its
   * gap, which is most of what the slot was costing. */
  .appearance { gap: 0; }
  :root[data-scheme] .appearance .theme-toggle {
    width: 0; min-width: 0; padding: 0; border-width: 0; overflow: hidden;
  }
  :root[data-scheme] .appearance:hover .theme-toggle,
  :root[data-scheme] .appearance[data-reveal] .theme-toggle,
  :root[data-scheme] .appearance .theme-toggle:focus-visible {
    width: 44px; min-width: 44px; border-width: 1px; margin-left: var(--s2); overflow: visible;
  }
}


/* account.css declares this too, and both account pages load that file — but
   the three legal pages load only this one, and the control's accessible name
   lives in a hidden span. Declared here so the name is not a property of which
   stylesheet a page happens to link. */
.visually-hidden {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.brand-word { display: block; color: var(--plum-ink); font-size: 15px; font-weight: 800; letter-spacing: 0.2em; }
.brand-studio { display: block; color: var(--muted); font-size: 12px; letter-spacing: 0.03em; }

/* 32px targets, not the 22px these were. Measured 2026-08-07: .back-link
 * rendered 22.1px on privacy.html and terms.html — under the house 32px floor
 * AND under WCAG 2.5.8's 24px AA floor. account.css noted this same gap and
 * left it deliberately ("a separate pass, not CP2's"); ruled by Sami 2026-08-07
 * alongside CP3D's close, and this is that pass. The study pages were already
 * fixed at 3d4db7b; these two files were the whole remaining miss.
 *
 * 32 and not 44, matching study.css: the charter reserves 44 for primary,
 * frequent, touch-first controls, and a back link on a policy page is none of
 * those. Height comes from PADDING, never font-size, so the type stays at the
 * size the page was designed for. */
.back-link,
.policy-nav a {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
}
.back-link { font-size: 13px; font-weight: 650; text-decoration: none; padding: 5px 2px; }
.policy-nav a { padding: 5px 2px; }

.draft-banner {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 18px;
  padding: 12px 16px;
  color: var(--warning);
  background: var(--warning-bg);
  border: 1px solid var(--blush-line);
  border-radius: 14px;
  font-size: 13px;
}

.draft-banner strong { white-space: nowrap; }

.paper {
  overflow: hidden;
  background: color-mix(in srgb, var(--paper) 96%, var(--cream));
  border: 1px solid var(--line);
  border-radius: 28px;
  box-shadow: var(--shadow);
}

.hero { padding: clamp(34px, 6vw, 64px); border-bottom: 1px solid var(--line); background: linear-gradient(135deg, var(--paper-tint), var(--cream)); }
.eyebrow { margin: 0 0 8px; color: var(--plum-ink); font-size: 12px; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; }
h1 { margin: 0; font: 700 clamp(36px, 7vw, 62px)/1.05 var(--serif); letter-spacing: -0.035em; }
.lede { max-width: 680px; margin: 18px 0 0; color: var(--ink-2); font-size: 18px; }
.meta { margin-top: 22px; color: var(--muted); font-size: 13px; }

.content { padding: clamp(30px, 6vw, 62px); }
.summary { margin: 0 0 34px; padding: 20px 22px; background: var(--lavender-soft); border-radius: 18px; color: var(--ink-2); }
.summary strong { color: var(--ink); }

h2 { margin: 42px 0 12px; font: 700 26px/1.2 var(--serif); letter-spacing: -0.015em; }
h2:first-of-type { margin-top: 0; }
h3 { margin: 24px 0 8px; font-size: 16px; }
p { margin: 0 0 14px; }
ul { margin: 10px 0 18px; padding-left: 22px; }
li + li { margin-top: 7px; }

.callout { margin: 26px 0; padding: 18px 20px; border-left: 4px solid var(--plum); background: var(--lavender-wash); border-radius: 0 14px 14px 0; }
.callout p:last-child { margin-bottom: 0; }

.policy-nav { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--line); font-size: 13px; font-weight: 650; }
.policy-nav a[aria-current="page"] { color: var(--muted); text-decoration: none; }

footer { margin-top: 22px; text-align: center; color: var(--muted); font-size: 11.5px; line-height: 1.65; }
footer strong { color: var(--plum-ink); letter-spacing: 0.08em; }

@media (max-width: 620px) {
  .shell { width: min(100% - 20px, 900px); padding-top: 12px; }
  .topbar { align-items: flex-start; }
  .brand .brand-mark { width: 46px; height: 46px; }
  .brand-studio { display: none; }
  .draft-banner { display: block; }
  .draft-banner strong { display: block; margin-bottom: 2px; }
  .paper { border-radius: 21px; }
  .lede { font-size: 16px; }
}

/* ⛔ PRINT MUST FORCE DAY, AND THE NIGHT MODE IS WHAT MAKES THAT TRUE.
   These are the pages a person actually prints (Terms, Privacy), and without
   this a reader in night mode prints white text on a dark slab — a defect the
   mode introduces rather than one it inherits, so it belongs in this batch.
   The selector list is not decoration: @media adds no specificity, so a bare
   `:root` here (0,1,0) would lose to every block above it. Each of the four is
   named so the override wins in the cell it is written for. */
@media print {
  :root,
  :root[data-scheme="night"],
  :root[data-theme="sapphire"][data-scheme="day"],
  :root[data-theme="sapphire"][data-scheme="night"] {
    --color-scheme: light;
    --paper: #ffffff; --bg: #ffffff; --paper-tint: #ffffff;
    --ink: #1a1a1a; --ink-2: #333333; --muted: #555555;
    --line: #cccccc; --lavender-soft: #ffffff; --wash-blush: #ffffff;
  }
  body { background: white; }
  .shell { width: 100%; padding: 0; }
  .topbar, .draft-banner, .policy-nav, footer { display: none; }
  .paper { border: 0; border-radius: 0; box-shadow: none; }
}