/* BSTools Design-Kern — farbwelten.css ERZEUGT von werkzeug/farbwelten_bauen.py aus kern/farbwelten.json. NICHT VON HAND AENDERN — der Riegel vergleicht Inhalt gegen Inhalt und meldet jede Abweichung. Werte aendert man in farbwelten.json. NACH kern.css einbinden, sonst wirkt nichts. Eine Farbwelt setzt Akzent und Dunkelton. Die hellen Flaechen- und die Text-Toene sind daraus GERECHNET, nicht geraten: der Text-Ton wurde so weit abgedunkelt (hell) bzw. aufgehellt (dunkel), bis er auf Karte, Papier, Chip und auf seiner eigenen Flaeche mindestens 4.5 erreicht. --auf-dunkel ist die Schrift auf dem Dunkelton der Welt (Konsole, dunkle Flaeche). Der Dunkelton ist in beiden Schemata derselbe, also gilt der Ton in beiden — er steht deshalb einmal je Welt. Ampelfarben (gut/warn/alarm) bleiben in JEDER Welt unveraendert — sie sind eine Wertung, keine Marke. Ihre Schrift-Toene (--auf-gut, --auf-warn, --auf-alarm) stehen aus demselben Grund in kern.css und nicht hier. Die Kopfleiste wird NICHT eingefaerbt — sie ist in jeder Welt Grund plus Linie (Vorgabe Stefan 03.09.2026: fast monochrom, genau ein Akzent). Anwenden: Attribut data-welt auf , z. B. . Ohne Attribut gilt die Auslieferung (bstools) aus kern.css. Kundeneigene Farben kommen NICHT hierher, sondern zur Laufzeit als Inline-Stil auf — siehe LESEMICH, Abschnitt 9. */ /* ---------------------------------------------------------- hell */ [data-welt="bstools"] { /* BSTools */ --orange: #EE7F00; --anthrazit: #18181B; --orange-hell: #FDF2E6; --orange-text: #A95A00; --auf-akzent: #502B00; --auf-dunkel: #A3A3AD; /* auf #18181B — Kontrast 7.09 */ } [data-welt="marine"] { /* Marine */ --orange: #1F6FEB; --anthrazit: #1B2733; --orange-hell: #E9F1FD; --orange-text: #1466E4; --auf-akzent: #FFFFFF; --auf-dunkel: #AAB3BC; /* auf #1B2733 — Kontrast 7.14 */ } [data-welt="bordeaux"] { /* Bordeaux */ --orange: #A4123F; --anthrazit: #2E2228; --orange-hell: #F6E7EC; --orange-text: #A4123F; --auf-akzent: #FFFFFF; --auf-dunkel: #BDABB4; /* auf #2E2228 — Kontrast 7.01 */ } [data-welt="wald"] { /* Wald */ --orange: #16815A; --anthrazit: #22312B; --orange-hell: #E8F2EE; --orange-text: #157A55; --auf-akzent: #FFFFFF; --auf-dunkel: #ADBFB7; /* auf #22312B — Kontrast 7.08 */ } [data-welt="kupfer"] { /* Kupfer */ --orange: #B4531A; --anthrazit: #3B3029; --orange-hell: #F8EEE8; --orange-text: #B05119; --auf-akzent: #FFFFFF; --auf-dunkel: #C8BFB9; /* auf #3B3029 — Kontrast 7.08 */ } [data-welt="petrol"] { /* Petrol */ --orange: #0E7490; --anthrazit: #1C2B30; --orange-hell: #E7F1F4; --orange-text: #0E7490; --auf-akzent: #FFFFFF; --auf-dunkel: #A9B7BB; /* auf #1C2B30 — Kontrast 7.08 */ } [data-welt="pflaume"] { /* Pflaume */ --orange: #6D3E9E; --anthrazit: #292233; --orange-hell: #F0ECF5; --orange-text: #6D3E9E; --auf-akzent: #FFFFFF; --auf-dunkel: #B5AEBF; /* auf #292233 — Kontrast 7.13 */ } [data-welt="gold"] { /* Gold */ --orange: #96780F; --anthrazit: #2E2A20; --orange-hell: #F4F2E7; --orange-text: #866B0D; --auf-akzent: #141002; --auf-dunkel: #BCB7AA; /* auf #2E2A20 — Kontrast 7.15 */ } [data-welt="schiefer"] { /* Schiefer */ --orange: #3E5C76; --anthrazit: #212A32; --orange-hell: #ECEFF1; --orange-text: #3E5C76; --auf-akzent: #FFFFFF; --auf-dunkel: #ADB6BF; /* auf #212A32 — Kontrast 7.09 */ } [data-welt="salbei"] { /* Salbei */ --orange: #4F7A52; --anthrazit: #242B25; --orange-hell: #EDF2EE; --orange-text: #4D7750; --auf-akzent: #FFFFFF; --auf-dunkel: #AAB8AC; /* auf #242B25 — Kontrast 7.02 */ } [data-welt="schwarzweiss"] { /* Schwarz-Weiß */ --orange: #3F3F46; --anthrazit: #18181B; --orange-hell: #ECECEC; --orange-text: #3F3F46; --auf-akzent: #FFFFFF; --auf-dunkel: #A3A3AD; /* auf #18181B — Kontrast 7.09 */ } /* -------------------------------------------------------- dunkel */ @media (prefers-color-scheme: dark) { :root:not([data-theme="hell"])[data-welt="bstools"] { --orange-hell: #392714; --orange-text: #EE7F00; } } :root[data-theme="dunkel"][data-welt="bstools"] { --orange-hell: #392714; --orange-text: #EE7F00; } @media (prefers-color-scheme: dark) { :root:not([data-theme="hell"])[data-welt="marine"] { --orange-hell: #17243A; --orange-text: #4789EF; } } :root[data-theme="dunkel"][data-welt="marine"] { --orange-hell: #17243A; --orange-text: #4789EF; } @media (prefers-color-scheme: dark) { :root:not([data-theme="hell"])[data-welt="bordeaux"] { --orange-hell: #2D151E; --orange-text: #EB4A7C; } } :root[data-theme="dunkel"][data-welt="bordeaux"] { --orange-hell: #2D151E; --orange-text: #EB4A7C; } @media (prefers-color-scheme: dark) { :root:not([data-theme="hell"])[data-welt="wald"] { --orange-hell: #162723; --orange-text: #1B9D6E; } } :root[data-theme="dunkel"][data-welt="wald"] { --orange-hell: #162723; --orange-text: #1B9D6E; } @media (prefers-color-scheme: dark) { :root:not([data-theme="hell"])[data-welt="kupfer"] { --orange-hell: #2F2018; --orange-text: #DE6720; } } :root[data-theme="dunkel"][data-welt="kupfer"] { --orange-hell: #2F2018; --orange-text: #DE6720; } @media (prefers-color-scheme: dark) { :root:not([data-theme="hell"])[data-welt="petrol"] { --orange-hell: #15252B; --orange-text: #1296BA; } } :root[data-theme="dunkel"][data-welt="petrol"] { --orange-hell: #15252B; --orange-text: #1296BA; } @media (prefers-color-scheme: dark) { :root:not([data-theme="hell"])[data-welt="pflaume"] { --orange-hell: #241C2D; --orange-text: #9E74C9; } } :root[data-theme="dunkel"][data-welt="pflaume"] { --orange-hell: #241C2D; --orange-text: #9E74C9; } @media (prefers-color-scheme: dark) { :root:not([data-theme="hell"])[data-welt="gold"] { --orange-hell: #2A2617; --orange-text: #AB8911; } } :root[data-theme="dunkel"][data-welt="gold"] { --orange-hell: #2A2617; --orange-text: #AB8911; } @media (prefers-color-scheme: dark) { :root:not([data-theme="hell"])[data-welt="schiefer"] { --orange-hell: #1C2127; --orange-text: #658CAE; } } :root[data-theme="dunkel"][data-welt="schiefer"] { --orange-hell: #1C2127; --orange-text: #658CAE; } @media (prefers-color-scheme: dark) { :root:not([data-theme="hell"])[data-welt="salbei"] { --orange-hell: #1F2621; --orange-text: #629766; } } :root[data-theme="dunkel"][data-welt="salbei"] { --orange-hell: #1F2621; --orange-text: #629766; } @media (prefers-color-scheme: dark) { :root:not([data-theme="hell"])[data-welt="schwarzweiss"] { --orange-hell: #1D1D1F; --orange-text: #858591; } } :root[data-theme="dunkel"][data-welt="schwarzweiss"] { --orange-hell: #1D1D1F; --orange-text: #858591; }