:root {
  color-scheme: dark;
  --pl-ink: #f2eee8;
  --pl-muted: #aba39d;
  --pl-faint: #837a73;
  --pl-page: #090706;
  --pl-surface: #100d0b;
  --pl-surface-raised: #15110e;
  --pl-surface-soft: #1b1511;
  --pl-field: #1d1713;
  --pl-accent: #f0aa66;
  --pl-accent-hover: #ffc07d;
  --pl-accent-strong: #f0aa66;
  --pl-on-accent: #1a120b;
  --pl-danger: #ef927c;
  --pl-success: #b6d798;
  --pl-border: rgba(244, 220, 198, 0.12);
  --pl-border-strong: rgba(244, 220, 198, 0.2);
  --pl-focus: rgba(240, 170, 102, 0.42);
  --pl-nav-bg: rgba(13, 10, 8, 0.8);
  --pl-nav-muted: rgba(242, 238, 232, 0.68);
  --pl-nav-hover: rgba(240, 170, 102, 0.1);
  --pl-grid-line: rgba(240, 170, 102, 0.072);
  --pl-grid-glow: rgba(239, 126, 42, 0.055);
  --pl-shadow-sm: 0 10px 28px rgba(4, 2, 1, 0.16);
  --pl-shadow-md: 0 18px 44px rgba(4, 2, 1, 0.22);
  --pl-shadow-soft: var(--pl-shadow-sm);
  --pl-radius-sm: 10px;
  --pl-radius-md: 16px;
  --pl-radius-lg: 24px;
  --pl-radius-xl: 32px;
  --pl-space-1: 0.25rem;
  --pl-space-2: 0.5rem;
  --pl-space-3: 0.75rem;
  --pl-space-4: 1rem;
  --pl-space-5: 1.5rem;
  --pl-space-6: 2rem;
  --pl-space-7: 3rem;
  --pl-shell-width: 1180px;
  --pl-copy-width: 720px;
  --pl-content-wide: var(--pl-shell-width);
  --pl-page-gutter: clamp(6px, 2.2vw, 20px);
  --pl-text: var(--pl-ink);
  --pl-text-muted: var(--pl-muted);
  --pl-text-subtle: var(--pl-faint);
  --pl-accent-soft: color-mix(in srgb, var(--pl-accent) 13%, transparent);
  --pl-font-mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --pl-motion-fast: 160ms;
  --pl-motion-base: 220ms;
  --pl-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) {
    color-scheme: light;
    --pl-ink: #241f1b;
    --pl-muted: #68605a;
    --pl-faint: #827970;
    --pl-page: #f2eee9;
    --pl-surface: #f8f5f1;
    --pl-surface-raised: #fffdf9;
    --pl-surface-soft: #e9e1d9;
    --pl-field: #e4dcd4;
    --pl-accent: #cf7432;
    --pl-accent-hover: #df8a48;
    --pl-accent-strong: #9d4b1e;
    --pl-on-accent: #1a120b;
    --pl-danger: #9f3f31;
    --pl-success: #4d702f;
    --pl-border: rgba(57, 42, 31, 0.13);
    --pl-border-strong: rgba(57, 42, 31, 0.21);
    --pl-focus: rgba(157, 75, 30, 0.35);
    --pl-nav-bg: rgba(248, 245, 241, 0.82);
    --pl-nav-muted: rgba(36, 31, 27, 0.68);
    --pl-nav-hover: rgba(215, 135, 69, 0.1);
    --pl-grid-line: rgba(82, 57, 41, 0.065);
    --pl-grid-glow: rgba(207, 116, 50, 0.039);
    --pl-shadow-sm: 0 10px 26px rgba(68, 44, 29, 0.07);
    --pl-shadow-md: 0 16px 38px rgba(68, 44, 29, 0.09);
  }
}

:root[data-theme="light"] {
  color-scheme: light;
  --pl-ink: #241f1b;
  --pl-muted: #68605a;
  --pl-faint: #827970;
  --pl-page: #f2eee9;
  --pl-surface: #f8f5f1;
  --pl-surface-raised: #fffdf9;
  --pl-surface-soft: #e9e1d9;
  --pl-field: #e4dcd4;
  --pl-accent: #cf7432;
  --pl-accent-hover: #df8a48;
  --pl-accent-strong: #9d4b1e;
  --pl-on-accent: #1a120b;
  --pl-danger: #9f3f31;
  --pl-success: #4d702f;
  --pl-border: rgba(57, 42, 31, 0.13);
  --pl-border-strong: rgba(57, 42, 31, 0.21);
  --pl-focus: rgba(157, 75, 30, 0.35);
  --pl-nav-bg: rgba(248, 245, 241, 0.82);
  --pl-nav-muted: rgba(36, 31, 27, 0.68);
  --pl-nav-hover: rgba(215, 135, 69, 0.1);
  --pl-grid-line: rgba(82, 57, 41, 0.065);
  --pl-grid-glow: rgba(207, 116, 50, 0.039);
  --pl-shadow-sm: 0 10px 26px rgba(68, 44, 29, 0.07);
  --pl-shadow-md: 0 16px 38px rgba(68, 44, 29, 0.09);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --pl-motion-fast: 0.01ms;
    --pl-motion-base: 0.01ms;
  }
}