/* =====================================================================
   DAS PULT (?leiste=pult, online.js) — die Leiste als Gegenstand aus der Welt des Sets
   Tobi, 01.10.: „Ich will was Neues, ein anderes Design" — „die Sets sind deutlich besser animiert
   als das da unten". Darum ist die Leiste hier kein Textstreifen, sondern ein Ding mit Material:
   SEIT 01.11.2026 STEHT JEDE WELT IN IHRER EIGENEN DATEI design/kategorien/pult/<set>.css (Tobi, 02.11.: „die auf das Niveau von
   Weltreise angleichen, alle Pulte“), geladen direkt nach dieser Datei; hier bleiben nur die gemeinsamen Regeln. data-welt → Datei:
     rummel  pult/kostprobe.css    der Rummel: Schiffschaukel, Wimpelkette, Budenschild, Riesenrad, Markise, Fahrchip — NUR die Kostprobe
     marke   pult/marke.css        neutral für jedes Set ohne eigene Welt (Creator-Sets): dunkles Glas, Leuchtkante in --acc, kein Zeichen
     kino    pult/kino.css         der Saalplatz: Samtsessel, Lichterleiste, Film als Anzeige, Zwischentitel, Klappe
     rennen  pult/rennsport.css    das Cockpit: Halo, Boxenfunk, Lenkrad-Display mit Schaltblitzen und Streckenkarte, Startampel
     fest    pult/weihnachten.css  der Kaminsims: Kamin mit Feuer, Tannengirlande, Wunschzettel, Geschenkanhänger, Päckchen
     pixel   pult/gaming.css       der Automat: Spielbildschirm, Rollenspiel-Textbox, Invader, Münze
     die übrigen Welten (studio, weltreise, kueche, sagenwelt, erfinder, anime, weltall, geschichte, tierwelt) ziehen ebenso nach
     pult/<set>.css (fussball seit 06.11.2026: pult/fussball.css, der Rand der Albumseite). Welche Welt gilt, entscheidet online.js (logeWelt) an der Uhr des Sets.
   Teile (online.js): .qo-kulisse (k-kante, k-glanz) · .qo-buddy · .qo-z-zeit (die Uhr des Sets) ·
   .qo-sagt (die Sprechblase, fester Platz neben dem Buddy) · .qo-display (.qo-anzeige + .qo-drin) ·
   .qo-los. Bewegung nur transform und opacity. Welt-Töne (Holz, Carbon, Papier) sind Material des
   Gegenstands; Licht, Schrift und Zustände kommen aus den Rollen des Sets.
   ===================================================================== */
.qn-buehne.qo-schirm.qo-mit-pult { --qo-leiste: calc(max(21.5cqmin, 98px) + (var(--schrift, 1) - 1) * 9cqmin); }
.qo-leiste.qo-pult {
  grid-template-columns: 18cqmin 27cqmin minmax(0, 1fr) auto; grid-template-rows: auto minmax(0, 1fr);
  column-gap: 2.2cqmin; row-gap: 1cqmin; padding: 1.9cqmin 3cqmin 1.9cqmin 1cqmin;
  background: var(--pult-grund, var(--g0)); box-shadow: 0 -2.4cqmin 6cqmin rgba(0, 0, 0, .6);
}
.qo-pult > .qo-kulisse { position: absolute; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; }
.qo-pult > .qo-z-zeit, .qo-pult > .qo-display, .qo-pult > .qo-los, .qo-pult > .qo-sagt, .qo-pult > .qo-buddy { z-index: 1; }
.qo-leiste.qo-pult > .qo-z-zeit { grid-column: 2 / 4; grid-row: 1; }
/* Die Blase füllt ihren Platz immer ganz: gleiche Breite, gleiche Höhe, bündig bis an die Anzeige.
   Kurze Rufe stehen groß darin, Sätze kleiner in zwei Zeilen (logeSag passt die Schrift ein) —
   so gibt es keinen wechselnden Abstand zwischen Blase und Wahl. */
.qo-leiste.qo-pult .qo-sagt { grid-column: 2; grid-row: 2; justify-self: stretch; align-self: center; max-width: none; box-sizing: border-box;
  height: calc(max(46px, 10.4cqmin) + (var(--schrift, 1) - 1) * 6cqmin); display: grid; grid-template-columns: minmax(0, 1fr); align-content: center; padding: .8cqmin 1.5cqmin .9cqmin; }
.qo-leiste.qo-pult .qo-sagt-text { width: 100%; min-width: 0; text-align: center; line-height: 1.08; }
.qo-leiste.qo-pult .qo-los { grid-column: 4; grid-row: 1 / 3; align-self: center; }
/* Die Kante oben und ein Glanz, der alle paar Sekunden einmal über das Pult läuft */
.qo-pult .k-kante { position: absolute; left: 0; right: 0; top: 0; height: var(--kante-h, .8cqmin); background: var(--kante); box-shadow: 0 .5cqmin 1.2cqmin rgba(0, 0, 0, .55); }
.qo-pult .k-glanz { position: absolute; top: 0; bottom: 0; left: 0; width: 26%; background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .07) 45%, rgba(255, 255, 255, .11) 50%, rgba(255, 255, 255, .07) 55%, transparent); transform: translateX(-120%); animation: qo-pult-glanz 9s ease-in-out 1.5s infinite; }
@keyframes qo-pult-glanz { 0%, 78% { transform: translateX(-120%); } 100% { transform: translateX(520%); } }

