/* ── Self-hosted fonts ── */
@font-face {
  font-family: 'IBM Plex Mono';
  font-weight: 300;
  font-style: normal;
  font-display: swap;
  src: url('../assets/fonts/plex-mono-300.woff2') format('woff2');
}

@font-face {
  font-family: 'IBM Plex Mono';
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src: url('../assets/fonts/plex-mono-400.woff2') format('woff2');
}

@font-face {
  font-family: 'IBM Plex Mono';
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  src: url('../assets/fonts/plex-mono-500.woff2') format('woff2');
}

@font-face {
  font-family: 'IBM Plex Sans';
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src: url('../assets/fonts/plex-sans-400.woff2') format('woff2');
}

@font-face {
  font-family: 'IBM Plex Sans';
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  src: url('../assets/fonts/plex-sans-500.woff2') format('woff2');
}

:root {
  /* ── Backgrounds ── */
  --bg-base:     #0F0E0C;
  --bg-surface:  #161513;
  --bg-elevated: #1C1A18;
  --bg-overlay:  #24211E;
  --bg-muted:    #2E2B27;

  /* ── Text ── */
  --text-primary:   #EAE5DD;
  --text-secondary: #A8A096;
  --text-tertiary:  #635D57;

  /* ── Accent — Warm Stone ── */
  --accent:        #C4B49A;
  --accent-dim:    #8B7D6C;
  --accent-subtle: #2B2620;

  /* ── Semantic ── */
  --success:        #7FA87A;
  --success-fill:   #1D2E1B;
  --success-border: #3A5436;
  --warning:        #C4A87A;
  --warning-fill:   #2E2519;
  --warning-border: #5A4520;
  --danger:         #C47A7A;
  --danger-fill:    #2E1A1A;
  --danger-border:  #5A2828;
  --info:           #7A9DC4;
  --info-fill:      #192535;
  --info-border:    #2A4060;

  /* ── Border ── */
  --border:        #2E2B27;
  --border-accent: #8B7D6C;

  /* ── Typography ── */
  --mono: 'IBM Plex Mono', monospace;
  --sans: 'IBM Plex Sans', system-ui, sans-serif;

  /* ── Spacing (4pt grid) ── */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;

  /* ── Border radius ── */
  --r-sm:   3px;
  --r-md:   6px;
  --r-lg:   10px;
  --r-pill: 9999px;
}