/* brandnext Labyrinth (KI-Fahrplan). Bühne aus js/labyrinth.js, liegt über dem Standbild im Seitenkopf
   (.c-page-hero__figure mit labyrinth-*.webp) oder im Ergebnis-Kopf ([data-lab-dock]). Kein Blau. */
.c-lab-dock { position: relative; }
.c-page-hero__figure img[src*="/assets/labyrinth/labyrinth-"] { aspect-ratio: 5 / 4; object-fit: cover; }
[data-lab-dock] { aspect-ratio: 5 / 4; }
[data-lab-dock] .c-fp-visual__img { object-fit: cover; }

/* Standbild im Dunkelmodus */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) img[src*="/assets/labyrinth/labyrinth-hell"] { content: url("/assets/labyrinth/labyrinth-dunkel.webp"); filter: none; }
}
:root[data-theme="dark"] img[src*="/assets/labyrinth/labyrinth-hell"] { content: url("/assets/labyrinth/labyrinth-dunkel.webp"); filter: none; }

/* 3D aktiv: Standbild bleibt als Platzhalter (Layout), Canvas schwebt frei darüber */
.c-lab-dock > img { transition: opacity .6s ease; }
.c-lab-dock.is-lab-3d > img { opacity: 0; }
.c-fp-visual.is-lab-3d { background: none; box-shadow: none; overflow: visible; }

.c-lab { position: absolute; inset: -5% -6%; opacity: 0; transition: opacity .8s ease; pointer-events: none; }
.c-lab.is-ready { opacity: 1; pointer-events: auto; }
[data-lab-dock] > .c-lab { inset: -3% -2%; }
.c-lab__canvas { display: block; width: 100%; height: 100%; cursor: grab; touch-action: pan-y; outline: none; }
.c-lab.is-dragged .c-lab__canvas:active { cursor: grabbing; }

.c-lab {
  --lab-glass: rgba(250, 247, 240, .86); --lab-line: rgba(11, 20, 12, .08); --lab-ink: #0B140C; --lab-muted: #4A5A48; --lab-accent: #3F6B42;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .c-lab { --lab-glass: rgba(20, 21, 19, .84); --lab-line: rgba(236, 230, 216, .12); --lab-ink: #ECE6D8; --lab-muted: #B7BCA9; --lab-accent: #A9D8B0; }
}
:root[data-theme="dark"] .c-lab { --lab-glass: rgba(20, 21, 19, .84); --lab-line: rgba(236, 230, 216, .12); --lab-ink: #ECE6D8; --lab-muted: #B7BCA9; --lab-accent: #A9D8B0; }

/* Textkarte der Kamerafahrt */
.c-lab__cap {
  position: absolute; left: 7%; bottom: 9%; max-width: min(78%, 420px); margin: 0; padding: 12px 16px 13px;
  background: var(--lab-glass); border: 1px solid var(--lab-line); border-radius: 14px 14px 14px 4px;
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: 0 18px 40px -28px rgba(40, 30, 10, .45);
  opacity: 0; transform: translateY(8px); transition: opacity .5s ease, transform .5s ease; pointer-events: none;
}
.c-lab__cap.is-on { opacity: 1; transform: none; }
.c-lab__cap-k { margin: 0 0 3px; font-size: .78rem; letter-spacing: .04em; color: var(--lab-accent); font-weight: 500; }
.c-lab__cap-t { margin: 0; font-size: 1rem; line-height: 1.35; color: var(--lab-ink); font-weight: 400; }

/* Hover-Karte am Wegpunkt */
.c-lab__tip {
  position: absolute; z-index: 2; transform: translate(-50%, calc(-100% - 18px)); width: max-content; max-width: 240px; padding: 8px 12px 9px;
  background: var(--lab-glass); border: 1px solid var(--lab-line); border-radius: 10px; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  pointer-events: none; box-shadow: 0 14px 30px -22px rgba(40, 30, 10, .5);
}
.c-lab__tip[hidden] { display: none; }
.c-lab__tip-k { display: block; font-size: .72rem; letter-spacing: .03em; color: var(--lab-accent); margin-bottom: 2px; }
.c-lab__tip-t { display: block; font-size: .88rem; line-height: 1.3; color: var(--lab-ink); }

/* Leiste: Kamerafahrt und Hinweis */
.c-lab__bar { position: absolute; right: 7%; top: 7%; display: flex; align-items: center; gap: 10px; }
.c-lab__btn {
  display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 8px 16px 8px 12px; border-radius: 999px; cursor: pointer;
  font: inherit; font-size: .88rem; color: var(--lab-ink); background: var(--lab-glass); border: 1px solid var(--lab-line);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
}
.c-lab__btn[hidden] { display: none; }
.c-lab__btn:hover { border-color: var(--lab-accent); }
.c-lab__btn:focus-visible { outline: 2px solid #E3B85C; outline-offset: 3px; }
.c-lab__btn-icon { width: 0; height: 0; border-left: 9px solid var(--lab-accent); border-top: 6px solid transparent; border-bottom: 6px solid transparent; margin-left: 2px; }
.c-lab__btn.is-playing .c-lab__btn-icon { width: 9px; height: 11px; border: 0; border-left: 3px solid var(--lab-accent); border-right: 3px solid var(--lab-accent); }
.c-lab__hint { font-size: .76rem; color: var(--lab-muted); transition: opacity .6s ease; }
.c-lab.is-dragged .c-lab__hint, .c-lab__btn:not([hidden]) + .c-lab__hint { opacity: 0; }

@media (max-width: 767px) {
  .c-lab { inset: -3% -3%; }
  .c-lab__cap { left: 4%; right: 4%; bottom: 3%; max-width: none; padding: 9px 12px 10px; }
  .c-lab__cap-t { font-size: .9rem; }
  .c-lab__bar { right: 4%; top: 3%; }
  .c-lab__btn { min-height: 36px; font-size: .82rem; padding: 6px 12px 6px 10px; }
  .c-lab__hint { display: none; }
}
@media (prefers-reduced-motion: reduce) { .c-lab, .c-lab__cap, .c-lab-dock > img { transition: none; } }
@media print { .c-lab { display: none !important; } .c-lab-dock.is-lab-3d > img { opacity: 1; } }