/* Design tokens — the house look.
 *
 * Shared by every site. Change here and every site inherits it.
 * Sites must not redefine these; they compose with them.
 *
 * Warm, editorial, restrained. Cream ground rather than stark white,
 * clay accent, serif display. Calm rather than loud.
 */

:root {
  /* Ground and ink */
  --bg:            #faf9f5;
  --bg-raised:     #ffffff;
  --bg-sunken:     #f3f1ea;
  --ink:           #1f1e1d;
  --ink-muted:     #6b6862;
  --ink-faint:     #9a958c;
  --rule:          #e6e2d8;

  /* Accent — clay */
  --accent:        #c96442;
  --accent-hover:  #b25538;
  --accent-wash:   #f7ede8;

  /* Type */
  --font-display:  ui-serif, Georgia, "Iowan Old Style", "Times New Roman", serif;
  --font-body:     ui-sans-serif, system-ui, -apple-system, "Segoe UI", Helvetica, sans-serif;
  --font-mono:     ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;

  --step--1:       clamp(0.83rem, 0.8rem + 0.15vw, 0.9rem);
  --step-0:        clamp(1rem, 0.96rem + 0.2vw, 1.09rem);
  --step-1:        clamp(1.25rem, 1.18rem + 0.35vw, 1.45rem);
  --step-2:        clamp(1.6rem, 1.45rem + 0.7vw, 2.05rem);
  --step-3:        clamp(2.1rem, 1.8rem + 1.4vw, 3rem);
  --step-4:        clamp(2.6rem, 2rem + 2.6vw, 4.2rem);

  --measure:       68ch;
  --leading:       1.65;
  --leading-tight: 1.15;

  /* Space — 4px base */
  --s-1:  0.25rem;
  --s-2:  0.5rem;
  --s-3:  0.75rem;
  --s-4:  1rem;
  --s-6:  1.5rem;
  --s-8:  2rem;
  --s-12: 3rem;
  --s-16: 4rem;
  --s-24: 6rem;

  --radius:    6px;
  --radius-lg: 12px;

  --shadow: 0 1px 2px rgb(31 30 29 / 0.04), 0 8px 24px -12px rgb(31 30 29 / 0.10);
}

/* Dark. Default follows the system; [data-theme] wins in both directions. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg:           #1b1a18;
    --bg-raised:    #232120;
    --bg-sunken:    #151413;
    --ink:          #f2efe8;
    --ink-muted:    #a8a299;
    --ink-faint:    #6f6a62;
    --rule:         #35322e;
    --accent:       #e08363;
    --accent-hover: #ee9877;
    --accent-wash:  #2b2320;
    --shadow: 0 1px 2px rgb(0 0 0 / 0.3), 0 8px 24px -12px rgb(0 0 0 / 0.5);
  }
}

:root[data-theme="dark"] {
  --bg:           #1b1a18;
  --bg-raised:    #232120;
  --bg-sunken:    #151413;
  --ink:          #f2efe8;
  --ink-muted:    #a8a299;
  --ink-faint:    #6f6a62;
  --rule:         #35322e;
  --accent:       #e08363;
  --accent-hover: #ee9877;
  --accent-wash:  #2b2320;
  --shadow: 0 1px 2px rgb(0 0 0 / 0.3), 0 8px 24px -12px rgb(0 0 0 / 0.5);
}