/* ==========================================================================
   Screenpuppets — Design Tokens (Single Source of Truth)

   Wird in layouts/puppet.blade.php VOR puppet.css und puppet-cutouts.css
   geladen. Definiert die Stamm-Tokens, auf die puppet-cutouts.css
   (--sp-*) und puppet.css (--pp-*) aliased werden.

   Zwei Serifen, bewusst getrennt:
   --serif  = Georgia (System-Stack) für Fließtext. Georgia ist für lange
              Lesestrecken gebaut; Biografien und Formulare bleiben darauf.
   --display = Fraunces (lokal unter /fonts/screenpuppets/) für Überschriften.
              Dieselbe Schrift trägt das Kino-Opening auf screenpuppets.com —
              die Klammer zwischen Schaufenster und Profilen entsteht hier.

   Achtung: --serif hängt in puppet.css an html/body. Wer den Token umstellt,
   ändert den gesamten Fließtext mit, nicht nur Überschriften.
   ========================================================================== */

@font-face {
  font-family: 'Fraunces';
  src: url('/fonts/screenpuppets/fraunces-variable.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Fraunces';
  src: url('/fonts/screenpuppets/fraunces-variable-italic.woff2') format('woff2');
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
}

/* Kinosaal (2026-08-28): die App uebernimmt die Palette der Landing
   screenpuppets.com. Es gibt nur noch diesen einen (dunklen) Token-Satz;
   der alte helle Satz (.sp-legacy-light) ging mit Welle 3 raus
   (Plaene: docs/plans/2026-08-28-screenpuppets-kinosaal*.md). */
:root {
  /* Background */
  --bg:          oklch(0.15 0.014 60);   /* warmes Fast-Schwarz (Landing --bg) */
  --bg-alt:      oklch(0.19 0.016 58);   /* Panel, eine Stufe heller */
  --bg-input:    oklch(0.21 0.016 58);   /* Formularfelder */
  --bg-tint:     oklch(0.19 0.016 58);   /* legacy alias */
  --bg-deep:     oklch(0.10 0.012 55);   /* Footer/Vignette */

  /* Ink */
  --ink:         oklch(0.93 0.018 80);   /* Bone/Creme */
  --ink-strong:  oklch(0.97 0.012 80);
  --ink-muted:   oklch(0.68 0.02 65);
  --ink-subtle:  oklch(0.55 0.02 65);
  --ink-faint:   oklch(0.93 0.018 80 / .18);
  --line:        oklch(0.93 0.018 80 / .14);

  /* Accent */
  --accent:      #B83A1F;                /* Rost — dieselbe Farbe wie hell */
  --accent-hi:   oklch(0.66 0.16 42);
  --accent-soft: rgba(184,58,31,0.22);
  --accent-line: rgba(184,58,31,0.5);
  --ok:          #7FBF6A;

  /* Photo placeholder */
  --photo-bg:    oklch(0.22 0.016 58);
  --photo-text:  oklch(0.55 0.02 65);

  /* Radii */
  --r-sm: 2px;
  --r-md: 4px;
  --r-lg: 8px;

  /* Typography — siehe Kopfkommentar */
  --serif:   Georgia, 'Iowan Old Style', 'Times New Roman', serif;
  --display: 'Fraunces', Georgia, 'Iowan Old Style', 'Times New Roman', serif;
  --sans:    -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}