/* EazyReader design tokens — mirrored from proto/app.css :root (keep in sync). */
:root{
  --ui-bg:#f3f1ea; --ui-panel:#faf9f5; --ui-border:rgba(20,20,18,0.06);
  --ui-ink:#141413; --ui-muted:#87867f; --ui-soft:#5c5b56; --ui-hover:#ebe8df;
  --ui-ink-2:#5f5e5a; --ui-faint:#9a9a94; --ui-action:#8a8880; --ui-divider:#d8d6cf;
  --ui-line:rgba(20,20,18,0.1); --ui-line-soft:rgba(20,20,18,0.08); --ui-line-strong:rgba(20,20,18,0.12);
  --ui-line-hover:rgba(20,20,18,0.28); --ui-shadow:rgba(20,20,18,0.14);
  --clay:#8a4476; --clay-deep:#5c2a4f; --clay-soft:rgba(138,68,118,0.14);
  --shell:"Figtree",system-ui,sans-serif; --serif:"Newsreader",Georgia,serif; --mono:"DM Mono",ui-monospace,monospace;
  --text-2xs:11px; --text-xs:12px; --text-sm:12.5px; --text-md:13px;
  --radius-xs:6px; --radius-sm:7px; --radius-md:8px; --radius-lg:12px; --radius-pill:999px;
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px;
  /* landing scale (derived) */
  --space-6:24px; --space-8:32px; --space-12:48px; --space-16:64px; --space-24:96px;
  --text-body:16px; --text-lead:19px; --text-h3:18px; --text-h2:clamp(28px,3.4vw,40px); --text-h1:clamp(40px,6vw,72px);
  --page-w:1120px; --gutter:clamp(20px,4vw,40px);
  --shadow-card:0 1px 2px rgba(20,20,18,0.04), 0 24px 60px -24px rgba(20,20,18,0.22);
}