:root {

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

  --radius-sm:  4px;
  --radius-md:  8px;
  --radius-lg:  12px;
  --radius-btn: var(--radius-md);

  --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-size-base: 1rem;
  --line-base: 1.5;
  --weight-medium: 600;
  --weight-bold: 700;

  --app-font-base: 14px;
  --app-line-base: 20px;
  --app-font-sm:   12px;
  --app-line-sm:   16px;
  --app-h1: 20px;
  --app-h2: 16px;

  --w-canvas:      #FFFFFF;
  --w-paper:       #F6F5F2;
  --w-navy:        #1F2A44;

  --w-ink:         #1F2A44;
  --w-ink-muted:   #57607A;
  --w-on-dark:     #FFFFFF;
  --w-on-dark-muted: #AEB6C8;

  --w-accent:         #E8262D;
  --w-accent-down:    #C81E24;
  --w-accent-pressed: #A81319;

  --w-hairline:      #E4E2DC;
  --w-hairline-dark: #33405E;

  --w-font-display: "Space Grotesk", "Inter", system-ui, sans-serif;
  --w-font-sans:    "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  --w-font-mono:    ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;

  --w-shadow-report: 0 24px 60px -24px rgba(31, 42, 68, 0.35);

  --w-ease:        cubic-bezier(.2,.6,.2,1);
  --w-reveal-dur:  240ms;

  --color-primary:        var(--w-accent-down);
  --color-primary-hover:  var(--w-accent-pressed);
  --color-on-primary:     var(--w-on-dark);

  --color-bg:             var(--w-canvas);
  --color-surface:        var(--w-canvas);
  --color-surface-2:      var(--w-paper);
  --color-text:           var(--w-ink);
  --color-text-muted:     var(--w-ink-muted);
  --color-text-subtle:    var(--w-ink-muted);
  --color-border:         var(--w-hairline);
  --color-link:           var(--w-navy);

  --shadow-md: 0 4px 12px rgba(31, 42, 68, 0.10);
}