/*
 * Waypost Advisory — the Respect pillar in CSS.
 *
 * The palette lives in custom properties so the inline component styles
 * (var(--…)) follow the visitor's OS preference without a theme framework:
 * prefers-color-scheme picks the scheme, prefers-reduced-motion disarms any
 * animation the site ever gains. Respect is adaptation too — the one kind
 * that needs zero signals.
 */

:root {
  color-scheme: light dark;
  --ink: #1c2428;
  --muted: #5c6a72;
  --accent: #155e63;
  --accent-ink: #ffffff;
  --hairline: #dde4e7;
  --page: #ffffff;
  --card: #ffffff;
  --card-tinted: #f8fafb;
  --tint-info: #eef6f7;
  --tint-warm: #f4f1ea;
  --tint-quiet: #f6f4f9;
  --ok-bg: #e7f3ec;
  --ok-ink: #14532d;
  --danger: #b3261e;
}

@media (prefers-color-scheme: dark) {
  :root {
    --ink: #e8eef0;
    --muted: #9fb0b6;
    --accent: #58b7bf;
    --accent-ink: #06282b;
    --hairline: #2e3b40;
    --page: #10181b;
    --card: #172226;
    --card-tinted: #141e22;
    --tint-info: #12333a;
    --tint-warm: #2b241a;
    --tint-quiet: #241f2e;
    --ok-bg: #113321;
    --ok-ink: #9adbb4;
    --danger: #ff8a80;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}

body {
  margin: 0;
  background: var(--page);
  color: var(--ink);
}