/* Design-Tokens der Plattform, abgeleitet aus DESIGN.md. Fachspezifische Werte (Hauptfarbe, Feld)
   überschreibt themes/<fach>.css für alles unter [data-fach="<fach>"] (gesetzt auf <html>, auf der
   Plattformseite je Eintrag). Komponenten verwenden nur diese Variablen, keine festen Farben. */

@font-face { font-family: "Fira Sans"; font-weight: 400; font-display: swap; src: url("../fonts/FiraSans-Regular.otf") format("opentype"); }
@font-face { font-family: "Fira Sans"; font-weight: 500; font-display: swap; src: url("../fonts/FiraSans-Medium.otf") format("opentype"); }
@font-face { font-family: "Fira Sans"; font-weight: 600; font-display: swap; src: url("../fonts/FiraSans-SemiBold.otf") format("opentype"); }
@font-face { font-family: "Fira Sans"; font-weight: 700; font-display: swap; src: url("../fonts/FiraSans-Bold.otf") format("opentype"); }
@font-face { font-family: "Fira Math"; font-weight: 400; font-display: swap; src: url("../fonts/FiraMath-Regular.otf") format("opentype"); }

:root {
    color-scheme: light; /* nur hell, bis ein dunkles Schema in Markenfarben freigegeben ist */

    /* Farben, gemeinsam für alle Fächer */
    --papier: #FBF9F4;
    --blatt: #FFFFFF;
    --tinte: #1F2933;
    --leise: #5E6670;
    --linie: #E2DED6;
    --karo: #E3EAF3;
    --akzent: #C4540A;          /* der Punkt; als kleine Schrift nur --akzent-dunkel */
    --akzent-dunkel: #A44507;
    --hellorange: #F6B26B;
    --rot: #B42318;             /* nur Fehler */
    --gruen: #2F7D32;           /* nur „richtig“ */
    --merke: #E6EEF8;   --merke-linie: #C3D5EA;
    --grund: #F4F3EF;           /* nur Verwaltung: Arbeitsfläche */
    --linie-stark: #8A8478;     /* Rand von Eingaben und Knöpfen (Verwaltung, Quiz), 3,7:1 auf Weiß (WCAG 1.4.11) */
    --achtung: #FBE8E5; --achtung-linie: #EFC4BD;
    --aufgabe: #FCEFDC; --aufgabe-linie: #EFD2A6;

    /* Fachspezifisch, Standard = mathe.verstehen */
    --haupt: #1D4E89;
    --feld: var(--haupt);
    --hellblau: #CFE0F5;
    --auswahl: var(--merke);    /* gewählte Zeile in Listen der Verwaltung */
    --feld-karo: rgba(255, 255, 255, .08);
    --feld-rand: rgba(255, 255, 255, .45);   /* Schalter auf dem Feld */
    --feld-hover: rgba(255, 255, 255, .1);

    /* Schrift */
    --text: "Fira Sans", "Segoe UI", system-ui, sans-serif;
    --formel: "Fira Math", "Cambria Math", "STIX Two Math", serif;
    --code: ui-monospace, "SFMono-Regular", "Cascadia Mono", Menlo, Consolas, monospace; /* nur Verwaltung, siehe DESIGN.md */
    --v-klein: 13px;            /* Verwaltung: Beschriftungen, Hinweise */
    --v-text: 15px;             /* Verwaltung: Grundschrift */
    --v-titel: 20px;            /* Verwaltung: Seitentitel */
    --s-1: .875rem;
    --s0: 1.0625rem;
    --s1: 1.25rem;
    --s2: 1.625rem;
    --s3: 2.125rem;
    --s4: clamp(2.25rem, 5vw, 3.5rem);

    /* Abstände und Ecken */
    --abstand-xs: 4px;
    --abstand-sm: 8px;
    --abstand-md: 16px;
    --abstand-lg: 24px;
    --abstand-xl: 32px;
    --abstand-xxl: 48px;
    --abstand-abschnitt: 72px;
    --karo-feld: 32px;
    --karo-blatt: 20px;
    --ecke-kante: 2px;
    --ecke-klein: 4px;
    --ecke-blatt: 6px;
    --ecke-mittel: 8px;
    --ecke-gross: 10px;
    --ecke-pille: 99px;

    --schatten-knopf: 0 6px 18px -6px rgba(15, 36, 64, .6);
    --schatten-blatt: 0 1px 2px rgba(15, 36, 64, .10), 0 12px 32px -12px rgba(15, 36, 64, .35);
}