:root {
  --uzs-font-display: "Bitter", "Fraunces", "Palatino Linotype", Georgia, serif;
  --uzs-font-body: "Manrope", "Plus Jakarta Sans", "Segoe UI", "Noto Sans", sans-serif;
  --uzs-font-mono: "IBM Plex Mono", Consolas, "Liberation Mono", monospace;

  /* Palette roles (AA-normal or stricter against paired text/surface tokens). */
  --uzs-surface-canvas: #f4f1ea;
  --uzs-surface-canvas-alt: #eeeadf;
  --uzs-surface-panel: #fbf9f4;
  --uzs-surface-raised: #ffffff;
  --uzs-surface-overlay: rgba(255, 255, 255, 0.82);

  --uzs-text-strong: #1f1b16;
  --uzs-text-soft: #4d473f;
  --uzs-text-muted: #6b6258;
  --uzs-text-inverse: #f8f6f1;

  --uzs-accent-strong: #2a5fbf;
  --uzs-accent-soft: #d7e4ff;
  --uzs-accent-ink: #173774;
  --uzs-accent-civic: #2a7f72;
  --uzs-accent-warm: #b0671d;

  --uzs-focus-ring: #0f56de;
  --uzs-focus-shadow: rgba(15, 86, 222, 0.3);

  --uzs-state-success: #1f8b55;
  --uzs-state-warning: #ac5d09;
  --uzs-state-danger: #a1322f;
  --uzs-state-info: #225f9c;

  --uzs-motif-line: rgba(42, 95, 191, 0.22);
  --uzs-motif-grid: rgba(31, 27, 22, 0.08);
  --uzs-motif-glow: rgba(42, 127, 114, 0.2);
  --uzs-motif-grain: rgba(31, 27, 22, 0.06);

  --uzs-space-1: 0.25rem;
  --uzs-space-2: 0.5rem;
  --uzs-space-3: 0.75rem;
  --uzs-space-4: 1rem;
  --uzs-space-5: 1.5rem;
  --uzs-space-6: 2rem;
  --uzs-space-7: 3rem;
  --uzs-space-8: 4rem;

  --uzs-radius-sm: 0.45rem;
  --uzs-radius-md: 0.8rem;
  --uzs-radius-lg: 1.1rem;
  --uzs-radius-xl: 1.6rem;
  --uzs-radius-pill: 999px;

  --uzs-shadow-sm: 0 1px 2px rgba(17, 17, 17, 0.08);
  --uzs-shadow-md: 0 12px 28px rgba(17, 17, 17, 0.12);
  --uzs-shadow-lg: 0 22px 48px rgba(17, 17, 17, 0.18);

  --uzs-motion-duration-fast: 150ms;
  --uzs-motion-duration-mid: 240ms;
  --uzs-motion-duration-slow: 340ms;
  --uzs-motion-duration-reduced: 120ms;
  --uzs-motion-ease-standard: cubic-bezier(0.22, 1, 0.36, 1);
  --uzs-motion-ease-decelerate: cubic-bezier(0.16, 1, 0.3, 1);
  --uzs-motion-ease-subtle: cubic-bezier(0.3, 0, 0.2, 1);

  --uzs-text-display-size: clamp(2.2rem, 5vw, 4.1rem);
  --uzs-text-display-lh: 1.05;
  --uzs-text-h1-size: clamp(1.9rem, 3.6vw, 3rem);
  --uzs-text-h1-lh: 1.08;
  --uzs-text-h2-size: clamp(1.45rem, 2.7vw, 2.2rem);
  --uzs-text-h2-lh: 1.14;
  --uzs-text-body-lg-size: 1.12rem;
  --uzs-text-body-lg-lh: 1.65;
  --uzs-text-body-size: 1rem;
  --uzs-text-body-lh: 1.72;
  --uzs-text-meta-size: 0.88rem;
  --uzs-text-meta-lh: 1.45;

  --uzs-z-base: 1;
  --uzs-z-nav: 120;
  --uzs-z-overlay: 500;

  --uzs-container: min(1140px, calc(100vw - 2rem));
  --uzs-reading-width: 72ch;
  --uzs-bento-gap: 1rem;
}

html[data-theme="dark"] {
  --uzs-surface-canvas: #191712;
  --uzs-surface-canvas-alt: #1f1c16;
  --uzs-surface-panel: #22201b;
  --uzs-surface-raised: #2a2720;
  --uzs-surface-overlay: rgba(42, 39, 32, 0.84);

  --uzs-text-strong: #f3eee2;
  --uzs-text-soft: #dad1bf;
  --uzs-text-muted: #bfb29e;
  --uzs-text-inverse: #1d1812;

  --uzs-accent-strong: #93b8ff;
  --uzs-accent-soft: rgba(147, 184, 255, 0.24);
  --uzs-accent-ink: #c6d9ff;
  --uzs-accent-civic: #7ecdc0;
  --uzs-accent-warm: #f0bc78;

  --uzs-focus-ring: #95beff;
  --uzs-focus-shadow: rgba(149, 190, 255, 0.36);

  --uzs-state-success: #63c58f;
  --uzs-state-warning: #f0aa54;
  --uzs-state-danger: #ec8b89;
  --uzs-state-info: #82bef9;

  --uzs-motif-line: rgba(147, 184, 255, 0.3);
  --uzs-motif-grid: rgba(243, 238, 226, 0.09);
  --uzs-motif-glow: rgba(126, 205, 192, 0.22);
  --uzs-motif-grain: rgba(243, 238, 226, 0.08);

  --uzs-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.44);
  --uzs-shadow-md: 0 12px 28px rgba(0, 0, 0, 0.5);
  --uzs-shadow-lg: 0 22px 48px rgba(0, 0, 0, 0.56);
}