/*
 * Design-Tokens aus design/tokens/ (Inkrabbit Design System). Quelle der
 * Wahrheit für Farben, Typo und Abstände. Die Konsole startet im Dark-Mode,
 * Light-Mode darf nicht kaputtgehen, muss aber nicht fein sein.
 *
 * Schriften liegen unter public/app/fonts/ und werden über den absoluten
 * Pfad geladen, damit es keine relativen Pfad-Fehler gibt.
 */
@font-face {
  font-family: 'Space Grotesk';
  src: url('/app/fonts/SpaceGrotesk-VariableFont_wght.woff2') format('woff2');
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'JetBrains Mono';
  src: url('/app/fonts/JetBrainsMono-VariableFont_wght.woff2') format('woff2');
  font-weight: 100 800;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Hintergründe */
  --bg: #FAFAF6;
  --bg-soft: #F2F1E9;
  --paper: #FFFFFF;

  /* Text */
  --ink: #1A1F12;
  --ink-soft: #3D4530;
  --mute: #8A8F7A;

  /* Linien */
  --rule: #1A1F12;
  --rule-soft: rgba(26, 31, 18, 0.12);
  --line: rgba(26, 31, 18, 0.14);

  /* Marke: Olive (Primär, OK, aktive Navigation) */
  --olive: #567428;
  --olive-deep: #3A5018;
  --sage: #81995C;
  --sage-light: #CCFF80;

  /* Akzent: Copper (Warnung, "braucht dich") */
  --copper: #B87333;
  --copper-deep: #8E5424;

  /* Highlight */
  --yellow: #FFEA75;
  --cream: #FFF6D9;

  /* Fehler: nur für Störungen, die den Stream kaputt machen. Kein DS-Token. */
  --err: #B4453C;

  /* Hintergrundraster */
  --grid: rgba(86, 116, 40, 0.08);
  --grid-strong: rgba(86, 116, 40, 0.16);

  /* Schriften */
  --font-sans: 'Space Grotesk', ui-sans-serif, system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Consolas, monospace;

  /* Abstände und Form */
  --radius: 4px;
  --radius-lg: 12px;
  --pad: 28px;

  /* Schatten und Übergänge */
  --shadow-sm: 0 1px 3px rgba(26, 31, 18, 0.08);
  --shadow-md: 0 4px 16px rgba(26, 31, 18, 0.12);
  --ease-fast: 0.15s ease;
}

/* Dark-Mode ist der Standard der Konsole. Greift per data-theme am Root,
   und zwar auch ohne Systemeinstellung. */
:root[data-theme="dark"],
:root:not([data-theme="light"]) {
  --bg: #0D1208;
  --bg-soft: #141A0D;
  --paper: #1B2312;
  --ink: #D4E8B4;
  --ink-soft: #8DAB66;
  --mute: #708A4E;
  --rule: rgba(212, 232, 180, 0.12);
  --rule-soft: rgba(212, 232, 180, 0.07);
  --line: rgba(212, 232, 180, 0.12);

  --olive: #7AB830;
  --olive-deep: #5C9020;
  --sage: #5A8A34;
  --copper: #C88840;
  --copper-deep: #A06830;
  --cream: #1A1806;
  --err: #E8746C;

  --grid: rgba(122, 184, 48, 0.05);
  --grid-strong: rgba(122, 184, 48, 0.10);
  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.35);
}