/* Maße - alle Längen, Schriftgrößen, Zeilenhöhen, Gewichte, Ebenen und
   Dauern der Oberfläche. Keine Farben (die stehen im Abschnitt "farben").

   Diese Kopie ist ERZEUGT: scripts/design_sync.py schreibt den
   Abschnitt "masse" von tokens.css nach masse.css - nie von Hand
   ändern, sondern in tokens.css benennen und neu erzeugen. */

:root {
  /* Abstände — eine Skala für margin, padding, gap und Lagen (top/left).
     Gemessen 11.10.2026: genau diese zehn Stufen kommen in triiga.css vor. */
  --abstand-1: 2px;
  --abstand-2: 4px;
  --abstand-3: 6px;
  --abstand-4: 8px;
  --abstand-5: 10px;
  --abstand-6: 12px;
  --abstand-7: 16px;
  --abstand-8: 20px;
  --abstand-9: 24px;
  --abstand-10: 32px;

  /* Schriftgrößen (nie kleiner als 14 px — docs/oberflaeche.md) */
  --schrift-klein: 14px;      /* Daten, Spaltenköpfe, Hinweise */
  --schrift-normal: 16px;     /* Fließtext */
  --schrift-abschnitt: 18px;  /* Abschnittsüberschrift (h2) */
  --schrift-gross: 20px;      /* hervorgehobene Zahlen, Unterkopf */
  --schrift-titel: 28px;      /* Seitentitel (h1) */

  /* Zeilenhöhen (ohne Einheit) */
  --zeile-eng: 1.25;
  --zeile-normal: 1.4;
  --zeile-text: 1.5;
  --zeile-weit: 1.6;

  /* Schriftgewichte */
  --gewicht-normal: 400;
  --gewicht-halbfett: 600;
  --gewicht-fett: 700;

  /* Inhaltsbreiten */
  --breite-inhalt: 672px;     /* Standard-Spalte (.inhalt) */
  --breite-weit: 1600px;      /* weite Ansicht (.inhalt--weit, Firmenliste) */
  --breite-formular: 360px;   /* Formulare (Anmeldung) */
  --breite-spalte: 360px;     /* Mindestbreite der Detailspalte ab 1200 px */
  --breite-spalte-schmal: 300px; /* Mindestbreite der Detailspalte im Schmalband (900-1199 px) */

  /* Textseiten (Issue 93, 11.10.2026): laengere Textseiten (Impressum,
     Datenschutz, spaeter weitere) nutzen statt der Standard-Spalte die
     Textseiten-Breite; Absaetze und Listen bleiben auf der Lesebreite,
     nur die Tabellen laufen in voller Textseiten-Breite (Rahmen).
     --breite-lese steht bewusst auf dem Mass der Standard-Spalte: auf
     Textseiten bleibt der Fliesstext so schmal wie heute (Lesebreite). */
  --breite-textseite: 960px;  /* laengere Textseiten (.inhalt--textseite) */
  --breite-lese: 672px;       /* Lesebreite des Fliesstextes in .textseite */

  /* Kopf und Fuss: Ziele (44 px) + 2 x 10 Futter + 1 Rand = 65 px.
     --kopf-hoehe gilt in jeder Breite, --fuss-hoehe am Rechner (unter
     480 px bleibt der Fuss schlanker). */
  --kopf-hoehe: 65px;
  --fuss-hoehe: 65px;

  /* Fenster: der Seitenkoerper füllt mindestens das Fenster (min-height
     des body). */
  --hoehe-fenster: 100vh;

  /* Bedienung */
  --deckkraft-leise: 0.65;    /* ausgeschaltete Rand-Spans */
  --tippflaeche: 44px;        /* Mindestgröße jeder Tipp-/Klickfläche */

  /* Bildbestandteile und Versaetze (Ticket 92, benannt 11.10.2026):
     das Logo im Kopf, das runde Symbolfeld der Leiste, das Kreis-Symbol
     darin und die Versaetze von Linien-Stueck und Haekchen vor "fertig". */
  --logo-hoehe: 40px;          /* Höhe des Kopf-Logos (Breite laeuft auf auto) */
  --symbol-feld: 40px;         /* rundes Symbolfeld der Leiste (1. Spaltenspur des Schritts) */
  --symbol-kreis: 16px;        /* Kreis-Symbol (SVG) bei Haekchen und Kreis-Zuständen */
  --versatz-linie: 19px;       /* linke Kante des Linien-Stuecks: Feldmitte minus halbe Strichbreite */
  --versatz-haekchen: -2px;    /* senkt das Haekchen vor "fertig" an die Grundlinie */

  /* Linien und Radien */
  --linie-duenn: 1px;
  --linie-dick: 2px;          /* Feldränder, Fokusring, Leisten-Strich, Puls-Ring */
  --radius: 8px;

  /* Ebenen (z-index) */
  --ebene-grund: 0;
  --ebene-ueber: 1;
  --ebene-kopf: 3;

  /* Firmenblatt (Issue 105): das offene Blatt sitzt unter seinem Schatten
     ueber dem Seitenkopf (3), die Abdunkelung der Liste (Schleier) unter
     dem Kopf, aber ueber dem Inhalt der Liste (1 und 0). */
  --ebene-blatt: 4;
  --ebene-schleier: 2;

  /* Lage und Form des Blatts: es faengt am unteren Fensterrand an und
     nimmt nicht das ganze Fenster - der obere Teil der Liste bleibt
     sichtbar: das 74-vh-Mass haelt beim kurzen Fenster ueber dem
     Blatt mehr frei als die Hoehe des Seitenkopfs, damit die gewaehlte
     Zeile noch ueber die Blatt-Oberkante gescrollt werden kann. */
  --hoehe-blatt: min(580px, 74vh);

  /* Das Spalten-Verhaeltnis des Firmenblatts (Issue 107, Teil 3/5):
     drei Spalten ohne Rollen; Kopf/Warum + Belege links (etwas breiter,
     damit „Anrufen“ neben der Nummer passt), Arbeitsstand in der Mitte,
     Eckdaten + Firmenprofil rechts: das Verhaeltnis 1,1 : 1 : 1 aus dem
     Design-Modul. */
  --anteil-blatt-eins: 1.1fr;
  --anteil-blatt-zwei: 1fr;
  --anteil-blatt-drei: 1fr;

  /* Schatten und Radius des Blatts */
  --schatten-versatz-blatt: -10px; /* der Schatten wandert nach oben */
  --schatten-weiche-blatt: 24px;
  --radius-blatt: 12px;            /* nur die oberen Ecken - unten rastet das Blatt am Fensterrand */

  /* Bewegung */
  --dauer-puls: 2s;
}

/* Bruchstellen (in @media-Bedingungen gehen Variablen technisch nicht —
   diese Zahlen sind die EINZIGEN erlaubten festen Längen im App-CSS und
   gelten nur innerhalb von @media-Bedingungen):
     schmal   max-width: 480px
     mittel   min-width: 900px  (bis max-width: 1199px)
     breit    min-width: 1200px                                           */