/* ============================================================
   Designtokens – ZENTRALE Quelle für Farben, Abstände, Typo.
   Übernommen aus der Budget-App, damit beide Apps gleich wirken.
   Keine hartkodierten Werte in app.css oder JS.

   Bewusst OHNE Signalfarben: es gibt kein Rot für eine
   "schlechte Nacht" und kein Grün für eine gute. Zahlen stehen
   ohne Wertung. Schlaf ist kein Leistungsspiel.
   ============================================================ */

:root {
  /* Basis-Palette: streng schwarz/weiß */
  --color-bg:           #000000;
  --color-fg:           #ffffff;
  --color-fg-muted:     #9a9a9a;   /* dezente Sekundärtexte */
  --color-fg-faint:     #5c5c5c;   /* sehr zurückhaltend, Hinweise */
  --color-line:         #2a2a2a;   /* Trennlinien, Rahmen */
  --color-line-strong:  #444444;
  --color-surface:      #0d0d0d;   /* minimal abgesetzte Fläche */
  --color-surface-2:    #161616;   /* Bottom-Sheet, Felder */
  --color-focus:        #ffffff;

  /* Abstands-Skala (8px-Basis) */
  --space-0:  0;
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  24px;
  --space-6:  32px;
  --space-7:  48px;
  --space-8:  64px;

  /* Typografie – reine Systemschriften, keine Web-Fonts */
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
               Helvetica, Arial, sans-serif;
  --font-mono: ui-monospace, "SF Mono", "Segoe UI Mono", Menlo,
               Consolas, monospace;

  /* Typo-Skala */
  --text-xs:   12px;
  --text-sm:   14px;
  --text-base: 16px;
  --text-md:   18px;
  --text-lg:   22px;
  --text-xl:   28px;
  --text-2xl:  36px;

  --leading-tight: 1.1;
  --leading-normal: 1.4;

  --weight-normal: 400;
  --weight-medium: 500;
  --weight-bold:   700;

  /* Form: klassisch-modern, keine Bonbon-Optik */
  --radius:      0px;
  --radius-full: 999px;
  --border:      1px solid var(--color-line);
  --border-strong: 1px solid var(--color-line-strong);

  /* Bewusst KEINE Schatten, KEINE Verläufe. */
  --shadow: none;

  /* Interaktion */
  --tap-min: 44px;         /* Mindest-Trefferfläche für den Daumen */
  --transition: 120ms ease;

  /* Layout */
  --content-max: 560px;    /* Handy-first, auf Desktop zentriert */
}