/* =====================================================================
   Hearth · design tokens
   Home care and disability support. Light is "Daytime"; dark is "Evening".
   --leaf is the one accent, dark enough for 7:1 (buttons, links, chosen days and services, the lit words).
   --sun is a marigold, for fills only (the underline, the budget bar, the summary panels, the doorway light); text on it is ink. --sun-ink is its text colour.
   --ok marks what's covered or within budget; --alert marks invalid fields and an over-budget plan.
   ===================================================================== */
:root {
  color-scheme: light;
  --paper: #faf6ef;
  --card: #ffffff;
  --well: #f0e9dd;
  --line: #ddd4c5;
  --ink: #1f1a14;
  --ink-2: #3d362d;
  --muted: #5c544a;
  --leaf: #22553e;
  --leaf-2: #183f2d;
  --on-leaf: #ffffff;
  --leaf-soft: #e2efe7;
  --sun: #f5b942;
  --sun-soft: #fdf0d2;
  --sun-ink: #7a4d00;
  --ok: #1d6b45;
  --alert: #b3261e;
  --focus: #22553e;
  --shadow-card: 0 1px 2px rgba(31, 26, 20, 0.06), 0 18px 36px -26px rgba(31, 26, 20, 0.4);
  --shadow-lift: 0 30px 60px -30px rgba(31, 26, 20, 0.46);

  --display: "Lora", Georgia, serif;
  --body: "Andika", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "Inconsolata", ui-monospace, Menlo, monospace;

  --fs-h1: clamp(42px, 5.6vw, 84px);
  --fs-h2: clamp(32px, 3.8vw, 54px);
  --fs-h3: 23px;
  --fs-lead: clamp(19px, 1.45vw, 22px);
  --fs-body: 18px;
  --fs-small: 16px;
  --fs-label: 13px;

  --wrap: 1200px;
  --gutter: max(20px, 4vw);
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 24px; --s-6: 40px; --s-7: 64px; --s-8: 104px;

  --r-s: 10px;
  --r-m: 16px;
  --r-l: 24px;
  --r-pill: 999px;

  --ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --snap: cubic-bezier(0.34, 1.56, 0.64, 1);
  --d-fast: 150ms;
  --d: 300ms;
  --d-slow: 900ms;
}

/* ---------- Evening ---------- */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --paper: #14171a;
    --card: #1d2125;
    --well: #181b1f;
    --line: #2f343a;
    --ink: #f3eee6;
    --ink-2: #d5d0c8;
    --muted: #a8a197;
    --leaf: #8fd3b0;
    --leaf-2: #b2e2c9;
    --on-leaf: #06261a;
    --leaf-soft: #16261f;
    --sun: #f5b942;
    --sun-soft: #2a2112;
    --sun-ink: #f5b942;
    --ok: #7fd6a0;
    --alert: #ff9a90;
    --focus: #8fd3b0;
    --shadow-card: 0 1px 0 rgba(255, 255, 255, 0.03) inset, 0 16px 34px -20px rgba(0, 0, 0, 0.85);
    --shadow-lift: 0 30px 60px -26px rgba(0, 0, 0, 0.9);
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --paper: #14171a;
  --card: #1d2125;
  --well: #181b1f;
  --line: #2f343a;
  --ink: #f3eee6;
  --ink-2: #d5d0c8;
  --muted: #a8a197;
  --leaf: #8fd3b0;
  --leaf-2: #b2e2c9;
  --on-leaf: #06261a;
  --leaf-soft: #16261f;
  --sun: #f5b942;
  --sun-soft: #2a2112;
  --sun-ink: #f5b942;
  --ok: #7fd6a0;
  --alert: #ff9a90;
  --focus: #8fd3b0;
  --shadow-card: 0 1px 0 rgba(255, 255, 255, 0.03) inset, 0 16px 34px -20px rgba(0, 0, 0, 0.85);
  --shadow-lift: 0 30px 60px -26px rgba(0, 0, 0, 0.9);
}