/* Der Buddy sitzt im Pult: größer, hinter ihm die Lehne seines Sitzes */
.qo-pult .qo-buddy-fig { width: 21cqmin; height: 21cqmin; margin-left: -10.5cqmin; bottom: -.9cqmin; z-index: 1; }
.qo-pult .qo-buddy::before { content: ""; position: absolute; left: 9%; right: 9%; top: 26%; bottom: -1.9cqmin; border-radius: 46% 46% 14% 14% / 34% 34% 10% 10%; background: var(--sitz, linear-gradient(180deg, color-mix(in srgb, var(--g3) 80%, #000), var(--g0))); box-shadow: inset 0 0 0 .4cqmin var(--sitz-naht, var(--acc)), inset 0 1.4cqmin 2cqmin rgba(255, 255, 255, .07); }
.qo-pult .qo-buddy::after { z-index: 0; }

/* DIE ANZEIGE: deine Wahl groß, dahinter klein „6/10 eingeloggt" */
.qo-pult .qo-display {
  grid-column: 3; grid-row: 2; align-self: stretch; position: relative; min-width: 0; overflow: hidden;
  display: flex; align-items: center; gap: 1.8cqmin; padding: 0 2.2cqmin 0 2cqmin; border-radius: var(--disp-rund, 1.6cqmin);
  background: var(--disp-grund); box-shadow: var(--disp-rahmen);
}
.qo-pult .qo-d-glas { position: absolute; inset: 0; pointer-events: none; background: var(--disp-glas, linear-gradient(180deg, rgba(255, 255, 255, .09), transparent 42%)); }
.qo-leiste.qo-pult .qo-display .qo-anzeige { flex: 1 1 auto; min-width: 0; padding: 0; gap: 1.4cqmin; }
/* KEINE ZIER KREUZT SCHRIFT (Tobi, 02.11.2026, Rennsport: die Streckenkarte lief über „sucht Anschluss“): Die Schrift der Anzeige
   endet vor dem Motiv der Welt. Jede Welt mit Motiv nennt in --qo-motiv-frei, wie weit es vom rechten Rand der Anzeige nach links
   reicht (pult/*.css); die Anzeige hört davor auf — der Abstand ist der Innenrand rechts. Die zweite Zeile läuft dort weich aus
   (.qo-loge … em), die erste wird kleiner (online.js, wahlEinpassen). Ohne Motiv (oder Motiv aus dem Bild: --qo-motiv-r −40) gilt nichts.
   „eingeloggt“ bleibt rechts stehen (margin-left: auto), auch wenn die Anzeige davor kürzer wird. */
.qo-leiste.qo-pult .qo-display > .qo-anzeige { max-width: calc(100% - var(--qo-motiv-frei, -100cqmin)); }
.qo-leiste.qo-pult .qo-display > .qo-drin { margin-left: auto; }
.qo-pult .qo-anzeige::after { display: none; }
.qo-pult .qo-a-t { gap: .5cqmin; }
.qo-pult .qo-a-t > b, .qo-pult .qo-a-t > b:not([class]) { font-family: var(--disp-schrift, var(--f-display)); font-weight: 800; font-size: max(15px, calc(4.6cqmin * var(--schrift, 1))); line-height: 1; letter-spacing: var(--disp-sperr, 0); text-transform: var(--disp-fall, none); color: var(--disp-leer); }
.qo-pult .qo-a-t em { font-size: max(9px, calc(1.9cqmin * var(--schrift, 1))); font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--disp-neben); }
/* DIE LEUCHTSCHRIFT SPRINGT EINMAL AN (Tobi, 02.11.2026: „Ich habe immer noch die Artefakte im Onlinepult, wenn ich die Frage
   beantworte.“). Das Flackern hing an der Zeile selbst — und jede Art baut die Anzeige bei jeder Änderung neu (innerHTML): beim Ziehen
   je Raste, beim Tippen je Buchstabe, bei Code knacken je Symbol. Jede neue Zeile begann ihr Flackern von vorn, bei Deckkraft 0 — der Wert
   blinkte, solange man zog oder tippte, und stand in 9 von 10 Bildern nicht da (Bildfolge: design/handy/pruefung-2026-11-02/artefakt/).
   Jetzt läuft das Flackern an der Anzeige-Fläche, die stehen bleibt (.qo-display), als geerbte Helligkeit (--qo-an-hell): einmal, wenn
   die erste Wahl steht; eine neu gebaute Zeile übernimmt die Helligkeit, die gerade gilt, statt bei 0 anzufangen.
   WEICH STATT FLACKERN (Tobi, 02.11.2026, zum Bericht artefakt-lobby/: „2 … beheben“): Das Anspringen war 0 → 0,83 → 0,48 → 0,64 → 1 in
   vier harten Schritten — der Wert stand nach der Wahl (und die Quittung „Link kopiert“ in der Lobby, einladen.css) ~130 ms gar nicht da
   und flackerte dann: „kurz weg, kurz da“. Jetzt blendet er weich ein, ab dem ersten Bild sichtbar (0,45 → 1, ohne Schritte). */
@property --qo-an-hell { syntax: '<number>'; inherits: true; initial-value: 1; }
.qo-pult .qo-display:has(> .qo-anzeige[data-zustand="gewaehlt"]) { animation: qo-pult-an var(--d-lang) var(--k-ein); }
.qo-pult .qo-anzeige[data-zustand="gewaehlt"] .qo-a-t > b { color: var(--disp-an); text-shadow: var(--disp-leucht, none); opacity: var(--qo-an-hell, 1); }
.qo-pult .qo-anzeige[data-zustand="gesendet"] .qo-a-t > b { color: var(--disp-fest); text-shadow: var(--disp-leucht-fest, none); }
.qo-pult .qo-anzeige[data-zustand="gewaehlt"] .qo-a-t em, .qo-pult .qo-anzeige[data-zustand="gesendet"] .qo-a-t em { color: var(--disp-neben); }
@keyframes qo-pult-an { from { --qo-an-hell: .45; } to { --qo-an-hell: 1; } }
.qo-pult .qo-a-marke { transform: scale(1.15); transform-origin: 0 50%; margin-right: .6cqmin; }
.qo-leiste.qo-pult .qo-drin { flex: none; grid-column: auto; grid-row: auto; padding: .4cqmin 0 .4cqmin 2cqmin; border-left: max(1px, .25cqmin) solid var(--disp-trenn); }
.qo-pult .qo-drin .qo-tischwort b { font-family: var(--disp-schrift, var(--f-display)); color: var(--disp-fest); }
.qo-pult .qo-drin .qo-tischwort b i { color: var(--disp-neben); }
.qo-pult .qo-drin .qo-tischwort span { color: var(--disp-neben); }

/* DIE TASTE: ein Rahmen, darin die Kappe; bereit, pocht sie leise */
.qo-pult .qo-los { padding: 1.1cqmin; border-radius: var(--taste-rund, 2.6cqmin); background: var(--taste-rahmen); box-shadow: var(--taste-schatten, 0 1cqmin 2.4cqmin rgba(0, 0, 0, .6), inset 0 .3cqmin 0 rgba(255, 255, 255, .16)); }
.qo-pult .qo-los::before { display: none; }
/* FALLE (Tobis Fund 8, 26.10.2026 — der Schlüssel von Geschichte lag über „Abgeschickt"): Die Grundform in online.css setzt
   .qo-los::before auf left: 0 / bottom: 0 und ::after auf inset. Wer ein Zierstück rechts anbringt (right: …), MUSS left: auto setzen —
   sonst gilt left: 0 und right wird überstimmt: Das Stück landet links, über der Schrift. Prüfung: knopf-pruefen.mjs. */
.qo-pult .qo-los .qo-kappe { min-width: 0; width: 30cqmin; max-width: 30cqmin; min-height: max(48px, 11cqmin); border-radius: calc(var(--taste-rund, 2.6cqmin) - .9cqmin); font-size: max(13px, calc(3.3cqmin * min(var(--schrift, 1), 1.25))); }
.qo-pult .qo-los[data-zustand="gewaehlt"] .qo-kappe { animation: qo-pult-bereit 1.5s ease-in-out infinite; }
@keyframes qo-pult-bereit { 0%, 100% { transform: none; } 50% { transform: scale(1.035); } }

/* ---- Schmale Schirme ------------------------------------------------------ */
@container (max-width: 900px) {
  .qo-leiste.qo-pult { grid-template-columns: 15cqmin 25cqmin minmax(0, 1fr) auto; column-gap: 1.6cqmin; padding-right: 2cqmin; }
  .qo-pult .qo-buddy-fig { width: 17cqmin; height: 17cqmin; margin-left: -8.5cqmin; }
  .qo-pult .qo-display { padding: 0 1.4cqmin; gap: 1.2cqmin; }
  .qo-pult .qo-a-t > b, .qo-pult .qo-a-t > b:not([class]) { font-size: max(13px, 3.8cqmin); }
  .qo-pult .qo-los .qo-kappe { width: 25cqmin; max-width: 25cqmin; font-size: max(11px, 2.5cqmin); }
  .qo-leiste.qo-pult .qo-drin { padding-left: 1.2cqmin; }
}
@media (prefers-reduced-motion: reduce) { .qo-pult .k-glanz, .qo-pult .qo-los[data-zustand="gewaehlt"] .qo-kappe { animation: none; } }
/* Die Taste sagt nur, was sie tut — die Wahl steht in der Anzeige, der Tastenhinweis an der Wand. */
.qo-pult .qo-los .qo-kbd, .qo-pult .qo-los .qo-los-marke { display: none; }
.qo-pult .qo-los .qo-kappe { white-space: normal; text-wrap: balance; line-height: 1.05; padding-left: 1.6cqmin; padding-right: 1.6cqmin; }
/* Der Sitz: eine Schale mit Schultern, die Naht fein */
.qo-pult .qo-buddy::before { left: 4%; right: 4%; top: 30%; border-radius: 50% 50% 16% 16% / 62% 62% 12% 12%; box-shadow: inset 0 0 0 .25cqmin var(--sitz-naht, var(--acc)), inset 0 1.6cqmin 2.2cqmin rgba(255, 255, 255, .08), 0 .6cqmin 1.6cqmin rgba(0, 0, 0, .5); }
/* Der Buddy sitzt tiefer (Tobi 01.10.: „Das Monster sitzt noch ein bisschen zu hoch"): Er steckt im
   Sitz, der vordere Rand des Pults verdeckt seinen Fuß — der Kopf bleibt unter der Kante. */
.qo-pult .qo-buddy-fig { bottom: -3.6cqmin; }
.qo-pult .qo-buddy::before { top: 34%; }
.qo-pult .qo-buddy::after { left: 2%; right: 2%; bottom: -1.9cqmin; height: 4.2cqmin; z-index: 2; border-radius: 2.2cqmin 2.2cqmin 0 0; background: var(--sitz, linear-gradient(180deg, var(--g3), var(--g0))); box-shadow: inset 0 .25cqmin 0 var(--sitz-naht, var(--acc)), 0 -.6cqmin 1.2cqmin rgba(0, 0, 0, .45); }
@container (max-width: 900px) { .qo-pult .qo-buddy-fig { bottom: -3cqmin; } }
/* … aber nicht so tief, dass der Rand den Mund verdeckt */
.qo-pult .qo-buddy-fig { bottom: -2.6cqmin; }
.qo-pult .qo-buddy::after { height: 3cqmin; }
@container (max-width: 900px) { .qo-pult .qo-buddy-fig { bottom: -1.4cqmin; } .qo-pult .qo-buddy::after { height: 2.6cqmin; } .qo-pult .qo-buddy::before { top: 30%; } }
/* Tobi 01.10.: „Der Einlock-Knopf ist nicht auf der Höhe von dem anderen Banner, und der Timer soll
   sich auch länger strecken, über den Antwort-Knopf hinaus." Die Uhr läuft bis an den rechten Rand;
   die Taste steht in derselben Reihe wie die Anzeige, gleiche Ober- und Unterkante. */
.qo-leiste.qo-pult > .qo-z-zeit { grid-column: 2 / 5; }
.qo-leiste.qo-pult .qo-los { grid-row: 2; align-self: stretch; display: flex; }
.qo-pult .qo-los .qo-kappe { height: auto; min-height: 0; flex: 1 1 auto; align-self: stretch; }

/* =====================================================================
   DAS PULT IN DER AUFLÖSUNG (online.js, pultAufloesung) — derselbe Gegenstand, die Anzeige schaltet
   auf das Urteil, wo die Taste war, steht die Tafel mit Platz und Stand. Die Schläge der Regie:
   qo-r-2 Siegel und Urteil · qo-r-3 Punkte (zählen hoch), Platz und Stand · qo-r-4 die Lage.
   ===================================================================== */
.qo-pult-a .qo-display { gap: 1.8cqmin; }
.qo-pult .qo-d-siegel { flex: none; display: grid; place-items: center; width: 7.4cqmin; height: 7.4cqmin; border-radius: 50%; background: var(--u); color: var(--u-auf);
  box-shadow: 0 0 2.4cqmin color-mix(in srgb, var(--u) 55%, transparent); opacity: 0; transform: scale(2.2) rotate(-24deg);
  transition: transform var(--d-lang) var(--k-schnapp), opacity var(--d-kurz) var(--k-ein); }
.qo-pult .qo-d-siegel svg { display: block; width: 60%; height: 60%; }
.qo-pult-a.qo-r-2 .qo-d-siegel { opacity: 1; transform: none; }
.qo-pult .qo-d-urteil { flex: 1 1 auto; min-width: 0; margin: 0; display: grid; gap: .6cqmin; overflow: hidden; }
.qo-pult .qo-z-uwort { display: block; font-family: var(--disp-schrift, var(--f-display)); font-weight: 800; font-size: max(15px, calc(4.8cqmin * var(--schrift, 1))); line-height: 1.02;
  letter-spacing: var(--disp-sperr, 0); text-transform: var(--disp-fall, none); white-space: nowrap; overflow: hidden;
  color: var(--disp-urteil, var(--u)); text-shadow: 0 0 1.6cqmin color-mix(in srgb, var(--u) 55%, transparent); }
.qo-pult .qo-z-uwort.lang, .qo-pult .qo-d-neben { -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 2cqmin), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 2cqmin), transparent); }
.qo-pult .qo-d-neben { display: block; font-style: normal; font-size: max(9px, calc(2cqmin * var(--schrift, 1))); font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--disp-neben); white-space: nowrap; overflow: hidden; }
.qo-pult .qo-d-neben b { color: var(--disp-fest); font-weight: 900; }
/* AUTOMATISCH ABGEGEBEN (Tobi 27.10.; online.js, pultAufloesung): eine kleine, ehrliche Zeile über dem Urteil — neben ihm, nicht statt seiner.
   Sie kommt mit dem Urteil (qo-r-2). */
