:root {
  
  --paper: #ddd6cb;
  --paper-deep: #c9c0b4;
  --paper-lift: #f0ebe3;
  --char: #211e1a;
  --char-soft: #4d463e;
  --char-muted: #665d53;
  --ash-line: rgba(33, 30, 26, 0.16);
  --ember: #e85d04;
  --ember-deep: #b84000;
  --ember-soft: #ffb17c;
  --ember-ink: #fff8f3;

  
  --font-sans: "DM Sans", system-ui, sans-serif;
  --font-mono: "DM Sans", system-ui, sans-serif;

  
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: clamp(3.5rem, 7vw, 4.5rem);
  --space-9: clamp(4.5rem, 9vw, 7rem);
  --space-10: clamp(6rem, 12vw, 10rem);

  --measure: 38rem;
  --measure-wide: 46rem;
  --page: min(1180px, calc(100% - clamp(2rem, 8vw, 8rem)));
  --page-wide: min(1320px, calc(100% - clamp(2rem, 5vw, 5rem)));

  --header-h: 64px;
  --header-height: var(--header-h);
  --radius: 0.75rem;
  --radius-md: 1rem;
  --radius-lg: 1.5rem;
  --shadow-soft: 0 1rem 3rem rgba(33, 30, 26, 0.08);
  --shadow-lift: 0 1.5rem 4rem rgba(33, 30, 26, 0.14);
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --dur: 0.55s;
  --motion-fast: 160ms;
  --motion-base: 260ms;
  --motion-panel: 340ms;
  --motion-reveal: 700ms;

  --z-header: 40;
  --z-nav: 50;
  --z-skip: 60;

  --ui-space-1: 4px;
  --ui-space-2: 8px;
  --ui-space-3: 12px;
  --ui-space-4: 16px;
  --ui-space-5: 20px;
  --ui-space-6: 24px;
  --ui-space-8: 32px;
  --ui-space-10: 40px;
  --ui-space-12: 48px;
  --ui-space-16: 64px;
  --ui-space-20: 80px;
  --ui-space-24: 96px;
  --ui-radius-sm: 8px;
  --ui-radius-md: 12px;
  --ui-radius-lg: 16px;
  --ui-type-h1: clamp(2.25rem, 1.5rem + 3.8vw, 5rem);
  --ui-type-h2: clamp(1.75rem, 1.35rem + 2.3vw, 3.25rem);
  --ui-type-h3: clamp(1.25rem, 1.1rem + 0.9vw, 1.75rem);
  --ui-leading-heading: 1.08;
  --ui-leading-body: 1.55;
  --ui-tracking-heading: -0.02em;
  --ui-touch-target: 44px;
  --ui-duration: 180ms;
  --ui-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --ui-focus-color: var(--ember);
}
