/* Graskind-Welt – Kapitel malbuch: Regeln für den Welt-Modus (.has-world [data-world="ready"] …) und Szenen-Ergänzungen. */

/* Welt aktiv: DOM-Bühne (Striche, Foto, Cover, Bücherfächer) ausblenden – die Bücher-Links stehen gleichwertig
   in der Auswahlliste der Textkarte (.mb__list) und bleiben dort bedienbar */
.has-world #malbuecher[data-world="ready"] .mb {
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity .6s ease, visibility 0s linear .6s;
}

/* Auswahlliste: Fokus/Zeigen hebt das Buch in der Welt an – kleiner Hinweis per Farbe */
.has-world #malbuecher[data-world="ready"] .mb__pick:focus-visible {
  outline: 3px solid var(--tint); outline-offset: 3px;
}

/* Beschriftungen in der Welt */
.world-label.mb-wl--book {
  display: inline-flex; align-items: center; gap: .45rem;
  padding: .32rem .7rem .32rem .5rem;
  background: rgba(251, 247, 238, .95);
  font-size: .8rem;
}
.world-label.mb-wl--book::before {
  content: ""; width: .7rem; height: .7rem; border-radius: 50%;
  background: var(--tint, var(--gk-green, #04785C));
  box-shadow: 0 0 0 2px rgba(255, 255, 255, .9);
}
.world-label.mb-wl--photo {
  padding: .3rem .62rem; border-radius: 7px;
  background: var(--ink, #1D2A22); color: var(--paper-white, #FBF7EE);
  font-size: .78rem; box-shadow: 0 8px 18px -8px rgba(0, 0, 0, .55);
}
.world-label.mb-wl--photo::before {
  content: ""; position: absolute; left: 50%; top: -11px; width: 12px; height: 12px; margin-left: -6px; border-radius: 50%;
  background: var(--gk-yellow, #FFC801); box-shadow: 0 0 0 3px rgba(255, 255, 255, .92), 0 2px 6px rgba(0, 0, 0, .3);
}
@media (max-width: 900px) {
  .world-label.mb-wl--photo { font-size: .64rem; padding: .22rem .45rem; }
  .world-label.mb-wl--book { font-size: .68rem; padding: .24rem .52rem .24rem .4rem; }
}

/* Mehr Scrollweg für die Choreografie (Karussell → Aufschlagen → Polaroid → Auswahl → Aufstieg) */
@media (min-width: 901px) {
  .has-world #malbuecher[data-world="ready"] .step:not(.step--intro) { margin-top: 70vh; margin-top: 70svh; }
  .has-world #malbuecher[data-world="ready"] .step--action { margin-top: 80vh; margin-top: 80svh; }
}

/* Mobil: freie Sicht auf Aufschlagen + Polaroid – die zweite Textkarte kommt erst danach */
@media (max-width: 900px) and (min-height: 561px) {
  .has-world #malbuecher[data-world="ready"] .step--intro { margin-bottom: 200vh; margin-bottom: 200svh; }
}