.qo-pult .qo-d-urteil.qo-mit-auto { gap: .2cqmin; }
.qo-pult .qo-d-auto { display: block; font-size: max(8px, calc(1.35cqmin * var(--schrift, 1))); font-weight: 800; letter-spacing: .14em; text-transform: uppercase; line-height: 1;
  color: var(--disp-neben); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.qo-la .qo-d-auto { opacity: 0; transition: opacity var(--d-mittel) var(--k-ein); }
.qo-la.qo-r-2 .qo-d-auto { opacity: 1; }
.qo-pult .qo-punkte { flex: none; display: grid; justify-items: end; gap: .2cqmin; padding: .4cqmin 0 .4cqmin 2cqmin; border-left: max(1px, .25cqmin) solid var(--disp-trenn); }
.qo-pult .qo-punkte b { font-family: var(--disp-schrift, var(--f-display)); font-weight: 900; font-size: max(18px, calc(5.6cqmin * var(--schrift, 1))); line-height: 1; color: var(--disp-an); text-shadow: var(--disp-leucht, none); font-variant-numeric: tabular-nums; text-align: right; }
.qo-pult .qo-punkte small { font-size: max(9px, calc(1.6cqmin * var(--schrift, 1))); font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--disp-neben); }

/* Die Tafel: Platz und Stand im Rahmen der Taste */
.qo-leiste.qo-pult .qo-rang { grid-column: 4; grid-row: 2; align-self: stretch; z-index: 1; display: flex; padding: 1.1cqmin; border-radius: var(--taste-rund, 2.6cqmin); background: var(--taste-rahmen);
  box-shadow: var(--taste-schatten, 0 1cqmin 2.4cqmin rgba(0, 0, 0, .6), inset 0 .3cqmin 0 rgba(255, 255, 255, .16)); }
