/* ===========================================================================
   ERSCHEINUNGSBILD: WERTE-DATEI

   DIE SCHRIFTEN DES HAUSES — als Dateien HIER, nicht von einem fremden Dienst.

   Montserrat für alles Geschriebene, JetBrains Mono für Zahlen. Beide liegen als
   `.woff2` in `bilder/schriften/` und werden über die Steckdose dieses Moduls
   ausgeliefert (`/erscheinungsbild/schrift/…`).

   WARUM NICHT VON GOOGLE: dann hinge jede Ansicht an einem fremden Dienst, der
   hängen oder verschwinden kann — und sobald ein Kunde Bruno benutzt, entstünde
   nebenbei eine Datenschutz-Frage, weil sein Browser bei jedem Seitenaufruf eine
   fremde Adresse anspräche. Die Seite muss OHNE Internetzugang vollständig
   richtig aussehen.

   LIZENZ: beide Schriften stehen unter der SIL Open Font License 1.1. Die
   vollständigen Lizenztexte liegen neben den Dateien (`schriften/OFL-*.txt`) —
   das ist die Bedingung der Lizenz, keine Beigabe.

   `latin` und `latin-ext` — beides, weil Bruno Ungarisch spricht (ő, ű) und die
   ungarischen Buchstaben im `latin`-Ausschnitt nicht enthalten sind.

   SEIT 1.8.0 (Baukonzept 102.1.1, Entwurf 2) VIER SCHRIFTEN FÜR DIE INITIALEN
   eines Kundenbilds: Orbitron 700 (technisch), Playfair Display 700 kursiv
   (künstlerisch), Racing Sans One 400 (dynamisch), Cinzel 700 (klassisch) —
   „pragmatisch" ist Montserrat 700 von oben. Initialen sind Grossbuchstaben und
   Ziffern; darum genügt der `latin`-Ausschnitt. Herkunft: npm `@fontsource/<name>`
   5.3.0, Prüfsumme (sha512) gegen die Angabe des Verzeichnisses gehalten; die
   Lizenztexte (OFL 1.1) liegen daneben (`schriften/OFL-*.txt`).
   =========================================================================== */

