/* Kuble — Marken-Tokens für das Präsentationssystem.
   Dark-first. Werte aus dem GTS-Brain kuble.knowledge.design-system-kuble
   (Stand CI/CD Manual Juli 2026). Variablennamen sind vom Core vorgegeben
   und dürfen nicht umbenannt werden. */

@font-face {
  font-family: "Montserrat";
  src: url("/brand-assets/fonts/montserrat-var.woff2") format("woff2-variations");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

@font-face {
  font-family: "Montserrat";
  src: url("/brand-assets/fonts/montserrat-italic-var.ttf") format("truetype-variations");
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
}

@font-face {
  font-family: "JetBrains Mono";
  src: url("/brand-assets/fonts/jetbrains-mono-var.woff2") format("woff2-variations");
  font-style: normal;
  font-weight: 100 800;
  font-display: swap;
}

/* Nur für die alternative Betonungsvariante, siehe --font-emphasis weiter unten.
   Der Browser lädt die Datei erst, wenn eine Regel die Familie tatsächlich verwendet. */
@font-face {
  font-family: "Instrument Serif";
  src: url("/brand-assets/fonts/instrument-serif-italic.ttf") format("truetype");
  font-style: italic;
  font-weight: 400;
  font-display: swap;
}

:root {
  color-scheme: dark;

  /* Akzente. Blue, Gold und Grün sind Markenfarben; Violett und Koralle
     ergänzen sie, damit der Core seine fünf data-accent-Slots füllen kann. */
  --blue: #2e5cff;
  --yellow: #edaa3c;
  --green: #3dd68c;
  --violet: #8b6bff;
  --orange: #f2545b;

  /* Getönte Nachtflächen für data-tone="soft" — dark-first heisst: der Akzent
     färbt das Ink ein, er hellt es nicht auf. Gemischt wird gegen das tiefste
     Ink, damit der Anteil Farbe trägt statt nur aufzuhellen. */
  --blue-soft: color-mix(in oklab, var(--blue) 18%, #05070c);
  --yellow-soft: color-mix(in oklab, var(--yellow) 18%, #05070c);
  --green-soft: color-mix(in oklab, var(--green) 18%, #05070c);
  --violet-soft: color-mix(in oklab, var(--violet) 18%, #05070c);
  --orange-soft: color-mix(in oklab, var(--orange) 18%, #05070c);

  /* Hellere Stufe von Kuble Blue. Als Fläche trägt #2e5cff, als Text auf
     Night Ink erreicht es nur 3.9:1 — dafür braucht es blue-400. */
  --blue-bright: #4e7bff;

  /* Night Ink. --paper ist die Bühne, --ink der Text: im Dark Mode gedreht. */
  --paper: #05070c;
  --paper-2: #0a0e17;
  --paper-3: #10141f;
  --ink: #f2f4f8;
  --ink-2: #b4bccc;
  --ink-3: #8892a6;
  --rule: #1e2535;
  --rule-strong: #2a3246;

  /* Flächen heben sich im Dark Mode mit Licht, nicht mit Weiss. Halbtransparent,
     damit derselbe Betrag über jedem Folienton gleich stark hebt. */
  --elevate: color-mix(in oklab, var(--ink) 6%, transparent);
  --elevate-strong: color-mix(in oklab, var(--ink) 12%, transparent);

  /* Auf gesättigten Folien liegt bei Kuble Ink, nicht der Akzent — die
     Sekundärtöne sind darum hell und gedämpft statt weiss-transparent. */
  --on-accent-muted: #8892a6;
  --on-accent-subtle: #8892a6;
  --overlay-scrim: rgba(5, 7, 12, 0.84);

  --font-display: "Montserrat", ui-sans-serif, -apple-system, "Segoe UI", system-ui, sans-serif;
  --font-body: "Montserrat", ui-sans-serif, -apple-system, "Segoe UI", system-ui, sans-serif;
  --font-ui: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* Betonung im Fliesstext. Default folgt dem Brain: Akzentwort in Montserrat
     Light, in der Akzentfarbe. Für die Serif-Kursiv-Variante des älteren
     Editorial-Looks stattdessen setzen:
       --font-emphasis: "Instrument Serif", Georgia, serif;
       --emphasis-style: italic;
       --emphasis-weight: 400; */
  --font-emphasis: var(--font-display);
  --emphasis-style: normal;
  --emphasis-weight: 300;

  /* Kuble-Radien. Der Core ist scharfkantig, Kuble ist ruhig gerundet. */
  --radius-card: 14px;
  --radius-input: 8px;
  --radius-pill: 999px;

  --container: 1240px;
  --gutter: clamp(28px, 5cqw, 72px);
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --focus: 2px solid var(--ink);
}

/* Kuble — Shell-Schicht für Login, Code-Gate, Bibliothek und Admin.
   Wird zusammen mit tokens.css als /brand-shell.css ausgeliefert. Kuble ist
   dark-first: Farben, Schriften und color-scheme kommen bereits aus
   tokens.css, deren @font-face-Pfade absolut sind und darum auch ausserhalb
   von /decks/ auflösen. Hier stehen nur die Rollen, die die Shell zusätzlich
   braucht. */

:root {
  /* Text auf Akzentflächen. Night Ink auf Kuble Blue käme nur auf 4.3:1;
     auf den Akzentflächen der Shell trägt darum Weiss. */
  --on-accent: #ffffff;

  /* Fehlerfarbe der Formulare — auf Night Ink braucht es eine helle Stufe. */
  --danger: #ff6b6b;
}