.qo-pult .qo-rang-in { flex: 1 1 auto; display: flex; align-items: center; justify-content: center; gap: 2.2cqmin; width: 30cqmin; padding: 0 1.6cqmin; border-radius: calc(var(--taste-rund, 2.6cqmin) - .9cqmin); overflow: hidden;
  background: var(--rang-grund, linear-gradient(180deg, color-mix(in srgb, var(--g2) 90%, #000), var(--g0))); box-shadow: inset 0 0 0 .25cqmin color-mix(in srgb, var(--t0) 14%, transparent), inset 0 1cqmin 2cqmin rgba(0, 0, 0, .5); }
.qo-pult .qo-rang-p, .qo-pult .qo-rang-s { display: grid; justify-items: center; gap: .2cqmin; min-width: 0; }
.qo-pult .qo-rang em { font-style: normal; font-size: max(9px, calc(1.6cqmin * var(--schrift, 1))); font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--t2); white-space: nowrap; }
.qo-pult .qo-z-pzahl { font-family: var(--f-display); font-weight: 900; font-size: max(22px, calc(6.4cqmin * var(--schrift, 1))); line-height: 1; color: var(--t0); font-variant-numeric: tabular-nums; }
.qo-pult .qo-rang .qo-sprung { font-size: max(9px, calc(1.9cqmin * var(--schrift, 1))); }
.qo-pult .qo-rang .qo-sprung.hoch { color: var(--ok); }
/* Große Runden (online.js, rangPasse): Ragt die Tafel mit zweistelligem Platz über ihren Rand, wird
   „= gleich" zu „=" — und reicht das nicht, weicht der Pfeil. Platzziffer und Stand bleiben ganz. */
.qo-pult .qo-rang.qo-rang-knapp .qo-sprung { display: none; }
.qo-pult .qo-summe { font-family: var(--f-display); font-weight: 900; font-size: max(15px, calc(3.8cqmin * var(--schrift, 1))); line-height: 1; color: var(--t0); font-variant-numeric: tabular-nums; text-align: center; }
.qo-pult .qo-rang-s { padding-left: 2.2cqmin; border-left: max(1px, .25cqmin) solid color-mix(in srgb, var(--t0) 14%, transparent); }
@container (max-width: 900px) {
  .qo-pult .qo-rang-in { width: 25cqmin; gap: 1.4cqmin; padding: 0 1cqmin; }
  .qo-pult .qo-rang-s { padding-left: 1.4cqmin; }
  .qo-pult .qo-d-siegel { width: 6cqmin; height: 6cqmin; }
  .qo-pult .qo-punkte { padding-left: 1.2cqmin; }
}
/* Platz und Punkte gleich gebaut: das Wort oben, die Zahl darunter auf einer Linie */
.qo-pult .qo-rang-p, .qo-pult .qo-rang-s { grid-template-rows: auto 1fr; align-items: end; align-self: center; }
.qo-pult .qo-rang-p { grid-template-columns: auto auto; column-gap: .8cqmin; }
.qo-pult .qo-rang-p em { grid-column: 1 / -1; }
.qo-pult .qo-rang .qo-sprung { align-self: center; }
.qo-pult .qo-summe { line-height: 1.5; }

/* ---- Der Übergang Frage → Auflösung (online.js, pultAufloesung) ---------------------------------
   Die Auflösung beginnt mit dem Stand der Frage: Die alte Wahl liegt als Lage in der Anzeige, die
   alte Taste auf der Tafel. Beim ersten Schlag (qo-r-1, 450 ms) rollt die Wahl nach oben weg und
   die Taste klappt um; dann kommen Urteil (qo-r-2), Punkte, Platz und Stand (qo-r-3). */
/* Die Abschrift steht genau wie die Frage (Tobi, 02.11.2026, „Artefakte, wenn ich die Frage beantworte“ — wer als Letzter abgibt, sieht
   gleich danach den Wechsel): Wie die Anzeige endet sie vor dem Motiv der Welt (--qo-motiv-frei; vorher sprang der Haken in Gaming,
   Kostprobe, Rennsport und Weltall um 72–176 px nach rechts, über das Motiv), hat ihren Abstand (gap: inherit) und, waren alle drin,
   ihr „Alle“ in der Farbe der Frage (.qo-alle — die Klasse stand an der Bühne der Frage, online.js pultAufloesung). */
.qo-pult .qo-d-alt { position: absolute; inset: 0; z-index: 2; display: flex; align-items: center; gap: inherit; padding: inherit;
  transition: transform var(--d-lang) var(--k-ein), opacity var(--d-mittel) var(--k-ein); }
.qo-pult .qo-d-alt .qo-d-glas { display: none; }
.qo-leiste.qo-pult .qo-d-alt > .qo-anzeige { max-width: calc(100% - var(--qo-motiv-frei, -100cqmin)); }
.qo-leiste.qo-pult .qo-d-alt > .qo-drin { margin-left: auto; }
.qo-pult .qo-d-alt.qo-alle .qo-drin .qo-tischwort b { color: var(--disp-an); }
.qo-pult .qo-d-alt .qo-a-t > b { animation: none !important; }
.qo-pult-a.qo-r-1 .qo-d-alt { transform: translateY(-110%); opacity: 0; }
.qo-leiste.qo-pult .qo-rang { position: relative; perspective: 60cqmin; }
.qo-pult .qo-rang .qo-los.qo-rang-alt { position: absolute; inset: 1.1cqmin; z-index: 2; grid-column: auto; grid-row: auto; padding: 0; background: none; box-shadow: none; display: flex; cursor: default;
  transform-origin: 50% 0; transition: transform var(--d-lang) var(--k-ein), opacity var(--d-mittel) var(--k-ein) 120ms; }
.qo-pult .qo-rang-alt .qo-kappe { animation: none !important; width: auto; max-width: none; }
.qo-pult .qo-rang-alt::after { display: none; }
.qo-pult-a.qo-r-1 .qo-rang .qo-los.qo-rang-alt { transform: rotateX(-88deg); opacity: 0; }
@media (prefers-reduced-motion: reduce) { .qo-pult .qo-d-alt, .qo-pult .qo-rang .qo-los.qo-rang-alt { display: none; } }
/* Die Kopie der Frage steht still: Stempel und Zeile spielen ihren Auftritt nicht noch einmal. */
.qo-pult .qo-d-alt *, .qo-pult .qo-rang-alt * { transition: none !important; animation: none !important; }

/* =====================================================================
   DIE TINTE DER ANZEIGE — für JEDE Kategorie (Tobi 01.10.: „Baue das jetzt passend für jede
   Kategorie"). Was eine Eingabe-Art in die Anzeige legt (Marke, Wert, Zustandszeile, Werkzeuge,
   der Vorsatz „① 1827"), ist für eine dunkle Leiste gebaut: Schrift in --t0/--t1/--t2. Auf dem
   Wunschzettel (Papier) stand das weiß auf hell („ITALIEN sucht Anschluss", „festgelegt bei 40",
   die Werkzeuge beim Zeichnen). Darum setzt die Anzeige diese drei Rollen selbst — auf die Tinte
   ihrer Welt. Alles, was darin steht, erbt sie; keine Art muss das Pult kennen.
   ===================================================================== */
.qo-pult .qo-display { --t0: var(--disp-fest); --t1: var(--disp-mittel, var(--disp-fest)); --t2: var(--disp-neben); color: var(--disp-fest); }

/* Die Teile der Arten in der Anzeige */
/* Werte in eigener Schrift (Jahr, Koordinate, Zahl mit Einheit) — groß wie die Wahl, in der Schrift der Anzeige */
.qo-pult .qo-a-t > b.qo-jahr, .qo-pult .qo-a-t > b.qo-rg-zahl, .qo-pult .qo-a-t > b.qo-koord { font-family: var(--disp-schrift, var(--f-mono)); letter-spacing: 0; }
.qo-pult .qo-a-t > b.qo-koord { font-size: max(13px, calc(3.8cqmin * var(--schrift, 1))); }
.qo-pult .qo-rg-zahl small { color: var(--disp-neben); text-transform: none; }
/* Der Maßstab der Karte steht an der Karte; die Anzeige nennt nur den Ort. */
.qo-pult .qo-mass { display: none; }
/* Die Marke vor der Wahl (Form + Buchstabe, Pin, Schieber, Stift, Zähler): leer ist sie ein blasser Abdruck */
.qo-pult .qo-a-marke.leer { background: color-mix(in srgb, var(--disp-fest) 9%, transparent); color: var(--disp-neben); box-shadow: inset 0 0 0 .22cqmin color-mix(in srgb, var(--disp-fest) 14%, transparent); }
/* Zuordnen: „ITALIEN sucht Anschluss" — der Name in der Tinte der Anzeige */
.qo-pult .qo-anzeige .qo-a-t em b { color: var(--disp-fest); }
.qo-pult .qo-anzeige[data-zustand="gewaehlt"] .qo-a-t em b { color: var(--disp-an); }
/* Werkzeuge (Zeichnen, Einkreisen): kleine Tasten der Anzeige, im Material der Welt */
.qo-pult .qo-f-wz { min-height: 0; align-self: center; padding: .7cqmin 1.1cqmin .6cqmin; }

/* =====================================================================
   DAS PULT DURCH DEN ABEND — Rundenvorschau (qo-pult-v), Zwischenstand (qo-pult-t), Abendende
   (qo-pult-e). Derselbe Gegenstand, dieselben Plätze (online.js, QN.pult):
     Uhr oben über die Breite · Buddy im Sitz · Blase · Anzeige · rechts Tafel oder Tasten.
   Das Pult STEHT: Es tritt nie auf, es blendet nicht ein — nur sein Inhalt wechselt.
   ===================================================================== */
.qo-leiste.qo-pult, .qo-leiste.qo-pult > .qo-z-zeit, .qo-leiste.qo-pult > .qo-display, .qo-leiste.qo-pult > .qo-los, .qo-leiste.qo-pult > .qo-rang,
.qo-leiste.qo-pult > .qo-buddy, .qo-leiste.qo-pult .qo-e-knoepfe, .qo-leiste.qo-pult .qo-t-jubel { animation: none; }

/* Der Textblock der Anzeige: ein Etikett (klein, gesperrt), darunter der Satz — bis zwei Zeilen. */
.qo-pult .qo-pt-text { flex: 1 1 auto; min-width: 0; margin: 0; display: grid; gap: .6cqmin; align-content: center; }
.qo-pult .qo-pt-wort { display: block; font-style: normal; font-size: max(9px, calc(1.9cqmin * var(--schrift, 1))); font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--disp-neben); white-space: nowrap; overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 2cqmin), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 2cqmin), transparent); }
.qo-pult .qo-pt-wort b { font-weight: 900; font-size: 1.3em; letter-spacing: .02em; color: var(--disp-an); text-shadow: var(--disp-leucht, none); }
.qo-pult .qo-pt-satz { display: block; font-family: var(--f-display); font-weight: 700; font-size: max(13px, calc(3.2cqmin * var(--schrift, 1))); line-height: 1.14; color: var(--disp-fest);
  max-height: 2.32em; overflow: hidden; text-wrap: balance; }
.qo-pult .qo-pt-satz b { font-weight: 900; color: var(--disp-an); }

