/* ============================================================
   Design tokens — monochrome, premium, Apple-quiet.
   Pure black ground, off-white ink, greys. Colour appears only
   as tiny status dots (like macOS traffic lights) — never as fill.
   ============================================================ */
:root {
  /* Ground + surfaces. */
  --bg:        #000000;
  --bg-2:      #08080a;
  --surface:   #101012;
  --surface-2: #17171a;
  --hairline:  rgba(255, 255, 255, 0.09);
  --hairline-2:rgba(255, 255, 255, 0.18);

  /* Ink — Apple off-white + system greys. */
  --ink:       #f5f5f7;
  --ink-dim:   #a1a1a6;
  --ink-faint: #6e6e73;

  /* The "accent" is simply white. */
  --accent:    #ffffff;

  /* Status — used ONLY as small dots, sparingly. */
  --good:     #30d158;
  --warning:  #ffd60a;
  --critical: #ff453a;
  --info:     #ffffff;
  --neutral:  #8e8e93;

  /* Type — system stack for the true Apple feel; mono for code. */
  --display: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Helvetica Neue", Arial, sans-serif;
  --body:    -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", Arial, sans-serif;
  --mono:    "SF Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* Fluid scale. */
  --fs-mega:  clamp(2.8rem, 9vw, 7rem);
  --fs-hero:  clamp(2.4rem, 6vw, 4.8rem);
  --fs-h2:    clamp(2rem, 5vw, 3.6rem);
  --fs-h3:    clamp(1.25rem, 2.5vw, 1.85rem);
  --fs-lead:  clamp(1.05rem, 1.7vw, 1.35rem);
  --fs-body:  1.04rem;
  --fs-small: 0.82rem;

  /* Spacing + shape. */
  --space-section: clamp(4rem, 9vh, 7rem);
  --maxw: 1200px;
  --menubar-h: 40px;
  --radius: 16px;
  --radius-lg: 24px;

  /* Motion. */
  --spring: cubic-bezier(0.16, 1, 0.3, 1);
  --ease:   cubic-bezier(0.33, 0, 0.12, 1);
}