/* Nur fuer die Abstimmungsphase. Vor dem Launch entfaellt diese Datei. */
[data-thema="blutrot"] {
  --nacht: #08080B; --nacht-2: #0E0E13; --karte: #14141B;
  --rot: #D9202B; --rot-hell: #FF3B44; --glut: #FF9E2C;
  --text: #F3F1EE; --text-dim: #CFCBC6;
  --rot-rgb: 217, 32, 43; --rot-hell-rgb: 255, 59, 68; --glut-rgb: 255, 158, 44; --dritt-rgb: 122, 44, 180;
  --rot-dunkel: #9C171E; --glut-dunkel: #B7711F;
  --linie: rgba(217, 32, 43, .28);
  --glow-rot: 0 0 16px rgba(217, 32, 43, .55), 0 0 44px rgba(217, 32, 43, .22);
  --glow-glut: 0 0 16px rgba(255, 158, 44, .5), 0 0 44px rgba(255, 158, 44, .2);
}

[data-thema="kalte-spur"] {
  --nacht: #06090C; --nacht-2: #0B1016; --karte: #101820;
  --rot: #0E9BB0; --rot-hell: #2FD3E8; --glut: #B6F04A;
  --text: #EFF4F5; --text-dim: #C3CFD3;
  --rot-rgb: 14, 155, 176; --rot-hell-rgb: 47, 211, 232; --glut-rgb: 182, 240, 74; --dritt-rgb: 44, 111, 180;
  --rot-dunkel: #0A6F7E; --glut-dunkel: #83AC35;
  --linie: rgba(14, 155, 176, .28);
  --glow-rot: 0 0 16px rgba(14, 155, 176, .55), 0 0 44px rgba(14, 155, 176, .22);
  --glow-glut: 0 0 16px rgba(182, 240, 74, .5), 0 0 44px rgba(182, 240, 74, .2);
}

[data-thema="nacht-gold"] {
  --nacht: #0A0908; --nacht-2: #100E0B; --karte: #17140F;
  --rot: #B8912F; --rot-hell: #E6C158; --glut: #E8892B;
  --text: #F5F2EA; --text-dim: #D2CCBD;
  --rot-rgb: 184, 145, 47; --rot-hell-rgb: 230, 193, 88; --glut-rgb: 232, 137, 43; --dritt-rgb: 138, 74, 30;
  --rot-dunkel: #846821; --glut-dunkel: #A7621E;
  --linie: rgba(184, 145, 47, .28);
  --glow-rot: 0 0 16px rgba(184, 145, 47, .55), 0 0 44px rgba(184, 145, 47, .22);
  --glow-glut: 0 0 16px rgba(232, 137, 43, .5), 0 0 44px rgba(232, 137, 43, .2);
}

[data-thema="violette-stunde"] {
  --nacht: #08060D; --nacht-2: #0E0A16; --karte: #16101F;
  --rot: #7A2BD6; --rot-hell: #A96BFF; --glut: #FF3BAC;
  --text: #F3EFF7; --text-dim: #CEC6D8;
  --rot-rgb: 122, 43, 214; --rot-hell-rgb: 169, 107, 255; --glut-rgb: 255, 59, 172; --dritt-rgb: 43, 122, 214;
  --rot-dunkel: #571E9A; --glut-dunkel: #B72A7B;
  --linie: rgba(122, 43, 214, .28);
  --glow-rot: 0 0 16px rgba(122, 43, 214, .55), 0 0 44px rgba(122, 43, 214, .22);
  --glow-glut: 0 0 16px rgba(255, 59, 172, .5), 0 0 44px rgba(255, 59, 172, .2);
}

@font-face { font-family: 'Bebas'; font-style: normal; font-weight: 400; font-display: swap; src: url('fonts/bebas-400.woff2') format('woff2'); }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 400; font-display: swap; src: url('fonts/barlow-400.woff2') format('woff2'); }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 500; font-display: swap; src: url('fonts/barlow-500.woff2') format('woff2'); }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 600; font-display: swap; src: url('fonts/barlow-600.woff2') format('woff2'); }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 700; font-display: swap; src: url('fonts/barlow-700.woff2') format('woff2'); }
[data-schrift="bebas"] {
  --head: 'Bebas', 'Haettenschweiler', 'Arial Narrow', sans-serif;
  --body: 'Barlow', 'Segoe UI', Arial, sans-serif;
  --head-lh: 1.05; --head-ls: .02em;
}