/* ---- ZWISCHENSTAND: mein Platz (rollt), mein Satz der Runde; rechts die Taste „Jubeln" ---------- */
.qo-pult .qo-pt-platz { flex: none; display: grid; grid-template-columns: auto auto; column-gap: .9cqmin; align-items: center; justify-items: center; padding-right: 2cqmin; border-right: max(1px, .25cqmin) solid var(--disp-trenn); }
.qo-pult .qo-pt-platz em { grid-column: 1 / -1; font-style: normal; font-size: max(9px, calc(1.6cqmin * var(--schrift, 1))); font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--disp-neben); }
.qo-pult .qo-pt-platz .qo-z-pzahl { font-family: var(--disp-schrift, var(--f-display)); font-size: max(22px, calc(6.8cqmin * var(--schrift, 1))); color: var(--disp-fest); text-shadow: var(--disp-leucht-fest, none); }
.qo-pult .qo-pt-platz .qo-sprung { font-style: normal; font-weight: 900; font-size: max(9px, calc(2.1cqmin * var(--schrift, 1))); white-space: nowrap; color: var(--disp-neben);
  opacity: 0; transform: scale(.5); transition: transform var(--d-mittel) var(--k-schnapp), opacity var(--d-kurz) var(--k-ein); }
.qo-pult .qo-pt-platz .qo-sprung.hoch { color: var(--ok); }
.qo-pult-t.qo-t-tausch .qo-pt-platz .qo-sprung { opacity: 1; transform: none; }
/* Der Satz kommt mit dem ersten Schlag der Wand (qo-t-lauf) von unten herein. */
.qo-pult-t .qo-pt-text { opacity: 0; transform: translateY(70%); transition: transform var(--d-lang) var(--k-ein), opacity var(--d-mittel) var(--k-ein); }
.qo-pult-t.qo-t-lauf .qo-pt-text { opacity: 1; transform: none; }

