/* Präsentationsbühne: feste 1920×1080-Fläche, wird per transform skaliert. */

/* ---------- Tokens je Beamer-Theme (Standard: Weltraum). Themes setzen sie auf .stage-wrap[data-theme=…] um. ----------
   --st-ink ist „Tinte“ für halbtransparente Flächen und Linien: weiß auf dunklen Themes, schwarz auf hellen. */
.stage-wrap, .screen-full {
  --st-bg: #03030a; --st-ink: #ffffff; --st-text: #f3f5ff; --st-text-soft: #dfe6ff; --st-muted: #c9d2ff; --st-muted-2: #c7cff7;
  --st-accent: #ffd447; --st-accent-soft: #ffe9a6; --st-accent-ink: #1a1400;
  --st-title-grad: linear-gradient(180deg, #fff6c9 0%, #ffd447 45%, #e59b14 100%);
  --st-blue: #8fb4ff; --st-blue-deep: #5b8cff;
  --st-good: #3ddc97; --st-good-bg: #1f6b4d; --st-good-bg-2: #1b4d6b; --st-good-soft: #b5f5d9;
  --st-bad: #ff5d6c; --st-bad-bg: #6b1f2a;
  --st-panel: #0d1030f2; --st-overlay: rgba(3, 3, 10, .87); --st-timer-bg: #00000088;
  --st-board-cat: #1b3a8a; --st-board-a: #1a2d6e; --st-board-b: #101a45; --st-board-line: #2f4aa8;
  --st-font-body: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --st-font-display: var(--st-font-body);
}

.stage-wrap {
  position: relative; width: 100%; height: 100%; overflow: hidden;
  background-color: var(--st-bg); background-size: cover; background-position: center;
}
.stage {
  position: absolute; left: 50%; top: 50%; width: 1920px; height: 1080px;
  transform-origin: center; color: var(--st-text);
  font-family: var(--st-font-body);
}
.preview .stage-wrap { position: absolute; inset: 0; }
.screen-full { position: fixed; inset: 0; background: #000; }
.screen-full.nocursor { cursor: none; }
body.presenting { overflow: hidden; }

.slide { position: absolute; inset: 0; padding: 64px 96px; display: flex; flex-direction: column; }
.slide.enter { animation: slideIn .55s cubic-bezier(.2, .8, .2, 1); }
@keyframes slideIn { from { opacity: 0; transform: scale(1.04); filter: blur(6px); } to { opacity: 1; transform: none; filter: none; } }

.kicker { font-size: 34px; letter-spacing: .3em; text-transform: uppercase; color: var(--st-blue); font-weight: 600; }
.title-big {
  /* Text-Verlauf deckt nur die Box ab: unten Platz für Unterlängen (g, j, p, q, y), sonst werden sie abgeschnitten */
  font-size: 128px; font-weight: 900; margin: 18px 0 calc(18px - .16em); padding-bottom: .16em; letter-spacing: -.01em; line-height: 1.06;
  background: var(--st-title-grad);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 6px 30px color-mix(in srgb, var(--st-accent) 25%, transparent));
}
.subtitle { font-size: 44px; color: var(--st-muted); margin: 0; max-width: 1500px; }
.big-emoji { font-size: 160px; }

/* Titel, Runde, Sammeln */
.slide-title, .slide-round, .slide-end { justify-content: center; align-items: center; text-align: center; }
.title-rounds { margin-top: 60px; display: flex; flex-wrap: wrap; justify-content: center; gap: 14px 22px; max-width: 1600px; }
.title-rounds span { font-size: 28px; padding: 8px 22px; border: 1px solid color-mix(in srgb, var(--st-ink) 19%, transparent); border-radius: 40px; background: color-mix(in srgb, var(--st-ink) 5%, transparent); }
.round-meta { margin-top: 50px; display: flex; gap: 16px; flex-wrap: wrap; justify-content: center; max-width: 1600px; }
.round-meta span { font-size: 28px; padding: 8px 22px; border-radius: 40px; background: color-mix(in srgb, var(--st-ink) 7%, transparent); border: 1px solid color-mix(in srgb, var(--st-ink) 15%, transparent); }
.round-meta .type-chip { color: var(--st-accent-soft); }
.round-meta + .round-types { margin-top: 18px; }
.joker-hint { margin-top: 26px; font-size: 30px; font-weight: 700; color: var(--st-accent); animation: jokerPulse 2.4s ease-in-out infinite; }
.joker-hint[hidden] { display: none; }
@keyframes jokerPulse { 50% { opacity: .55; } }
.round-meta .type-chip { font-size: 24px; }

/* Lauftext-Intro */
.slide-prelude { justify-content: center; align-items: center; }
.slide-prelude p { color: #4bd5ee; font-size: 64px; max-width: 1300px; line-height: 1.35; animation: prelude 6s ease forwards; text-align: left; }
@keyframes prelude { 0% { opacity: 0; } 15%, 80% { opacity: 1; } 100% { opacity: 1; } }
.slide-crawl { padding: 0; overflow: hidden; }
.crawl-fade { position: absolute; inset: 0 0 auto 0; height: 360px; background: linear-gradient(#000 10%, transparent); z-index: 2; pointer-events: none; }
.crawl-tilt { position: absolute; top: 0; left: 50%; width: 1500px; height: 1080px; margin-left: -750px; transform-origin: 50% 100%; transform: perspective(480px) rotateX(24deg); }
.crawl-text { position: absolute; top: 100%; width: 100%; color: var(--st-accent); font-size: 60px; font-weight: 700; text-align: justify; line-height: 1.35; animation: crawl 75s linear forwards; }
.crawl-text h1 { text-align: center; font-size: 120px; margin: 0 0 60px; text-transform: uppercase; }
.crawl-episode { text-align: center; font-size: 80px; }
.crawl-text p { margin: 0 0 70px; }
.slide-prelude p, .crawl-text p { white-space: pre-line; } /* Enter im Editor = Zeilenumbruch */
@keyframes crawl { from { top: 100%; } to { top: -420%; } }

/* Frage-Folie */
.slide-question { gap: 22px; }
.q-header { display: flex; align-items: center; gap: 24px; font-size: 28px; color: var(--st-muted); }
.q-num { font-weight: 600; letter-spacing: .04em; }
.q-type { flex: 1; color: var(--st-muted-2); }
.q-points { background: var(--st-accent); color: var(--st-accent-ink); font-weight: 800; border-radius: 30px; padding: 4px 22px; }
.is-reveal .q-num { color: var(--st-good); }
.q-prompt { font-size: 66px; font-weight: 750; margin: 0; line-height: 1.15; text-wrap: balance; }
.q-prompt.compact { font-size: 52px; }
.q-prompt.long { font-size: 42px; }
.is-reveal .q-prompt { font-size: 40px; color: var(--st-muted); font-weight: 600; }

/* Reine Textfragen: Frage (und Lösung) vertikal zentriert */
.slide-question.text-only > .q-body { display: none; }
.slide-question.text-only > .q-prompt { margin-top: auto; }
.slide-question.text-only > :last-child { margin-bottom: auto; }
.slide-question.text-only:not(.is-reveal) .q-prompt { font-size: 84px; white-space: pre-line; }
.slide-question.text-only.is-reveal .answer-box { margin-top: 30px; }
.q-prompt { white-space: pre-line; }
.q-body { flex: 1; min-height: 0; display: flex; gap: 40px; }
.q-body.layout-text { flex-direction: column; justify-content: center; }
.q-body.layout-media { flex-direction: column; }
.q-body.layout-split > .q-media { flex: 1.25; }
.q-side { flex: 1; display: flex; flex-direction: column; justify-content: center; min-width: 0; }
.q-media { position: relative; flex: 1; min-height: 0; }
.q-media.missing { display: grid; place-items: center; border: 4px dashed color-mix(in srgb, var(--st-ink) 25%, transparent); border-radius: 24px; font-size: 44px; color: color-mix(in srgb, var(--st-ink) 50%, transparent); }

.img-wrap { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; overflow: hidden; border-radius: 18px; }
.img-wrap img, .img-wrap canvas {
  display: block; max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 12px;
  transition: transform .9s cubic-bezier(.2, .8, .2, 1), filter .9s, clip-path .9s;
  box-shadow: 0 20px 60px #000a;
}
.slide.enter .img-wrap img { transition: none; }

/* Auswahl-Antworten */
.choices { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.q-side .choices { grid-template-columns: 1fr; }
.choice { display: flex; align-items: center; gap: 24px; font-size: 44px; padding: 22px 30px; border-radius: 20px; background: color-mix(in srgb, var(--st-ink) 6%, transparent); border: 2px solid color-mix(in srgb, var(--st-ink) 15%, transparent); transition: all .5s; }
.choice .letter { flex-shrink: 0; }
.choices.tf .choice { justify-content: center; font-size: 60px; padding: 34px; }
.choice.correct { background: var(--st-good-bg); border-color: var(--st-good); box-shadow: 0 0 50px color-mix(in srgb, var(--st-good) 40%, transparent); transform: scale(1.02); }
.choice.wrong { opacity: .3; }
.letter {
  display: inline-grid; place-items: center; min-width: 64px; height: 64px; padding: 0 10px; border-radius: 16px;
  background: var(--st-accent); color: var(--st-accent-ink); font-weight: 900; font-size: 36px;
}
.letter.alt { background: var(--st-blue); color: #0b1640; }

/* Sortieren / Zuordnen / Hinweise */
.order-list { display: flex; flex-direction: column; gap: 16px; margin: 0; padding: 0; list-style: none; }
.order-list > * { display: flex; align-items: center; gap: 24px; font-size: 42px; padding: 14px 26px; background: color-mix(in srgb, var(--st-ink) 6%, transparent); border-radius: 18px; }
.order-list.solved > li { border: 2px solid color-mix(in srgb, var(--st-good) 60%, transparent); }
.match-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; }
.match-item { display: flex; align-items: center; gap: 20px; font-size: 38px; padding: 12px 22px; margin-bottom: 14px; background: color-mix(in srgb, var(--st-ink) 6%, transparent); border-radius: 16px; }
.match-solved { display: flex; flex-direction: column; gap: 14px; }
.match-solved .pair { display: flex; align-items: center; gap: 22px; font-size: 38px; padding: 12px 24px; background: color-mix(in srgb, var(--st-ink) 6%, transparent); border: 2px solid color-mix(in srgb, var(--st-good) 60%, transparent); border-radius: 16px; }
.match-solved .arrow { color: var(--st-good); }
.match-solved .pair .letter:last-child { margin-left: auto; }

/* Sortieren/Zuordnen mit Bildern/Tönen */
.elem-img { display: block; border-radius: 12px; object-fit: contain; max-width: 100%; }
.elem-sound { font-size: 54px; line-height: 1; }
.elem.playing { box-shadow: 0 0 0 5px var(--st-accent), 0 0 40px color-mix(in srgb, var(--st-accent) 40%, transparent); background: color-mix(in srgb, var(--st-accent) 13%, transparent); }
.elem.playing .elem-sound { animation: pulse .6s ease-in-out infinite alternate; }
@keyframes pulse { to { transform: scale(1.25); } }
.order-list.has-media { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 20px; }
.order-list.has-media > * { position: relative; flex-direction: column; justify-content: center; gap: 12px; padding: 18px; text-align: center; font-size: 34px; }
.order-list.has-media .letter { position: absolute; top: 12px; left: 12px; z-index: 1; }
.order-list.has-media .elem-img { height: 300px; }
.order-list.has-media:is(.n5, .n6) .elem-img { height: 210px; }
.order-list.has-media:is(.n7, .n8, .n9, .n10) .elem-img { height: 140px; }
.order-list.has-media:is(.n7, .n8, .n9, .n10) > * { font-size: 28px; padding: 12px; }
.match-grid.has-media .match-item, .match-solved.has-media .pair { padding: 8px 18px; margin-bottom: 10px; }
.match-solved.has-media { gap: 6px; }
.has-media .elem { display: flex; align-items: center; gap: 16px; border-radius: 14px; }
.match-grid.has-media .elem-img, .match-solved.has-media .elem-img { height: 170px; }
:is(.match-grid, .match-solved).has-media.n4 .elem-img { height: 128px; }
:is(.match-grid, .match-solved).has-media.n5 .elem-img { height: 100px; }
:is(.match-grid, .match-solved).has-media:is(.n6, .n7, .n8, .n9, .n10) .elem-img { height: 76px; }
:is(.match-grid, .match-solved).has-media:is(.n6, .n7, .n8, .n9, .n10) .elem { font-size: 30px; }
.clues { display: flex; flex-direction: column; gap: 18px; }
.clue { display: flex; align-items: center; gap: 26px; font-size: 44px; padding: 18px 28px; border-radius: 18px; background: color-mix(in srgb, var(--st-ink) 3%, transparent); color: color-mix(in srgb, var(--st-ink) 25%, transparent); border: 2px dashed color-mix(in srgb, var(--st-ink) 15%, transparent); }
.clue.shown { color: var(--st-text); background: color-mix(in srgb, var(--st-ink) 8%, transparent); border-style: solid; animation: clueIn .6s ease; }
@keyframes clueIn { from { opacity: 0; transform: translateX(-30px); } }
.estimate-hint { font-size: 40px; color: var(--st-muted); padding: 24px 32px; border-radius: 20px; border: 2px dashed color-mix(in srgb, var(--st-blue) 50%, transparent); align-self: flex-start; }

/* Lösung */
.answer-box {
  display: flex; align-items: center; gap: 30px; font-size: 64px; font-weight: 800;
  padding: 22px 40px; border-radius: 24px; background: linear-gradient(90deg, var(--st-good-bg), var(--st-good-bg-2));
  border: 2px solid var(--st-good); box-shadow: 0 0 60px color-mix(in srgb, var(--st-good) 33%, transparent); animation: pop .6s cubic-bezier(.2, 1.4, .4, 1);
}
.answer-label { font-size: 26px; text-transform: uppercase; letter-spacing: .2em; color: var(--st-good-soft); font-weight: 700; }
@keyframes pop { from { transform: scale(.8); opacity: 0; } }
.info-box { font-size: 32px; color: var(--st-text-soft); background: color-mix(in srgb, var(--st-ink) 6%, transparent); border-left: 6px solid var(--st-blue); padding: 16px 26px; border-radius: 12px; }

/* Player */
.player { position: absolute; inset: 0; display: flex; flex-direction: column; gap: 18px; }
.video-box { flex: 1; min-height: 0; position: relative; }
.video-box video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; border-radius: 14px; background: #000; cursor: pointer; }
.player.is-audio video, .player.is-audio audio { display: none; }
.audio-visual { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 40px; border-radius: 24px; background: radial-gradient(circle, color-mix(in srgb, var(--st-ink) 7%, transparent), transparent 70%); }
.audio-icon { font-size: 170px; filter: drop-shadow(0 0 40px color-mix(in srgb, var(--st-blue) 53%, transparent)); }
.player.playing .audio-icon { animation: pulse 1.2s ease-in-out infinite; }
@keyframes pulse { 50% { transform: scale(1.08); } }
.eq { display: flex; gap: 10px; height: 120px; align-items: center; }
.eq span { width: 16px; height: 20%; background: linear-gradient(var(--st-accent), #ff7a3d); border-radius: 8px; }
.player.playing .eq span { animation: eq .9s ease-in-out infinite alternate; }
@keyframes eq { 0% { height: 15%; } 50% { height: 95%; } 100% { height: 35%; } }
.player-controls { display: flex; align-items: center; gap: 22px; font-size: 28px; color: var(--st-muted); }
.player-btn { width: 72px; height: 72px; border-radius: 50%; border: none; background: var(--st-accent); color: var(--st-accent-ink); font-size: 30px; cursor: pointer; flex-shrink: 0; }
.player-progress { flex: 1; height: 12px; background: color-mix(in srgb, var(--st-ink) 13%, transparent); border-radius: 6px; overflow: hidden; }
.player-progress .bar { height: 100%; width: 0; background: var(--st-accent); transition: width .2s linear; }
.player-time { font-variant-numeric: tabular-nums; }
.player-flags { background: color-mix(in srgb, var(--st-ink) 8%, transparent); padding: 4px 16px; border-radius: 20px; font-size: 24px; }

/* Punktestand */
.slide-scores { align-items: center; }
.slide-scores h1 { font-size: 90px; margin: 8px 0 30px; }
.score-list { width: 1500px; display: flex; flex-direction: column; gap: 14px; }
.score-row { display: grid; grid-template-columns: 90px 420px 1fr 140px; align-items: center; gap: 20px; font-size: 40px; animation: rowIn .6s both; }
.score-list.dense .score-row { font-size: 28px; gap: 14px; }
.score-list.dense { gap: 6px; }
@keyframes rowIn { from { opacity: 0; transform: translateY(20px); } }
.score-row .rank { color: var(--st-accent); font-weight: 800; text-align: right; }
.score-row .team { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bar-track { height: 34px; background: color-mix(in srgb, var(--st-ink) 7%, transparent); border-radius: 17px; overflow: hidden; }
.score-list.dense .bar-track { height: 20px; }
.bar-track .bar { height: 100%; background: linear-gradient(90deg, var(--st-blue-deep), var(--st-accent)); border-radius: 17px; animation: grow 1.2s cubic-bezier(.2, .8, .2, 1) both; transform-origin: left; }
@keyframes grow { from { transform: scaleX(0); } }
.score-row .pts { font-weight: 800; text-align: right; font-variant-numeric: tabular-nums; }

/* Finale */
.slide-end .title-big { font-size: 96px; }
.podiums { display: flex; align-items: flex-end; gap: 30px; margin-top: 30px; }
.podium { width: 380px; display: flex; flex-direction: column; align-items: center; gap: 8px; animation: rowIn .8s both; }
.podium.p1 { animation-delay: 1.4s; } .podium.p2 { animation-delay: .8s; } .podium.p3 { animation-delay: .3s; }
.pod-name { font-size: 44px; font-weight: 800; text-align: center; }
.pod-pts { font-size: 32px; color: var(--st-muted); }
.pod-block { width: 100%; display: grid; place-items: center; font-size: 110px; font-weight: 900; color: var(--st-accent-ink); border-radius: 18px 18px 0 0; }
.p1 .pod-block { height: 300px; background: linear-gradient(#fff3b0, var(--st-accent)); }
.p2 .pod-block { height: 220px; background: linear-gradient(#f2f4ff, #b9c2dd); }
.p3 .pod-block { height: 160px; background: linear-gradient(#ffd2a8, #cd8a4f); }
.podium.empty { visibility: hidden; }
.slide-end .rest { margin-top: 24px; display: flex; flex-wrap: wrap; gap: 12px 30px; justify-content: center; font-size: 28px; color: var(--st-muted); max-width: 1600px; }
.slide-empty { justify-content: center; align-items: center; font-size: 50px; color: color-mix(in srgb, var(--st-ink) 31%, transparent); }

/* Timer, Schwarzbild, Ton-Freigabe */
.timer {
  position: absolute; top: 40px; right: 50px; width: 150px; height: 150px; border-radius: 50%; overflow: hidden; z-index: 5;
  background: var(--st-timer-bg); border: 5px solid var(--st-accent); display: grid; place-items: center; box-shadow: 0 0 40px #0009;
}
.timer .timer-fill { position: absolute; left: 0; right: 0; bottom: 0; background: color-mix(in srgb, var(--st-accent) 33%, transparent); transition: height .2s linear; }
.timer span { position: relative; font-size: 60px; font-weight: 900; font-variant-numeric: tabular-nums; }
.timer.urgent { border-color: var(--st-bad); animation: pulse .5s ease-in-out infinite; }
.timer.urgent .timer-fill { background: color-mix(in srgb, var(--st-bad) 40%, transparent); }
.timer.done { border-color: var(--st-bad); background: var(--st-bad); }
.blank { position: absolute; inset: 0; background: #000; opacity: 0; pointer-events: none; transition: opacity .4s; z-index: 10; }
.blank.on { opacity: 1; }
.unlock { position: absolute; left: 50%; bottom: 30px; transform: translateX(-50%); z-index: 20; cursor: pointer; }
.unlock > div { display: flex; flex-direction: column; align-items: center; gap: 4px; background: #000c; color: var(--st-text); border: 1px solid var(--st-accent); padding: 14px 26px; border-radius: 14px; font-size: 16px; }
.unlock span { color: #aab; font-size: 13px; }
.slide-question.text-only:not(.is-reveal) > .q-prompt { margin-bottom: auto; }
.stage.has-timer .q-header { padding-right: 150px; }
.clue-text { flex: 1; }
.clue-pts { font-size: 28px; font-weight: 800; color: var(--st-accent); opacity: .45; white-space: nowrap; }
.clue.current { border-color: var(--st-accent); box-shadow: 0 0 30px color-mix(in srgb, var(--st-accent) 20%, transparent); }
.clue.current .clue-pts { opacity: 1; }

/* ---------- Rundenformen ---------- */
.twist-text { color: var(--st-accent-soft); font-weight: 600; }
.mode-badge.twist-badge { border-style: dashed; }
.mode-badge { margin-top: 24px; font-size: 34px; font-weight: 700; color: var(--st-accent); padding: 8px 28px; border: 2px solid color-mix(in srgb, var(--st-accent) 40%, transparent); border-radius: 40px; }
.slide-tiebreak .tie-teams { font-size: 56px; font-weight: 800; color: var(--st-accent); }

/* Jeopardy-Brett */
.slide-board { align-items: stretch; }
.slide-board .kicker { text-align: center; margin-bottom: 26px; }
.board { flex: 1; display: grid; gap: 14px; grid-auto-rows: 1fr; }
.board-cat { display: flex; align-items: center; justify-content: center; text-align: center; font-size: 36px; font-weight: 800; padding: 12px; border-radius: 14px; background: var(--st-board-cat); border: 2px solid var(--st-blue-deep); text-transform: uppercase; letter-spacing: .03em; line-height: 1.1; }
.board-cell { display: flex; align-items: center; justify-content: center; font-size: 84px; font-weight: 900; color: var(--st-accent); border-radius: 14px; background: linear-gradient(160deg, var(--st-board-a), var(--st-board-b)); border: 2px solid var(--st-board-line); text-shadow: 0 4px 0 #0008; transition: all .5s; }
.board-cell.played { background: color-mix(in srgb, var(--st-ink) 2%, transparent); border-color: color-mix(in srgb, var(--st-ink) 7%, transparent); color: transparent; text-shadow: none; }
.board-cell.empty { background: none; border: 2px dashed color-mix(in srgb, var(--st-ink) 6%, transparent); }

/* Passt nicht! */
.choices.type-oddone .choice.correct { background: #6b1f3a; border-color: #ff5d8c; box-shadow: 0 0 50px #ff5d8c66; }
.choices.type-oddone .choice.wrong { opacity: .55; }

/* Bilder-Kombi */
.combo { display: flex; align-items: center; justify-content: center; gap: 40px; flex-wrap: wrap; }
.combo-part { min-width: 300px; height: 380px; display: flex; align-items: center; justify-content: center; padding: 20px; border-radius: 24px; background: color-mix(in srgb, var(--st-ink) 6%, transparent); border: 2px solid color-mix(in srgb, var(--st-ink) 15%, transparent); }
.combo-part img { max-width: 520px; max-height: 340px; border-radius: 12px; object-fit: contain; }
.combo-text { font-size: 150px; line-height: 1.1; text-align: center; }
.combo-plus { font-size: 110px; font-weight: 900; color: var(--st-accent); }
.combo.connect { gap: 30px; }
/* 4 Bilder als 2 × 2, damit sie groß bleiben */
.combo.connect.n4 { display: grid; grid-template-columns: repeat(2, auto); justify-content: center; gap: 24px 40px; }
.combo.connect.n4 .combo-part { min-width: 0; width: 700px; height: 340px; padding: 14px; }
.combo.connect.n4 .combo-part img { max-width: 670px; max-height: 312px; }
.combo.connect.n4 .combo-text { font-size: 110px; }
.is-reveal .combo.connect.n4 .combo-part { height: 290px; }
.is-reveal .combo.connect.n4 .combo-part img { max-height: 262px; }
.combo-part.hidden-part { border-style: dashed; background: color-mix(in srgb, var(--st-ink) 3%, transparent); }
.combo-part.hidden-part .combo-text { color: color-mix(in srgb, var(--st-ink) 25%, transparent); }
.combo-part.new-part { animation: clueIn .6s ease; }
.combo-solution { margin: 34px auto 0; width: fit-content; max-width: 1500px; padding: 18px 50px; font-size: 64px; font-weight: 800; text-align: center; border-radius: 20px; background: var(--st-good-bg); border: 2px solid var(--st-good); box-shadow: 0 0 50px color-mix(in srgb, var(--st-good) 27%, transparent); animation: clueIn .6s ease; }
.answer-box.long { font-size: 40px; }
.layout-text .combo, .layout-text .gap-text, .layout-text .stages { margin-top: 30px; }

/* Lückentext */
.gap-text { margin: 0 auto; max-width: 1500px; font-size: 64px; line-height: 1.6; font-style: italic; text-align: center; }
.gap-text .gap { display: inline-block; border-bottom: 5px solid var(--st-accent); margin: 0 6px; font-style: normal; color: var(--st-accent); font-weight: 800; text-align: center; line-height: 1.1; }
.gap-text.solved .gap { background: var(--st-good-bg); border-color: var(--st-good); color: var(--st-text); border-radius: 10px 10px 0 0; padding: 0 14px; animation: clueIn .6s ease; }
.gap-text footer { margin-top: 30px; font-size: 36px; font-style: normal; color: var(--st-muted); }

/* Musik-Intro: Stufen */
.stages { display: flex; justify-content: center; gap: 22px; margin-top: 24px; }
.stage-chip { display: flex; flex-direction: column; align-items: center; gap: 6px; min-width: 200px; padding: 18px 30px; border-radius: 18px; background: color-mix(in srgb, var(--st-ink) 3%, transparent); border: 2px dashed color-mix(in srgb, var(--st-ink) 15%, transparent); color: color-mix(in srgb, var(--st-ink) 31%, transparent); }
.stage-chip.shown { color: var(--st-text); background: color-mix(in srgb, var(--st-ink) 8%, transparent); border-style: solid; }
.stage-chip.current { border-color: var(--st-accent); box-shadow: 0 0 30px color-mix(in srgb, var(--st-accent) 20%, transparent); }
.stage-chip.current .clue-pts { opacity: 1; }
.stage-secs { font-size: 48px; font-weight: 800; }

/* Text weiterführen */
.lyric { margin: 0; font-size: 58px; line-height: 1.4; font-style: italic; color: var(--st-text-soft); }
.lyric mark { background: var(--st-good-bg); color: var(--st-text); font-style: normal; font-weight: 800; padding: 0 14px; border-radius: 10px; border-bottom: 5px solid var(--st-good); animation: clueIn .6s ease; }
.layout-text .lyric { text-align: center; margin-top: 30px; }

/* Mashup */
.mash-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 18px; }
.mash-list li { display: flex; align-items: center; gap: 26px; font-size: 44px; padding: 18px 28px; border-radius: 18px; background: color-mix(in srgb, var(--st-ink) 6%, transparent); border: 2px solid color-mix(in srgb, var(--st-ink) 15%, transparent); }
.mash-list .clue-pts { margin-left: auto; opacity: 1; }
.mash-list:not(.solved) .mash-answer { color: color-mix(in srgb, var(--st-ink) 44%, transparent); }
.mash-list.solved li { border-color: color-mix(in srgb, var(--st-good) 60%, transparent); animation: clueIn .6s ease; }
.mash-list.solved .mash-answer { font-weight: 800; }

/* Handy-Spiel: QR-Code (klein auf der Titelfolie, groß mit Taste Q) */
.qr-overlay { position: absolute; inset: 0; pointer-events: none; z-index: 5; display: none; }
.qr-overlay.corner, .qr-overlay.full { display: block; }
.qr-overlay.full { background: var(--st-overlay); display: flex; align-items: center; justify-content: center; animation: slideIn .4s; }
.qr-box { display: flex; align-items: center; gap: 40px; background: var(--st-panel); border: 2px solid color-mix(in srgb, var(--st-ink) 19%, transparent); border-radius: 28px; padding: 28px 40px; color: var(--st-text); }
.qr-svg svg { display: block; width: 100%; height: 100%; border-radius: 12px; }
.qr-overlay.corner .qr-box { position: absolute; right: 48px; bottom: 48px; gap: 24px; padding: 18px 24px; }
.qr-overlay.corner .qr-svg { width: 200px; height: 200px; }
.qr-overlay.corner .qr-title { font-size: 30px; }
.qr-overlay.corner .qr-url { font-size: 20px; }
.qr-overlay.corner .qr-code { font-size: 30px; }
.qr-overlay.full .qr-box { flex-direction: column; gap: 30px; padding: 50px 70px; text-align: center; }
.qr-overlay.full .qr-svg { width: 560px; height: 560px; }
.qr-overlay.full .qr-title { font-size: 64px; }
.qr-overlay.full .qr-url { font-size: 34px; }
.qr-overlay.full .qr-code { font-size: 56px; }
.qr-title { font-weight: 800; }
.qr-url { color: var(--st-blue); margin: 4px 0 8px; }
.qr-code strong { color: var(--st-accent); letter-spacing: .12em; }

/* Buzzer-Duell über der Stechfrage */
/* Antwortstand (Handy-Spiel): Pille unten in der Mitte, ein Punkt je Handy-Team (gefüllt = geantwortet) */
.live-overlay { position: absolute; left: 50%; bottom: 34px; transform: translateX(-50%); z-index: 4; display: none; align-items: center; gap: 20px; padding: 10px 28px;
  border-radius: 999px; background: color-mix(in srgb, var(--st-ink) 10%, transparent); border: 1px solid color-mix(in srgb, var(--st-ink) 18%, transparent);
  color: var(--st-text-soft); font-size: 26px; font-weight: 600; white-space: nowrap; pointer-events: none; animation: slideIn .3s; max-width: 90%; }
.live-overlay.on { display: flex; }
.live-dots { display: flex; gap: 8px; flex-wrap: wrap; max-width: 560px; }
.live-dots i { width: 16px; height: 16px; border-radius: 50%; border: 3px solid var(--st-accent); box-sizing: border-box; opacity: .5; }
.live-dots i.done { background: var(--st-accent); opacity: 1; }
.buzz-overlay { position: absolute; left: 0; right: 0; bottom: 0; z-index: 4; display: none; justify-content: center; padding: 0 96px 60px; pointer-events: none; }
.buzz-overlay.on { display: flex; }
.buzz-panel {
  min-width: 900px; max-width: 1500px; background: var(--st-panel); border: 2px solid color-mix(in srgb, var(--st-bad) 53%, transparent); border-radius: 28px; padding: 26px 44px;
  display: flex; flex-direction: column; align-items: center; gap: 14px; box-shadow: 0 20px 80px #000a;
}
.buzz-panel.enter { animation: slideIn .4s; }
.stage.duel-on .slide { padding-bottom: 470px; transition: padding .4s; }
.stage.duel-on .q-prompt { font-size: 64px; }
.buzz-head { display: flex; gap: 30px; align-items: baseline; font-size: 40px; }
.buzz-title { color: #ff8a95; font-weight: 900; }
.buzz-teams em { color: var(--st-blue); font-style: normal; }
.buzz-count { font-size: 150px; font-weight: 900; line-height: 1; color: var(--st-accent); }
.buzz-go { font-size: 110px; font-weight: 900; color: #ff3b4f; letter-spacing: .05em; }
.buzz-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; min-width: 760px; }
.buzz-list li { display: flex; align-items: center; gap: 24px; font-size: 44px; padding: 8px 26px; border-radius: 16px; background: color-mix(in srgb, var(--st-ink) 6%, transparent); }
.buzz-list li span { flex: 1; font-weight: 700; }
.buzz-list li small { font-size: 32px; color: var(--st-blue); }
.buzz-list li.turn { background: color-mix(in srgb, var(--st-accent) 20%, transparent); outline: 3px solid var(--st-accent); }
.buzz-list li.out { opacity: .45; text-decoration: line-through; }
.buzz-list li.won { background: color-mix(in srgb, var(--st-good) 20%, transparent); outline: 3px solid var(--st-good); }
.buzz-result { font-size: 54px; font-weight: 900; color: var(--st-accent); }
.buzz-warn { font-size: 28px; color: #ffb547; }

/* Beamer-Gerät (#/beamer): Code zum Koppeln, Hinweis bei Verbindungsproblemen */
.beamer-pair { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; padding: 4vw;
  background: radial-gradient(circle at 50% 40%, #1d2350 0%, #07081a 75%); color: #e9ecff; font-family: system-ui, sans-serif; }
.beamer-pair-box { display: flex; align-items: center; gap: 5vw; max-width: 1400px; }
.beamer-pair .qr-svg { width: min(34vw, 46vh); aspect-ratio: 1; flex: none; background: #fff; border-radius: 16px; padding: 10px; }
.beamer-pair .kicker { font-size: clamp(16px, 2.2vw, 34px); }
.beamer-code { font-size: clamp(54px, 10vw, 170px); font-weight: 900; letter-spacing: .12em; color: var(--st-accent); line-height: 1.1; margin: 1vh 0 2vh; font-variant-numeric: tabular-nums; }
.beamer-pair p { font-size: clamp(15px, 1.6vw, 26px); color: var(--st-muted); margin: 0 0 .5em; }
.beamer-net { position: absolute; top: 14px; left: 50%; transform: translateX(-50%); z-index: 30; background: #ffb547; color: var(--st-accent-ink); font: 600 16px system-ui, sans-serif; padding: 6px 16px; border-radius: 20px; }
@media (max-aspect-ratio: 1/1) { .beamer-pair-box { flex-direction: column; text-align: center; } }

/* ===== Show-Intros (Titelfolie) und Rundenfolien im selben Stil ===== */
.slide-show { padding: 0; overflow: hidden; align-items: center; justify-content: center; text-align: center; }
.slide-show > *, .round-styled > * { position: relative; z-index: 1; }
@keyframes fadeUp { from { opacity: 0; transform: translateY(40px); } to { opacity: 1; transform: none; } }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes blink { 50% { opacity: 0; } }

/* --- Breaking News --- */
.show-news { background: linear-gradient(160deg, #0b1d4d 0%, #071233 55%, #2a0710 100%); }
.show-news::before { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(90deg, #ffffff05 0 2px, transparent 2px 120px), radial-gradient(circle at 75% 30%, #1e4bb455, transparent 60%); }
.news-bug { position: absolute !important; top: 50px; right: 70px; display: flex; align-items: center; gap: 18px; font-size: 40px; font-weight: 900; letter-spacing: .05em; color: #fff; padding: 10px 22px; background: #c8102e; border-radius: 6px; }
.news-live { font-size: 26px; padding: 4px 12px; background: #fff; color: #c8102e; border-radius: 4px; animation: blink 1.6s step-end infinite; }
.news-flash { position: absolute !important; left: 0; top: 150px; width: 100%; height: 150px; background: #c8102e; display: flex; align-items: center; box-shadow: 0 10px 50px #c8102e66; animation: newsSweep .7s cubic-bezier(.2, .9, .2, 1) both, newsFlashOut .6s ease 2.6s forwards; }
.news-flash span { padding-left: 120px; font-size: 110px; font-weight: 900; letter-spacing: .08em; color: #fff; animation: blink .5s step-end 0.7s 4; }
@keyframes newsSweep { from { transform: translateX(-100%); } }
@keyframes newsFlashOut { to { transform: translateY(-260px) scaleY(.5); opacity: 0; } }
.news-flash.small { top: 130px; height: 100px; animation: newsSweep .6s cubic-bezier(.2, .9, .2, 1) both; }
.news-flash.small span { font-size: 64px; padding-left: 96px; }
.news-head { position: absolute !important; left: 120px; right: 120px; top: 170px; text-align: left; animation: fadeUp .8s ease 2.9s both; }
.news-head-title { display: inline-block; font-size: 104px; font-weight: 900; line-height: 1.05; padding: 14px 34px; background: #fff; color: #0b1d4d; box-shadow: 14px 14px 0 #c8102e; }
.news-head-sub { margin-top: 34px; display: inline-block; font-size: 44px; font-weight: 700; padding: 8px 26px; background: #0b1d4d; color: #fff; border-left: 10px solid #c8102e; }
.news-topics { position: absolute !important; left: 120px; right: 120px; top: 560px; text-align: left; display: flex; flex-wrap: wrap; gap: 14px 18px; align-items: center; }
.news-topics-label { width: 100%; font-size: 30px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: #8fb4ff; animation: fadeIn .5s ease 3.2s both; }
.news-topic { font-size: 32px; padding: 10px 22px; background: #ffffff14; border-left: 6px solid #c8102e; animation: fadeUp .5s ease both; }
.news-topic b { margin-right: 12px; color: #ff6b81; }
.news-ticker { position: absolute !important; left: 0; right: 0; bottom: 0; height: 90px; display: flex; align-items: stretch; background: #f2f2f2; color: #0b1d4d; font-size: 40px; font-weight: 700; }
.news-ticker-label { flex: none; display: flex; align-items: center; padding: 0 34px; background: #c8102e; color: #fff; font-weight: 900; letter-spacing: .1em; z-index: 1; }
.news-ticker-track { flex: 1; overflow: hidden; display: flex; align-items: center; white-space: nowrap; }
.news-ticker-track span { padding-left: 100%; animation: ticker 28s linear infinite; }
@keyframes ticker { to { transform: translateX(-100%); } }
.news-standby { animation: fadeIn 1s ease both; }
.news-standby-kicker { display: inline-block; font-size: 46px; font-weight: 900; letter-spacing: .15em; color: #fff; padding: 8px 30px; background: #c8102e; text-transform: uppercase; }
.news-standby-title { margin-top: 40px; font-size: 110px; font-weight: 900; color: #fff; text-shadow: 0 8px 40px #000a; }
.round-styled.show-news .kicker { margin-top: 120px; color: #ff9aa9; }

/* --- Kino-Vorspann --- */
.show-cinema { background: radial-gradient(ellipse at 50% 55%, #1a1408 0%, #000 70%); }
.cin-bar { position: absolute !important; left: 0; right: 0; height: 110px; background: #000; z-index: 3 !important; }
.cin-bar.top { top: 0; } .cin-bar.bottom { bottom: 0; }
.cin-tagline { position: absolute !important; inset: 0; display: flex; align-items: center; justify-content: center; padding: 0 200px; font-size: 64px; font-weight: 300; font-style: italic; letter-spacing: .04em; color: #e8dcc0; animation: cinTag 3.1s ease both; }
@keyframes cinTag { 0% { opacity: 0; } 25%, 80% { opacity: 1; } 100% { opacity: 0; } }
.cin-title { margin: 0; font-size: 150px; font-weight: 900; text-transform: uppercase; letter-spacing: .12em; line-height: 1;
  background: linear-gradient(180deg, #fff8e1 0%, #e7c66b 45%, #8a6418 100%); -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 0 40px #e7c66b55); animation: cinTitle 5s cubic-bezier(.1, .7, .2, 1) 3s both; }
@keyframes cinTitle { from { opacity: 0; transform: scale(1.35); letter-spacing: .5em; filter: blur(12px); } 30% { opacity: 1; filter: none; } to { transform: scale(1); } }
.cin-sub { margin-top: 30px; font-size: 44px; letter-spacing: .3em; text-transform: uppercase; color: #cbb98c; animation: fadeIn 1.2s ease 6s both; }
.cin-credits { margin-top: 60px; display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 46px; max-width: 1500px; }
.cin-credits span { font-size: 28px; letter-spacing: .25em; text-transform: uppercase; color: #a89a78; animation: fadeIn 1s ease both; }
.cin-standby { animation: fadeIn 1.2s ease both; }
.cin-rating { display: inline-block; font-size: 26px; letter-spacing: .2em; text-transform: uppercase; color: #3ddc97; border: 3px solid #3ddc97; padding: 10px 28px; border-radius: 6px; }
.cin-standby-title { margin-top: 50px; font-size: 96px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #e8dcc0; }
.cin-standby-hint { margin-top: 30px; font-size: 36px; letter-spacing: .3em; text-transform: uppercase; color: #8a7d5c; animation: blink 2.4s ease infinite; }
.round-styled.show-cinema .kicker { color: #e7c66b; letter-spacing: .5em; }
.round-styled.show-cinema .title-big { text-transform: uppercase; letter-spacing: .08em; animation: cinTitle 2.6s cubic-bezier(.1, .7, .2, 1) both; }

/* --- Gameshow --- */
.show-gameshow { background: radial-gradient(ellipse at 50% 110%, #ff3d9a 0%, #5a0e7a 35%, #1a0633 75%); }
.gs-lights { position: absolute !important; inset: 22px; border-radius: 30px; pointer-events: none;
  border: 18px solid transparent; background: radial-gradient(circle, #ffe066 0 7px, transparent 8px) -11px -11px / 40px 40px border-box;
  -webkit-mask: linear-gradient(#000 0 0) padding-box exclude, linear-gradient(#000 0 0); mask: linear-gradient(#000 0 0) padding-box exclude, linear-gradient(#000 0 0);
  filter: drop-shadow(0 0 10px #ffe066); animation: gsChase .4s steps(2) infinite; }
@keyframes gsChase { to { background-position: 9px 9px; } }
.gs-spot { position: absolute !important; top: -200px; width: 500px; height: 1400px; background: linear-gradient(180deg, #fff6, transparent 80%); filter: blur(30px); transform-origin: top center; opacity: .45; }
.gs-spot.l { left: 300px; animation: gsSwing 4s ease-in-out infinite alternate; }
.gs-spot.r { right: 300px; animation: gsSwing 4s ease-in-out -2s infinite alternate-reverse; }
@keyframes gsSwing { from { transform: rotate(25deg); } to { transform: rotate(-25deg); } }
.gs-curtain { position: absolute !important; top: 0; bottom: 0; width: 51%; z-index: 4 !important;
  background: repeating-linear-gradient(90deg, #8e0d1f 0 40px, #b5162c 40px 70px, #7a0a1a 70px 100px); box-shadow: inset 0 -80px 120px #0008; }
.gs-curtain.l { left: 0; } .gs-curtain.r { right: 0; }
.live .gs-curtain.l { animation: gsOpenL 1.4s cubic-bezier(.6, 0, .3, 1) 1s forwards; }
.live .gs-curtain.r { animation: gsOpenR 1.4s cubic-bezier(.6, 0, .3, 1) 1s forwards; }
@keyframes gsOpenL { to { transform: translateX(-100%); } }
@keyframes gsOpenR { to { transform: translateX(100%); } }
.gs-standby { position: absolute !important; z-index: 5 !important; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 30px; font-size: 110px; font-weight: 900; color: #ffe066; text-shadow: 0 6px 0 #7a0a1a, 0 0 40px #ffe06688; }
.gs-standby small { font-size: 46px; color: #fff; text-shadow: 0 4px 20px #000; }
.gs-title { margin: 0; font-size: 140px; font-weight: 900; line-height: 1; color: #ffe066; text-shadow: 0 8px 0 #c2185b, 0 14px 0 #5a0e7a, 0 0 60px #ffe06699; transform: rotate(-3deg); animation: gsPop .9s cubic-bezier(.2, 1.6, .4, 1) 1.9s both; }
@keyframes gsPop { from { transform: rotate(-3deg) scale(0); } }
.gs-line { margin-top: 50px; font-size: 46px; font-weight: 700; color: #fff; animation: fadeUp .6s ease 2.6s both; }
.gs-rounds { margin-top: 50px; display: flex; flex-wrap: wrap; justify-content: center; gap: 16px; max-width: 1600px; }
.gs-tile { font-size: 30px; font-weight: 800; padding: 12px 26px; border-radius: 16px; color: #fff; box-shadow: 0 6px 0 #0005; animation: gsPopTile .5s cubic-bezier(.2, 1.6, .4, 1) both; }
.gs-tile b { margin-right: 10px; }
@keyframes gsPopTile { from { transform: scale(0); } }
.gs-tile.c0 { background: #e91e63; } .gs-tile.c1 { background: #2196f3; } .gs-tile.c2 { background: #ff9800; }
.gs-tile.c3 { background: #4caf50; } .gs-tile.c4 { background: #9c27b0; } .gs-tile.c5 { background: #00bcd4; }
.round-styled.show-gameshow .kicker { font-size: 54px; font-weight: 900; letter-spacing: .05em; color: #ffe066; text-shadow: 0 4px 0 #c2185b; text-transform: none; animation: gsPop .7s cubic-bezier(.2, 1.6, .4, 1) both; }

/* --- Retro-Arcade --- */
.show-arcade { background: #05010f; font-family: "Press Start 2P", ui-monospace, "Courier New", monospace; text-transform: uppercase; }
.show-arcade::before { content: ''; position: absolute; inset: 0; background: linear-gradient(#ff2fd61a 2px, transparent 2px) 0 0 / 60px 60px, linear-gradient(90deg, #ff2fd61a 2px, transparent 2px) 0 0 / 60px 60px; transform: perspective(500px) rotateX(55deg) translateY(35%) scale(2); transform-origin: bottom; }
.arc-scan { position: absolute !important; inset: 0; z-index: 5 !important; pointer-events: none; background: repeating-linear-gradient(0deg, #0006 0 3px, transparent 3px 6px); }
.arc-standby-title, .arc-title { color: #00f0ff; text-shadow: 6px 6px 0 #ff2fd6, 0 0 30px #00f0ff88; font-weight: 900; letter-spacing: .08em; }
.arc-coin { font-size: 80px; font-weight: 900; color: #ffe600; text-shadow: 5px 5px 0 #ff2fd6; animation: blink 1s step-end infinite; }
.arc-standby-title { margin-top: 60px; font-size: 72px; }
.arc-hint { margin-top: 60px; font-size: 32px; color: #9bff6a; animation: blink 1.4s step-end infinite; }
.arc-ready { position: absolute !important; top: 46%; left: 0; right: 0; font-size: 90px; font-weight: 900; color: #9bff6a; text-shadow: 5px 5px 0 #0a5; animation: arcReady 1.6s step-end both; }
@keyframes arcReady { 0%, 20%, 40%, 60% { opacity: 1; } 10%, 30%, 50% { opacity: 0; } 99% { opacity: 1; } 100% { opacity: 0; } }
.arc-title { margin: 0; font-size: 110px; line-height: 1.1; animation: arcDrop 1s steps(6) 1.6s both; }
@keyframes arcDrop { from { transform: translateY(-700px); } }
.arc-line { margin-top: 40px; font-size: 38px; color: #ffe600; animation: fadeIn .1s steps(1) 2.6s both; }
.arc-levels { margin-top: 50px; display: flex; flex-direction: column; gap: 14px; align-items: flex-start; font-size: 32px; color: #fff; }
.arc-levels div { animation: fadeIn .1s steps(1) both; }
.arc-levels b { display: inline-block; min-width: 260px; text-align: left; color: #ff2fd6; }
.arc-go { margin-top: 40px; font-size: 44px; color: #9bff6a; animation: fadeIn .1s steps(1) 5s both, blink .8s step-end 5s infinite; }
.round-styled.show-arcade .kicker { font-size: 90px; font-weight: 900; color: #ffe600; letter-spacing: .1em; text-shadow: 6px 6px 0 #ff2fd6; animation: arcDrop .6s steps(4) both; }
.round-styled.show-arcade .title-big { font-family: inherit; background: none; color: #00f0ff; -webkit-text-fill-color: #00f0ff; text-shadow: 6px 6px 0 #ff2fd6; filter: none; font-size: 96px; }

/* Rundenfolien im Stil: eigener Hintergrund statt Sternenhimmel */
.round-styled { overflow: hidden; }
.round-styled.show-news .title-big { background: none; -webkit-background-clip: border-box; background-clip: border-box; -webkit-text-fill-color: #0b1d4d; color: #0b1d4d; filter: none; padding: 10px 40px; background-color: #fff; box-shadow: 14px 14px 0 #c8102e; animation: fadeUp .6s ease .5s both; }

/* ===== Welche Seite? / Zwei Wahrheiten, eine Lüge / Wer würde gewinnen? ===== */
.sides { display: grid; grid-template-columns: 1fr 1fr; gap: 26px 22px; }
.side { --side: color-mix(in srgb, var(--st-ink) 25%, transparent); position: relative; display: flex; align-items: center; justify-content: center; gap: 22px; font-size: 54px; font-weight: 800; padding: 26px 30px; border-radius: 22px; background: color-mix(in srgb, var(--st-ink) 6%, transparent); border: 3px solid var(--side); transition: all .5s; }
.side.s0 { --side: #3d8bff; background: linear-gradient(135deg, #3d8bff40, #3d8bff0d); }
.side.s1 { --side: #ffc531; background: linear-gradient(225deg, #ffc53140, #ffc5310d); }
.side.s2 { --side: var(--st-good); }
.side.s3 { --side: #ff5dc8; }
.sides.n4 .side.s2, .sides.n4 .side.s3 { font-size: 40px; padding: 18px 24px; }
.side-icon { font-size: 1.3em; }
.side.correct { background: color-mix(in srgb, var(--side) 45%, transparent); box-shadow: 0 0 60px var(--side); transform: scale(1.04); }
.side.wrong { opacity: .28; }
.q-side .sides { gap: 20px 16px; }
.q-side .side { font-size: 38px; padding: 18px; }
.votes { position: absolute; right: 18px; top: -18px; font-size: 24px; font-weight: 700; background: var(--st-panel); border: 2px solid color-mix(in srgb, var(--st-ink) 25%, transparent); border-radius: 20px; padding: 2px 14px; color: var(--st-muted); white-space: nowrap; }

.lies { display: flex; flex-direction: column; gap: 24px; }
.lie { position: relative; display: flex; align-items: center; gap: 26px; font-size: 44px; padding: 24px 30px; border-radius: 20px; background: color-mix(in srgb, var(--st-ink) 6%, transparent); border: 2px solid color-mix(in srgb, var(--st-ink) 15%, transparent); transition: all .5s; }
.lie-body { flex: 1; }
.lie-note { font-size: 28px; color: var(--st-muted); margin-top: 8px; }
.lie.hidden-part { border-style: dashed; background: color-mix(in srgb, var(--st-ink) 2%, transparent); }
.lie.hidden-part .lie-text { color: color-mix(in srgb, var(--st-ink) 25%, transparent); }
.lie.new-part { animation: clueIn .6s ease; }
.lie.is-true { border-color: color-mix(in srgb, var(--st-good) 53%, transparent); background: color-mix(in srgb, var(--st-good-bg) 33%, transparent); }
.lie.is-lie { border-color: var(--st-bad); background: color-mix(in srgb, var(--st-bad-bg) 53%, transparent); box-shadow: 0 0 50px color-mix(in srgb, var(--st-bad) 33%, transparent); }
.lie.is-lie .lie-text { text-decoration: line-through; text-decoration-thickness: 5px; text-decoration-color: var(--st-bad); }
.lie-stamp { flex-shrink: 0; font-size: 34px; font-weight: 900; letter-spacing: .12em; padding: 6px 18px; border: 5px solid; border-radius: 10px; transform: rotate(-8deg); animation: stamp .45s cubic-bezier(.2, 1.6, .4, 1) both; }
.is-lie .lie-stamp { color: var(--st-bad); font-size: 44px; animation-delay: .6s; }
.is-true .lie-stamp { color: var(--st-good); opacity: .8; }
@keyframes stamp { from { transform: rotate(-8deg) scale(3); opacity: 0; } }
.lie .votes { right: 200px; }

.versus { display: flex; align-items: stretch; justify-content: center; gap: 30px; padding-top: 40px; }
.fighter { position: relative; flex: 1; max-width: 720px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 20px; padding: 30px; border-radius: 24px; background: color-mix(in srgb, var(--st-ink) 6%, transparent); border: 3px solid color-mix(in srgb, var(--st-ink) 19%, transparent); transition: all .6s; }
.fighter:first-child { border-color: #3d8bff; background: linear-gradient(135deg, #3d8bff33, #3d8bff08); }
.fighter:last-child { border-color: var(--st-bad); background: linear-gradient(225deg, color-mix(in srgb, var(--st-bad) 20%, transparent), color-mix(in srgb, var(--st-bad) 3%, transparent)); }
.fighter img { max-width: 100%; max-height: 400px; border-radius: 14px; object-fit: contain; }
.fighter-name { font-size: 60px; font-weight: 900; text-align: center; line-height: 1.1; }
.versus.n3 .fighter-name, .versus.n4 .fighter-name { font-size: 42px; }
.vs { align-self: center; font-size: 90px; font-weight: 900; font-style: italic; color: var(--st-bad); text-shadow: 0 0 30px color-mix(in srgb, var(--st-bad) 53%, transparent); animation: pulse 1.2s ease-in-out infinite; }
.versus.solved .vs { animation: none; opacity: .4; }
.fighter.winner { border-color: var(--st-accent); box-shadow: 0 0 60px color-mix(in srgb, var(--st-accent) 53%, transparent); transform: scale(1.04); }
.fighter.loser { opacity: .45; }
.crown { position: absolute; top: -78px; font-size: 90px; animation: pop .6s .3s both; }
.fighter-bar { position: relative; width: 100%; height: 48px; border-radius: 24px; background: color-mix(in srgb, var(--st-ink) 8%, transparent); overflow: hidden; }
.fighter-bar .fill { height: 100%; background: linear-gradient(90deg, var(--st-blue-deep), var(--st-accent)); transform-origin: left; animation: grow 1.2s cubic-bezier(.2, .8, .2, 1) both; }
.fighter-bar span { position: absolute; inset: 0; display: grid; place-items: center; font-size: 26px; font-weight: 800; text-shadow: 0 2px 6px #000; }
.poll-verdict { margin-top: 34px; text-align: center; font-size: 48px; font-weight: 800; color: var(--st-accent); animation: fadeUp .6s .5s both; }

/* ===== Tauziehen der Lager ===== */
.tug { display: grid; grid-template-columns: 320px 1fr 320px; align-items: center; gap: 24px; width: 1500px; margin: 0 auto 24px; }
.tug.small { width: 1300px; margin-top: 56px; margin-bottom: 0; }
.tug.big { width: 1650px; margin-top: 40px; }
.tug-camp { display: flex; flex-direction: column; align-items: center; gap: 2px; color: var(--camp); text-align: center; }
.tug-icon { font-size: 54px; line-height: 1.1; }
.tug-name { font-size: 34px; font-weight: 800; }
.tug-avg { font-size: 22px; color: var(--st-muted); }
.tug-camp.lead .tug-icon { animation: pulse 1s ease-in-out infinite; }
.tug-rope { position: relative; height: 18px; border-radius: 9px; background: linear-gradient(90deg, var(--a), var(--b)); }
.tug-rope::before { content: ''; position: absolute; inset: 0; border-radius: 9px; background: repeating-linear-gradient(60deg, #0004 0 6px, transparent 6px 14px); }
.tug-mid { position: absolute; left: 50%; top: -26px; bottom: -26px; width: 4px; margin-left: -2px; background: color-mix(in srgb, var(--st-ink) 53%, transparent); border-radius: 2px; }
.tug-knot { position: absolute; top: 50%; width: 46px; height: 46px; margin: -23px 0 0 -23px; border-radius: 50%; background: #fff; border: 7px solid #e8344a; box-shadow: 0 0 24px color-mix(in srgb, var(--st-ink) 53%, transparent); animation: tugIn 1.8s cubic-bezier(.3, 1.4, .4, 1) .3s both; }
@keyframes tugIn { from { left: 50%; } }
.tug.big .tug-icon { font-size: 90px; }
.tug.big .tug-name { font-size: 48px; }
.tug.big .tug-avg { font-size: 30px; }
.tug.big .tug-rope { height: 26px; }
.slide-scores:has(.tug) h1 { font-size: 64px; margin: 0 0 18px; }
.slide-camp-win .camp-win-icon { font-size: 180px; line-height: 1.1; animation: pop .8s both; }
.slide-camp-win .title-big { background: none; color: var(--camp, var(--st-accent)); -webkit-text-fill-color: var(--camp, var(--st-accent)); filter: drop-shadow(0 0 40px var(--camp, var(--st-accent))); animation: fadeUp .7s .3s both; }

/* --- Logbuch (Bordcomputer) --- */
.show-logbook { background: #000; font-family: "Antonio", "Arial Narrow", "Roboto Condensed", system-ui, sans-serif; color: #ff9c33; }
.lcars { position: absolute !important; inset: 0; z-index: 0 !important; pointer-events: none; }
.lcars-elbow { position: absolute; left: 40px; top: 40px; width: 130px; height: 118px; background: #ff9c33; border-radius: 64px 0 0 0; }
.lcars-top { position: absolute; left: 180px; right: 40px; top: 40px; height: 48px; display: flex; gap: 10px; }
.lcars-top .c1 { flex: 3; background: #ff9c33; }
.lcars-top .c2 { flex: 1; background: #cc99ff; }
.lcars-top .c3 { flex: 2; background: #9999ff; border-radius: 0 24px 24px 0; color: #000; font-size: 26px; font-weight: 700; letter-spacing: .12em; display: flex; align-items: center; justify-content: flex-end; padding-right: 26px; }
.lcars-side { position: absolute; left: 40px; top: 168px; bottom: 40px; width: 130px; display: flex; flex-direction: column; gap: 10px; }
.lcars-side .c1 { flex: 1; background: #ff9c33; border-radius: 0 0 0 40px; }
.lcars-side .c2 { flex: 2; background: #cc99ff; }
.lcars-side .c3 { flex: 1; background: #ff7744; }
.log-live, .log-standby { position: absolute; left: 250px; right: 110px; top: 130px; bottom: 50px; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; text-align: left; }
.log-entry { font-size: 50px; line-height: 1.35; color: #ffcc99; max-width: 1450px; }
.log-char { animation: fadeIn .01s linear both; }
.log-cursor { display: inline-block; width: 26px; height: 50px; background: #ff9c33; vertical-align: -6px; margin-left: 8px; animation: fadeIn .01s both, blink .8s step-end infinite; }
.log-title { margin: 36px 0 0; font-size: 108px; line-height: 1.05; color: #ff9c33; text-transform: uppercase; letter-spacing: .03em; animation: fadeUp .6s both; }
.log-sub { font-size: 40px; color: #cc99ff; animation: fadeIn .6s both; }
.log-course { margin-top: 34px; display: flex; flex-wrap: wrap; gap: 14px 18px; align-items: center; animation: fadeIn .4s both; }
.log-course-label { width: 100%; font-size: 28px; letter-spacing: .3em; text-transform: uppercase; color: #9999ff; }
.log-stop { font-size: 30px; color: #000; background: #ff9c33; padding: 8px 28px 8px 18px; border-radius: 0 30px 30px 0; animation: fadeIn .3s both; }
.log-stop:nth-child(odd) { background: #cc99ff; }
.log-stop b { margin-right: 14px; }
.log-blink { font-size: 36px; letter-spacing: .3em; text-transform: uppercase; color: #9999ff; animation: blink 1.4s step-end infinite; }
.log-standby-title { margin: 30px 0; font-size: 120px; line-height: 1.05; color: #ff9c33; text-transform: uppercase; }
.log-hint { font-size: 32px; color: #ffcc99; }
.round-styled.show-logbook { background: #000; padding-left: 250px; }
.round-styled.show-logbook .kicker { color: #9999ff; animation: fadeIn .4s both; }
.round-styled.show-logbook .title-big { font-family: inherit; background: none; color: #ff9c33; -webkit-text-fill-color: #ff9c33; filter: none; text-transform: uppercase; letter-spacing: .03em; animation: fadeUp .6s .3s both; }
.round-styled.show-logbook .subtitle { color: #ffcc99; }

/* ---------- Übergang vor einer Runde: ⚡ Störung / 🌀 Wurmloch ---------- */
.slide-transition { padding: 0; overflow: hidden; justify-content: center; align-items: center; text-align: center; }
.slide-transition.glitch { background: #05060f; animation: glitchShake .5s steps(8) infinite; }
@keyframes glitchShake { 0%, 100% { transform: none; } 25% { transform: translate(-6px, 3px); } 50% { transform: translate(4px, -5px); } 75% { transform: translate(7px, 2px); } }
.glitch-noise { position: absolute; inset: -50%; opacity: .35; pointer-events: none;
  background: repeating-radial-gradient(circle at 30% 40%, #ffffff22 0 1px, transparent 1px 3px), repeating-linear-gradient(0deg, #ffffff10 0 1px, transparent 1px 4px);
  animation: glitchNoise .25s steps(4) infinite; }
@keyframes glitchNoise { to { transform: translate(-4%, 3%); } }
.glitch-bars { position: absolute; inset: 0; pointer-events: none; }
.glitch-bars span { position: absolute; left: 0; right: 0; height: 40px; background: #00e5ff; mix-blend-mode: screen; opacity: .7; animation: glitchBar 1.1s steps(6) infinite; }
.glitch-bars .b0 { top: 8%; height: 18px; background: #ff2fd6; animation-duration: .9s; }
.glitch-bars .b1 { top: 22%; height: 60px; animation-duration: 1.3s; animation-delay: .2s; }
.glitch-bars .b2 { top: 37%; height: 10px; background: #fff; animation-duration: .7s; }
.glitch-bars .b3 { top: 55%; height: 90px; background: #ff2fd6; opacity: .4; animation-duration: 1.5s; animation-delay: .4s; }
.glitch-bars .b4 { top: 68%; height: 26px; animation-duration: 1s; animation-delay: .1s; }
.glitch-bars .b5 { top: 81%; height: 14px; background: #ffd447; animation-duration: .8s; }
.glitch-bars .b6 { top: 92%; height: 48px; animation-duration: 1.2s; animation-delay: .3s; }
@keyframes glitchBar { 0% { transform: translateX(-6%); } 20% { transform: translateX(5%); opacity: .2; } 40% { transform: translateX(-2%) scaleY(.4); } 60% { transform: translateX(8%); } 80% { transform: translateX(-9%); opacity: .9; } 100% { transform: translateX(3%); } }
.glitch-text { position: relative; font-size: 130px; font-weight: 900; letter-spacing: .06em; color: #fff; text-transform: uppercase; animation: glitchFlicker 2s steps(10) infinite; }
.glitch-text::before, .glitch-text::after { content: attr(data-text); position: absolute; inset: 0; }
.glitch-text::before { color: #ff2fd6; clip-path: inset(10% 0 60% 0); animation: glitchShift .7s steps(5) infinite; }
.glitch-text::after { color: #00e5ff; clip-path: inset(55% 0 5% 0); animation: glitchShift .9s steps(7) infinite reverse; }
@keyframes glitchShift { 0% { transform: translate(-14px, 2px); } 25% { transform: translate(10px, -4px); } 50% { transform: translate(-6px, 6px); } 75% { transform: translate(12px, 0); } 100% { transform: translate(-10px, -3px); } }
@keyframes glitchFlicker { 0%, 100% { opacity: 1; } 10% { opacity: .3; } 20% { opacity: 1; } 35% { opacity: .5; } 60% { opacity: 1; } 75% { opacity: .2; } 80% { opacity: 1; } }
.glitch-sub { position: relative; margin-top: 30px; font-size: 36px; letter-spacing: .3em; text-transform: uppercase; color: #9fb2ea; font-family: ui-monospace, "Courier New", monospace; animation: blink 1s step-end infinite; }
.glitch-scan { position: absolute; inset: 0; background: repeating-linear-gradient(0deg, transparent 0 3px, #00000066 3px 5px); pointer-events: none; }

.slide-transition.wormhole { background: #000; }
.worm-rings { position: absolute; left: 50%; top: 50%; width: 1800px; height: 1800px; margin: -900px 0 0 -900px; border-radius: 50%; opacity: .9; filter: blur(1px);
  background: repeating-conic-gradient(from 0deg, #3d8bff 0 6deg, #0a1a4d 6deg 14deg, #8fd8ff 14deg 16deg, #000 16deg 30deg);
  -webkit-mask: radial-gradient(circle, #000 10%, transparent 70%); mask: radial-gradient(circle, #000 10%, transparent 70%);
  animation: wormSpin 6s linear infinite, wormPulse 3s ease-in-out infinite alternate; }
@keyframes wormSpin { to { rotate: 360deg; } }
@keyframes wormPulse { from { scale: .8; } to { scale: 1.15; } }
.worm-core { position: absolute; left: 50%; top: 50%; width: 500px; height: 500px; margin: -250px; border-radius: 50%;
  background: radial-gradient(circle, #fff 0%, #bfe6ff 25%, #3d8bff66 55%, transparent 72%); animation: wormCore 1.6s ease-in-out infinite alternate; }
@keyframes wormCore { from { transform: scale(.7); } to { transform: scale(1.1); } }
.worm-text { position: relative; font-family: "Antonio", "Arial Narrow", "Roboto Condensed", system-ui, sans-serif; font-size: 120px; text-transform: uppercase; letter-spacing: .08em; color: #ff9c33; text-shadow: 0 0 40px #000, 0 0 12px #000; animation: fadeUp .8s 2.2s both; }
.worm-sub { position: relative; margin-top: 20px; font-size: 40px; letter-spacing: .3em; text-transform: uppercase; color: #ffd447; text-shadow: 0 0 20px #000; animation: fadeIn .8s 3s both; }
.crawl-short .crawl-text { animation-duration: 45s; }

/* ---------- Eigener Look einer Runde: Logbuch auch auf Frage-, Sammel- und Punktefolien ---------- */
.look-styled.show-logbook { background: #000; padding: 120px 96px 64px 250px; color: #ffcc99; overflow: hidden; }
.look-styled.show-logbook > :not(.lcars) { position: relative; z-index: 1; }
.look-styled.show-logbook .q-header, .look-styled.show-logbook .kicker { color: #9999ff; }
.look-styled.show-logbook .q-prompt { color: #ff9c33; }
.look-styled.show-logbook h1, .look-styled.show-logbook .title-big { font-family: inherit; background: none; -webkit-background-clip: border-box; background-clip: border-box; -webkit-text-fill-color: #ff9c33; color: #ff9c33; filter: none; text-transform: uppercase; letter-spacing: .03em; }
.look-styled.show-logbook .subtitle { color: #ffcc99; }
.look-styled.show-logbook .score-row .rank { color: #ff9c33; }
.look-styled.show-logbook .score-row .bar { background: linear-gradient(90deg, #cc99ff, #ff9c33); }
.look-styled.show-logbook .info-box { border-left-color: #ff9c33; }
.look-styled.show-logbook .lcars-top .c3 { font-size: 22px; }
.look-styled.show-logbook .q-points { background: #ff9c33; color: #000; }

/* Tipp-Verteilung bei Auswahlfragen; „auch richtig“ in der Lösung; Auswahl neben einem Bild */
.choice { position: relative; }
.choice .votes { position: static; margin-left: auto; font-size: 26px; background: color-mix(in srgb, var(--st-ink) 9%, transparent); border-color: color-mix(in srgb, var(--st-ink) 19%, transparent); }
.choice.correct .votes { background: var(--st-good-bg); border-color: var(--st-good); color: var(--st-good-soft); }
.choice .choice-text { min-width: 0; }
.answer-accept { display: block; font-size: 30px; font-weight: 500; color: var(--st-muted); margin-top: 6px; }
.q-side .choices { grid-template-columns: 1fr; gap: 14px; }
.q-side .choice { font-size: 34px; padding: 14px 22px; }
.q-side .choices.tf .choice { font-size: 44px; padding: 20px; }
.q-side .choice .votes { font-size: 22px; }
.q-body.layout-split > .q-side { flex: 1.15; }

/* Geheimwort bei der Auflösung */
.secret-box { font-size: 34px; color: var(--st-accent-soft); background: color-mix(in srgb, var(--st-accent) 9%, transparent); border: 2px dashed color-mix(in srgb, var(--st-accent) 40%, transparent); border-radius: 14px; padding: 12px 24px; animation: pop .5s .4s both; }
.secret-hits { color: var(--st-good); font-weight: 700; }
.secret-hits.none { color: var(--st-muted); font-weight: 500; }

/* Übersetzte Songtexte / Schlecht erklärt */
.say-lines { display: flex; flex-direction: column; gap: 22px; justify-content: center; flex: 1; }
.say-line { font-size: 54px; line-height: 1.3; padding: 18px 30px; border-radius: 18px; border: 2px dashed color-mix(in srgb, var(--st-ink) 15%, transparent); color: color-mix(in srgb, var(--st-ink) 25%, transparent); background: color-mix(in srgb, var(--st-ink) 2%, transparent); }
.say-line.shown { color: var(--st-text); background: color-mix(in srgb, var(--st-ink) 6%, transparent); border-style: solid; border-color: color-mix(in srgb, var(--st-ink) 19%, transparent); }
.say-lines.translated .say-line.shown { font-style: italic; }
.say-lines.n1 .say-line { font-size: 64px; }
.say-line.new-part { animation: clueIn .6s ease; }
.q-side .say-line { font-size: 40px; }
.cat-chip { align-self: flex-start; font-size: 34px; font-weight: 700; padding: 6px 24px; border-radius: 30px; background: color-mix(in srgb, var(--st-accent) 13%, transparent); border: 2px solid color-mix(in srgb, var(--st-accent) 40%, transparent); color: var(--st-accent-soft); }

/* Überschriften: Zeilenumbruch aus dem Editor übernehmen; zu lange Wörter verkleinert fitHeadings() */
.title-big, .log-title, .crawl-text h1, .worm-text { white-space: pre-line; hyphens: manual; max-width: 100%; }
.squeezed { overflow-wrap: anywhere; }

/* Regeln vor der ersten „Wer/Was bin ich?“-Frage */
.slide-howto h1 { font-size: 96px; margin: 10px 0 30px; }
.howto-list { text-align: left; font-size: 40px; line-height: 1.4; max-width: 1400px; margin: 0 0 40px; padding-left: 1.4em; color: var(--st-text-soft); }
.howto-list li { margin: 6px 0; }
.howto-points { display: flex; gap: 28px; justify-content: center; }
.howto-step { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 18px 34px; border-radius: 18px; background: color-mix(in srgb, var(--st-ink) 6%, transparent); border: 2px solid color-mix(in srgb, var(--st-accent) 40%, transparent); font-size: 30px; color: var(--st-muted); }
.howto-step strong { font-size: 52px; color: var(--st-accent); }
.correct-box { margin-top: 18px; font-size: 34px; color: var(--st-good-soft); background: color-mix(in srgb, var(--st-good) 8%, transparent); border: 2px solid color-mix(in srgb, var(--st-good) 33%, transparent); border-radius: 16px; padding: 12px 24px; max-width: 1600px; }
.correct-box b { color: var(--st-good); }

/* Punktestand über der Folie (Taste P) */
.board-overlay { position: absolute; inset: 0; z-index: 6; display: none; pointer-events: none; }
.board-overlay.on { display: flex; align-items: center; justify-content: center; background: var(--st-overlay); }
.board-card { width: min(1500px, 90%); display: flex; flex-direction: column; align-items: center; gap: 10px; }
.board-card.enter { animation: slideIn .4s; }
.board-card h1 { font-size: 80px; margin: 0 0 20px; }
.board-card .score-list { width: 100%; }

/* Beamer: Vorlade-Anzeige unten links, dezent */
.preload-badge { position: absolute; left: 14px; top: 12px; z-index: 20; font: 600 13px system-ui, sans-serif; color: var(--st-muted); background: #0c0e1ccc;
  border: 1px solid #2a3160; border-radius: 20px; padding: 4px 12px; pointer-events: none; transition: opacity .6s; }
.preload-badge.gone { opacity: 0; }

/* ===== Beamer-Themes (quiz.theme) – nur Tokens und wenige Formregeln; Weltraum = Standardwerte oben ===== */
@font-face { font-family: "Patrick Hand"; src: url(../fonts/patrick-hand.woff2) format("woff2"); font-weight: 400; font-display: swap; }
:is(.stage-wrap, .slide)[data-theme="space"] { --st-font-display: "Sora", var(--st-font-body); }
.slide-foot { position: absolute; left: 96px; right: 96px; bottom: 0; height: 0; pointer-events: none; } /* Platz für Logo/Sponsor (11b) */

/* --- Kreidetafel --- */
:is(.stage-wrap, .slide)[data-theme="chalk"] {
  --st-bg: #27493e; --st-ink: #ffffff; --st-text: #f3efe3; --st-text-soft: #e6e2d6; --st-muted: #cfd8c9; --st-muted-2: #dfe6da;
  --st-accent: #f1c56b; --st-accent-soft: #f7dca3; --st-accent-ink: #2a2410;
  --st-title-grad: linear-gradient(180deg, #fff5d6, #f1c56b 70%);
  --st-blue: #9fd3e8; --st-blue-deep: #6fb6d6;
  --st-good: #a8e6a1; --st-good-bg: #2f6b3f; --st-good-bg-2: #2f5f6b; --st-good-soft: #dff5dc;
  --st-bad: #f08a8a; --st-bad-bg: #6b2f2f;
  --st-panel: #1d3a30f2; --st-overlay: rgba(29, 58, 48, .9); --st-timer-bg: #00000066;
  --st-board-cat: #3b6b5c; --st-board-a: #345c4f; --st-board-b: #27493e; --st-board-line: #9fd3e8;
  --st-font-body: "Source Sans 3", "Segoe UI", system-ui, sans-serif; --st-font-display: "Patrick Hand", "Comic Sans MS", cursive;
}
:is(.stage-wrap, .slide)[data-theme="chalk"] .title-big { filter: none; letter-spacing: .01em; font-weight: 400; }
:is(.stage-wrap, .slide)[data-theme="chalk"] .q-prompt { font-weight: 400; }
:is(.stage-wrap, .slide)[data-theme="chalk"] :is(.choice, .clue, .order-list > *, .match-item, .match-solved .pair, .combo-part, .side, .lie, .mash-list li, .say-line, .stage-chip, .round-meta span, .title-rounds span, .answer-box, .info-box, .estimate-hint, .howto-step, .fighter) {
  border-style: dashed; border-radius: 12px 18px 10px 16px / 16px 10px 18px 12px; box-shadow: none;
}
:is(.stage-wrap, .slide)[data-theme="chalk"] .answer-box { background: color-mix(in srgb, var(--st-good) 22%, transparent); border-style: solid; }
:is(.stage-wrap, .slide)[data-theme="chalk"] .bar-track .bar, :is(.stage-wrap, .slide)[data-theme="chalk"] .fighter-bar .fill { background: var(--st-accent); }

/* --- Gameshow --- */
:is(.stage-wrap, .slide)[data-theme="gameshow"] {
  --st-bg: #2a0a44; --st-ink: #ffffff; --st-text: #ffffff; --st-text-soft: #ffe3f1; --st-muted: #ffd6ea; --st-muted-2: #ffc2e0;
  --st-accent: #ffe066; --st-accent-soft: #fff2b3; --st-accent-ink: #3a2a00;
  --st-title-grad: linear-gradient(180deg, #fff8c4 0%, #ffe066 55%, #f2b705 100%);
  --st-blue: #4dd0e1; --st-blue-deep: #26c6da;
  --st-good: #69f0ae; --st-good-bg: #1b6b47; --st-good-bg-2: #1b5a6b; --st-good-soft: #c8ffe4;
  --st-bad: #ff5c8a; --st-bad-bg: #7a1f3d;
  --st-panel: #3a0e5cf2; --st-overlay: rgba(42, 10, 68, .88); --st-timer-bg: #00000088;
  --st-board-cat: #7b1fa2; --st-board-a: #6a1b9a; --st-board-b: #4a148c; --st-board-line: #ce93d8;
  --st-font-body: "Public Sans", "Segoe UI", system-ui, sans-serif; --st-font-display: "Archivo", "Arial Black", system-ui, sans-serif;
}
:is(.stage-wrap, .slide)[data-theme="gameshow"] .title-big { text-transform: uppercase; letter-spacing: .02em; filter: drop-shadow(0 6px 0 #c2185b) drop-shadow(0 0 30px #ffe06655); }
:is(.stage-wrap, .slide)[data-theme="gameshow"] .q-prompt, :is(.stage-wrap, .slide)[data-theme="gameshow"] .slide-scores h1, :is(.stage-wrap, .slide)[data-theme="gameshow"] .kicker { text-transform: uppercase; letter-spacing: .02em; }
:is(.stage-wrap, .slide)[data-theme="gameshow"] :is(.choice, .clue, .order-list > *, .match-item, .side, .lie, .mash-list li, .say-line, .stage-chip, .combo-part) { border-width: 4px; box-shadow: 0 6px 0 #0004; }
:is(.stage-wrap, .slide)[data-theme="gameshow"] :is(.q-points, .letter, .player-btn, .pod-block) { box-shadow: 0 5px 0 #0005; }
:is(.stage-wrap, .slide)[data-theme="gameshow"] .score-row .rank { text-shadow: 0 3px 0 #c2185b; }

/* --- Hell & Branding --- */
:is(.stage-wrap, .slide)[data-theme="light"] {
  --st-bg: #f4f1ea; --st-ink: #000000; --st-text: #1d2324; --st-text-soft: #2e3536; --st-muted: #5d6668; --st-muted-2: #6f7a7c;
  --st-accent: #245d4e; --st-accent-soft: #1f4d41; --st-accent-ink: #ffffff;
  --st-title-grad: linear-gradient(180deg, #2f6b5b, #1f4d41);
  --st-blue: #1f5fbf; --st-blue-deep: #1f5fbf;
  --st-good: #2e7d4f; --st-good-bg: #dcebe4; --st-good-bg-2: #d7e6ee; --st-good-soft: #1f5f3f;
  --st-bad: #b23a3a; --st-bad-bg: #f6dcdc;
  --st-panel: #ffffffee; --st-overlay: rgba(244, 241, 234, .9); --st-timer-bg: #ffffffaa;
  --st-board-cat: #dcebe4; --st-board-a: #ffffff; --st-board-b: #ecebe5; --st-board-line: #245d4e;
  --st-font-body: "Source Sans 3", "Segoe UI", system-ui, sans-serif; --st-font-display: "Bricolage Grotesque", "Avenir Next", system-ui, sans-serif;
}
:is(.stage-wrap, .slide)[data-theme="light"] .title-big { filter: none; }
:is(.stage-wrap, .slide)[data-theme="light"] :is(.board-cell, .board-cat) { text-shadow: none; color: var(--st-accent); }
:is(.stage-wrap, .slide)[data-theme="light"] .board-cat { color: var(--st-accent); }
:is(.stage-wrap, .slide)[data-theme="light"] :is(.choice.correct, .combo-solution, .gap-text.solved .gap, .lyric mark) { color: var(--st-text); }
:is(.stage-wrap, .slide)[data-theme="light"] .timer span { color: var(--st-text); }
:is(.stage-wrap, .slide)[data-theme="light"] .lie-stamp { mix-blend-mode: multiply; }
:is(.stage-wrap, .slide)[data-theme="light"] .crawl-fade { background: linear-gradient(var(--st-bg) 10%, transparent); }
:is(.stage-wrap, .slide)[data-theme="light"] :is(.bar-track .bar, .fighter-bar .fill) { background: linear-gradient(90deg, var(--st-blue), var(--st-accent)); }
:is(.stage-wrap, .slide)[data-theme="light"] .fighter-bar span { text-shadow: none; color: #fff; }

/* Display-Schrift je Theme: Titel, Fragen, Zahlen, Lösungen */
.title-big, .q-prompt, .q-points, .answer-box, .answer-label, .score-row .pts, .score-row .rank, .board-cell, .board-cat, .slide-scores h1, .slide-howto h1,
.pod-name, .pod-block, .timer span, .kicker, .letter, .clue-pts, .stage-secs, .combo-solution, .mode-badge, .tie-teams, .poll-verdict, .fighter-name, .vs, .beamer-code { font-family: var(--st-font-display); }

/* ===== Show-Themes: die Intro-Stile als durchgehendes Aussehen (Rundenfolien behalten ihr Show-Dekor und die Jingles) ===== */
@font-face { font-family: "Press Start 2P"; src: url(../fonts/press-start-2p.woff2) format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Antonio"; src: url(../fonts/antonio.woff2) format("woff2"); font-weight: 400 700; font-display: swap; }
.slide[data-theme] { background-color: var(--st-bg); background-size: cover; background-position: center; } /* eigener Look einer Runde */

/* --- Breaking News --- */
:is(.stage-wrap, .slide)[data-theme="news"] {
  --st-bg: #071233; --st-ink: #ffffff; --st-text: #ffffff; --st-text-soft: #e6ebff; --st-muted: #b7c4ec; --st-muted-2: #c9d2ff;
  --st-accent: #e8324a; --st-accent-soft: #ff9aa9; --st-accent-ink: #ffffff;
  --st-title-grad: linear-gradient(#ffffff, #ffffff);
  --st-blue: #8fb4ff; --st-blue-deep: #5b8cff;
  --st-good: #3ddc97; --st-good-bg: #1f6b4d; --st-good-bg-2: #1b4d6b; --st-good-soft: #b5f5d9;
  --st-bad: #ff6b81; --st-bad-bg: #6b1f2a;
  --st-panel: #0b1d4df2; --st-overlay: rgba(7, 18, 51, .9); --st-timer-bg: #00000088;
  --st-board-cat: #c8102e; --st-board-a: #0b1d4d; --st-board-b: #071233; --st-board-line: #e8324a;
  --st-font-body: "Public Sans", "Segoe UI", system-ui, sans-serif; --st-font-display: "Archivo", "Arial Black", system-ui, sans-serif;
}
:is(.stage-wrap, .slide)[data-theme="news"] .title-big { filter: drop-shadow(10px 10px 0 #c8102e); text-transform: uppercase; }
.look-styled.show-news { padding-bottom: 120px; }
.look-styled.show-news .news-bug { top: auto; bottom: 36px; font-size: 30px; }

/* --- Kino --- */
:is(.stage-wrap, .slide)[data-theme="cinema"] {
  --st-bg: #000000; --st-ink: #ffffff; --st-text: #e8dcc0; --st-text-soft: #d8ccae; --st-muted: #cbb98c; --st-muted-2: #a89a78;
  --st-accent: #e7c66b; --st-accent-soft: #fff1c2; --st-accent-ink: #1a1408;
  --st-title-grad: linear-gradient(180deg, #fff8e1 0%, #e7c66b 45%, #8a6418 100%);
  --st-blue: #cbb98c; --st-blue-deep: #a89a78;
  --st-good: #3ddc97; --st-good-bg: #1f4d3d; --st-good-bg-2: #3a3017; --st-good-soft: #b5f5d9;
  --st-bad: #ff5d6c; --st-bad-bg: #6b1f2a;
  --st-panel: #1a1408f2; --st-overlay: rgba(0, 0, 0, .9); --st-timer-bg: #00000088;
  --st-board-cat: #3a3017; --st-board-a: #2a2210; --st-board-b: #1a1408; --st-board-line: #e7c66b;
  --st-font-body: "Source Sans 3", "Segoe UI", system-ui, sans-serif; --st-font-display: "Archivo", "Arial Black", system-ui, sans-serif;
}
:is(.stage-wrap, .slide)[data-theme="cinema"] :is(.title-big, .kicker, .slide-scores h1) { text-transform: uppercase; letter-spacing: .1em; }
.look-styled.show-cinema { padding-top: 140px; padding-bottom: 140px; }
.look-styled.show-cinema .timer { top: 130px; }

/* --- Retro-Arcade --- */
:is(.stage-wrap, .slide)[data-theme="arcade"] {
  --st-bg: #05010f; --st-ink: #ffffff; --st-text: #ffffff; --st-text-soft: #e0e0ff; --st-muted: #9bff6a; --st-muted-2: #c9d2ff;
  --st-accent: #ffe600; --st-accent-soft: #fff6a3; --st-accent-ink: #1a1400;
  --st-title-grad: linear-gradient(#00f0ff, #00f0ff);
  --st-blue: #00f0ff; --st-blue-deep: #00b8c4;
  --st-good: #9bff6a; --st-good-bg: #0a5533; --st-good-bg-2: #0a3355; --st-good-soft: #d8ffc8;
  --st-bad: #ff2fd6; --st-bad-bg: #5a0a4d;
  --st-panel: #0a0320f2; --st-overlay: rgba(5, 1, 15, .9); --st-timer-bg: #00000088;
  --st-board-cat: #5a0a4d; --st-board-a: #1a0633; --st-board-b: #0a0320; --st-board-line: #ff2fd6;
  --st-font-body: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; --st-font-display: "Press Start 2P", ui-monospace, "Courier New", monospace;
}
:is(.stage-wrap, .slide)[data-theme="arcade"] .title-big { font-size: 84px; filter: drop-shadow(6px 6px 0 #ff2fd6); text-transform: uppercase; line-height: 1.2; }
:is(.stage-wrap, .slide)[data-theme="arcade"] .q-prompt { font-size: 44px; line-height: 1.4; }
:is(.stage-wrap, .slide)[data-theme="arcade"] .q-prompt.compact { font-size: 36px; }
:is(.stage-wrap, .slide)[data-theme="arcade"] .slide-question.text-only:not(.is-reveal) .q-prompt { font-size: 52px; }
:is(.stage-wrap, .slide)[data-theme="arcade"] :is(.answer-box, .score-row .pts, .kicker) { font-size: .8em; }
:is(.stage-wrap, .slide)[data-theme="arcade"] :is(.letter, .q-points, .board-cell) { font-size: .75em; }

/* --- Logbuch (Bordcomputer) --- */
:is(.stage-wrap, .slide)[data-theme="logbook"] {
  --st-bg: #000000; --st-ink: #ffcc99; --st-text: #ffcc99; --st-text-soft: #ffe0c2; --st-muted: #cc99ff; --st-muted-2: #9999ff;
  --st-accent: #ff9c33; --st-accent-soft: #ffcc99; --st-accent-ink: #000000;
  --st-title-grad: linear-gradient(#ff9c33, #ff9c33);
  --st-blue: #9999ff; --st-blue-deep: #cc99ff;
  --st-good: #99ff99; --st-good-bg: #335533; --st-good-bg-2: #333366; --st-good-soft: #ccffcc;
  --st-bad: #ff7744; --st-bad-bg: #663322;
  --st-panel: #000000f2; --st-overlay: rgba(0, 0, 0, .92); --st-timer-bg: #00000088;
  --st-board-cat: #cc99ff; --st-board-a: #1a1a2e; --st-board-b: #000000; --st-board-line: #ff9c33;
  --st-font-body: "Antonio", "Arial Narrow", "Roboto Condensed", system-ui, sans-serif; --st-font-display: "Antonio", "Arial Narrow", "Roboto Condensed", system-ui, sans-serif;
}
:is(.stage-wrap, .slide)[data-theme="logbook"] :is(.title-big, .q-prompt, .slide-scores h1) { text-transform: uppercase; letter-spacing: .03em; filter: none; }
:is(.stage-wrap, .slide)[data-theme="logbook"] .board-cat { color: #000; }
/* Arcade: Pixelschrift nur für Titel, Zahlen und Lösungen – Fragen und Antworten bleiben in lesbarer Schrift */
.look-styled.show-arcade { font-family: var(--st-font-body); text-transform: none; }

/* ===== Branding: Logo in der Fußzone, Sponsorenfolie ===== */
.slide-foot .brand-logo { position: absolute; bottom: 36px; left: 0; max-height: 90px; max-width: 340px; object-fit: contain; object-position: left bottom; }
.slide-foot .brand-logo.right { left: auto; right: 0; object-position: right bottom; }
.slide-question .slide-foot .brand-logo, .slide-scores .slide-foot .brand-logo { max-height: 64px; bottom: 14px; }
.slide-sponsor { justify-content: center; align-items: center; text-align: center; gap: 40px; }
.slide-sponsor .kicker { animation: fadeIn .8s both; }
.sponsor-img { max-width: 1200px; max-height: 560px; object-fit: contain; border-radius: 16px; animation: fadeUp .8s .2s both; }
.sponsor-text { margin: 0; max-width: 1400px; font-size: 54px; line-height: 1.3; color: var(--st-text); animation: fadeUp .8s .5s both; }
/* Mit Logo: Inhaltsfolien lassen unten Platz, damit Info-Box, Lösung und Tabellen nicht unter dem Logo liegen */
:is(.slide-question, .slide-scores, .slide-board, .slide-howto):has(> .slide-foot .brand-logo) { padding-bottom: 96px; }
.slide-question:has(> .slide-foot .brand-logo) .slide-foot .brand-logo { max-height: 64px; }
.season-played { font-size: .6em; color: var(--st-muted); font-weight: 500; }
/* Hinweis-Timer bei Stufen-Fragen: kleines Etikett über der Zahl */
.timer.hint::before { content: 'Hinweis'; position: absolute; top: 10px; left: 0; right: 0; text-align: center; font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: var(--st-muted); }

/* Insights: Zeilen unter dem Punktestand, Kacheln, Abschluss-Statistik */
.insight-foot { display: flex; gap: 28px; justify-content: center; flex-wrap: wrap; margin-top: 26px; font-size: 24px; color: var(--st-muted); }
.insight-grid { display: grid; gap: 22px; grid-template-columns: repeat(3, 1fr); margin-top: 30px; }
.insight-grid.n1, .insight-grid.n2, .insight-grid.n4 { grid-template-columns: repeat(2, 1fr); }
.insight-tile { background: color-mix(in srgb, var(--st-ink) 8%, transparent); border: 1px solid color-mix(in srgb, var(--st-ink) 14%, transparent); border-radius: 18px; padding: 22px 24px; animation: rise .5s ease both; }
.ins-ico { font-size: 34px; }
.ins-value { font-family: var(--st-display, inherit); font-size: 56px; font-weight: 900; line-height: 1.05; color: var(--st-accent); margin-top: 4px; }
.ins-label { font-size: 15px; letter-spacing: .14em; text-transform: uppercase; color: var(--st-muted); margin-top: 2px; }
.ins-text { font-size: 22px; margin-top: 8px; line-height: 1.3; }
.slide-stats .stats-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; margin-top: 20px; align-items: start; }
.slide-stats .insight-grid { grid-template-columns: repeat(2, 1fr); margin-top: 0; gap: 14px; }
.slide-stats .insight-tile { padding: 14px 16px; }
.slide-stats .ins-ico { font-size: 24px; }
.slide-stats .ins-value { font-size: 36px; }
.slide-stats .ins-text { font-size: 17px; }
.rb-head { font-size: 15px; letter-spacing: .14em; text-transform: uppercase; color: var(--st-muted); margin: 18px 0 8px; }
.rb-row { display: grid; grid-template-columns: 1fr 1fr auto; gap: 14px; font-size: 20px; padding: 5px 0; border-bottom: 1px solid color-mix(in srgb, var(--st-ink) 12%, transparent); }
.rb-team { font-weight: 700; }
.rb-pts { color: var(--st-accent); font-weight: 700; }
.curve-box .rb-head { margin-top: 0; }
.curve { width: 100%; height: auto; }
.curve polyline { fill: none; stroke-width: 4; stroke-linejoin: round; stroke-linecap: round; }
.curve .grid { stroke: color-mix(in srgb, var(--st-ink) 14%, transparent); stroke-width: 1; }
.curve .axis { fill: var(--st-muted); font-size: 16px; }
.curve-legend { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 8px; font-size: 18px; }
.legend-item i { display: inline-block; width: 14px; height: 14px; border-radius: 50%; margin-right: 6px; vertical-align: -1px; }
@keyframes rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.slide-insights h1, .slide-stats h1 { font-size: 52px; margin: 4px 0 6px; }