/* Direction: Waypoint — calm clinical-warm. Linen paper, deep sage, a literary serif */
/* Completed by the platform from the short form: both modes, every
   palette token, each text-on-ground pair at its floor. To restyle, write the
   short form again (the decisions in one :root) and it is completed again. */

:root {
  --canvas: #f5f1e8;
  --surface: #fffdf8;
  --surface-2: #e9e6dd;
  --border: #d4d1c9;
  --border-strong: #aeada6;
  --ink: #1d2a26;
  --muted: #626762;
  --accent: #2f6b5a;
  --accent-hover: #285b4d;
  --accent-ink: #ffffff;
  --accent-text: #27584a;
  --accent-strong: #2f6b5a;
  --accent-soft: #dcebe4;
  --accent-border: #9cb5a8;
  --success: #15803d;
  --success-ink: #ffffff;
  --success-soft: #dae3d3;
  --success-strong: #116d34;
  --warning: #b45309;
  --warning-ink: #ffffff;
  --warning-soft: #eddecd;
  --warning-strong: #994607;
  --danger: #b91c1c;
  --danger-ink: #ffffff;
  --danger-soft: #eed7d0;
  --danger-strong: #b91c1c;
  --chart-1: #2f6b5a;
  --chart-2: #1a82ae;
  --chart-3: #513b8d;
  --chart-4: #aa4e7a;
  --chart-5: #773a0a;
  --chart-6: #777c10;

  --font-display: "Newsreader", Georgia, serif;
  --font-body: "DM Sans", system-ui, sans-serif;
  --radius-card: 18px;
  --radius-btn: 999px;
  --display-weight: 500;
  --display-tracking: -0.02em;
  --x-band: #1f3a33;
  --x-on-band: #f3efe4;
  --x-clay: #c9785a;
  --font-mono: "JetBrains Mono Variable", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --font-sans: "DM Sans", system-ui, sans-serif;
  --eyebrow-tracking: 0.08em;
}

html[data-theme="dark"] {
  --canvas: #070f0d;
  --surface: #202725;
  --surface-2: #131b19;
  --border: #2a312f;
  --border-strong: #515756;
  --ink: #f5f1e8;
  --muted: #969790;
  --accent: #2f6b5a;
  --accent-hover: #4e8173;
  --accent-ink: #ffffff;
  --accent-text: #6a9588;
  --accent-strong: #6a9588;
  --accent-soft: #10231e;
  --accent-border: #193830;
  --success: #15803d;
  --success-ink: #ffffff;
  --success-soft: #0a2818;
  --success-strong: #499c68;
  --warning: #b45309;
  --warning-ink: #ffffff;
  --warning-soft: #2d1e0c;
  --warning-strong: #c57a40;
  --danger: #b91c1c;
  --danger-ink: #ffffff;
  --danger-soft: #2e1210;
  --danger-strong: #d16969;
  --chart-1: #417d6b;
  --chart-2: #2396c6;
  --chart-3: #8370c7;
  --chart-4: #be608c;
  --chart-5: #bb672c;
  --chart-6: #8a8e1a;
}

.bar { height: 8px; border-radius: 999px; background: color-mix(in srgb, var(--ink) 12%, transparent); overflow: hidden; }
.bar > i { display: block; height: 100%; background: var(--accent); border-radius: inherit; transition: width .6s ease; }
.lift { transition: transform .2s ease, box-shadow .2s ease; }
.lift:hover { transform: translateY(-3px); box-shadow: 0 14px 30px -18px rgba(0,0,0,.35); }
.hero-glow { background: radial-gradient(60% 80% at 85% 10%, color-mix(in srgb, var(--accent) 22%, transparent), transparent 70%), radial-gradient(40% 50% at 5% 90%, color-mix(in srgb, var(--x-clay) 22%, transparent), transparent 70%); }
.switch { width: 44px; height: 26px; border-radius: 999px; background: color-mix(in srgb, var(--ink) 30%, transparent); position: relative; flex: none; transition: background .2s; border: 0; cursor: pointer; }
.switch::after { content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: var(--surface); transition: transform .2s; }
.switch[aria-checked="true"] { background: var(--accent); }
.switch[aria-checked="true"]::after { transform: translateX(18px); }
.moodbar { background: var(--accent); border-radius: 6px 6px 2px 2px; width: 100%; }
@media print { header, footer, .no-print { display: none !important; } }
@keyframes drift { from { transform: translateY(0); } to { transform: translateY(-8px); } }
.drift { animation: drift 5s ease-in-out infinite alternate; }
html.reduced-motion .drift { animation: none; }