:root{
  /* Brand & accent — one blue, no second accent exists */
  --color-primary:#0066cc;
  --color-primary-focus:#0071e3;
  --color-primary-on-dark:#2997ff;
  --color-on-primary:#ffffff;

  /* Surface */
  --color-canvas:#ffffff;
  --color-canvas-parchment:#f5f5f7;
  --color-surface-pearl:#fafafc;
  --color-surface-tile-1:#272729;
  --color-surface-tile-2:#2a2a2c;
  --color-surface-tile-3:#252527;
  --color-surface-black:#000000;
  --color-surface-chip-translucent:#d2d2d7;
  --color-surface-chip-translucent-64:rgba(210,210,215,0.64);

  /* Text */
  --color-ink:#1d1d1f;
  --color-body:#1d1d1f;
  --color-body-on-dark:#ffffff;
  --color-body-muted:#cccccc;
  --color-ink-muted-80:#333333;
  --color-ink-muted-48:#7a7a7a;
  --color-on-dark:#ffffff;

  /* Hairlines */
  --color-divider-soft:#f0f0f0;
  --color-divider-soft-alpha:rgba(0,0,0,0.04);
  --color-hairline:#e0e0e0;
  --color-hairline-alpha:rgba(0,0,0,0.08);

  /* Semantic aliases */
  --text-body:var(--color-body);
  --text-body-on-dark:var(--color-body-on-dark);
  --text-muted:var(--color-ink-muted-48);
  --text-link:var(--color-primary);
  --text-link-on-dark:var(--color-primary-on-dark);
  --surface-page:var(--color-canvas);
  --surface-page-alt:var(--color-canvas-parchment);
  --surface-card:var(--color-canvas);
  --surface-nav:var(--color-surface-black);
  --border-card:var(--color-hairline);
}