:root {
  /* color system (brand sheet: docs/brand/salut-brand-sheet.svg) */
  --ink: #0F172A;
  --slate: #1E293B;
  --teal: #0EA38A;
  --teal-dark: #0B8672;
  --seafoam: #CDEFEA;
  --seafoam-light: #E4F6F2;
  --coral: #FF4D4F;
  --soft-gray: #F1F5F9;
  --border: #E5E7EB;
  --white: #FFFFFF;
  --muted: #6B7280;

  /* 8pt spacing grid */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px;
  --s-6: 24px; --s-8: 32px; --s-12: 48px; --s-16: 64px;

  --radius-sm: 8px;
  --radius: 12px;
  --radius-lg: 16px;
  --shadow: 0 1px 2px rgba(15, 23, 32, .05), 0 4px 16px rgba(15, 23, 32, .06);
  --shadow-lg: 0 4px 12px rgba(15, 23, 32, .08), 0 16px 40px rgba(15, 23, 32, .12);
  --teal-grad: linear-gradient(135deg, #12B598 0%, #0B8672 100%);
  --hero-grad: linear-gradient(120deg, #E4F6F2 0%, #F1FAF7 55%, #FDF3F0 100%);

  --sidebar-w: 240px;
  --panel-w: 360px;
}