/* Maneframe — structural design tokens (spacing, type, radii, layout).
   Brand colors live in theme.css. Every CSS value in the app comes from a token. */

@font-face {
  font-family: 'JetBrains Mono';
  src: url('../fonts/JetBrainsMono-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'JetBrains Mono';
  src: url('../fonts/JetBrainsMono-Medium.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'JetBrains Mono';
  src: url('../fonts/JetBrainsMono-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'JetBrains Mono';
  src: url('../fonts/JetBrainsMono-Italic.woff2') format('woff2');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'BankGothic';
  src: url('../fonts/bankgothic-medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'BankGothic';
  src: url('../fonts/bankgothic-light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Type */
  --font-mono: 'JetBrains Mono', 'Fira Code', 'SF Mono', Consolas, monospace;
  --font-brand: 'BankGothic', 'JetBrains Mono', monospace;
  --fs-xs: 0.72rem;
  --fs-sm: 0.82rem;
  --fs-base: 0.95rem;
  --fs-md: 1.05rem;
  --fs-lg: 1.3rem;
  --fs-xl: 1.7rem;
  --fs-2xl: 2.2rem;
  --fs-3xl: 3rem;
  --lh-tight: 1.25;
  --lh-base: 1.6;

  /* Spacing scale (4px base) */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-7: 3rem;
  --sp-8: 4rem;

  /* Radii + borders */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-full: 999px;

  /* Layout */
  --sidebar-w: 220px;
  --content-max: 880px;
  --content-wide: 1100px;

  /* Motion */
  --t-fast: 0.15s ease;
  --t-base: 0.25s ease;
}