/*
  Tunetown design tokens.
  Source of truth: docs/brandbook.md (Sections 3, 4, 5).
  Do not hardcode raw hex/px values in component CSS where a token below
  already covers the case — extend this file instead so brand values stay
  centralized in one place.
*/
:root {
  /* 4.1 Base / surface — exactly three elevation layers */
  --bg: #0B0D0F;
  --surface: #14171A;
  --surface-raised: #1B1F23;
  --border: #262B2F;

  /* 4.2 Text */
  --text: #ECEAE4;
  --text-secondary: #8B9096;
  --text-muted: #5B6167;

  /* 4.3 Accent ("skin") system — amber is default */
  --accent: #E8A33D;
  --accent-dim: #3A2E18;
  --accent-ink: #1A1408; /* text drawn directly on solid accent fill */

  /* 4.4 Status colors — fixed, never skinned */
  --open: #E2503D;
  --open-dim: #3A1E1A;
  --progress: #4F8FE8;
  --progress-dim: #182A3E;
  --resolved: #4FB286;
  --resolved-dim: #132C22;

  /* 3.1 Brand face */
  --font-brand: 'Fraunces', 'Georgia', serif;
  /* 3.2 UI / system face */
  --font-ui: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  /* 3.3 Monospace face */
  --font-mono: 'JetBrains Mono', 'SF Mono', Consolas, monospace;

  /* 3.4 Type scale */
  --type-wordmark: 20px;
  --type-hero: 36px;
  --type-h1: 17px;
  --type-h2: 13px;
  --type-label: 11px;
  --type-body: 13px;
  --type-meta: 12px;
  --type-mono: 12px;

  /* 5.3 Spacing scale — base unit 4px */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 32px;

  /* Radius scale */
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
}