@font-face {
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("/erscheinungsbild/schrift/montserrat-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
    U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("/erscheinungsbild/schrift/montserrat-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
    U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020,
    U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: "JetBrains Mono";
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url("/erscheinungsbild/schrift/jetbrains-mono-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
    U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "JetBrains Mono";
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url("/erscheinungsbild/schrift/jetbrains-mono-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
    U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020,
    U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: "Orbitron";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/erscheinungsbild/schrift/orbitron-latin-700.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
    U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Playfair Display";
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url("/erscheinungsbild/schrift/playfair-display-latin-700-italic.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
    U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Racing Sans One";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/erscheinungsbild/schrift/racing-sans-one-latin-400.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
    U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Cinzel";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/erscheinungsbild/schrift/cinzel-latin-700.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
    U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ===========================================================================
   ERSCHEINUNGSBILD: WERTE-DATEI

   DUNKEL — das Erscheinungsbild von Bruno. Abgenommen von Gabor am 20.9.2026
   nach vier Entwurfs-Durchgängen (Notiz 917 und 918 am Baukonzept 100.2.3).

   JEDER NAME DIESER DATEI STEHT IN DER NAMENSLISTE (`../vertrag.py`), und jeder
   Name der Namensliste steht hier. Beide Richtungen sind bewacht
   (`proben/test_erscheinungsbild_werte.py`, Sabotage-Probe B): ein fehlender Wert
   fiele sonst still auf die Vorgabe des Browsers zurück, und die Seite sähe nicht
   kaputt aus, sondern nur ein bisschen falsch.

   ALLE WERTE STEHEN AN DER WURZEL DES DOKUMENTS. Das ist die Bedingung für den
   Austausch: ein zweites Erscheinungsbild ist eine zweite solche Datei mit
   denselben Namen und anderen Zahlen — kein Bauteil wird dafür angefasst.

   DIE NAMEN TRAGEN IHRE ROLLE, NICHT IHR AUSSEHEN. `--akzent`, nicht `--orange`:
   ein Bauteil, das `--orange` einsetzt, wird beim blauen Kundenportal zur Lüge.
   =========================================================================== */

:root {

  /* --- AKZENT ------------------------------------------------------------ */
  --akzent: #FF8800;
  --akzent-hell: #FFA845;
  /* Schrift auf der Akzent-Fläche (Hauptknopf) — seit 100.2.4. */
  --auf-akzent: #1B1206;

  /* --- FLÄCHEN ----------------------------------------------------------- */
  --grund: #17150F;
  --grund-schein: radial-gradient(820px 340px at 84% -10%,
                                  rgba(255, 136, 0, .22), transparent 62%);
  --seitenleiste: rgba(11, 10, 8, .5);
  --karte: linear-gradient(160deg, rgba(255, 255, 255, .06),
                                   rgba(255, 255, 255, .015));
  --linie: #2A2620;
  --linie-karte: #322B22;
  --zeile-linie: rgba(255, 255, 255, .06);
  --zeile-drueber: rgba(255, 255, 255, .035);

  /* Seit 100.2.4 (Baukasten): die Flächen der Bauteile, aus dem abgenommenen
     Entwurf „Bruno Baukasten Entwurf", Fassung 4 — dort als feste Zahl
     gezeichnet, hier benannt. Kein bestehender Wert hat sich geändert. */
  --zeile-gewaehlt: rgba(255, 136, 0, .10);
  --knopf-grund: rgba(255, 255, 255, .03);
  --feld-grund: rgba(0, 0, 0, .28);
  --fenster-grund: #1F1B15;
  --fenster-schleier: rgba(8, 7, 5, .62);
  /* Seit 100.2.4 Rev. 2 (Entwurf Fassung 5): der Grund eines Tabellenkopfs, der
     beim Scrollen stehen bleibt — deckend, sonst schienen die Zeilen durch —,
     und der Lauf-Balken der Warte-Anzeige am oberen Rand einer Karte. */
  --tabellenkopf-grund: #1D1A14;
  --warte-verlauf: linear-gradient(90deg, transparent, #FF8800, transparent);
  /* Datumsfeld, Auswahl-Pfeil, Kästchen: der Browser zeichnet sie dunkel. */
  --farbschema: dark;
  /* Die Scrollbalken: schmal, im Ton der Kartenränder, nie hellgrau. */
  --balken-griff: #322B22;
  --balken-griff-drueber: #5D5A54;
  --balken-bahn: transparent;

  /* --- SCHRIFT NACH BEDEUTUNG -------------------------------------------- */
  /* NICHT AUFHELLEN. Die beiden schwachen Stufen wurden am 20.9. versuchsweise
     auf #A4A097 und #7C776E gesetzt und wieder zurückgenommen: der Abstand
     zwischen den Stufen geht dabei verloren, und mit ihm die Information, die
     in der Abstufung steckt. Lesbarkeit kommt über die Größe, nicht die Helle. */
  --schrift-1: #F3F2EF;
  --schrift-2: #C8C6C0;
  --schrift-3: #8C8981;
  --schrift-4: #5D5A54;

  /* --- BEDEUTUNG — getrennt vom Akzent ------------------------------------ */
  /* Diese drei wechseln NICHT mit, wenn ein Kunde seine Hausfarbe bekommt:
     ein rotes „kritisch" bleibt rot, auch wenn der Akzent blau wird. */
  --gut: #56C173;
  --achtung: #E6AE45;
  --kritisch: #E85C55;

  /* Seit 100.2.4: der durchscheinende Grund von Pille und Gefahr-Knopf — aus
     der Bedeutungsfarbe abgeleitet, darum ebenso getrennt vom Akzent. */
  --gut-grund: rgba(86, 193, 115, .12);
  --achtung-grund: rgba(230, 174, 69, .13);
  --kritisch-grund: rgba(232, 92, 85, .13);
  --kritisch-rand: rgba(232, 92, 85, .45);
  --neutral-grund: rgba(255, 255, 255, .06);
  /* Seit 101.3.3: „läuft gerade" (Inbox: „in Arbeit") — blau, getrennt vom Akzent. */
  --info: #5B9FE8;
  --info-grund: rgba(91, 159, 232, .14);

  /* --- SCHRIFTARTEN UND GRÖSSEN ------------------------------------------ */
  /* Die Ersatz-Schriften dahinter sind kein Beiwerk: sie tragen die Seite in
     dem Augenblick, in dem die Schriftdatei noch nicht da ist. */
  --schriftart: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;
  --schriftart-zahlen: "JetBrains Mono", ui-monospace, monospace;
  /* 16,5 -> 14 px am 28.9.2026 (Gabor, Zoom 85 %; Notiz 953): weil alle Maße
     Vielfache hiervon sind, wird die ganze Seite dichter, nicht nur die Schrift. */
  --grundgroesse: 14px;

  /* Alles Weitere leitet sich von der Grundgröße ab, damit eine einzige
     Änderung die ganze Anwendung mitnimmt. */
  --schrift-ueberschrift: calc(var(--grundgroesse) * 1.1);
  --schrift-text: calc(var(--grundgroesse) * 1);
  --schrift-zelle: calc(var(--grundgroesse) * .95);
  --schrift-bedien: calc(var(--grundgroesse) * .9);
  --schrift-pille: calc(var(--grundgroesse) * .85);
  --schrift-spaltenkopf: calc(var(--grundgroesse) * .8);
  --schrift-grosszahl: calc(var(--grundgroesse) * 1.65);

  /* --- FORM --------------------------------------------------------------- */
  /* Seit 100.2.4 Rev. 2 Vielfache der Grundgröße — der Zoom, den Gabor geprüft
     hat, verkleinert auch die Rundungen (14 · 0,86 = 12, 10 und 8 px). */
  --rund-kachel: calc(var(--grundgroesse) * .86);
  --rund-flaeche: calc(var(--grundgroesse) * .72);
  --rund-bedien: calc(var(--grundgroesse) * .57);
  --rund-pille: 999px;
  --rand-aktiv: 4px;
  /* Das Relief: heller Grat oben, dunkle Unterkante, Schlagschatten darunter. */
  --tiefe-kachel: inset 0 1px 0 rgba(255, 255, 255, .10),
                  inset 0 -1px 0 rgba(0, 0, 0, .45),
                  0 6px 14px rgba(0, 0, 0, .38);

  /* Die vier Maße der Seitenleiste — als VIELFACHE der Grundgröße, nicht als
     feste Bildpunkte (Notiz 918). Dann zieht eine Änderung der Grundgröße sie
     mit, und „die Kacheln sind mir zu groß" ist ein Zahlentausch hier statt
     eines Bau-Auftrags am Rahmen. */
  --kachel-groesse: calc(var(--grundgroesse) * 5);
  --icon-groesse: calc(var(--grundgroesse) * 2);
  --leiste-breite: calc(var(--grundgroesse) * 6.7);
  --label-groesse: calc(var(--grundgroesse) * .55);

  --luft: calc(var(--grundgroesse) * .75);
  --luft-gross: calc(var(--grundgroesse) * 1.5);
  --zeilenhoehe: 1.5;

  /* Seit 100.2.4: das Rückfrage-Fenster hebt sich ab; der Scrollbalken ist schmal. */
  --tiefe-fenster: 0 24px 60px rgba(0, 0, 0, .55);
  --balken-breite: 8px;

  /* --- KUNDENFARBEN (seit 1.8.0, Baukonzept 102.1.1 §3.6, Entwurf 2) -------
     Die 24 Farben, aus denen ein Kunde seine wählt — gleich in JEDEM Bild: sie
     gehören dem Kunden, nicht dem Haus. Die Nummer ist die Rolle, der Name der
     Palettenfarbe steht im Vertrag (`KUNDENFARBEN`). */
  --kunde-01: #D64545;   /* Rot */
  --kunde-02: #A9483A;   /* Ziegel */
  --kunde-03: #F07F6A;   /* Koralle */
  --kunde-04: #E2702F;   /* Kürbis */
  --kunde-05: #E5A532;   /* Bernstein */
  --kunde-06: #B8922A;   /* Senf */
  --kunde-07: #E3D553;   /* Zitrone */
  --kunde-08: #9CC43F;   /* Limette */
  --kunde-09: #4FA14A;   /* Gras */
  --kunde-10: #2D6E4A;   /* Tanne */
  --kunde-11: #62C9A5;   /* Mint */
  --kunde-12: #26A9A6;   /* Türkis */
  --kunde-13: #1D6F80;   /* Petrol */
  --kunde-14: #5BAEE6;   /* Himmel */
  --kunde-15: #3A72D1;   /* Blau */
  --kunde-16: #2A3F86;   /* Marine */
  --kunde-17: #5656C9;   /* Indigo */
  --kunde-18: #8A55CF;   /* Violett */
  --kunde-19: #B39BE6;   /* Lavendel */
  --kunde-20: #74396A;   /* Pflaume */
  --kunde-21: #BE3F93;   /* Magenta */
  --kunde-22: #EB8DB5;   /* Rosa */
  --kunde-23: #CBB592;   /* Sand */
  --kunde-24: #5D6A78;   /* Schiefer */
  --kunde-licht: #F3F2EF;      /* Schrift „hell" */
  --kunde-tief: #1B1206;       /* Schrift „dunkel" */
  --kunde-ohne: #4A4640;       /* ohne Kundenfarbe: neutrales Grau */

  /* --- KUNDENBILD: Schriftarten und Größen (seit 1.8.0) -------------------
     Die fünf Schriften der Initialen liegen als Dateien bei (`schriften.css`).
     Die Größen sind die des Entwurfs: 42 × 28, 72 × 48, 120 × 80 (3:2), die
     Initialen darin 16, 25 und 42 px. */
  --kunde-art-pragmatisch: "Montserrat", system-ui, sans-serif;
  --kunde-art-technisch: "Orbitron", "Montserrat", sans-serif;
  --kunde-art-kuenstlerisch: "Playfair Display", Georgia, serif;
  --kunde-art-dynamisch: "Racing Sans One", "Montserrat", sans-serif;
  --kunde-art-klassisch: "Cinzel", Georgia, serif;
  --kundenbild-klein: 42px;
  --kundenbild-mittel: 72px;
  --kundenbild-gross: 120px;
  --kundenbild-schrift-klein: 16px;
  --kundenbild-schrift-mittel: 25px;
  --kundenbild-schrift-gross: 42px;
  --kundenbild-sperrung: .04em;
  --farbfeld: calc(var(--grundgroesse) * 2);
}