@font-face { font-family: 'Anton'; font-style: normal; font-weight: 400; font-display: swap; src: url('fonts/anton-400.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap; src: url('fonts/inter-400.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: swap; src: url('fonts/inter-600.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 700; font-display: swap; src: url('fonts/inter-700.woff2') format('woff2'); }
[data-schrift="anton"] {
  --head: 'Anton', 'Haettenschweiler', 'Arial Narrow', sans-serif;
  --body: 'Inter', 'Segoe UI', Arial, sans-serif;
  --head-lh: 1.06; --head-ls: 0;
}

@font-face { font-family: 'Oswald'; font-style: normal; font-weight: 500; font-display: swap; src: url('fonts/oswald-500.woff2') format('woff2'); }
@font-face { font-family: 'SourceSans'; font-style: normal; font-weight: 400; font-display: swap; src: url('fonts/sourcesans-400.woff2') format('woff2'); }
@font-face { font-family: 'SourceSans'; font-style: normal; font-weight: 600; font-display: swap; src: url('fonts/sourcesans-600.woff2') format('woff2'); }
@font-face { font-family: 'SourceSans'; font-style: normal; font-weight: 700; font-display: swap; src: url('fonts/sourcesans-700.woff2') format('woff2'); }
[data-schrift="oswald"] {
  --head: 'Oswald', 'Haettenschweiler', 'Arial Narrow', sans-serif;
  --body: 'SourceSans', 'Segoe UI', Arial, sans-serif;
  --head-lh: 1.12; --head-ls: .01em;
}

@font-face { font-family: 'ArchivoBlack'; font-style: normal; font-weight: 400; font-display: swap; src: url('fonts/archivoblack-400.woff2') format('woff2'); }
@font-face { font-family: 'Archivo'; font-style: normal; font-weight: 400; font-display: swap; src: url('fonts/archivo-400.woff2') format('woff2'); }
@font-face { font-family: 'Archivo'; font-style: normal; font-weight: 600; font-display: swap; src: url('fonts/archivo-600.woff2') format('woff2'); }
@font-face { font-family: 'Archivo'; font-style: normal; font-weight: 700; font-display: swap; src: url('fonts/archivo-700.woff2') format('woff2'); }
[data-schrift="archivo"] {
  --head: 'ArchivoBlack', 'Haettenschweiler', 'Arial Narrow', sans-serif;
  --body: 'Archivo', 'Segoe UI', Arial, sans-serif;
  --head-lh: 1.1; --head-ls: -.01em;
}


/* Umschalter fuer die Abstimmung – erscheint nur, solange
   VORSCHAU_UMSCHALTER in inhalte.py auf True steht. */
.umschalter { position: fixed; right: 14px; bottom: 14px; z-index: 90; width: 15.5rem;
  background: rgba(10,10,14,.96); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  border: 1px solid rgba(255,255,255,.22); border-radius: 10px; padding: .75rem .8rem .8rem;
  box-shadow: 0 12px 40px rgba(0,0,0,.6); font-family: var(--body); color: var(--text); }
.um-kopf { display: flex; align-items: center; justify-content: space-between; }
.um-kopf p { font-size: .6rem; letter-spacing: .18em; text-transform: uppercase; color: var(--glut); }
.um-zu { background: none; border: 0; color: var(--text-dim); font-size: .85rem; cursor: pointer;
  padding: .1rem .2rem; line-height: 1; }
.um-zu:hover { color: var(--rot-hell); }
.um-titel { margin-top: .7rem; font-size: .58rem; letter-spacing: .16em; text-transform: uppercase;
  color: var(--text-dim); }
.um-farben { display: grid; grid-template-columns: 1fr 1fr; gap: .3rem; margin-top: .35rem; }
.um-farben button { display: flex; align-items: center; gap: .35rem; padding: .3rem .4rem;
  border: 1px solid rgba(255,255,255,.16); border-radius: 5px; background: none; cursor: pointer;
  color: var(--text); font-family: var(--body); font-size: .66rem; text-align: left; line-height: 1.2; }
.um-farben button:hover { border-color: var(--glut); }
.um-farben button[aria-pressed="true"] { border-color: var(--rot-hell); background: rgba(255,255,255,.07); }
.tupf { width: 12px; height: 12px; border-radius: 3px; flex: none; border: 1px solid rgba(255,255,255,.2); }
.um-schriften { display: grid; grid-template-columns: 1fr 1fr; gap: .3rem; margin-top: .35rem; }
.um-schriften button { padding: .3rem .45rem; border: 1px solid rgba(255,255,255,.16); border-radius: 5px;
  background: none; cursor: pointer; text-align: left; color: var(--text); font-family: var(--body); }
.um-schriften button:hover { border-color: var(--glut); }
.um-schriften button[aria-pressed="true"] { border-color: var(--rot-hell); background: rgba(255,255,255,.07); }
.um-schriften b { display: block; font-size: .78rem; font-weight: 400; text-transform: uppercase;
  letter-spacing: .02em; line-height: 1.1; }
.um-schriften span { display: block; font-size: .55rem; color: var(--text-dim); line-height: 1.25; margin-top: .1rem; }
.um-fuss { margin-top: .6rem; font-size: .58rem; line-height: 1.4; color: var(--text-dim); }
.um-auf { position: fixed; right: 14px; bottom: 14px; z-index: 90;
  background: rgba(10,10,14,.96); border: 1px solid rgba(255,255,255,.22); border-radius: 8px;
  color: var(--text); font-family: var(--body); font-size: .62rem; letter-spacing: .16em;
  text-transform: uppercase; padding: .5rem .8rem; cursor: pointer; box-shadow: 0 8px 24px rgba(0,0,0,.5); }
.um-auf:hover { border-color: var(--glut); }
@media (max-width: 720px) {
  .umschalter { right: 8px; left: 8px; width: auto; bottom: calc(3.6rem + env(safe-area-inset-bottom)); }
  .um-auf { bottom: calc(3.6rem + env(safe-area-inset-bottom)); }
}
@media print { .umschalter, .um-auf { display: none; } }