/* Die Taste „Jubeln" und das Tastenfeld des Abendendes: derselbe Rahmen wie die Taste der Frage. */
.qo-leiste.qo-pult .qo-pt-taste { cursor: default; }
.qo-pult .qo-pt-taste::after { display: none; }
.qo-pult .qo-pt-taste .qo-t-jubel { flex: 1 1 auto; display: flex; grid-column: auto; grid-row: auto; align-self: stretch; }
.qo-pult .qo-pt-taste .sp-jubel { flex: 1 1 auto; width: 30cqmin; min-height: 0; padding: .6cqmin 1.6cqmin; gap: 0; justify-content: center; border-radius: calc(var(--taste-rund, 2.6cqmin) - .9cqmin);
  background: linear-gradient(180deg, var(--acc2), color-mix(in srgb, var(--acc2) 72%, var(--acc))); color: var(--auf-acc2);
  box-shadow: inset 0 .4cqmin 0 color-mix(in srgb, #fff 22%, transparent), 0 0 3cqmin color-mix(in srgb, var(--acc2) 32%, transparent); }
.qo-pult .qo-pt-taste .sp-jubel.gejubelt { background: linear-gradient(180deg, color-mix(in srgb, var(--acc2) 80%, #fff), var(--acc2)); }
.qo-pult .qo-pt-taste .sp-jubel-kopf { display: none; }
.qo-pult .qo-pt-taste .sp-jubel-t { text-align: center; justify-items: center; }
.qo-pult .qo-pt-taste .sp-jubel-wort { font-size: max(13px, calc(3.4cqmin * min(var(--schrift, 1), 1.25))); letter-spacing: .06em; }
.qo-pult .qo-pt-taste .sp-jubel-t em { font-size: max(9px, calc(1.7cqmin * min(var(--schrift, 1), 1.25))); font-weight: 700; color: color-mix(in srgb, var(--auf-acc2) 78%, transparent); white-space: nowrap; }

/* ---- ABENDENDE: vor der Aufdeckung „Das Finale läuft", danach Titel und Geschichte ------------- */
.qo-pult .qo-pe { --u: var(--acc2); --u-auf: var(--auf-acc2); }
.qo-pult .qo-pe-warten, .qo-pult .qo-pe-titel { position: absolute; inset: 0; display: flex; align-items: center; gap: 1.8cqmin; padding: inherit;
  transition: transform var(--d-lang) var(--k-ein), opacity var(--d-mittel) var(--k-ein); }
.qo-pult .qo-pe-titel { opacity: 0; transform: translateY(110%); }
.qo-pult-e.qo-e-auf .qo-pe-warten { opacity: 0; transform: translateY(-110%); }
.qo-pult-e.qo-e-auf .qo-pe-titel { opacity: 1; transform: none; }
.qo-pult .qo-pe-frage { opacity: 1; transform: none; background: none; box-shadow: inset 0 0 0 .35cqmin var(--disp-neben); color: var(--disp-neben); }
.qo-pult .qo-pe-frage b { font-family: var(--f-display); font-weight: 900; font-size: 4.2cqmin; line-height: 1; animation: qo-pe-frage 1.6s ease-in-out infinite; }
@keyframes qo-pe-frage { 0%, 100% { transform: none; } 50% { transform: translateY(-.5cqmin) rotate(8deg); } }
.qo-pult .qo-pe-medaille.pokal { --u: #f5c542; --u-auf: #2a1c00; }
.qo-pult-e.qo-e-auf .qo-pe-medaille { opacity: 1; transform: none; transition-delay: 180ms; }
.qo-pult .qo-pe-tname { display: block; font-family: var(--disp-schrift, var(--f-display)); font-weight: 800; font-size: max(15px, calc(4.4cqmin * var(--schrift, 1))); line-height: 1.04; letter-spacing: var(--disp-sperr, 0); text-transform: var(--disp-fall, none);
  white-space: nowrap; overflow: hidden; color: var(--disp-an); text-shadow: var(--disp-leucht, none); }
/* Der Zusatz („Wer von uns", „Weltspitze") hängt an der Größe des Titels — wird der Titel kleiner
   gesetzt, damit er passt (pultPasse), fiel der Zusatz auf 7,9 px. Er bleibt bei mindestens 9 px. */
.qo-pult .qo-pe-tname i { font-style: normal; font-family: var(--f-body); font-weight: 800; font-size: max(9px, .46em); letter-spacing: .1em; text-transform: uppercase; color: var(--disp-neben); text-shadow: none; margin-left: 1cqmin; }
.qo-pult .qo-pe-gesch { font-size: max(11px, calc(2.35cqmin * var(--schrift, 1))); font-weight: 600; opacity: 0; transition: opacity var(--d-mittel) var(--k-ein); }
.qo-pult-e.qo-e-gesch-da .qo-pe-gesch { opacity: 1; }
/* Das Tastenfeld: Jubeln · Teilen · Feedback — Kappen in einem Rahmen. Seit 28.10. ohne „Neues Set", und Jubeln ist eine Taste
   wie die beiden anderen (Tobi: „der Jubeln-Knopf kann auch kleiner"): Zeichen über dem Wort, mindestens 48 px BREIT (min-width).
   Die Höhe ist die des Tastenfelds (auf S 30 px sichtbar, wie auf main); der Hof darüber (online.css, ::before) reicht auf 48 px. */
.qo-pult .qo-pe-feld .qo-e-knoepfe { flex: 1 1 auto; display: flex; align-items: stretch; gap: .9cqmin; grid-column: auto; grid-row: auto; }
.qo-pult .qo-pe-feld .sp-jubel { flex: none; width: auto; min-width: max(48px, 10.5cqmin); flex-direction: column; justify-content: center; gap: .5cqmin; padding: .4cqmin 1.2cqmin; }
.qo-pult .qo-pe-feld .sp-jubel-t em { display: none; }
.qo-pult .qo-pe-hoch { display: block; flex: none; width: max(15px, 3.4cqmin); height: max(15px, 3.4cqmin); color: var(--acc2); }
.qo-pult .qo-pe-hoch svg { display: block; width: 100%; height: 100%; }
.qo-pult .qo-pe-feld .qo-e-knopf { flex: none; flex-direction: column; justify-content: center; gap: .5cqmin; min-height: 0; min-width: max(48px, 10.5cqmin); padding: .4cqmin 1.2cqmin; border-radius: calc(var(--taste-rund, 2.6cqmin) - .9cqmin);
  font-size: max(9px, calc(1.9cqmin * min(var(--schrift, 1), 1.25))); letter-spacing: .02em;
  background: linear-gradient(180deg, color-mix(in srgb, var(--g2) 90%, #000), var(--g0)); color: var(--t0); box-shadow: inset 0 0 0 .25cqmin color-mix(in srgb, var(--t0) 16%, transparent), inset 0 .3cqmin 0 rgba(255, 255, 255, .08); }
.qo-pult .qo-pe-feld .qo-e-knopf svg { width: max(15px, 3.4cqmin); height: max(15px, 3.4cqmin); }

/* ---- ABENDENDE · MEIN PLATZ (online.js, pultEndeHtml; Tobi 28.10.: „nimm B, nur den Platz“) ----------------------
   Der Platz links in der Anzeige wie am Zwischenstand (.qo-pt-platz), daneben der Wechsel „Das Finale läuft“ → Titel und
   Geschichte; seine Schichten (warten, titel) füllen nur ihn. */
.qo-pult .qo-pe-wechsel { position: relative; flex: 1 1 auto; align-self: stretch; min-width: 0; overflow: hidden; padding: 0 .4cqmin; }
.qo-pult .qo-pe-wechsel > .qo-pe-warten, .qo-pult .qo-pe-wechsel > .qo-pe-titel { padding: 0; }

/* ---- RUNDENVORSCHAU: mein Satz zur Runde; rechts die Tafel wie in der Auflösung ---------------- */
.qo-pult-v .qo-rang .qo-z-pzahl { color: var(--t0); }

@container (max-width: 900px) {
  .qo-pult .qo-pt-satz { font-size: max(11px, 2.9cqmin); }
  .qo-pult .qo-pt-platz { padding-right: 1.2cqmin; }
  .qo-pult .qo-pt-taste .sp-jubel { width: 25cqmin; padding: .4cqmin 1cqmin; }
  .qo-pult .qo-pt-taste .sp-jubel-t em { display: none; }
  .qo-pult .qo-pe-feld .sp-jubel { width: auto; padding: .4cqmin 1cqmin; }
  .qo-pult .qo-pe-feld .qo-e-knoepfe { gap: .6cqmin; }
}
@media (prefers-reduced-motion: reduce) { .qo-pult-t .qo-pt-text, .qo-pult .qo-pt-platz .qo-sprung { opacity: 1; transform: none; } .qo-pult .qo-pe-frage b { animation: none; } }

/* Die Tafel rechts: beide Spalten gleich hoch — die Wörter stehen auf einer Linie, die Zahlen auf einer Mitte. */
.qo-pult .qo-rang-in { align-items: stretch; padding-top: 1.1cqmin; padding-bottom: 1.1cqmin; }
.qo-pult .qo-rang-p, .qo-pult .qo-rang-s { align-self: stretch; grid-template-rows: auto minmax(0, 1fr); align-items: center; }
.qo-pult .qo-summe { line-height: 1; }
/* Zwischenstand: mein Stand rechts in der Anzeige */
.qo-pult .qo-pt-stand b { color: var(--disp-fest); text-shadow: var(--disp-leucht-fest, none); font-size: max(16px, calc(4.6cqmin * var(--schrift, 1))); }
/* Abendende: Jubeln ist dort eine Taste unter mehreren.
   DER GRUND DER TASTEN KOMMT AUS DER ROLLE, NIE AUS DEM SET (Tobis Fund 16 vom 26.10.2026: bei Anime, Küche, Sagenwelt, Erfinder,
   Weltall, Geschichte, Musik stand helle Schrift auf hellen Tasten, 1,0–2,8 : 1). Die Tasten liehen sich --rang-grund, den Grund der
   Rangtafel — deren Tinte aber stellt jedes Set nur an der Tafel selbst ein (.qo-rang …), nie an den Tasten. Jetzt: dunkle Rolle
   (--g2/--g0) mit heller Schrift (--t0) für alle Sets. Ein Set gibt den Tasten des
   Abendendes keinen eigenen Grund und keine eigene Schriftfarbe (finale-pruefen.mjs misst es). */
.qo-pult .qo-pe-feld .sp-jubel { background: linear-gradient(180deg, color-mix(in srgb, var(--g2) 90%, #000), var(--g0)); color: var(--t0);
  box-shadow: inset 0 0 0 .3cqmin color-mix(in srgb, var(--acc2) 70%, transparent), inset 0 .3cqmin 0 rgba(255, 255, 255, .08); }
.qo-pult .qo-pe-feld .sp-jubel.gejubelt { background: color-mix(in srgb, var(--acc2) 40%, var(--g1)); }
.qo-pult .qo-pe-feld .sp-jubel-wort { font-family: var(--f-display); font-size: max(9px, calc(1.9cqmin * min(var(--schrift, 1), 1.25))); letter-spacing: .02em; text-transform: none; }
.qo-pult .qo-rang .qo-z-d::before { content: none; }
/* Die Wand über dem Pult ist niedriger als über der alten Leiste: Die eigene Kurzzeile der Tafel („88 bis Lea · 52 vor Ben") bleibt EINE Zeile — zweizeilig lief sie aus ihrer Bahn. */
.qo-mit-pult.zw-zweizeilig .zw-zeile .zw-tag.du .teil, .qo-mit-pult.zw-zweizeilig .zw-zeile .zw-tag.du .trenn { display: inline; }

/* Der Titel ist EINE Zeile: Passt er nicht, geht zuerst sein Zusatz („3 Plätze"), dann wird er kleiner. */
.qo-pult .qo-pe-tname.ohne-wert i { display: none; }
/* Passt er auch klein nicht in eine Zeile, steht er in zwei (online.js, pultPasseImmer) — die Geschichte dann in einer. */
.qo-pult .qo-pe-zwei .qo-pe-tname { white-space: normal; overflow-wrap: normal; text-wrap: balance; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; }
.qo-pult .qo-pe-zwei .qo-pe-gesch { max-height: 1.16em; white-space: nowrap; }
.qo-pult .qo-pe-gesch.qo-pe-weg { display: none; }
/* Auf kleinen Schirmen nimmt das Pult mehr vom Fenster (die Taste braucht 48 px): Die Tafel darüber setzt ihre Größen eine Stufe kleiner, sonst laufen die Kurzzeilen aus ihren Bahnen. (Am Kind gesetzt: Ein Container kann sich nicht selbst abfragen.) */
@container (max-width: 900px) { .qo-mit-pult.qo-t > * { --zw-s: .76; } }
/* „Alle eingeloggt" in der Tinte der Anzeige (auf dem Wunschzettel stand es gold auf hell). */
.qo-alle .qo-pult .qo-drin .qo-tischwort b { color: var(--disp-an); }

/* =====================================================================
   DIE UHR IM KOPF, DAS PULT IN EINER REIHE (Tobi 01.10.: „Können wir den Timer nach oben in die
   Leiste verschieben, also neben das Kronen-Symbol, und die Leiste unten kleiner machen, dass die
   nicht so viel Platz einnimmt"). Die Uhr steht rechts im Kopf neben Krone und Zahnrad — in der
   Gestalt des Sets, wie am Fernseher (online.js, kopfUhrNehmen). Das Pult hat nur noch eine Reihe:
   Buddy · Blase · Anzeige · Taste — so hoch wie die alte Leiste (14,6 statt 21,5 cqmin).
   ===================================================================== */
.qn-buehne.qo-schirm.qo-mit-pult { --qo-leiste: calc(max(14.6cqmin, 66px) + (var(--schrift, 1) - 1) * 7cqmin); }
.qo-leiste.qo-pult { grid-template-columns: 14cqmin 27cqmin minmax(0, 1fr) auto; grid-template-rows: minmax(0, 1fr); row-gap: 0; padding: 2.1cqmin 3cqmin 1.3cqmin 1cqmin; }
.qo-leiste.qo-pult .qo-buddy, .qo-leiste.qo-pult .qo-sagt, .qo-leiste.qo-pult .qo-display, .qo-leiste.qo-pult .qo-los, .qo-leiste.qo-pult .qo-rang { grid-row: 1; }
/* Blase und Anzeige gleich hoch — eine Kante oben, eine unten */
.qo-leiste.qo-pult .qo-sagt { align-self: stretch; height: auto; }
/* Der Buddy sitzt in der niedrigeren Reihe: kleiner, der Kopf bleibt unter der Kante */
.qo-pult .qo-buddy-fig { width: 14.6cqmin; height: 14.6cqmin; margin-left: -7.3cqmin; bottom: -2.2cqmin; }
.qo-pult .qo-buddy::before { top: 22%; bottom: -1.4cqmin; }
.qo-pult .qo-buddy::after { bottom: -1.4cqmin; height: 2.4cqmin; }
@container (max-width: 900px) {
  .qo-leiste.qo-pult { grid-template-columns: 12.5cqmin 25cqmin minmax(0, 1fr) auto; padding-top: 1.9cqmin; }
  .qo-pult .qo-buddy-fig { width: 13.4cqmin; height: 13.4cqmin; margin-left: -6.7cqmin; bottom: -1.9cqmin; }
  .qo-pult .qo-buddy::before { top: 20%; }
  .qo-pult .qo-buddy::after { height: 2.1cqmin; }
}

/* Die Uhr im Kopf: so groß wie Krone und Zahnrad daneben, die Zahl gut lesbar */
.qn-buehne.qo-schirm.qo-mit-pult .qn-kopf .qn-uhr { display: block; }
/* skaliert mit Krone und Zahnrad (Tobi 04.11.: „kann man doch einfach runterskalieren“) — keine Mindestgröße in px mehr */
.qo-mit-pult .qn-kopf .qn-ring { width: 7.4cqmin; height: 7.4cqmin; }
.qo-mit-pult .qn-kopf .qn-uhr { width: calc(7.4cqmin * var(--qn-uhr-fb, 1)); height: calc(7.4cqmin * min(var(--qn-uhr-fh, 1), 1.16)); }   /* die Faktoren der Gestalt (qn.css) */
.qo-mit-pult .qn-kopf .qo-kopfuhr [data-feld="sekunden"] { font-size: 3cqmin !important; }
.qo-mit-pult .qn-kopf .qn-ring b { font-size: 3cqmin; }
.qo-mit-pult .qn-kopf .qn-weiterwort { font-size: max(9px, 1.85cqmin); }
/* Der Ring der Vorgabe (Sets ohne eigene Uhr) läuft im Takt der Engine statt als eigene Animation */
.qo-kopfuhr.qn-ring .lauf { animation: none; stroke-dashoffset: calc((1 - var(--anteil, 1)) * 264); transition: stroke-dashoffset 140ms linear; }
/* Schmale Schirme: Im Kopf bleibt neben der Uhr nur, was man braucht — „weiter in" und die Marke
   („Auflösung", „Stand") gehen; die Uhr in der Gegenfarbe und das Pult sagen dasselbe.
   NICHT in der Rundenvorschau (.rv-wand; Tobi 02.10.: „Rundenvorschau: oben der Text fehlt"): Dort
   steht im Kopf sonst nichts — keine Kategorie, keine Marke —, und das Pult zählt nicht mehr mit.
   Ohne „weiter in" war die Uhr auf S, M und L eine Zahl ohne Wort; Platz ist im leeren Kopf genug. */
@container (max-width: 1200px) { .qo-mit-pult:not(.rv-wand) .qn-kopf .qn-weiterwort { display: none; } }
@container (max-width: 900px) { .qo-mit-pult .qn-kopf .qn-kopf-rechts .qn-marke { display: none; } }

/* =====================================================================
   DIE BLASE LENKT NICHT AB (Tobi 02.10., online-buddy.js Regel 2). Ein Satz kommt weich herein —
   ohne Sprung, ohne Wort-für-Wort; Schwung haben nur Urteil, Platz und Finale. Nach gut drei
   Sekunden wird die Blase LEISE: Sie steht noch da (ihr Platz bleibt gefüllt), zieht aber nicht mehr.
   ===================================================================== */
.qo-loge .qo-sagt { transition: opacity 520ms var(--k-ein), transform var(--d-mittel) var(--k-schnapp), filter 520ms var(--k-ein); }
.qo-loge .qo-sagt.an.leise { opacity: .6; }
.qo-sagt-text.weich { animation: qo-satz-weich 340ms var(--k-ein) both; }
@keyframes qo-satz-weich { from { opacity: 0; transform: translateY(.28em); } to { opacity: 1; transform: none; } }
/* ERST AUS, DANN EIN (online.js, logeSag; Generaldurchlauf 02.11., M6): Der Satz, der steht, blendet kurz aus — erst dann kommt der neue in
   denselben Absatz. Nie zwei Sätze übereinander; die Blase selbst bleibt an. */
.qo-sagt-text.aus { animation: qo-satz-aus 120ms cubic-bezier(.5, 0, .75, .4) both; }
@keyframes qo-satz-aus { from { opacity: var(--von, 1); } to { opacity: 0; transform: translateY(-.16em); } }
/* Der folgende Satz setzt nicht bei null ein, sondern gleich lesbar — so steht der Kasten zwischen zwei Sätzen kaum ein Bild leer. */
.qo-sagt-text.nach { animation: qo-satz-nach 300ms var(--k-ein) both; }
@keyframes qo-satz-nach { from { opacity: .4; transform: translateY(.18em); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .qo-sagt-text.weich, .qo-sagt-text.aus, .qo-sagt-text.nach { animation: none; } }

/* =====================================================================
   WELTREISE · der Fensterplatz (data-welt="weltreise" — online.js liest sie an der Uhr „fallblatt" ab)
   Die Kabine am Abend: die Wand in dunklem Blaugrau, darüber die Leiste des Kabinenlichts (Azur). Der
   Buddy sitzt AM FENSTER: Hinter ihm steht statt einer Lehne das ovale Fenster mit dickem Rahmen —
   draußen Azur über Koralle, ein Wolkenband, ein Stern. Die ANZEIGE ist der Bildschirm in der
   Rückenlehne: dunkel, darauf fein die Flugkarte (gestrichelte Route mit kleinem Flieger), die Wahl
   steht darauf wie das Ziel. Die TASTE ist das Anschnallzeichen: ein Leuchtfeld im hellen Kabinen-
   rahmen — leer dunkel, mit der Wahl leuchtet es warm, abgeschickt ist man eingecheckt (der Haken).
   Der Buddy spricht in DURCHSAGEN: die Blase als Ansage mit dem Gong davor.
   Kunststoff und Glas sind Material des Gegenstands; Licht, Schrift und Zustände kommen aus den Rollen
   des Sets. Bewegung nur transform und opacity.
   ===================================================================== */
.qo-pult[data-welt="weltreise"] {
  /* Die Flugkarte auf dem Bildschirm: eine Route in Weiß (leise — sie trägt keine Farbe des Sets). */
  --qo-wr-route: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 60'%3E%3Cpath d='M6 50C50 6 130 4 176 30' fill='none' stroke='%23fff' stroke-width='1.6' stroke-dasharray='5 5' opacity='.22'/%3E%3Ccircle cx='6' cy='50' r='2.6' fill='%23fff' opacity='.32'/%3E%3Ccircle cx='190' cy='38' r='2.6' fill='%23fff' opacity='.32'/%3E%3Cpath d='M176 30l-9-1.4-1.2 1.6 6 1.6-3.4 4.2 1.6.4 4.6-3.6 5.6 1.6.8-1.6-4.6-2.6z' fill='%23fff' opacity='.4'/%3E%3C/svg%3E");
  --pult-grund: radial-gradient(60% 140% at 6% 50%, color-mix(in srgb, var(--acc2) 18%, transparent), transparent 70%),
    repeating-linear-gradient(90deg, transparent 0 22cqmin, rgba(0, 0, 0, .28) 22cqmin 22.2cqmin, rgba(255, 255, 255, .04) 22.2cqmin 22.4cqmin),
    linear-gradient(180deg, color-mix(in srgb, var(--acc) 12%, #1d2734), color-mix(in srgb, var(--acc) 6%, #0f151d) 60%, #0b1016);
  --kante: linear-gradient(180deg, color-mix(in srgb, var(--acc) 70%, #fff), var(--acc) 45%, color-mix(in srgb, var(--acc) 40%, #0b1016)); --kante-h: .6cqmin;
  /* Die Route steht rechts vor „eingeloggt“ wie die Motive der anderen Welten (--qo-motiv-r, unten) — vorher bei 66 % mitten unter der Schrift. */
  --disp-grund: var(--qo-wr-route) right var(--qo-motiv-r) center / 20cqmin 6cqmin no-repeat,
    linear-gradient(90deg, color-mix(in srgb, var(--acc) 10%, transparent) 1px, transparent 1px) 0 0 / 3.2cqmin 100%,
    linear-gradient(180deg, color-mix(in srgb, var(--acc) 10%, transparent) 1px, transparent 1px) 0 0 / 100% 3.2cqmin,
    radial-gradient(90% 160% at 30% 50%, color-mix(in srgb, var(--acc) 16%, #0a1520), #05090e 80%);
  --disp-rahmen: inset 0 0 0 .3cqmin #050709, inset 0 0 0 .55cqmin color-mix(in srgb, #9aa4b0 40%, #1b222b), 0 .9cqmin 2cqmin rgba(0, 0, 0, .6); --disp-rund: 1.1cqmin;
  --disp-glas: linear-gradient(115deg, rgba(255, 255, 255, .06), transparent 38%);
  --disp-leer: color-mix(in srgb, var(--acc) 30%, #4a5664); --disp-an: color-mix(in srgb, var(--acc) 62%, var(--t0)); --disp-fest: var(--t0);
  --disp-neben: color-mix(in srgb, var(--acc) 40%, var(--t1)); --disp-mittel: color-mix(in srgb, var(--acc) 20%, var(--t0));
  --disp-leucht: 0 0 .8cqmin color-mix(in srgb, var(--acc) 60%, transparent); --disp-leucht-fest: 0 0 .7cqmin color-mix(in srgb, var(--t0) 34%, transparent);
  --disp-trenn: color-mix(in srgb, var(--acc) 30%, transparent);
  --taste-rahmen: linear-gradient(180deg, #cfd5dc, #9aa3ad 55%, #b9c0c8); --taste-rund: 1.6cqmin;
  --taste-schatten: 0 1cqmin 2.4cqmin rgba(0, 0, 0, .6), inset 0 .25cqmin 0 rgba(255, 255, 255, .6);
  --rang-grund: radial-gradient(90% 160% at 30% 50%, color-mix(in srgb, var(--acc) 14%, #0a1520), #05090e 80%);
  --qo-motiv-r: 19.5cqmin; --qo-motiv-frei: calc(var(--qo-motiv-r) + 20cqmin);
}
/* Wo die Route steht — wie in pult/rennsport.css: S rückt sie vor das breitere „eingeloggt“, die Lobby an den Rand; wo der Satz die
   ganze Anzeige braucht (Abendende, Lobby auf S, Handy), tritt sie ab. */
@container (max-width: 900px) { .qo-pult[data-welt="weltreise"] { --qo-motiv-r: 23.6cqmin; } }
.qo-pult.qla-pult[data-welt="weltreise"] { --qo-motiv-r: 2.6cqmin; }
.qo-pult.qo-pult-e[data-welt="weltreise"], .qo-pult.k1-pult[data-welt="weltreise"] { --qo-motiv-r: -40cqmin; }
@container (max-width: 900px) { .qo-pult.qla-pult[data-welt="weltreise"] { --qo-motiv-r: -40cqmin; } }
/* DAS FENSTER statt der Lehne: das Oval mit dem hellen Rahmen, draußen der Abend. */
.qo-pult[data-welt="weltreise"] .qo-buddy::before {
  left: 1%; right: 1%; top: -3%; bottom: -.6cqmin; border-radius: 44% / 36%;
  background:
    radial-gradient(circle at 70% 22%, #fff 0 .14cqmin, transparent .26cqmin),
    radial-gradient(60% 18% at 40% 64%, color-mix(in srgb, #fff 62%, var(--acc2)) 0, transparent 70%),
    radial-gradient(70% 20% at 66% 74%, color-mix(in srgb, #fff 46%, var(--acc2)) 0, transparent 72%),
    linear-gradient(180deg, color-mix(in srgb, var(--acc) 40%, #0b1a2e) 0, var(--acc) 42%, color-mix(in srgb, var(--acc) 40%, var(--acc2)) 62%, var(--acc2) 78%, color-mix(in srgb, var(--acc2) 70%, #fff) 100%);
  box-shadow: inset 0 0 0 .9cqmin #d5dbe2, inset 0 0 0 1.25cqmin #8f99a4, inset 0 .9cqmin 1.6cqmin rgba(0, 0, 0, .35), 0 .5cqmin 1.4cqmin rgba(0, 0, 0, .5);
}
/* Die Ansage: eine Karte der Kabine, vorn der Gong (zwei Ringe). */
.qo-pult[data-welt="weltreise"] .qo-sagt { border-radius: 1.2cqmin; background: #0c1219; padding-left: 4.4cqmin;
  box-shadow: inset 0 .4cqmin 0 var(--acc), inset 0 0 0 .2cqmin color-mix(in srgb, var(--acc) 40%, transparent), 0 .8cqmin 2cqmin rgba(0, 0, 0, .55); }
.qo-pult[data-welt="weltreise"] .qo-sagt::before { background: #0c1219; }
.qo-pult[data-welt="weltreise"] .qo-sagt::after {
  content: ""; position: absolute; left: 1.4cqmin; top: 50%; width: 2.2cqmin; height: 2.2cqmin; margin-top: -1.1cqmin; border-radius: 50%;
  background: radial-gradient(circle, var(--acc2) 0 22%, transparent 24% 44%, color-mix(in srgb, var(--acc2) 70%, transparent) 46% 56%, transparent 58% 78%, color-mix(in srgb, var(--acc2) 40%, transparent) 80% 90%, transparent 92%);
}
.qo-pult[data-welt="weltreise"] .qo-sagt-text { color: var(--t0); }
/* Das Anschnallzeichen: Das Leuchtfeld liegt im Kabinenrahmen; vorn das Zeichen des Gurts. */
.qo-pult[data-welt="weltreise"] .qo-los .qo-kappe { box-shadow: 0 0 0 .3cqmin #5d6772, inset 0 .3cqmin .6cqmin rgba(0, 0, 0, .45); }
.qo-pult[data-welt="weltreise"] .qo-los[data-zustand="leer"] .qo-kappe { background: linear-gradient(180deg, #1a222c, #0e141b); color: color-mix(in srgb, var(--t1) 80%, var(--acc)); }
.qo-pult[data-welt="weltreise"] .qo-los[data-zustand="gewaehlt"] .qo-kappe {
  background: radial-gradient(120% 140% at 50% 30%, color-mix(in srgb, #fff 55%, var(--acc2)), var(--acc2) 62%, color-mix(in srgb, var(--acc2) 80%, var(--g0)));
  color: var(--auf-acc2);
  box-shadow: 0 0 0 .3cqmin #5d6772, 0 0 3cqmin color-mix(in srgb, var(--acc2) 62%, transparent), inset 0 .3cqmin 0 rgba(255, 255, 255, .4);
}
.qo-pult[data-welt="weltreise"] .qo-los[data-zustand="gesendet"] .qo-kappe {
  background: linear-gradient(180deg, color-mix(in srgb, var(--acc) 86%, var(--t0)), var(--acc) 55%, color-mix(in srgb, var(--acc) 82%, var(--g0)));
  color: var(--auf-acc); box-shadow: 0 0 0 .3cqmin #5d6772, inset 0 .5cqmin .9cqmin rgba(0, 0, 0, .3);
}
.qo-pult[data-welt="weltreise"] .qo-los .qo-kappe::before {
  content: ""; display: inline-block; vertical-align: middle; flex: none; width: 3.6cqmin; height: 2.4cqmin; margin-right: .8cqmin; background: currentColor; opacity: .9;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 24'%3E%3Cpath d='M0 9h10v6H0zM26 9h10v6H26z'/%3E%3Crect x='10' y='4' width='16' height='16' rx='3' fill='none' stroke='%23000' stroke-width='3'/%3E%3Crect x='15' y='9.5' width='6' height='5' rx='1'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 24'%3E%3Cpath d='M0 9h10v6H0zM26 9h10v6H26z'/%3E%3Crect x='10' y='4' width='16' height='16' rx='3' fill='none' stroke='%23000' stroke-width='3'/%3E%3Crect x='15' y='9.5' width='6' height='5' rx='1'/%3E%3C/svg%3E") center / contain no-repeat;
}
.qo-pult[data-welt="weltreise"] .qo-los[data-zustand="gesendet"] .qo-kappe::before { display: none; }
.qo-pult[data-welt="weltreise"] .qo-los[data-zustand="gewaehlt"] .qo-kappe { animation: qo-wr-zeichen 2.4s ease-in-out infinite; }
@keyframes qo-wr-zeichen { 0%, 100% { opacity: 1; } 50% { opacity: .86; } }
@media (prefers-reduced-motion: reduce) { .qo-pult[data-welt="weltreise"] .qo-los[data-zustand="gewaehlt"] .qo-kappe { animation: none; } }
