/* ============================================================
   quiz-experiences-robot.css — Styles der Erfahrung „Roboterrennen".
   Komplett auf body.qz-kahoot gescopt (aktiv nur in Spielszenen).
   Präfix: .robo- · Machart wie quiz-experiences.css (U-Boot).
   ============================================================ */

body.qz-robot main#app { width: 100%; max-width: 96rem; box-sizing: border-box; }
body.qz-robot .host-bar { width: min(100%, 92rem); margin-inline: auto; box-sizing: border-box; }

/* ---------- Raumstation-Szene (Beamer) ---------- */
body.qz-kahoot .robo-scene {
  position: relative; isolation: isolate; overflow: hidden;
  width: min(100%, 92rem);
  height: clamp(22rem, min(56vh, calc((100vw - 2rem) * .42)), 40rem);
  border: 1px solid rgba(120, 220, 255, .3); border-radius: 1.15rem;
  margin: .55rem auto;
  background:
    radial-gradient(circle at 16% 10%, rgba(103, 232, 255, .14), transparent 30%),
    radial-gradient(circle at 86% 20%, rgba(255, 210, 62, .07), transparent 26%),
    linear-gradient(180deg, #1b2334 0%, #131a29 52%, #0a0f1a 100%);
  box-shadow: inset 0 -4rem 7rem rgba(0, 0, 0, .4), 0 1rem 2.8rem rgba(0, 0, 0, .22);
}
body.qz-kahoot .robo-scene::after {
  content: ""; position: absolute; inset: 0; z-index: 20; pointer-events: none;
  background: radial-gradient(ellipse at center, transparent 40%, rgba(0, 0, 0, .4));
  mix-blend-mode: multiply;
}
body.qz-kahoot .robo-scene[data-threat="warn"] { box-shadow: inset 0 0 0 .18rem rgba(255, 204, 63, .6), inset 0 -4rem 7rem rgba(0, 0, 0, .4); }
body.qz-kahoot .robo-scene[data-threat="danger"],
body.qz-kahoot .robo-scene--alarm, body.qz-kahoot .robo-scene--caught {
  border-color: rgba(255, 84, 112, .9);
  background:
    radial-gradient(circle at 60% 38%, rgba(255, 86, 74, .18), transparent 34%),
    linear-gradient(180deg, #451523 0%, #22101f 48%, #0a0612 100%);
  box-shadow: inset 0 0 0 .2rem rgba(255, 76, 88, .65), inset 0 -4rem 7rem rgba(0, 0, 0, .45);
}
body.qz-kahoot .robo-scene--cheer { border-color: rgba(120, 255, 190, .55); }

/* Boden mit Laufgitter + Fenster mit Sternen */
body.qz-kahoot .robo-floor {
  position: absolute; z-index: 0; left: 0; right: 0; bottom: 0; height: 26%;
  background:
    repeating-linear-gradient(90deg, rgba(120, 200, 255, .12) 0 2px, transparent 2px 3.2rem),
    linear-gradient(180deg, rgba(46, 66, 96, .5), rgba(8, 12, 20, .9));
  border-top: 2px solid rgba(120, 200, 255, .25);
}
body.qz-kahoot .robo-windows {
  position: absolute; z-index: 0; left: 4%; right: 12%; top: 9%; height: 17%;
  display: flex; gap: 4%;
}
body.qz-kahoot .robo-windows i {
  flex: 1; border-radius: 1rem; border: 2px solid rgba(120, 200, 255, .3);
  background:
    radial-gradient(circle at 24% 36%, rgba(255, 255, 255, .75) 1px, transparent 2px),
    radial-gradient(circle at 66% 60%, rgba(255, 255, 255, .6) 1px, transparent 2px),
    radial-gradient(circle at 82% 28%, rgba(255, 255, 255, .5) 1px, transparent 2px),
    linear-gradient(180deg, #060a14, #0b1626);
  opacity: .85;
}
body.qz-kahoot .robo-sparks { position: absolute; inset: 0; z-index: 5; pointer-events: none; }
body.qz-kahoot .robo-sparks i {
  position: absolute; bottom: -1rem; width: .3rem; height: .3rem; border-radius: 50%;
  background: rgba(255, 214, 90, .8); box-shadow: 0 0 .5rem rgba(255, 214, 90, .8);
  animation: robo-rise linear infinite;
}
@keyframes robo-rise { from { transform: translateY(0); opacity: .9; } to { transform: translateY(-40vh); opacity: 0; } }

/* ---------- Figuren ---------- */
body.qz-kahoot .robo-bot {
  position: absolute; z-index: 8; display: block; line-height: 0;
  width: clamp(9rem, 17vw, 15rem); left: -14%; bottom: 16%;
  pointer-events: none; user-select: none; will-change: left;
  transition: left .85s linear;
  filter: drop-shadow(0 1rem 1.6rem rgba(0, 0, 0, .5));
  animation: robo-bot-hover 2.6s ease-in-out infinite;
}
body.qz-kahoot .robo-bot svg { width: 100%; height: auto; display: block; }
body.qz-kahoot .robo-svg__eye { animation: robo-eye 1.6s ease-in-out infinite; }
body.qz-kahoot .robo-svg__antenna { animation: robo-eye 1.1s ease-in-out infinite; }
@keyframes robo-eye { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
@keyframes robo-bot-hover { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-.5rem); } }
body.qz-kahoot .robo-scene[data-threat="danger"] .robo-bot { filter: drop-shadow(0 0 1.6rem rgba(255, 60, 70, .75)); }
body.qz-kahoot .robo-bot--intro { left: 8% !important; bottom: 15%; }
body.qz-kahoot .robo-bot--alarm { left: 12% !important; width: clamp(11rem, 21vw, 18rem); }
body.qz-kahoot .robo-bot--caught { left: 50% !important; transform: translateX(-50%); width: clamp(12rem, 24vw, 20rem); }

body.qz-kahoot .robo-door {
  position: absolute; z-index: 6; right: 2.5%; bottom: 15%;
  width: clamp(4.5rem, 8vw, 7rem); line-height: 0; pointer-events: none;
  filter: drop-shadow(0 0 1.2rem rgba(103, 232, 255, .4));
}
body.qz-kahoot .robo-door svg { width: 100%; height: auto; display: block; }

body.qz-kahoot .robo-crew {
  position: absolute; z-index: 9; left: 16%; bottom: 19%;
  pointer-events: none; user-select: none; will-change: left;
  transition: left .85s linear;
}
body.qz-kahoot .robo-crew__chips {
  min-height: clamp(3.7rem, 6.8vw, 5.6rem);
  display: flex; align-items: flex-end;
}
body.qz-kahoot .robo-runner {
  position: relative; z-index: 10;
  flex: 0 0 clamp(2.7rem, 4.5vw, 4rem);
  width: clamp(2.7rem, 4.5vw, 4rem);
  height: clamp(3.7rem, 6.4vw, 5.5rem);
  margin-left: clamp(-1rem, -1.1vw, -.62rem);
  display: grid; place-items: end center;
  line-height: 0; overflow: visible;
  filter: drop-shadow(0 .28rem .3rem rgba(0, 0, 0, .42));
}
body.qz-kahoot .robo-runner:first-child { margin-left: 0; }
body.qz-kahoot .robo-runner__rig {
  width: 100%; height: 100%;
  display: grid; place-items: center;
  overflow: visible;
}
body.qz-kahoot .robo-runner__rig > .avstudio-rig {
  width: 100%; height: 100%;
  max-width: none; aspect-ratio: auto;
}
body.qz-kahoot .robo-runner .avstudio-rig__motion { animation-delay: var(--robo-runner-delay, 0s); }
body.qz-kahoot .robo-runner--fallback { animation: robo-runbob .9s ease-in-out var(--robo-runner-delay, 0s) infinite; }
body.qz-kahoot .robo-runner--fallback .robo-chip { flex: 0 0 auto; margin: 0; }
body.qz-kahoot .robo-crew__chips > .robo-chip--more {
  position: relative; z-index: 20;
  align-self: center; margin-left: -.35rem;
}
@keyframes robo-runbob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-.45rem); } }
body.qz-kahoot .robo-crew.is-thrust .robo-crew__chips { animation: robo-thrust .7s ease-out; }
@keyframes robo-thrust { 25% { transform: translateX(1rem); filter: brightness(1.35); } }
body.qz-kahoot .robo-crew--cheer { left: 62%; bottom: 22%; }
body.qz-kahoot .robo-crew--cheer .robo-runner--fallback { animation: robo-cheerjump 1s ease-in-out var(--robo-runner-delay, 0s) infinite; }
@keyframes robo-cheerjump { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-.9rem); } }

