/* Gemeinsame Typografie aller Chemie-Apps (wie die Übersicht webroot/):
   Open Sans für Titel, Inter für Text und Bedienung, JetBrains Mono für Zahlen, Einheiten und Labels.
   Selbst gehostet (variable Schriften, Teilmenge Latein + Griechisch + Indizes/Pfeile/Mathe), keine
   Abhängigkeit von Google Fonts. Einbinden VOR dem App-Stylesheet:
     <link rel="stylesheet" href="../lib/schrift/schrift.css" />
   Die App definiert danach keine eigenen Schriftfamilien mehr, sondern nutzt die Variablen unten.
   Lizenzen: OFL-*.txt in diesem Ordner. */

@font-face {
  font-family: 'Open Sans'; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url(open-sans.woff2) format('woff2');
}
@font-face {
  font-family: 'Open Sans'; font-style: italic; font-weight: 400 700; font-display: swap;
  src: url(open-sans-italic.woff2) format('woff2');
}
@font-face {
  font-family: 'Inter'; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url(inter.woff2) format('woff2');
}
@font-face {
  font-family: 'Inter'; font-style: italic; font-weight: 400 700; font-display: swap;
  src: url(inter-italic.woff2) format('woff2');
}
@font-face {
  font-family: 'JetBrains Mono'; font-style: normal; font-weight: 400 600; font-display: swap;
  src: url(jetbrains-mono.woff2) format('woff2');
}

:root {
  /* Familien */
  --schrift-titel: 'Open Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --schrift-text: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --schrift-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Consolas, monospace;

  /* Grössenskala (Desktop; auf dem Handy setzen die Apps höchstens den App-Titel kleiner) */
  --gr-app-titel: clamp(26px, 3vw, 38px);  /* Titel der App, Open Sans 600 */
  --gr-panel-titel: 22px;  /* Titel im Bedienfeld (Frage der App), Open Sans 600 */
  --gr-titel: 18px;    /* Abschnitts- und Fokustitel, Open Sans 600 */
  --gr-text: 14px;     /* Fliesstext, Inter */
  --gr-panel: 13px;    /* Text, Knöpfe und Regler im Bedienfeld */
  --gr-klein: 12px;    /* Hinweise, Legenden, Bildunterschriften */
  --gr-label: 11px;    /* Panel-Titel und Labels: JetBrains Mono 500, Versalien, gesperrt */

  /* Ältere Variablennamen der Apps, damit bestehende Regeln die neuen Schriften erhalten */
  --serif: var(--schrift-titel);
  --display: var(--schrift-titel);
  --sans: var(--schrift-text);
  --mono: var(--schrift-mono);
  --font-display: var(--schrift-titel);
  --font-ui: var(--schrift-text);
  --font-mono: var(--schrift-mono);
}