/* Miracue design system v2 (TEST, 28 Sept 2026): the two self-contained landing pages,
   /pro/ (the waitlist) and /start/ (the paid-ad page). STAGING ONLY (see v2-fonts.css).
   They carry their own tokens rather than miracue.css, so they get their own layer:
   the dark chapters become ink, the reading sections white, one typeface, no gradients,
   and the buttons follow v2 (ink with accent text; accent with ink text on ink). */
:root{
  --d-bg:var(--ink); --d-ink:var(--on-ink); --d-body:rgba(255,255,255,.8); --d-mute:rgba(255,255,255,.62); --d-hair:rgba(255,255,255,.14);
  --l-bg:var(--white); --l-alt:var(--tint); --l-ink:var(--ink); --l-body:var(--ink-2); --l-mute:var(--ink-3); --l-hair:var(--line);
  --err:var(--danger);
}
body{font-family:var(--sans);font-variant-numeric:tabular-nums}
h1,h2,h3{font-weight:500;letter-spacing:0}
h1{line-height:1.12}
.eyebrow{font-weight:700;letter-spacing:.06em}
header.dark,.dark{background-image:none !important}
.btn,button,.join button{border-radius:var(--r-m);font-weight:700}
.btn.on-dark,.dark .join button,.dark button[type=submit]{background:var(--accent) !important;color:var(--ink) !important}
.btn.on-light,.light .join button,.light button[type=submit]{background:var(--ink) !important;color:var(--accent) !important}
.join input[type=email]{border-radius:var(--r-m);background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.2)}
.light .join input[type=email]{background:var(--white);color:var(--ink);border-color:var(--field-edge)}
:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.dark :focus-visible{outline-color:var(--accent)}
/* the gradients that faded one chapter into the next: a straight edge instead */
[class*="fade"],.fade,.to-light,.to-dark{background-image:none !important}
.hero-end{background:var(--d-bg) !important;height:40px !important;border-radius:0 0 40px 40px}
