/*
Theme Name: all-survive Funkraum
Template: twentytwentyfive
Description: Zweite Gestaltung fuer all-survive.de ("Funkraum"): dunkler Funk- und Lagerraum, Bernstein wie eine Roehrenanzeige, Schablonenschrift; die Startseite zeigt die Statustafel der Spielwelten direkt aus der Seite "Server". Laeuft neben "all-survive Design" und kann jederzeit zurueckgewechselt werden.
Version: 0.1.0
*/

/* ============================================================
   KONTRASTE (nachgerechnet 24.09.2026, WCAG-Formel, Werte unten)

   DUNKEL (Grundzustand)             HELL („Tageslicht")
   Text ink / paper      14,25:1     14,78:1
   muted / paper          7,33:1      6,91:1
   muted / surface        6,80:1      6,31:1
   Link accent-text       10,76:1      5,92:1
   Knopf paper / accent   10,37:1      5,15:1
   Knopf beim Zeigen      12,07:1      7,07:1
   Signalgruen „laeuft"   10,26:1      5,60:1
   „Auf Anfrage"           9,69:1      5,43:1   (auf surface 4,95:1)
   „Archiviert"            6,60:1      5,79:1
   „Pausiert"              6,15:1      5,95:1
   Fehlertext              8,27:1      6,40:1
   Feldrahmen / paper      4,37:1      3,87:1   (noetig 3:1)
   Fokusring / paper      12,07:1      5,15:1   (noetig 3:1)

   Die Zustaende stehen immer auch als WORT da — die Farbe allein
   traegt keine Aussage (Farbfehlsichtigkeit).
   ============================================================ */

/* ============================================================
   Schriften — als Dateien mitgeliefert (keine Anfrage an Google).
   Saira Stencil One (Ueberschriften, Schablone), IBM Plex Sans
   (Fliesstext) und JetBrains Mono (Anzeigen, Zustaende).
   Alle drei: SIL Open Font License 1.1, bezogen ueber Fontsource.
   ============================================================ */