/* Avatar-Chips (Crew, Zonen, Finale) */
body.qz-kahoot .robo-chip {
  display: inline-flex; align-items: center; justify-content: center;
  width: 2.3rem; height: 2.3rem; border-radius: 50%;
  background: rgba(10, 18, 32, .85); border: 2px solid rgba(140, 220, 255, .5);
  overflow: hidden; box-shadow: 0 .25rem .7rem rgba(0, 0, 0, .4);
}
body.qz-kahoot .robo-chip > * { max-width: 100%; max-height: 100%; }
body.qz-kahoot .robo-chip__fallback { font-size: 1.15rem; line-height: 1; }
body.qz-kahoot .robo-chip--more {
  width: auto; min-width: 2.3rem; padding: 0 .4rem; border-radius: 999px;
  color: #fff; font-weight: 800; font-size: .85rem;
}

/* ---------- Beamer-HUD ---------- */
body.qz-kahoot .robo-hud {
  display: flex; align-items: center; gap: .8rem; flex-wrap: wrap;
  width: min(100%, 92rem); margin: .4rem auto 0;
  padding: .45rem .8rem; border-radius: .9rem;
  background: rgba(8, 13, 26, .8); border: 1px solid rgba(255, 255, 255, .15); color: #fff;
  backdrop-filter: blur(6px);
  font-weight: 700; font-size: 1.05rem;
}
body.qz-kahoot .robo-hud__level { white-space: nowrap; }
body.qz-kahoot .robo-hud__timer { margin-left: auto; font-variant-numeric: tabular-nums; }
body.qz-kahoot .robo-hud__timer--zone { font-size: 1.35rem; }
body.qz-kahoot .robo-hud__stat { font-weight: 500; opacity: .9; font-size: .95rem; }
body.qz-kahoot .robo-hud__danger { padding: .2rem .55rem; border-radius: 999px; font-size: .88rem; background: rgba(67, 199, 122, .18); color: #bfffd6; white-space: nowrap; }
body.qz-kahoot .robo-hud__danger[data-state="warn"] { background: rgba(255, 193, 46, .18); color: #ffe7a1; }
body.qz-kahoot .robo-hud__danger[data-state="danger"] { background: rgba(255, 74, 92, .24); color: #ffd4da; }
body.qz-kahoot .robo-hud__danger[data-state="safe"] { background: rgba(67, 199, 122, .26); color: #d6ffe6; }
body.qz-kahoot .robo-progress {
  flex: 1 1 12rem; height: 1.05rem; border-radius: .6rem; overflow: hidden;
  background: rgba(255, 255, 255, .18); min-width: 8rem;
}
body.qz-kahoot .robo-progress--host { min-width: 14rem; height: 1.25rem; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12); }
body.qz-kahoot .robo-progress__fill {
  height: 100%; width: 0; border-radius: .6rem;
  background: linear-gradient(90deg, #ffb02e, #ffe14d);
  transition: width .8s ease;
}
body.qz-kahoot .robo-hint { width: min(100%, 92rem); margin: .35rem auto; color: rgba(255, 255, 255, .85); font-size: .95rem; }

/* Leben (gemeinsam) */
body.qz-kahoot .robo-lives { display: inline-flex; align-items: center; gap: .1rem; white-space: nowrap; font-size: 1.05rem; }
body.qz-kahoot .robo-lives__off { opacity: .45; filter: grayscale(1); }
body.qz-kahoot .robo-lives__lbl { font-size: .85rem; opacity: .85; margin-left: .2rem; }
body.qz-kahoot .robo-lives--mini { font-size: .95rem; }

/* ---------- Info-/Alarm-Boxen ---------- */
body.qz-kahoot .robo-introbox {
  position: relative; z-index: 30; max-width: 36rem; margin: 1.2rem auto;
  padding: 1rem 1.4rem; border-radius: 1rem; text-align: center; color: #fff;
  background: rgba(9, 15, 32, .8); backdrop-filter: blur(3px);
}
body.qz-kahoot .robo-scene--intro .robo-introbox { max-width: min(60%, 48rem); margin: 1.3rem 0 0 2rem; text-align: left; background: rgba(6, 11, 24, .85); }
body.qz-kahoot .robo-introbox h2 { margin: .2rem 0 .5rem; }
body.qz-kahoot .robo-introbox__level {
  display: inline-block; padding: .15rem .7rem; border-radius: 1rem;
  background: rgba(255, 255, 255, .16); font-weight: 800; font-size: .95rem;
}
body.qz-kahoot .robo-tutorial { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .6rem; margin: .9rem 0 .65rem; }
body.qz-kahoot .robo-tutorial__step { display: grid; grid-template-columns: auto 1fr; gap: .1rem .45rem; align-content: start; min-height: 5.8rem; padding: .7rem; border: 1px solid rgba(255, 255, 255, .14); border-radius: .75rem; background: rgba(255, 255, 255, .08); }
body.qz-kahoot .robo-tutorial__step > span:last-child { grid-column: 1 / -1; font-size: .85rem; color: rgba(255, 255, 255, .78); line-height: 1.3; }
body.qz-kahoot .robo-tutorial__num { display: inline-grid; place-items: center; width: 1.45rem; height: 1.45rem; border-radius: 50%; background: #67e8ff; color: #10233a; font-weight: 900; }
body.qz-kahoot .robo-introbox__meta { margin: .35rem 0 0; color: rgba(255, 255, 255, .78); font-size: .85rem; display: flex; align-items: center; justify-content: flex-start; gap: .3rem; flex-wrap: wrap; }
body.qz-kahoot .robo-alarmbox {
  position: absolute; z-index: 30; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: min(88%, 48rem); padding: 1.2rem 1.6rem; border: .22rem solid #ff4f5e; border-radius: 1rem;
  text-align: center; color: #fff; background: rgba(69, 4, 16, .9);
  box-shadow: 0 0 2.4rem rgba(255, 48, 68, .35);
}
body.qz-kahoot .robo-alarmbox__eyebrow { font-weight: 900; letter-spacing: .14em; color: #ffb8c1; }
body.qz-kahoot .robo-alarmbox h2 { margin: .35rem 0; font-size: clamp(1.7rem, 3.6vw, 3.2rem); text-transform: uppercase; }
body.qz-kahoot .robo-alarmbox p { margin: .4rem 0; font-size: clamp(1rem, 2vw, 1.3rem); }
body.qz-kahoot .robo-alarmbox__count { display: inline-block; margin-top: .45rem; padding: .28rem .8rem; border-radius: 999px; background: #fff; color: #65101d; font-weight: 900; }

/* ---------- Schutzzonen (Beamer) ---------- */
body.qz-kahoot .robo-zonewrap { width: min(100%, 92rem); margin: .55rem auto; }
body.qz-kahoot .robo-zones { display: grid; gap: .8rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
body.qz-kahoot .robo-zones--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
body.qz-kahoot .robo-zones--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
body.qz-kahoot .robo-zone {
  min-height: clamp(11rem, 30vh, 17rem);
  border-radius: 1rem; padding: .75rem .9rem; color: #fff;
  border: .22rem solid var(--robo-zone, #67e8ff);
  /* Fallback zuerst: ältere Browser ohne color-mix() verwerfen die zweite
     background-Deklaration komplett und behalten die dunkle Fläche. */
  background: rgba(9, 15, 30, .85);
  background:
    radial-gradient(circle at 50% 0%, color-mix(in srgb, var(--robo-zone, #67e8ff) 26%, transparent), transparent 62%),
    rgba(9, 15, 30, .85);
  box-shadow: inset 0 0 2.4rem rgba(0, 0, 0, .45);
  display: flex; flex-direction: column; gap: .35rem;
}
body.qz-kahoot .robo-zone--c0 { --robo-zone: #ff6b81; }
body.qz-kahoot .robo-zone--c1 { --robo-zone: #58b6ff; }
body.qz-kahoot .robo-zone--c2 { --robo-zone: #ffd23e; }
body.qz-kahoot .robo-zone--c3 { --robo-zone: #52de97; }
body.qz-kahoot .robo-zone__name { margin: 0; display: flex; align-items: center; gap: .5rem; font-size: 1.05rem; }
body.qz-kahoot .robo-zone__letter {
  display: inline-grid; place-items: center; width: 2rem; height: 2rem; border-radius: .55rem;
  background: var(--robo-zone, #67e8ff); color: #0b1220; font-weight: 900; font-size: 1.2rem;
}
body.qz-kahoot .robo-zone__count { font-size: clamp(1.6rem, 3.4vw, 2.6rem); font-weight: 900; font-variant-numeric: tabular-nums; }
body.qz-kahoot .robo-zone__chips { display: flex; flex-wrap: wrap; gap: .25rem; align-content: flex-start; }
body.qz-kahoot .robo-zone.is-full { outline: .18rem solid rgba(255, 255, 255, .55); outline-offset: -.5rem; }
body.qz-kahoot .robo-zone.is-over {
  border-color: #ff2e44;
  animation: robo-over-pulse .8s ease-in-out infinite;
}
body.qz-kahoot .robo-zone.is-over .robo-zone__count::after { content: " ⚠"; }
@keyframes robo-over-pulse { 0%, 100% { box-shadow: inset 0 0 2.4rem rgba(0, 0, 0, .45); } 50% { box-shadow: inset 0 0 2.4rem rgba(255, 46, 68, .55); } }
body.qz-kahoot .robo-outside {
  display: flex; align-items: center; justify-content: center; gap: .6rem; flex-wrap: wrap;
  margin-top: .6rem; color: #ffe7a1; font-size: 1.05rem;
}
body.qz-kahoot .robo-outside__chips { display: inline-flex; gap: .25rem; }
body.qz-kahoot .robo-outside__ok { color: #bfffd6; }

/* ---------- Finale (Beamer) ---------- */
body.qz-kahoot .robo-final { text-align: center; color: #fff; padding: 1rem 0; }
body.qz-kahoot .robo-final__emoji { font-size: 4.5rem; line-height: 1.1; }
body.qz-kahoot .robo-final__team { font-size: 1.15rem; }
body.qz-kahoot .robo-final__board { list-style: none; margin: .6rem auto; padding: 0; max-width: 28rem; }
body.qz-kahoot .robo-final__board li {
  display: flex; align-items: center; gap: .6rem;
  padding: .4rem .8rem; margin: .3rem 0; border-radius: .7rem;
  background: rgba(255, 255, 255, .12); font-weight: 700;
}
body.qz-kahoot .robo-final__board .robo-final__score { margin-left: auto; }

/* ---------- Spielergerät ---------- */
body.qz-kahoot .robo-phud {
  display: flex; align-items: center; gap: .7rem; flex-wrap: wrap;
  color: #fff; font-size: .95rem; margin: .2rem 0 .5rem;
}
body.qz-kahoot .robo-progress--mini { flex: 1 1 8rem; height: .7rem; position: relative; overflow: visible; }
body.qz-kahoot .robo-phud__mine { font-weight: 800; white-space: nowrap; }
body.qz-kahoot .robo-phud__toward { opacity: .85; white-space: nowrap; }
body.qz-kahoot .robo-phud__bot {
  position: absolute; right: -.2rem; top: 50%; transform: translateY(-50%);
  font-size: 1rem; line-height: 1; opacity: 0; transition: opacity .4s ease;
}
body.qz-kahoot .robo-progress--mini.is-warn .robo-progress__fill { background: linear-gradient(90deg, #f7a600, #ffd23e); }
body.qz-kahoot .robo-progress--mini.is-danger .robo-progress__fill {
  background: linear-gradient(90deg, #c81e3e, #ff5470); animation: robo-danger-pulse .7s ease-in-out infinite;
}
@keyframes robo-danger-pulse { 0%, 100% { filter: brightness(1); } 50% { filter: brightness(1.5); } }

body.qz-kahoot .robo-boost {
  position: relative; isolation: isolate; overflow: hidden;
  display: block; width: 100%; min-height: 3.4rem; margin: 0 0 .25rem; padding: .85rem 1rem;
  border: 0; border-radius: 1rem; cursor: pointer;
  font-size: 1.25rem; font-weight: 800; color: #10233a;
  background: linear-gradient(180deg, #7fe4ff, #22a7d8);
  box-shadow: 0 .35rem 0 #10648a, 0 .6rem 1.2rem rgba(0, 0, 0, .3);
  animation: robo-boost-pulse 1.4s ease-in-out infinite;
}
body.qz-kahoot .robo-boost__fill { position: absolute; z-index: 0; inset: 0; width: 0; background: linear-gradient(90deg, #fff1a6, #b1f3ff); }
body.qz-kahoot .robo-boost__label { position: relative; z-index: 1; }
body.qz-kahoot .robo-boost.is-holding .robo-boost__fill { animation: robo-boost-hold .85s linear forwards; }
@keyframes robo-boost-hold { from { width: 0; } to { width: 100%; } }
body.qz-kahoot .robo-boost:active { transform: translateY(.2rem); box-shadow: 0 .15rem 0 #10648a; }
body.qz-kahoot .robo-boost:focus-visible, body.qz-kahoot .robo-zonetile:focus-visible { outline: .25rem solid #fff; outline-offset: .2rem; }
body.qz-kahoot .robo-boost[hidden] { display: none !important; }
body.qz-kahoot .robo-boost[hidden] + .robo-boost__help { display: none; }
body.qz-kahoot .robo-boost__help { margin: 0 0 .45rem; text-align: center; color: rgba(255, 255, 255, .75); font-size: .78rem; }
body.qz-kahoot .robo-boost__status { min-height: 1.2rem; text-align: center; color: #bfffd6; font-size: .84rem; font-weight: 700; }
@keyframes robo-boost-pulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.03); } }

body.qz-kahoot .robo-player-intro__lvl { font-weight: 800; margin: .2rem 0; }
body.qz-kahoot .robo-player-final { margin-top: .5rem; font-size: 1.05rem; }
body.qz-kahoot .robo-player-intro__dots { display: flex; gap: .4rem; justify-content: center; margin-top: .8rem; }
body.qz-kahoot .robo-player-intro__dots span {
  width: .55rem; height: .55rem; border-radius: 50%; background: #fff; opacity: .5;
  animation: robo-dot-bounce 1.1s ease-in-out infinite;
}
body.qz-kahoot .robo-player-intro__dots span:nth-child(2) { animation-delay: .15s; }
body.qz-kahoot .robo-player-intro__dots span:nth-child(3) { animation-delay: .3s; }
@keyframes robo-dot-bounce { 0%, 80%, 100% { transform: translateY(0); opacity: .5; } 40% { transform: translateY(-.4rem); opacity: 1; } }

/* Zonenwahl (Spieler) */
body.qz-kahoot .robo-zoneplayer__timer {
  text-align: center; font-size: 1.6rem; font-weight: 900; color: #fff;
  font-variant-numeric: tabular-nums; margin: .2rem 0 .45rem;
}
body.qz-kahoot .robo-zoneplayer__timer.is-low { color: #ff9aa8; animation: robo-danger-pulse .7s ease-in-out infinite; }
body.qz-kahoot .robo-zonegrid {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .7rem; width: min(100%, 32rem); margin: .5rem auto;
}
body.qz-kahoot .robo-zonetile {
  border: .22rem solid var(--robo-zone, #67e8ff); border-radius: .9rem; cursor: pointer;
  padding: .9rem .5rem .7rem; color: #fff; min-height: 6.6rem;
  display: flex; flex-direction: column; align-items: center; gap: .25rem;
  background: rgba(9, 15, 30, .9); /* Fallback für Browser ohne color-mix() */
  background:
    radial-gradient(circle at 50% 0%, color-mix(in srgb, var(--robo-zone, #67e8ff) 30%, transparent), transparent 66%),
    rgba(9, 15, 30, .9);
  box-shadow: 0 .25rem 0 rgba(0, 0, 0, .35);
}
body.qz-kahoot .robo-zonetile--c0 { --robo-zone: #ff6b81; }
body.qz-kahoot .robo-zonetile--c1 { --robo-zone: #58b6ff; }
body.qz-kahoot .robo-zonetile--c2 { --robo-zone: #ffd23e; }
body.qz-kahoot .robo-zonetile--c3 { --robo-zone: #52de97; }
body.qz-kahoot .robo-zonetile:active { transform: translateY(.15rem); box-shadow: 0 .1rem 0 rgba(0, 0, 0, .35); }
body.qz-kahoot .robo-zonetile.chosen { outline: .28rem solid #fff; outline-offset: .1rem; }
body.qz-kahoot .robo-zonetile:disabled { opacity: .65; cursor: default; }
body.qz-kahoot .robo-zonetile.is-over { border-color: #ff2e44; animation: robo-over-pulse .8s ease-in-out infinite; }
body.qz-kahoot .robo-zonetile__letter {
  display: inline-grid; place-items: center; width: 2.6rem; height: 2.6rem; border-radius: .7rem;
  background: var(--robo-zone, #67e8ff); color: #0b1220; font-weight: 900; font-size: 1.6rem;
}
body.qz-kahoot .robo-zonetile__count { font-weight: 800; font-variant-numeric: tabular-nums; }
body.qz-kahoot .robo-zoneplayer__status { color: rgba(255, 255, 255, .88); min-height: 1.3rem; }

/* ---------- kompakt / responsiv ---------- */
@media (max-width: 760px) {
  body.qz-robot main#app { padding-inline: .65rem; }
  body.qz-kahoot .robo-scene { height: clamp(24rem, 62vh, 34rem); border-radius: .85rem; }
  body.qz-kahoot .robo-scene--intro .robo-introbox { max-width: calc(100% - 1rem); margin: .7rem .5rem; }
  body.qz-kahoot .robo-tutorial { grid-template-columns: 1fr; gap: .35rem; }
  body.qz-kahoot .robo-tutorial__step { min-height: 0; }
  body.qz-kahoot .robo-bot { width: 10rem; }
  body.qz-kahoot .robo-hud__timer { margin-left: 0; }
  body.qz-kahoot .robo-progress--host { order: 5; flex-basis: 100%; }
  body.qz-kahoot .robo-zones, body.qz-kahoot .robo-zones--3, body.qz-kahoot .robo-zones--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.qz-kahoot .robo-zone { min-height: 8.5rem; }
}
@media (max-height: 650px) and (min-width: 700px) {
  body.qz-kahoot .robo-scene { height: min(54vh, 26rem); }
  body.qz-kahoot .robo-hud { font-size: .88rem; padding-block: .3rem; }
  body.qz-kahoot .robo-hint { display: none; }
  body.qz-kahoot .robo-introbox { margin-top: .5rem; padding-block: .65rem; }
  body.qz-kahoot .robo-zone { min-height: 9rem; }
}

/* ---------- Bewegung reduzieren ---------- */
@media (prefers-reduced-motion: reduce) {
  body.qz-kahoot .robo-bot, body.qz-kahoot .robo-crew, body.qz-kahoot .robo-runner { transition: none; animation: none; }
  body.qz-kahoot .robo-runner--fallback, body.qz-kahoot .robo-runner .avstudio-rig__motion,
  body.qz-kahoot .robo-svg__eye, body.qz-kahoot .robo-svg__antenna { animation: none !important; }
  body.qz-kahoot .robo-sparks { display: none; }
  body.qz-kahoot .robo-progress__fill { transition: none; }
  body.qz-kahoot .robo-boost { animation: none; }
  body.qz-kahoot .robo-boost.is-holding .robo-boost__fill { animation: none; width: 35%; }
  body.qz-kahoot .robo-zone.is-over, body.qz-kahoot .robo-zonetile.is-over,
  body.qz-kahoot .robo-progress--mini.is-danger .robo-progress__fill,
  body.qz-kahoot .robo-zoneplayer__timer.is-low { animation: none; }
  body.qz-kahoot .robo-phud__bot { transition: none; }
  body.qz-kahoot .robo-player-intro__dots span { animation: none; opacity: .8; }
}

@media (forced-colors: active) {
  body.qz-kahoot .robo-hud, body.qz-kahoot .robo-introbox, body.qz-kahoot .robo-alarmbox,
  body.qz-kahoot .robo-zone, body.qz-kahoot .robo-boost, body.qz-kahoot .robo-zonetile {
    border: 2px solid CanvasText;
  }
  body.qz-kahoot .robo-progress { border: 1px solid CanvasText; }
}

/* ============================================================
   Immersiver Stationskorridor mit generierten Runtime-Assets
   ============================================================ */
body.qz-robot { overscroll-behavior:none; background:#060b14; }
body.qz-robot .lnav__bar,
body.qz-robot .lesson-header,
body.qz-robot .lesson-footer,
body.qz-robot .dr-shell { display:none !important; }
body.qz-robot.dr-shell-enabled { padding-left:0 !important; }
body.qz-robot main#app {
  position:fixed; inset:0; z-index:40;
  display:flex; flex-direction:column;
  width:100%; max-width:none; height:100dvh;
  padding:0; overflow:hidden;
  background:#060b14 url("/quiz/assets/robot/station-corridor-generated.webp") center / cover no-repeat;
}
body.qz-robot main#app > .host-bar {
  position:absolute; z-index:90; top:max(.5rem,env(safe-area-inset-top));
  left:max(.5rem,env(safe-area-inset-left)); right:max(.5rem,env(safe-area-inset-right));
  width:auto; min-height:2.65rem; margin:0; padding:.35rem .65rem;
  border:1px solid rgba(130,220,255,.22); border-radius:999px;
  color:#fff; background:rgba(4,10,20,.68); backdrop-filter:blur(12px);
  box-shadow:0 .35rem 1.4rem rgba(0,0,0,.34);
}
body.qz-robot main#app > .host-bar + div { flex:1 1 auto; min-height:0; height:100%; overflow:auto; }
body.qz-robot main#app > div > .qz-actions {
  position:absolute; z-index:96; right:max(1rem,env(safe-area-inset-right));
  bottom:max(1rem,env(safe-area-inset-bottom)); margin:0;
}

body.qz-kahoot .robo-scene {
  width:100%; max-width:none; height:100%; min-height:100%;
  margin:0; border:0; border-radius:0;
  background-color:#08111f;
  background-image:
    linear-gradient(180deg,rgba(3,8,18,.08),rgba(3,8,18,.02) 62%,rgba(3,8,18,.34)),
    url("/quiz/assets/robot/station-corridor-generated.webp");
  background-size:cover; background-position:center;
  box-shadow:inset 0 -6rem 9rem rgba(0,0,0,.38);
  animation:robo-world-drift 24s ease-in-out infinite alternate;
}
@keyframes robo-world-drift { to { background-position:53% center; } }
body.qz-kahoot .robo-scene[data-level="2"] { filter:saturate(1.06) brightness(.93); }
body.qz-kahoot .robo-scene[data-level="3"],
body.qz-kahoot .robo-scene[data-level="4"],
body.qz-kahoot .robo-scene[data-level="5"] { filter:saturate(1.14) brightness(.86); }
body.qz-kahoot .robo-scene::after { background:radial-gradient(ellipse at center,transparent 45%,rgba(0,0,0,.48)); }
body.qz-kahoot .robo-scene[data-threat="warn"]::before,
body.qz-kahoot .robo-scene[data-threat="danger"]::before,
body.qz-kahoot .robo-scene--alarm::before,
body.qz-kahoot .robo-scene--caught::before {
  content:""; position:absolute; inset:0; z-index:19; pointer-events:none;
  background:repeating-linear-gradient(90deg,rgba(255,35,55,.11) 0 8%,transparent 8% 16%);
  mix-blend-mode:screen; animation:robo-red-alert .7s steps(2,end) infinite;
}
@keyframes robo-red-alert { 50% { opacity:.35; } }
body.qz-kahoot .robo-floor,
body.qz-kahoot .robo-windows,
body.qz-kahoot .robo-door { display:none; }
body.qz-kahoot .robo-parallax,
body.qz-kahoot .robo-scanlines { position:absolute; inset:-10%; pointer-events:none; }
body.qz-kahoot .robo-parallax--far {
  z-index:1; opacity:.32;
  background:radial-gradient(circle at 15% 29%,rgba(133,222,255,.55) 0 .08rem,transparent .12rem),radial-gradient(circle at 57% 18%,rgba(255,255,255,.45) 0 .06rem,transparent .1rem),radial-gradient(circle at 81% 42%,rgba(133,222,255,.38) 0 .07rem,transparent .11rem);
  background-size:18rem 14rem,23rem 18rem,29rem 20rem;
  animation:robo-parallax-far var(--robo-far-dur,32s) linear infinite;
}
body.qz-kahoot .robo-parallax--near {
  z-index:12; opacity:.22; filter:blur(1px);
  background:repeating-linear-gradient(98deg,transparent 0 13%,rgba(84,191,230,.13) 14%,transparent 16% 30%);
  animation:robo-parallax-near var(--robo-near-dur,15s) linear infinite;
}
body.qz-kahoot .robo-scanlines {
  z-index:18; opacity:.12;
  background:repeating-linear-gradient(180deg,transparent 0 4px,rgba(103,232,255,.18) 5px,transparent 6px);
  animation:robo-scan 8s linear infinite;
}
@keyframes robo-parallax-far { to { transform:translate3d(-9%,2%,0); } }
@keyframes robo-parallax-near { to { transform:translate3d(-22%,0,0); } }
@keyframes robo-scan { to { transform:translateY(6%); } }

body.qz-kahoot .robo-bot {
  width:clamp(10rem,18vw,17rem); bottom:12%;
  filter:drop-shadow(0 1.1rem 1.6rem rgba(0,0,0,.58));
}
body.qz-kahoot .robo-bot__asset { display:block; width:100%; height:auto; max-width:none; pointer-events:none; user-select:none; }
body.qz-kahoot .robo-bot__spriteclip {
  position:relative; display:block; width:100%; aspect-ratio:543 / 724;
  overflow:hidden;
}
body.qz-kahoot .robo-bot__spritesheet {
  position:absolute; left:0; top:0; display:block;
  width:400%; height:100%; max-width:none; pointer-events:none; user-select:none;
  animation:robo-run-sprite .72s linear infinite;
}
@keyframes robo-run-sprite {
  0%,24.99% { transform:translateX(0); }
  25%,49.99% { transform:translateX(-25%); }
  50%,74.99% { transform:translateX(-50%); }
  75%,100% { transform:translateX(-75%); }
}
body.qz-kahoot .robo-bot.is-fallback svg { width:100%; height:auto; display:block; }
body.qz-kahoot .robo-bot--intro { left:7% !important; bottom:8%; width:clamp(12rem,22vw,20rem); }
body.qz-kahoot .robo-bot--alarm { left:10% !important; bottom:8%; width:clamp(14rem,25vw,23rem); }
body.qz-kahoot .robo-bot--caught { bottom:5%; width:clamp(16rem,30vw,27rem); }
body.qz-kahoot .robo-scene[data-threat="danger"] .robo-bot { filter:drop-shadow(0 0 2rem rgba(255,52,73,.82)); }

body.qz-kahoot .robo-hud {
  position:absolute; z-index:82; left:max(1rem,env(safe-area-inset-left));
  right:max(1rem,env(safe-area-inset-right)); bottom:max(1rem,env(safe-area-inset-bottom));
  width:auto; margin:0; background:rgba(4,10,21,.72); backdrop-filter:blur(12px);
}
body.qz-kahoot .robo-hint { display:none; }
body.qz-kahoot .robo-introbox {
  margin-top:clamp(5rem,12vh,8rem); border:1px solid rgba(112,224,255,.22);
  background:rgba(4,10,22,.62); backdrop-filter:blur(12px);
}
body.qz-kahoot .robo-scene--intro .robo-introbox { background:rgba(4,10,22,.7); }
body.qz-kahoot .robo-alarmbox {
  width:min(62%,39rem); left:auto; right:clamp(1rem,5vw,5rem); transform:translateY(-50%);
  border-width:2px; background:rgba(69,4,16,.72); backdrop-filter:blur(12px);
}

/* Schutzzonen erscheinen als beleuchtete Stationsbuchten statt als Menüseite. */
body.qz-kahoot .robo-zonewrap {
  box-sizing:border-box; width:100%; min-height:100%; height:100%; margin:0;
  padding:clamp(5rem,11vh,7rem) clamp(1rem,3vw,3rem) clamp(5rem,11vh,7rem);
  display:grid; align-content:center;
  background:linear-gradient(rgba(2,8,18,.48),rgba(2,8,18,.7)),url("/quiz/assets/robot/station-corridor-generated.webp") center / cover no-repeat;
}
body.qz-kahoot .robo-zones { position:relative; z-index:3; }
body.qz-kahoot .robo-zone {
  min-height:clamp(13rem,38vh,22rem); border-radius:1.2rem;
  background:linear-gradient(180deg,color-mix(in srgb,var(--robo-zone,#67e8ff) 18%,rgba(5,13,28,.72)),rgba(5,13,28,.88));
  backdrop-filter:blur(8px); box-shadow:inset 0 0 3.5rem rgba(0,0,0,.45),0 1rem 2rem rgba(0,0,0,.28);
}

/* Schülergerät: laufender Stationshintergrund, große Touchziele. */
body.qz-robot main#app > .host-bar + div:has(.robo-pquiz),
body.qz-robot main#app > .host-bar + div:has(.robo-zoneplayer) {
  padding:max(4.4rem,env(safe-area-inset-top)) max(.8rem,env(safe-area-inset-right)) max(1rem,env(safe-area-inset-bottom)) max(.8rem,env(safe-area-inset-left));
  background:linear-gradient(rgba(2,8,18,.72),rgba(2,8,18,.9)),url("/quiz/assets/robot/station-corridor-generated.webp") center / cover no-repeat;
}
body.qz-kahoot .robo-pquiz { width:min(100%,58rem); margin-inline:auto; }
body.qz-kahoot .robo-pquiz button,
body.qz-kahoot .robo-boost,
body.qz-kahoot .robo-zonetile { touch-action:manipulation; min-height:3.5rem; }
body.qz-kahoot .robo-zonetile { min-height:clamp(7.5rem,20vh,10rem); }

@media (max-width:760px) {
  body.qz-robot main#app { padding:0; }
  body.qz-kahoot .robo-scene { border-radius:0; }
  body.qz-kahoot .robo-scene--intro .robo-introbox { max-width:calc(100% - 1rem); margin:4.8rem .5rem 0; }
  body.qz-kahoot .robo-hud { font-size:.76rem; padding:.35rem .5rem; }
  body.qz-kahoot .robo-alarmbox { left:1rem; right:1rem; width:auto; }
  body.qz-kahoot .robo-zonewrap { overflow:auto; }
}

@media (prefers-reduced-motion:reduce) {
  body.qz-kahoot .robo-scene, body.qz-kahoot .robo-parallax,
  body.qz-kahoot .robo-scanlines, body.qz-kahoot .robo-scene::before,
  body.qz-kahoot .robo-bot__spritesheet { animation:none !important; }
}
