.ki-warteanzeige { display:inline-flex; align-items:center; gap:12px; line-height:1.5; }
.ki-orbit {
  position:relative; display:inline-grid; place-items:center; flex:none;
  width:32px; height:32px; color:var(--accent);
}
.ki-orbit::before {
  content:''; position:absolute; inset:0; border:2px solid var(--border);
  border-top-color:currentColor; border-right-color:currentColor; border-radius:50%;
  animation:ki-orbit-kreisen 1.6s linear infinite;
}
.ki-orbit i { font-style:normal; font-size:16px; animation:ki-orbit-atmen 2.4s ease-in-out infinite; }
.ki-knopf:disabled:has(.ki-warteanzeige) { opacity:1; cursor:wait; }
@keyframes ki-orbit-kreisen { to { transform:rotate(360deg); } }
@keyframes ki-orbit-atmen { 50% { transform:scale(.8); opacity:.5; } }
@media(prefers-reduced-motion:reduce) { .ki-orbit::before,.ki-orbit i { animation:none; } }

/* ---------------------------------------------------------------------
   Die Warteanzeigen der übrigen Bereiche, ergaenzt am 06.10.2026.
   Jede hat hier ihre ruhige Fassung für prefers-reduced-motion – eine
   Bewegung ohne Ausweg ist für manche Menschen keine Spielerei.
   --------------------------------------------------------------------- */
.warteanzeige { display:inline-flex; align-items:center; gap:12px; line-height:1.5; }
.warte-bild { display:inline-flex; align-items:center; gap:4px; flex:none; }
.warte-text { display:flex; flex-direction:column; gap:1px; }
.warte-bild i { font-style:normal; }

/* Garten: die Kanne kippt, der Tropfen fällt, das Blatt richtet sich auf. */
.warte-garten i { font-size:19px; display:inline-block; }
.w-kanne   { animation:w-kippen 2.4s ease-in-out infinite; transform-origin:70% 70%; }
.w-tropfen { animation:w-fallen 2.4s ease-in infinite; }
.w-blatt   { animation:w-wachsen 2.4s ease-out infinite; transform-origin:50% 100%; }
@keyframes w-kippen  { 0%,55%,100% { transform:rotate(0) } 20%,40% { transform:rotate(-38deg) } }
@keyframes w-fallen  { 0%,22% { opacity:0; transform:translateY(-4px) } 30% { opacity:1 }
                       48% { opacity:1; transform:translateY(9px) } 52%,100% { opacity:0 } }
@keyframes w-wachsen { 0%,45% { transform:scale(.88) } 65% { transform:scale(1.1) } 85%,100% { transform:scale(1) } }

/* Heizung: eine Flamme, die atmet. Keine zuckende – an einer Heizung ist
   ein unruhiges Feuer kein gutes Zeichen. */
.warte-heizung i { font-size:22px; display:inline-block; animation:w-atmen 2.2s ease-in-out infinite; }
@keyframes w-atmen { 0%,100% { transform:scale(1) } 50% { transform:scale(1.16) translateY(-1px) } }

/* Pool: der Teststreifen läuft durch die Farben, die er messen soll. */
.w-streifen {
  display:inline-block; width:13px; height:30px; border-radius:3px;
  border:1px solid var(--border); animation:w-messen 3s ease-in-out infinite;
}
@keyframes w-messen { 0%,100% { background:#d8d24a } 33% { background:#6fbf73 } 66% { background:#4a9fd8 } }

/* Geschenkideen: die Schleife bindet sich. */
.warte-geschenk { position:relative; display:inline-flex; width:34px; height:26px; }
.w-band {
  position:absolute; inset:auto 0 9px 0; height:4px; border-radius:2px;
  background:var(--accent); transform-origin:left center; animation:w-binden 2.4s ease-in-out infinite;
}
.w-knoten { position:absolute; left:50%; top:0; translate:-50% 0; font-size:17px;
            animation:w-knoten-auf 2.4s ease-out infinite; }
@keyframes w-binden    { 0%,100% { transform:scaleX(.2) } 45%,70% { transform:scaleX(1) } }
@keyframes w-knoten-auf{ 0%,45% { opacity:0; transform:scale(.4) } 65% { opacity:1; transform:scale(1.15) }
                         80%,100% { opacity:1; transform:scale(1) } }

/* Sehen: die Filmklappe schnappt zu. */
.warte-film { position:relative; display:inline-block; width:30px; height:26px; }
.w-klappe-unten { position:absolute; inset:9px 0 0 0; background:var(--border); border-radius:2px; }
.w-klappe-oben {
  position:absolute; inset:2px 0 auto 0; height:7px; background:var(--accent);
  border-radius:2px; transform-origin:left bottom; animation:w-klappen 1.8s ease-in-out infinite;
}
@keyframes w-klappen { 0%,100% { transform:rotate(0) } 40%,55% { transform:rotate(-26deg) } }

/* Sprüche und Zitate: drei Punkte in einer Sprechblase. */
.warte-blase {
  display:inline-flex; gap:4px; padding:7px 9px; border-radius:11px 11px 11px 3px;
  background:var(--border);
}
.warte-blase i { width:5px; height:5px; border-radius:50%; background:currentColor; opacity:.4;
                 animation:w-tippen 1.4s ease-in-out infinite; }
.warte-blase i:nth-child(2) { animation-delay:.18s; }
.warte-blase i:nth-child(3) { animation-delay:.36s; }
@keyframes w-tippen { 0%,70%,100% { opacity:.35; transform:translateY(0) } 35% { opacity:1; transform:translateY(-3px) } }

/* Hauswissen: Werkzeug, das sich sortiert. */
.warte-werkzeug i { font-size:17px; display:inline-block; animation:w-sortieren 2.2s ease-in-out infinite; }
.warte-werkzeug i:nth-child(2) { animation-delay:.2s; }
.warte-werkzeug i:nth-child(3) { animation-delay:.4s; }
@keyframes w-sortieren { 0%,60%,100% { transform:translateY(0) rotate(0) } 30% { transform:translateY(-5px) rotate(-12deg) } }

/* Termine: Kalenderblätter, die umschlagen. */
.warte-kalender { position:relative; display:inline-block; width:26px; height:28px;
                  border:1px solid var(--border); border-radius:4px; overflow:hidden; }
.warte-kalender i { position:absolute; inset:0 0 50% 0; background:var(--accent); opacity:.75;
                    transform-origin:bottom center; animation:w-blaettern 1.9s ease-in-out infinite; }
.warte-kalender i:nth-child(2) { animation-delay:.5s; }
@keyframes w-blaettern { 0% { transform:rotateX(0) } 55%,100% { transform:rotateX(-170deg) } }

/* Lupe über einer angedeuteten Seite. */
.warte-lupe { display:inline-block; width:34px; overflow:hidden; }

/* Würfel und Figuren, aus spiele-recherche.js übernommen. */
.warte-spiel i { display:inline-block; }

@media (prefers-reduced-motion:reduce) {
  .w-kanne, .w-tropfen, .w-blatt, .warte-heizung i, .w-streifen, .w-band, .w-knoten,
  .w-klappe-oben, .warte-blase i, .warte-werkzeug i, .warte-kalender i { animation:none; }
  .w-tropfen { opacity:1; }
  .w-band { transform:scaleX(1); }
  .w-knoten { opacity:1; transform:scale(1); }
}