@font-face {
  font-family: "Saira Stencil One";
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url("schriften/saira-stencil-one-latin-400-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+2000-206F,U+2074,U+20AC,U+2212;
}
@font-face {
  font-family: "Saira Stencil One";
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url("schriften/saira-stencil-one-latin-ext-400-normal.woff2") format("woff2");
  unicode-range: U+0100-02BA,U+1E00-1EFF,U+2020,U+20A0-20AB;
}
@font-face {
  font-family: "IBM Plex Sans Variable";
  font-style: normal;
  font-display: swap;
  font-weight: 100 700;
  src: url("schriften/ibm-plex-sans-latin-wght-normal.woff2") format("woff2-variations");
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+2000-206F,U+2074,U+20AC,U+2212;
}
@font-face {
  font-family: "IBM Plex Sans Variable";
  font-style: normal;
  font-display: swap;
  font-weight: 100 700;
  src: url("schriften/ibm-plex-sans-latin-ext-wght-normal.woff2") format("woff2-variations");
  unicode-range: U+0100-02BA,U+1E00-1EFF,U+2020,U+20A0-20AB;
}
@font-face {
  font-family: "JetBrains Mono Variable";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("schriften/jetbrains-mono-latin-wght-normal.woff2") format("woff2-variations");
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+2000-206F,U+2074,U+20AC,U+2212;
}
@font-face {
  font-family: "JetBrains Mono Variable";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("schriften/jetbrains-mono-latin-ext-wght-normal.woff2") format("woff2-variations");
  unicode-range: U+0100-02BA,U+1E00-1EFF,U+2020,U+20A0-20AB;
}

/* ============================================================
   FARBEN

   Die NAMEN sind dieselben wie im bisherigen Theme („all-survive
   Design"): die Seiten in der Datenbank sprechen sie an (gezaehlt
   24.09.: 26× muted, 1× accent …). Nur die Werte sind neu.
   Neu dazu: surface (Kachelgrund) und signal (nur fuer „laeuft").

   Wie im bisherigen Theme ist DUNKEL der Grundzustand — die
   Systemeinstellung des Geraets wird bewusst nicht gefragt.
   ============================================================ */
:root {
  color-scheme: dark;
  --wp--preset--color--paper: #0f110c;
  --wp--preset--color--surface: #171a12;
  --wp--preset--color--ink: #e6dfc8;
  --wp--preset--color--muted: #a7a18a;
  --wp--preset--color--line: #2c3023;
  --wp--preset--color--input-border: #7d7a63;
  --wp--preset--color--accent: #ffb000;
  --wp--preset--color--accent-strong: #ffc54d;
  --wp--preset--color--accent-text: #ffb52e;
  --wp--preset--color--focus: #ffc54d;
  --wp--preset--color--olive: #6b6f3a;
  --wp--preset--color--signal: #8fce86;
  --wp--preset--color--status-experiment: #e0b34a;
  --wp--preset--color--status-archive: #8a9ba3;
  --wp--preset--color--status-offline: #d9785e;
  --wp--preset--color--contact-error: #ff8a75;
  --wp--preset--color--notice-warn-bg: #2a2410;
  --wp--preset--color--notice-warn-border: #a9812a;
  --fr-glimmen: 0 0 .6em rgba(255, 176, 0, .35);
}
:root[data-theme="light"] {
  color-scheme: light;
  --wp--preset--color--paper: #f1efe6;
  --wp--preset--color--surface: #e8e5d8;
  --wp--preset--color--ink: #1b1d15;
  --wp--preset--color--muted: #52523f;
  --wp--preset--color--line: #d3d0c0;
  --wp--preset--color--input-border: #7b7862;
  --wp--preset--color--accent: #8a5a00;
  --wp--preset--color--accent-strong: #6f4700;
  --wp--preset--color--accent-text: #7d5200;
  --wp--preset--color--focus: #8a5a00;
  --wp--preset--color--olive: #575830;
  --wp--preset--color--signal: #2f6b2a;
  --wp--preset--color--status-experiment: #7a5c00;
  --wp--preset--color--status-archive: #4d5f67;
  --wp--preset--color--status-offline: #9c3b22;
  --wp--preset--color--contact-error: #a3261a;
  --wp--preset--color--notice-warn-bg: #f6e7c4;
  --wp--preset--color--notice-warn-border: #a9812a;
  --fr-glimmen: none;
}

/* Umschalter im Kopfbereich */
.theme-toggle {
  background: none;
  border: 1px solid var(--wp--preset--color--input-border, currentColor);
  border-radius: 4px;
  color: inherit;
  cursor: pointer;
  font: inherit;
  line-height: 1;
  padding: .5rem .7rem;
}
.theme-toggle:hover { background: var(--wp--preset--color--line, rgba(0,0,0,.06)); }
.theme-toggle:focus-visible {
  outline: 2px solid var(--wp--preset--color--focus, currentColor);
  outline-offset: 2px;
}
.theme-toggle {
  align-self: center;
  flex: 0 0 auto;
  margin-left: .5rem;
}

/* Welches Symbol der Knopf zeigt.
   Dunkel ist der Grundzustand: beim ersten Besuch steht KEIN data-theme am
   Dokument. Deshalb fragt diese Regel „alles ausser hell" — dieselbe
   Bedingung wie die Farbregeln oben (:root gegen :root[data-theme="light"]). */
.theme-toggle .icon-dark { display: none; }
:root:not([data-theme="light"]) .theme-toggle .icon-dark { display: inline; }
:root:not([data-theme="light"]) .theme-toggle .icon-hell { display: none; }

/* Absaetze hoechstens 68 Zeichen breit — laengere Zeilen liest man schlechter. */
p { max-width: 68ch; }
.wp-block-columns p,
.karte p,
.server-kachel p,
.hinweis p { max-width: none; }

/* ============================================================
   TASTATUR-FOKUS — Twenty Twenty-Five setzt keine Ringfarbe; ohne
   diese Regel stand im dunklen Theme ein fast schwarzer Ring auf fast
   schwarzem Grund (gemessen 28.08.2026 im bisherigen Theme: 1,05:1).
   ============================================================ */
:where(.wp-site-blocks :focus-visible),
:root :where(.wp-element-button:focus-visible),
:root :where(.wp-block-button__link:focus-visible) {
  outline: 2px solid var(--wp--preset--color--focus);
  outline-offset: 2px;
}

/* Lange Adressen in den Rechtstexten duerfen umbrechen (sonst seitliches
   Scrollen auf dem Handy, gemessen 28.08.2026 bei 390 px). */
code, kbd, samp, pre {
  overflow-wrap: anywhere;
  word-break: break-word;
}
pre { overflow-x: auto; }