/* Business LAB — platform styles (BEM-ish .lab-*, tokens only, no raw hex).
   Dark mode is the default for apps & tools (22 §12); values come from
   /tokens.css (single source, repo root). */

/* Effra kommt aus /fonts.css (Set-Kopie, 10 WOFF2-Schnitte) — kein
   eigenes @font-face mehr: die alte Kette kannte nur 4 Schnitte und
   bildete font-weight 600 auf Medium ab, was den fehlenden Schnitt
   legitimierte (22 §4.1, design-audit Befund 8). */

* { box-sizing: border-box; }

/* Skip-Link wie im Test (22 §13) — sichtbar nur bei Tastaturfokus. */
.lab-skip-link {
  position: absolute; left: var(--space-md); top: -100px;
  z-index: 100; padding: var(--space-sm) var(--space-md);
  background: var(--bg-2); color: var(--text-100);
  border: 1px solid var(--border-strong); border-radius: var(--r-md);
  transition: top var(--t-fast) var(--ease);
}
.lab-skip-link:focus-visible { top: var(--space-md); }

/* Dark is the default (22 §12); data-theme="light" flips the shared tokens
   (css/tokens.css). theme.js sets the attribute before first paint. */
html { color-scheme: dark; scrollbar-gutter: stable; }
html[data-theme='light'] { color-scheme: light; }

.lab-body {
  margin: 0;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  background: var(--bg-1);
  color: var(--text-200);
  font-family: var(--font);
  -webkit-font-smoothing: antialiased;
}

/* One focus pattern app-wide (24 §2.3): every interactive element without its
   own rule gets the set's ring. Specific rules below only adjust the offset. */
.lab-body :focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}

/* Shared header line — deliberately mirrors the test's .mm-header (logo left,
   theme toggle right, same logo size and padding) so both services read as
   one family (Filip 31.07.). */
.lab-header {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: var(--space-md);
  width: 100%;
  padding: var(--space-md) var(--space-lg);
  border-bottom: 1px solid var(--border-subtle);
}

/* Signed-in status next to the logo (member area only) — same voice as the
   test's header status. The toggle pushes itself to the far right. */
.lab-header__status {
  flex: 0 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: var(--fs-sm);
  color: var(--text-300);
}

.lab-header .lab-theme-toggle { margin-left: auto; }

/* Logo from assets/ (22 §2.2: never rebuild); pos = light, neg = dark
   surface — swapped per theme like the test's .mm-logo. */
.lab-header__logo {
  display: block;
  width: 170px;
  height: 32px;
  background: url('/assets/logo-wide-neg.svg') no-repeat left center / contain;
}

[data-theme='light'] .lab-header__logo {
  background-image: url('/assets/logo-wide-pos.svg');
}

/* Produkt-Identität im Mitgliederbereich: bisher sagte nichts in der Shell,
   in welchem Produkt man ist (22 §2.3, design-audit Befund 21). */
.lab-wordmark {
  flex: 0 0 auto;
  font-size: var(--fs-sm);
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--text-200);
  white-space: nowrap;
}

/* KEIN Verlauf hier: --grad-headline ist ausschließlich für Schlüsselwörter
   in H1-Headlines zugelassen (22 §3.2). In der Kopfzeile trägt das Brand-Wort
   flaches Lime; im Light greift weiter der Lime-Chip (Muster des Tests). */
.lab-wordmark .lab-keyword {
  background: none;
  -webkit-background-clip: border-box;
  background-clip: border-box;
  color: var(--lime);
}

.lab-hero {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: var(--space-lg) var(--space-md) var(--space-xl);
  gap: var(--space-lg);
}

/* Fluide Hero-Größen sind bewusst NICHT Teil der diskreten Skala
   (22 §4.2) — gilt für diese beiden clamp()-Werte auf der öffentlichen
   Startseite. Alles andere im Lab läuft über --fs-*. */
.lab-hero__title {
  margin: 0;
  font-size: clamp(2.4rem, 7vw, 4rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--text-100);
}

.lab-hero__title--sm { font-size: clamp(1.6rem, 4.5vw, 2.4rem); }

/* {LAB} word mark: braces in pink, keyword in lime → lime-bright — the
   headline gradient never meets the braces (22 §2.3 collision rule).
   Light mode follows the test's brand-word pattern: lime highlight chip. */
.lab-brace { color: var(--pink); font-weight: 700; }
.lab-keyword {
  background: linear-gradient(135deg, var(--lime) 0%, var(--lime-bright) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

[data-theme='light'] .lab-brace { color: var(--pink-dark); }
[data-theme='light'] .lab-keyword {
  background: var(--lime);
  -webkit-background-clip: border-box;
  background-clip: border-box;
  color: var(--on-accent);
  border-radius: var(--r-xs);
  padding: 0 6px;
}

.lab-hero__subtitle {
  margin: 0;
  max-width: 34rem;
  font-size: var(--fs-lg);
  color: var(--text-300);
}

.lab-step-card {
  margin-top: var(--space-md);
  max-width: 26rem;
  width: 100%;
  padding: var(--space-lg);
  background: var(--bg-2);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-lg);
  text-align: left;
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

.lab-step-card__eyebrow {
  margin: 0;
  font-size: var(--fs-xs);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--signal-text);
}

.lab-step-card__title {
  margin: 0;
  font-size: var(--fs-lg);
  color: var(--text-100);
}

/* Eigenständige Seiten (Hinweis, Übernahme) tragen ein H1 in der Karte —
   eine Ebene über dem Karten-H2, damit eine Klasse nicht zwei Hierarchie-
   Stufen bedienen muss (design-audit Befund 19). */
.lab-step-card__heading {
  margin: 0;
  font-size: var(--fs-xl);
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--text-100);
}

.lab-step-card__text {
  margin: 0;
  font-size: var(--fs-md);
  line-height: 1.5;
  color: var(--text-300);
}

/* Primary action is exclusively pink (22 §3.2, 24 §2.1).
   Fixed white label: --text-100 flips dark in light mode, white stays
   readable on pink in BOTH themes.
   EINE Button-Höhe für alle Varianten (Filip 21.08. abends: primary und
   ghost standen ungleich hoch nebeneinander): min-height 44 (Klickziel
   22 §13) trägt die Höhe, vertikales Padding 0, line-height gebändigt —
   so enden <a> und <button>, mit und ohne Rahmen, auf exakt 44px. */
.lab-btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  line-height: 1.2;
  margin-top: var(--space-sm);
  align-self: flex-start;
  padding: 0 24px;
  background: var(--pink);
  color: var(--white);
  /* As a real <button> (check station) it would fall back to the browser
     font and border — same reset as .lab-btn-ghost. */
  font-family: inherit;
  font-weight: 500;
  font-size: var(--fs-md);
  text-decoration: none;
  /* Transparent border so the hover contour does not shift the layout. */
  border: 1px solid transparent;
  border-radius: var(--r-md);
  cursor: pointer;
}

.lab-btn-primary:hover:not(:disabled) { background: var(--pink-bright); border-color: var(--white); }
.lab-btn-primary:active:not(:disabled) { transform: scale(.98); }

/* Disabled per 24 §2.3: dimmed, no hover — e.g. while the workbook uploads. */
.lab-btn-primary:disabled { opacity: .4; cursor: not-allowed; }

.lab-btn-primary:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}

/* Secondary action: neutral token surface, never a white block (50-F8). */
.lab-btn-ghost {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;   /* Klickziel 22 §13 */
  line-height: 1.2;
  padding: 0 20px;
  background: transparent;
  border: 1px solid var(--border-soft);
  border-radius: var(--r-md);
  color: var(--text-300);
  font-family: inherit;
  font-size: var(--fs-md);
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
}

.lab-btn-ghost:hover:not(:disabled) { border-color: var(--border-strong); color: var(--text-100); }
.lab-btn-ghost:active:not(:disabled) { transform: scale(.98); }
.lab-btn-ghost:disabled { opacity: .4; cursor: not-allowed; }

.lab-btn-ghost:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}

.lab-btn-ghost[hidden] { display: none; }

.lab-step-card--center { text-align: center; align-items: center; }

.lab-meta {
  margin: 0;
  font-size: var(--fs-sm);
  color: var(--text-400);
}

.lab-footer {
  padding: var(--space-md);
  text-align: center;
  font-size: var(--fs-xs);
  /* --text-500 ist De-Emphasis (2,67:1 auf Hell) und darf keine Information
     tragen — 22 §13. */
  color: var(--text-300);
  border-top: 1px solid var(--border-subtle);
}

.lab-footer p { margin: 0; }

/* ---- Money-Mindset-Reise (P2): Schritt-Karten + Ranking + Import ---- */

.lab-journey {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  width: 100%;
}

.lab-journey .lab-step-card { margin-top: 0; max-width: none; }

/* Challenge run waiting to be taken into the lab (dashboard + money-mindset). */
.lab-challenge-vorschlag { max-width: 40rem; border-color: var(--border-strong); }
.lab-journey .lab-challenge-vorschlag { max-width: none; }
.lab-challenge-vorschlag form { margin-top: var(--space-md); }

/* Kommende Schritte: eine Liste statt fünf gleichlautender Karten. Kein
   opacity-Dimmen — das drückte die Schritt-Titel auf 3,76:1 (24 §9, 22 §13).
   Die Zurückhaltung kommt aus Fläche und Rahmen, nicht aus Deckkraft. */
.lab-upcoming {
  padding: var(--space-lg);
  background: transparent;
  border: 1px dashed var(--border-soft);
  border-radius: var(--r-lg);
}

.lab-upcoming__head {
  margin: 0;
  font-size: var(--fs-xs);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-300);
}

.lab-upcoming__note {
  margin: var(--space-xs) 0 var(--space-md);
  font-size: var(--fs-sm);
  color: var(--text-300);
  max-width: 46rem;
}

.lab-upcoming__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  counter-reset: none;
}

.lab-upcoming__item {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  padding: var(--space-sm) 0;
  border-top: 1px solid var(--border-subtle);
}

.lab-upcoming__num {
  flex: 0 0 auto;
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  border: 1px solid var(--border-strong);
  border-radius: 50%;
  color: var(--text-300);
  font-size: var(--fs-sm);
  font-weight: 500;
}

.lab-upcoming__title { color: var(--text-200); font-size: var(--fs-md); }

/* Gestalteter Leerzustand (24 §9): ein Satz, warum leer — plus die nächste
   sinnvolle Aktion. Nie ein toter Bildschirm. */
.lab-empty {
  max-width: 46rem;
  padding: var(--space-lg);
  background: var(--bg-2);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-lg);
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  align-items: flex-start;
}

.lab-empty__text { margin: 0; color: var(--text-300); font-size: var(--fs-md); }
.lab-empty .lab-btn-primary { margin-top: var(--space-md); }

/* Notice page: the state's own way out first, the way home beside it. */
.lab-hinweis__aktionen {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--space-sm);
  margin-top: var(--space-sm);
}
.lab-hinweis__aktionen .lab-btn-primary { margin-top: 0; }

.lab-ranking {
  list-style: none;
  margin: var(--space-xs) 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
}

.lab-ranking__item {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  padding: 10px 12px;
  background: var(--bg-1);
  border: 1px solid var(--border-subtle);
  border-radius: var(--r-md);
}

.lab-ranking__rank {
  flex: 0 0 auto;
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  border: 1px solid var(--signal-text);
  border-radius: 50%;
  color: var(--signal-text);
  font-size: var(--fs-sm);
  font-weight: 700;
}

.lab-ranking__name {
  flex: 1;
  display: flex;
  flex-direction: column;
  color: var(--text-100);
  font-weight: 500;
  font-size: var(--fs-md);
}

.lab-ranking__name small {
  color: var(--text-400);
  font-weight: 400;
  font-size: var(--fs-xs);
}

.lab-ranking__score {
  color: var(--text-100);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.lab-ranking__score small { color: var(--text-400); font-weight: 400; }

.lab-actions {
  display: flex;
  flex-wrap: wrap;
  /* center statt stretch: sonst zieht die Zeile ungleiche Buttons hoch. */
  align-items: center;
  gap: var(--space-sm);
  margin-top: var(--space-xs);
}

/* In der Zeile liefert der Container den Abstand — das Eigen-Margin des
   Primary würde ihn sonst aus der Mittellinie schieben. */
.lab-actions .lab-btn-primary { margin-top: 0; }

/* Frühere Testergebnisse (Retakes): kompakte Zeilen mit Datum, Top-Rängen
   und Direktzugriff — Entwicklung über die Zeit bleibt ablesbar. */
.lab-verlauf { margin-top: var(--space-sm); }

.lab-verlauf__head {
  margin: 0 0 2px;
  font-size: var(--fs-sm);
  font-weight: 500;
  color: var(--text-200);
}

.lab-verlauf__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.lab-verlauf__item {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--space-sm);
  padding: 8px 0;
  border-top: 1px solid var(--border-subtle);
  font-size: var(--fs-sm);
}

.lab-verlauf__item:first-child { border-top: 0; }

.lab-verlauf__date {
  flex: 0 0 auto;
  font-family: var(--mono);
  font-size: var(--fs-xs);
  color: var(--text-300);
}

.lab-verlauf__top { flex: 1 1 200px; color: var(--text-200); }

.lab-verlauf__actions { flex: 0 0 auto; display: flex; gap: var(--space-sm); }

.lab-verlauf__actions a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--text-200);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.lab-verlauf__actions a:hover { color: var(--text-100); }

.lab-import { margin-top: var(--space-xs); font-size: var(--fs-sm); }
.lab-import summary { cursor: pointer; color: var(--text-300); }
.lab-import summary:hover { color: var(--text-100); }

.lab-import__form {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs);
  margin-top: var(--space-sm);
}

.lab-input {
  flex: 1 1 200px;
  padding: 10px 12px;
  background: var(--bg-1);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-md);
  color: var(--text-100);
  font-family: inherit;
  font-size: var(--fs-sm);
}

.lab-input:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }

/* Fehlertext über den Alias, nicht über Pink: Pink ist die Aktionsfarbe, und
   --pink-bright erreicht auf Hell nur 3,47:1. --alert-text ist im Dark
   Status-Rot und im Light neutral — die Bedeutung tragen dort die Worte
   (22 §12/§13). */
.lab-alert {
  margin: var(--space-xs) 0 0;
  font-size: var(--fs-sm);
  color: var(--alert-text);
  /* Platz ist reserviert, bevor der Inhalt kommt — die Meldung darf das
     Formular nicht verschieben (24 §9 Regel 1). */
  min-height: 1.4em;
}

.lab-hint { margin: var(--space-xs) 0 0; font-size: var(--fs-xs); color: var(--text-400); }
.lab-hint:empty { display: none; }
.lab-hint code { font-family: var(--mono); font-size: var(--fs-xs); }
.lab-hint a { color: var(--text-300); }

.lab-sr-only {
  position: absolute;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

.lab-btn-primary[hidden] { display: none; }

/* ---- Theme toggle (KOE-443): icon button in the shared header line —
   borderless, sized and rounded exactly like the test's
   .mm-btn--ghost.mm-btn--icon so both toggles look identical ---- */
.lab-theme-toggle {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
  padding: 10px;
  background: transparent;
  border: 0;
  border-radius: var(--r-md);
  color: var(--text-300);
  cursor: pointer;
}

.lab-theme-toggle:hover { color: var(--text-100); background: var(--bg-3); }

.lab-theme-toggle:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}

.lab-theme-toggle svg { width: 18px; height: 18px; stroke: currentColor; }

/* svg has no hidden IDL default styling in some engines — force it
   (same trap as .mm-btn[hidden] and svg[hidden] in the test, 50-learnings). */
.lab-theme-toggle svg[hidden] { display: none; }

/* ---- P4 platform shell: sidebar layout, user menu, dashboard ---- */

.lab-header__home { display: block; flex: 0 0 auto; }

/* Breadcrumb sits between logo and user menu, truncates gracefully. */
.lab-crumb {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: var(--fs-sm);
  color: var(--text-400);
}

.lab-crumb a { color: var(--text-300); text-decoration: none; }
.lab-crumb a:hover { color: var(--text-100); text-decoration: underline; }
.lab-crumb span[aria-current] { color: var(--text-200); }
.lab-crumb__sep { margin: 0 6px; color: var(--text-500); }

/* User menu (details/summary — CSP-clean, no JS): identity + logout live
   here now; the logout button left the page center for good (Filip 04.08.). */
.lab-user-menu { position: relative; flex: 0 0 auto; }

.lab-user-menu__summary {
  list-style: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 220px;
  min-height: 44px;
  padding: 10px 12px;
  border-radius: var(--r-md);
  color: var(--text-300);
  font-size: var(--fs-sm);
  cursor: pointer;
}

.lab-user-menu__summary::-webkit-details-marker { display: none; }
.lab-user-menu__summary:hover { color: var(--text-100); background: var(--bg-3); }
.lab-user-menu__summary:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.lab-user-menu__summary svg { width: 14px; height: 14px; stroke: currentColor; flex: 0 0 auto; }
.lab-user-menu[open] .lab-user-menu__summary svg { transform: rotate(180deg); }

.lab-user-menu__name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.lab-user-menu__panel {
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  z-index: 20;
  min-width: 220px;
  padding: var(--space-md);
  background: var(--bg-2);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-md);
}

.lab-user-menu__id {
  margin: 0 0 var(--space-sm);
  font-size: var(--fs-sm);
  color: var(--text-400);
  line-height: 1.5;
}

.lab-user-menu__id strong { color: var(--text-100); }
.lab-user-menu__id span { word-break: break-all; }
.lab-user-menu__logout { width: 100%; justify-content: center; }

/* App layout (0.19.0, Filip 20.10.): the sidebar sits flush left under the
   logo like in the Academy — no centred block with a floating menu. The main
   column carries ONE content width (--lab-inhalt): every block of a page is
   equally wide, running text keeps its own measure inside.
   ⚠️ Der Test spiegelt diese Geometrie (css/styles.css .mm-main: 232px
   Sidebar-Versatz + --space-xl, linksbündig), damit die linken Inhaltskanten
   beim Tab-Wechsel fluchten — Änderungen hier dort nachziehen. */
.lab-app {
  flex: 1;
  display: grid;
  grid-template-columns: 232px minmax(0, 1fr);
  width: 100%;
}

.lab-sidebar {
  /* Link text lines up with the logo above (3px marker + 10px padding). */
  padding: var(--space-lg) var(--space-md) var(--space-lg) calc(var(--space-lg) - 13px);
  border-right: 1px solid var(--border-subtle);
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.lab-sidebar__link {
  display: flex;
  align-items: center;
  min-height: 44px;   /* Klickziel 22 §13 (war 34px) */
  padding: 8px 10px;
  border-left: 3px solid transparent;
  border-radius: 0 var(--r-xs) var(--r-xs) 0;
  color: var(--text-300);
  font-size: var(--fs-sm);
  text-decoration: none;
}

.lab-sidebar__link:hover { color: var(--text-100); background: var(--bg-2); }

/* Aktiver Eintrag: PINK, nicht Lime — Lime ist Marken-Akzent, Pink ist
   Aktion/Aktiv (24 §7 + §8 Anti-Pattern 8). */
.lab-sidebar__link--active {
  color: var(--text-100);
  font-weight: 500;
  border-left-color: var(--pink);
  background: var(--bg-2);
}

.lab-sidebar__link:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: -2px; }

/* Noch nicht offene Bereiche: gedimmt, aber klickbar — die Bereichsseite
   zeigt die Module als Ausblick (--text-400, nie --text-500: 22 §13). */
.lab-sidebar__link--dimm { color: var(--text-400); }
.lab-sidebar__link--dimm:hover { color: var(--text-300); }

/* Kapitel unter dem Hauptpunkt Bootcamp: eingerückt, gleiche Größe — die
   Kapitel SIND die Navigation (Filip 24.09.: keine Modul-Unterpunkte mehr,
   Module stehen auf ihren Seiten). */
.lab-sidebar__kapitel { padding-left: 24px; }

.lab-main {
  --lab-inhalt: 1600px;
  min-width: 0;
  padding: var(--space-lg) var(--space-xl) var(--space-xl);
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
}
/* One width for every block; narrower things (text measure, forms) say so
   in their own, later rules. */
.lab-main > * { max-width: var(--lab-inhalt); }

.lab-page__title {
  margin: 0;
  font-size: clamp(var(--fs-xl), 3.5vw, var(--fs-2xl));
  font-weight: 800;
  letter-spacing: -0.01em;
  color: var(--text-100);
  /* The name falls back to the e-mail address — it must wrap, not overflow. */
  overflow-wrap: anywhere;
}

.lab-page__subtitle {
  margin: 0 0 var(--space-sm);
  max-width: 46rem;
  font-size: var(--fs-md);
  line-height: 1.55;
  color: var(--text-300);
}

/* ---- Home = Status-Cockpit (Filips Dashboard-Report 21.08.): erst Stand +
   Fortschritt + nächster Schritt, dann der Handlungsraum in beschrifteten
   Sektionen. Ruhig und ohne Druck — Fortschritt ist Orientierung, kein KPI. */
.lab-status {
  padding: var(--space-lg) var(--space-lg) var(--space-lg);
  background: var(--bg-2);
  border: 1px solid var(--border-soft);
  border-left: 3px solid var(--signal-text);
  border-radius: var(--r-lg);
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

.lab-status__title {
  margin: 0;
  font-size: var(--fs-lg);
  color: var(--text-100);
}

.lab-status__note {
  margin: 0;
  max-width: 46rem;
  font-size: var(--fs-sm);
  line-height: 1.55;
  color: var(--text-300);
}

/* Der Weg zum Standort (Filip 14.10.): drei Schritte, die es heute gibt —
   statt sechs Money-Mindset-Segmenten, von denen fünf ins Leere zeigten.
   Erledigt = Lime-Signal, der aktuelle Schritt trägt den Pink-Rand. */
.lab-weg {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 18px;
}

.lab-weg__schritt {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: var(--fs-sm);
  color: var(--text-300);
}

.lab-weg__nr {
  width: 22px;
  height: 22px;
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  border: 1px solid var(--border-soft);
  background: var(--bg-3);
  font-size: var(--fs-xs);
  font-weight: 700;
  color: var(--text-300);
}

.lab-weg__schritt--erledigt .lab-weg__nr {
  background: var(--signal-text);
  border-color: var(--signal-text);
  color: var(--bg-0);
}

.lab-weg__schritt--jetzt { color: var(--text-100); font-weight: 500; }
.lab-weg__schritt--jetzt .lab-weg__nr { border: 2px solid var(--pink); color: var(--text-100); }

/* Fertiges Review: der Kernsatz als Zitat aus dem Fitness Check Review. */
.lab-status__kern {
  margin: 0;
  max-width: 46rem;
  font-size: var(--fs-md);
  line-height: 1.5;
  color: var(--text-200);
}

/* Sektions-Überschrift auf Home: sagt, WAS die Kartengruppe ist — die
   früheren Kind-Labels in jeder Karte haben eher verwirrt (Filip 21.08.).
   Seit 14.10. heißt sie wie der Menüpunkt und trägt rechts den Weg zur
   ganzen Seite („Bootcamp im Überblick") statt einer eigenen Kachel. */
.lab-home-kopf {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 0 var(--space-md);
  margin: var(--space-sm) 0 calc(-1 * var(--space-xs));
}

.lab-home-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 44px;
  font-size: var(--fs-sm);
  color: var(--text-300);
  text-decoration: none;
  transition: color var(--t-fast) var(--ease);
}

.lab-home-link:hover { color: var(--text-100); }
.lab-home-link svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

.lab-home-label {
  margin: 0;
  font-size: var(--fs-xs);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--text-300);
}

/* Area library grid — five areas, fills the width. */
.lab-area-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: var(--space-sm);
}

.lab-area-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-height: 150px;
  padding: var(--space-lg) var(--space-md) var(--space-md);
  background: var(--bg-2);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-lg);
  text-decoration: none;
}

.lab-area-card:hover {
  border-color: var(--border-strong);
  transform: translateY(-2px);
}
.lab-area-card:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }

.lab-area-card__icon {
  width: 26px;
  height: 26px;
  color: var(--text-300);
  margin-bottom: 2px;
}

.lab-area-card__name { margin: 0; font-size: var(--fs-md); font-weight: 700; color: var(--text-100); }

/* Das Kapitel, das das Fitness Check Review empfiehlt — verbindet die große
   Karte oben mit den fünf Bootcamp-Kapiteln. Pink wie der aktive Menüpunkt. */
.lab-area-card--empfohlen { position: relative; border-color: var(--pink); box-shadow: inset 0 0 0 1px var(--pink); }
.lab-area-card__badge {
  position: absolute;
  top: var(--space-md);
  right: var(--space-md);
  padding: 2px 8px;
  border: 1px solid var(--pink);
  border-radius: var(--r-pill);
  font-size: var(--fs-xs);
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-100);
}
.lab-area-card__meta { margin: auto 0 0; font-size: var(--fs-sm); color: var(--text-400); }

/* Quer-Reihe: Icon + Text + Pfeil in einer großzügigen Zeile — dieselbe
   Affordanz wie die Modul-Balken. */
.lab-row-link {
  display: flex;
  align-items: center;
  gap: var(--space-md);
  padding: var(--space-md) 18px;
  background: var(--bg-2);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-lg);
  text-decoration: none;
}

.lab-row-link:hover {
  border-color: var(--border-strong);
  transform: translateY(-2px);
}
.lab-row-link:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }

.lab-row-link__icon {
  flex: 0 0 auto;
  width: 26px;
  height: 26px;
  color: var(--text-300);
}

.lab-row-link__text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  margin-right: auto;
}

.lab-row-link__text strong { font-size: var(--fs-md); font-weight: 700; color: var(--text-100); }
.lab-row-link__text span { font-size: var(--fs-sm); color: var(--text-400); }

/* Module list on area pages: the WHOLE bar is the link (Birgit-Live-Test
   21.08. — die Status-Pille wurde für den Klickpunkt gehalten, der
   unterstrichene Name nicht erkannt). Bars sind bewusst großzügig. */
/* One column across the content width (0.19.0, Filip 20.10.: side by side
   read worse and gave uneven heights). */
.lab-modul-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

.lab-modul {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-sm);
  min-height: 68px;
  padding: 16px 18px;
  background: var(--bg-2);
  border: 1px solid var(--border-subtle);
  border-radius: var(--r-md);
  text-decoration: none;
}

/* Dritte Ebene (Module eines Kapitels, Filip 01.10.): ohne Fläche, nur
   Kontur und etwas flacher — eine Stufe leiser als die Balken der
   Hauptpunkte, damit man auf einen Blick sieht, wie tief man drin ist.
   Steht VOR dem Hover, damit dessen Kontur gewinnt. */
.lab-modul-list--tief .lab-modul {
  min-height: 56px;
  padding-block: 12px;
}

.lab-modul--link:hover {
  border-color: var(--border-strong);
  transform: translateY(-2px);
}

.lab-modul--link:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }

.lab-modul__icon {
  flex: 0 0 auto;
  width: 22px;
  height: 22px;
  color: var(--text-300);
}

.lab-modul--dimm .lab-modul__icon { color: var(--text-400); }

.lab-modul__name {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  margin-right: auto;
  font-weight: 500;
  font-size: var(--fs-md);
  color: var(--text-100);
}

.lab-modul__name small { font-weight: 400; font-size: var(--fs-xs); color: var(--text-400); }

/* Einordnung in Klammern auf der Bootcamp-Übersicht (Birgit 09.10.): leiser als der Name. */
.lab-modul__einordnung { font-weight: 400; color: var(--text-300); }

.lab-modul__pfeil {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  color: var(--text-400);
}

.lab-modul--link:hover .lab-modul__pfeil { color: var(--text-200); }

/* Vorbereitete Module: ausgegraut als Ausblick — sichtbar, nicht versteckt
   (Filip 21.08.: Motivation statt Leerstelle). */
.lab-modul--dimm .lab-modul__name { color: var(--text-400); }

/* Badge, nicht Chip: reines Status-LABEL, nie klickbar (24 §3-Matrix, §6).
   Hieß bis zum Audit .lab-chip — die Klasse widersprach dem Bauteil. */
.lab-badge {
  flex: 0 0 auto;
  padding: 3px 10px;
  border: 1px solid var(--border-soft);
  border-radius: var(--r-pill);
  font-size: var(--fs-xs);
  font-weight: 500;
  letter-spacing: 0.04em;
  color: var(--text-300);
  white-space: nowrap;
}

/* Lime als Status „gut/verfügbar" ist die Rolle des Akzents (22 §3.2). */
.lab-badge--live { border-color: var(--ok-text); color: var(--ok-text); }

/* Etappen-Überschrift auf der Einstiegs-Seite (Birgits Dreiteilung 21.08.):
   verbindet Modul-Gruppen mit den drei Ergebnissen der Trias. */
.lab-etappe-label {
  margin: var(--space-sm) 0 calc(-1 * var(--space-xs));
  font-size: var(--fs-xs);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--text-300);
}



/* The journey column keeps its reading width inside the wider main area. */


/* ---- Motion: EINE Regel app-weit (22 §10, 24 §8 AP 5) ----
   Karten heben sich, Buttons/Links wechseln Farbe — nie beides an derselben
   Fläche (kein doppelter Hover). Fallback für prefers-reduced-motion unten. */
/* Jedes Bauteil überblendet NUR, was sich bei Hover/Fokus wirklich ändert.
   Würde man Flächen pauschal mitanimieren, schmiert der Theme-Wechsel:
   die Token kippen dann über --t-fast statt sofort. */
.lab-area-card,
.lab-row-link,
.lab-modul {
  transition: border-color var(--t-fast) var(--ease),
              transform var(--t-fast) var(--ease);
}

.lab-btn-primary,
.lab-btn-ghost,
.lab-theme-toggle {
  transition: background-color var(--t-fast) var(--ease),
              border-color var(--t-fast) var(--ease),
              transform var(--t-fast) var(--ease);
}

.lab-sidebar__link,
.lab-user-menu__summary,
.lab-exped-btn,
.lab-zurueck-pfeil,
.lab-rv-toc__link,
.lab-rv-modul,
.lab-coach-zeile,
a.lab-extern {
  transition: background-color var(--t-fast) var(--ease),
              border-color var(--t-fast) var(--ease),
              color var(--t-fast) var(--ease);
}

.lab-crumb a,
.lab-import summary,
.lab-check-ohne summary {
  transition: color var(--t-fast) var(--ease);
}

.lab-check-datei__feld { transition: border-color var(--t-fast) var(--ease); }

@media (prefers-reduced-motion: reduce) {
  /* Bewegungs-Token einsammeln statt !important (22 §15) — dieselbe Lösung
     wie im Test (css/styles.css). */
  :root { --t-fast: 0s; --t: 0s; --t-slow: 0s; }

  .lab-area-card:hover { transform: none; }
  .lab-modul--link:hover { transform: none; }
  .lab-row-link:hover { transform: none; }
  .lab-skip-link { transition: none; }
}

/* Narrow screens: the user menu collapses to an icon button. The header must
   not grow past the viewport — logo (170) + toggle (44) + gaps + padding
   already fill a 375 px row, and a long member name pushed the toggle off
   screen entirely (design-audit 2026-08-20, Befund 1). Padding and logo size
   stay untouched on purpose: both services share the same header line and
   nothing may jump between them (Filip 31.07.). The name stays available to
   assistive tech and, for everyone, inside the panel. */
@media (max-width: 640px) {
  /* Die Wortmarke ist der erste Platz, der im engen Header weichen kann —
     der Seitentitel nennt das Produkt ohnehin. */
  .lab-wordmark { display: none; }

  .lab-user-menu__summary {
    max-width: none;
    min-width: 44px;
    justify-content: center;
    padding: 10px;
  }

  .lab-user-menu__name {
    position: absolute;
    width: 1px; height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
  }
}

/* Small screens: sidebar becomes a horizontal strip under the header. */
@media (max-width: 880px) {
  .lab-app { grid-template-columns: 1fr; }

  .lab-sidebar {
    flex-direction: row;
    align-items: center;
    gap: 4px;
    overflow-x: auto;
    padding: var(--space-xs) var(--space-md);
    border-right: 0;
    border-bottom: 1px solid var(--border-subtle);
  }


  .lab-sidebar__link {
    flex: 0 0 auto;
    border-left: 0;
    border-bottom: 3px solid transparent;
    border-radius: var(--r-xs) var(--r-xs) 0 0;
    padding: 8px 10px;
  }

  .lab-sidebar__link--active { border-left: 0; border-bottom-color: var(--pink); }

  /* Im horizontalen Streifen keine Einrückung der Kapitel — Platz ist auf
     Mobile das knappe Gut. */
  .lab-sidebar__kapitel { padding-left: 10px; }

  .lab-main { padding: var(--space-md); }

  .lab-crumb { display: none; }
}

/* ---- Expeditionskarte als Vollflächen-Overlay (Filip 20.08. abends) ----
   Karten-Farben sind komponentenlokale Ableitungen der Token — kein zweiter
   Token-Spiegel. Sichtbarkeit hart schalten (hidden-Attribut), nie über
   Transitions: eingebettete Browser pausieren sie in Hintergrund-Tabs. */

/* Der Kompass-Knopf in der Kopfzeile — der Hingucker, der zur Karte einlädt.
   Lime-Rand = das eine Signal der Kopfzeile (22 §3.2), Nadel in Pink. */
.lab-exped-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 8px 16px;
  background: transparent;
  border: 1px solid var(--border-active);
  border-radius: var(--r-md);
  color: var(--text-100);
  font-family: inherit;
  font-size: var(--fs-sm);
  font-weight: 500;
  cursor: pointer;
  white-space: nowrap;
}
.lab-exped-btn:hover { background: var(--bg-3); }
.lab-exped-btn:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.lab-exped-btn svg { width: 19px; height: 19px; fill: none; stroke: currentColor;
  stroke-width: 1.7; stroke-linejoin: round; }
@media (max-width: 760px) { .lab-exped-btn span, .lab-exped-btn { font-size: 0; gap: 0; padding: 10px; } .lab-exped-btn svg { width: 20px; height: 20px; } }

/* Overlay: legt sich über Sidebar UND Inhalt — die Karte IST dann die Navigation. */
/* display:flex würde das hidden-Attribut überstimmen — explizit absichern. */
.lab-exped[hidden] { display: none; }

.lab-exped {
  position: fixed;
  inset: 65px 0 0 0;   /* Kopfzeile bleibt sichtbar und bedienbar */
  z-index: 80;
  background: var(--bg-1);
  overflow-y: auto;
  padding: var(--space-md) var(--space-lg) var(--space-lg);
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}
body.lab-exped-offen { overflow: hidden; }

.lab-exped__kopf { display: flex; align-items: baseline; gap: var(--space-md); flex-wrap: wrap; }
.lab-exped__titel { margin: 0; font-size: var(--fs-xl); font-weight: 800; letter-spacing: -0.01em; color: var(--text-100); }
.lab-exped__sub { margin: 0; flex: 1; font-size: var(--fs-sm); color: var(--text-300); }
.lab-exped__zu { align-self: center; }

.lab-exped__karte {
  position: relative;
  flex: 1;
  min-height: 0;
  background: var(--bg-2);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-lg);
  overflow: hidden;
  box-shadow: var(--shadow-md);
}
.lab-exped__karte svg { display: block; width: 100%; height: 100%; min-height: 420px; }

/* Small screens: the journey as a list instead of the map (karte.js builds it). */
.lab-exped__liste { display: none; }
@media (max-width: 640px) {
  .lab-exped__karte { overflow-y: auto; }
  .lab-exped__karte svg, .lab-exped__panel { display: none; }
  .lab-exped__liste {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
    margin: 0;
    padding: var(--space-md);
    list-style: none;
  }
  .lab-exped__zeile {
    display: grid;
    gap: 2px;
    min-height: 44px;
    padding: var(--space-sm) var(--space-md);
    border: 1px solid var(--border-soft);
    border-radius: var(--r-md);
    color: var(--text-200);
    text-decoration: none;
  }
  .lab-exped__zeile--link { background: var(--bg-3); }
  .lab-exped__zeile--link:hover { border-color: var(--border-strong); }
  .lab-exped__zeile strong { font-size: var(--fs-md); font-weight: 700; color: var(--text-100); overflow-wrap: anywhere; }
  .lab-exped__zeile-ort { font-family: var(--mono); font-size: var(--fs-xs); letter-spacing: .12em; text-transform: uppercase; color: var(--text-300); }
  .lab-exped__zeile-meta { font-size: var(--fs-sm); color: var(--text-300); }
}
.lab-exped__hint { margin: 0; }

/* Gebiets-Panel im Overlay: erscheint am Camp, Navigation erst hier */
.lab-exped__panel {
  position: absolute;
  width: min(320px, calc(100% - 32px));
  background: var(--bg-2);
  border: 1px solid var(--border-strong);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-lg);
  padding: var(--space-lg);
}
.lab-exped__panel-zu {
  position: absolute; top: 4px; right: 4px; width: 44px; height: 44px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 0; background: transparent; color: var(--text-400);
  cursor: pointer; border-radius: var(--r-xs);
}
.lab-exped__panel-zu svg { width: 16px; height: 16px; stroke: currentColor; }
.lab-exped__panel-zu:hover { color: var(--text-100); background: var(--bg-3); }
.lab-exped__panel-kind {
  margin: 0; font-family: var(--mono); font-size: var(--fs-xs);
  letter-spacing: 0.1em; text-transform: uppercase; color: var(--signal-text);
}
.lab-exped__panel-name { margin: 4px 0 10px; font-size: var(--fs-lg); color: var(--text-100); }
.lab-exped__panel-liste { list-style: none; margin: 0 0 var(--space-md); padding: 0; }
.lab-exped__panel-modul {
  display: flex; justify-content: space-between; gap: var(--space-sm);
  padding: 10px 0; border-top: 1px solid var(--border-subtle);
  font-size: var(--fs-sm); color: var(--text-400);
}
.lab-exped__panel-modul--da { color: var(--text-100); }
.lab-exped__panel-modul small { font-family: var(--mono); font-size: var(--fs-xs); color: var(--text-400); white-space: nowrap; }
.lab-exped__panel-cta { margin-top: 0; align-self: stretch; text-align: center; display: block; }
.lab-exped__panel-hinweis { margin: 0; font-size: var(--fs-sm); color: var(--text-300);
  border-top: 1px solid var(--border-subtle); padding-top: var(--space-sm); }

.lab-exped__karte {
  --lab-karte-line: rgba(255,255,255,.075);
  --lab-karte-field: rgba(255,255,255,.022);
  --lab-karte-field-2: rgba(255,255,255,.014);
  --lab-karte-field-3: rgba(255,255,255,.008);
  --lab-karte-peak: rgba(255,255,255,.05);
  --lab-karte-tint: var(--lime);
}

[data-theme='light'] .lab-exped__karte {
  --lab-karte-line: rgba(25,25,25,.09);
  --lab-karte-field: rgba(25,25,25,.025);
  --lab-karte-field-2: rgba(25,25,25,.015);
  --lab-karte-field-3: rgba(25,25,25,.008);
  --lab-karte-peak: rgba(25,25,25,.055);
  --lab-karte-tint: var(--lime-dark);
}


.lab-karte__kontur { fill: none; stroke: var(--lab-karte-line); stroke-width: 1; }
.lab-karte__feld--1 { fill: var(--lab-karte-field); }
.lab-karte__feld--2 { fill: var(--lab-karte-field-2); }
.lab-karte__feld--3 { fill: var(--lab-karte-field-3); }
.lab-karte__peak { fill: var(--lab-karte-peak); }
.lab-karte__route { fill: none; stroke: var(--text-500); stroke-width: 1.5; stroke-dasharray: 1 9; stroke-linecap: round; }
.lab-karte__chev { fill: none; stroke: var(--text-500); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.lab-karte__mast { stroke: var(--text-300); stroke-width: 1.6; stroke-linecap: round; }
.lab-karte__flagge { fill: var(--lab-karte-tint); }
.lab-karte__gipfel { fill: none; stroke: var(--text-300); stroke-width: 1.6; stroke-linejoin: round; }
.lab-karte__kappe { fill: var(--text-300); }
.lab-karte__ort { font-family: var(--mono); font-size: 10px; letter-spacing: .1em; fill: var(--text-300); text-transform: uppercase; }
.lab-karte__meta { font-family: var(--mono); font-size: 10px; fill: var(--text-400); }
.lab-karte__name { font-family: var(--font); font-weight: 700; font-size: 15.5px; fill: var(--text-100); }
.lab-karte__camp { cursor: pointer; }
.lab-karte__camp:focus { outline: none; }  /* Ersatz: Plateau-Strich + Panel-Fokus */
.lab-karte__camp--gesperrt .lab-karte__name { fill: var(--text-400); }
.lab-karte__camp .lab-karte__plateau { fill: var(--lab-karte-field); stroke: var(--border-soft); stroke-width: 1; }
.lab-karte__camp:hover .lab-karte__plateau { stroke: var(--border-active); stroke-width: 1.5; }
.lab-karte__camp:focus-visible .lab-karte__plateau { stroke: var(--focus-ring); stroke-width: 2; }
.lab-karte__seg { rx: 2.5; fill: none; stroke: var(--text-600); stroke-width: 1; }
.lab-karte__seg--voll { fill: var(--lab-karte-tint); stroke: none; }
.lab-karte__cp-core { fill: var(--pink); stroke: var(--pink); stroke-width: 1.6; }
.lab-karte__cp text { font-family: var(--mono); font-size: 10.5px; font-weight: 700; fill: var(--white);
  text-anchor: middle; dominant-baseline: central; }
.lab-karte__tag { font-family: var(--mono); font-size: 9px; letter-spacing: .08em; fill: var(--text-400); text-transform: uppercase; }
.lab-karte__rose-kreis { fill: var(--bg-2); stroke: var(--pink); stroke-width: 1.4; }
[data-theme='light'] .lab-karte__rose-kreis { stroke: var(--pink-dark); }
.lab-karte__nadel-n { fill: var(--pink); }
[data-theme='light'] .lab-karte__nadel-n { fill: var(--pink-dark); }
.lab-karte__nadel-s { fill: var(--text-500); }

@keyframes lab-karte-puls { 0%,100% { opacity: .35; transform: scale(1); } 50% { opacity: 0; transform: scale(1.9); } }
.lab-karte__cp-ring { fill: none; stroke: var(--pink); stroke-width: 1.5; transform-origin: center;
  transform-box: fill-box; animation: lab-karte-puls 2.2s var(--ease-out) infinite; }
@media (prefers-reduced-motion: reduce) { .lab-karte__cp-ring { animation: none; opacity: 0; } }

/* Zurück in den Bereich: Icon-Pfeil bündig an der linken Content-Kante,
   die Headline rückt daneben ein (Filip 21.08. nachmittags — der Pfeil im
   Randraum wirkte verloren). Absolut positioniert, damit die H1 ihre
   Zeilenhöhe behält: vertikal springt beim Navigieren weiterhin nichts. */
.lab-titelzeile { position: relative; padding-left: 52px; }
.lab-zurueck-pfeil {
  position: absolute;
  /* Optische Bündigkeit: das 20px-Icon zentriert in der 44px-Klickfläche —
     die Box rückt 12px hinaus, damit das ICON auf der Content-Kante liegt. */
  left: -12px;
  top: 50%;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: var(--r-md);
  color: var(--text-300);
}
.lab-zurueck-pfeil:hover { color: var(--text-100); background: var(--bg-2); }
.lab-zurueck-pfeil:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.lab-zurueck-pfeil svg { width: 20px; height: 20px; fill: none; stroke: currentColor;
  stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

/* ---- KI-Station Fitness-Check-Review (Coach v1, 21.08.) ----
   Formular, Warte-Zustand und Review-Karten. Der Safe-Space-Charakter lebt
   in ruhigen Flächen: eine Karte, klare Felder, keine Dringlichkeit. */
.lab-check-form {
  max-width: 52rem;
  padding: var(--space-lg);
  background: var(--bg-2);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-lg);
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
}

/* Workbook-Upload (Welle 2 Punkt 4): eine ruhige Fläche, das unsichtbare
   Datei-Feld liegt darüber — Klick und Hineinziehen funktionieren nativ. */
.lab-check-datei { display: flex; flex-direction: column; gap: 6px; }

.lab-check-datei__feld {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: var(--space-md);
  padding: var(--space-lg);
  background: var(--bg-1);
  border: 1px dashed var(--border-strong);
  border-radius: var(--r-md);
  cursor: pointer;
}

.lab-check-datei__icon { flex: 0 0 auto; width: 32px; height: 32px; color: var(--text-300); }

.lab-check-datei__text { display: flex; flex-direction: column; gap: 4px; min-width: 0; }

.lab-check-datei__feld:hover,
.lab-check-datei__feld.is-drag { border-color: var(--border-active); }

.lab-check-datei__feld.is-gewaehlt { border-style: solid; }

.lab-check-datei__feld:focus-within { outline: 2px solid var(--focus-ring); outline-offset: 2px; }

.lab-check-datei__input {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}

.lab-check-datei__titel { font-weight: 500; color: var(--text-100); }

.lab-check-datei__hilfe { font-size: var(--fs-sm); color: var(--text-400); }

.lab-check-datei__wahl {
  margin-top: var(--space-xs);
  font-size: var(--fs-sm);
  font-weight: 500;
  color: var(--text-200);
  text-decoration: underline;
  text-underline-offset: 3px;
  overflow-wrap: anywhere;
}

.lab-check-datei__feld.is-gewaehlt .lab-check-datei__wahl { color: var(--text-100); text-decoration: none; }
.lab-check-datei__feld.is-gewaehlt .lab-check-datei__icon { color: var(--text-100); }

/* Weitere Unterlagen (0.14.0): leiser als das Workbook-Feld — Liste + Knopf. */
.lab-check-anlagen { display: flex; flex-direction: column; gap: 6px; }
.lab-check-anlagen__titel { margin: 0; font-weight: 500; color: var(--text-100); }
.lab-check-anlagen__optional { margin-left: 6px; font-size: var(--fs-xs); font-weight: 400; color: var(--text-300); }
.lab-check-anlagen__liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.lab-check-anlagen__liste:empty { display: none; }
.lab-check-anlagen__zeile {
  display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: var(--space-sm); align-items: center;
  padding: 8px 12px; background: var(--bg-1); border: 1px solid var(--border-soft); border-radius: var(--r-md);
  font-size: var(--fs-sm);
}
.lab-check-anlagen__name { color: var(--text-100); font-weight: 500; overflow-wrap: anywhere; }
.lab-check-anlagen__groesse { color: var(--text-300); white-space: nowrap; }
.lab-check-anlagen__weg {
  min-height: 44px; padding: 4px 12px; background: none; border: 1px solid var(--border-strong); border-radius: var(--r-md);
  font: inherit; font-size: var(--fs-xs); color: var(--text-200); cursor: pointer;
}
.lab-check-anlagen__weg:hover { color: var(--text-100); border-color: var(--border-active); }
.lab-check-anlagen__knopf { position: relative; align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; cursor: pointer; }
.lab-check-anlagen__knopf[hidden] { display: none; }
.lab-check-anlagen__knopf:focus-within { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.lab-check-anlagen__input { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; }
.lab-check-anlagen__icon { width: 18px; height: 18px; }

.lab-check-ohne summary { cursor: pointer; font-size: var(--fs-sm); color: var(--text-300); }
.lab-check-ohne summary:hover { color: var(--text-100); }

.lab-check-ohne__felder {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  margin-top: var(--space-md);
}

.lab-check-feld { display: flex; flex-direction: column; gap: 6px; }

.lab-check-feld__label { font-weight: 500; color: var(--text-100); }

.lab-check-feld__hilfe { font-size: var(--fs-sm); color: var(--text-400); }

.lab-check-feld__text {
  max-width: none;
  min-height: 96px;
  resize: vertical;
  font-family: inherit;
  font-size: var(--fs-md);
  line-height: 1.5;
}

.lab-check-kompass {
  margin: 0;
  padding: var(--space-md);
  border: 1px solid var(--border-subtle);
  border-radius: var(--r-md);
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

.lab-check-kompass legend {
  padding: 0 6px;
  font-size: var(--fs-sm);
  color: var(--text-300);
}

.lab-check-slider {
  display: grid;
  grid-template-columns: minmax(140px, 200px) 1fr 2ch;
  align-items: center;
  gap: var(--space-sm);
}

.lab-check-slider__name { font-size: var(--fs-sm); color: var(--text-200); }

.lab-check-slider input[type='range'] { width: 100%; accent-color: var(--pink); }

.lab-check-slider output {
  font-family: var(--mono);
  font-size: var(--fs-sm);
  color: var(--text-200);
  text-align: right;
}

/* Unbewegt = „keine Angabe": grau statt Pink, bis das Mitglied ihn anfasst. */
.lab-check-slider.is-leer input[type='range'] { accent-color: var(--text-400); }
.lab-check-slider.is-leer output { color: var(--text-400); }

/* Schmale Fenster: Name über dem Regler — nebeneinander blieben dem Regler
   auf 375 px nur rund 40 px (Befund 28.09.). */
@media (max-width: 640px) {
  .lab-check-slider { grid-template-columns: 1fr 2ch; row-gap: 2px; }
  .lab-check-slider__name { grid-column: 1 / -1; }
}

/* Geld-Archetyp als eigener, erklärter Baustein (Filip 01.10.) — dieselbe
   ruhige Fläche wie die Freigabe darunter. */
.lab-check-archetyp {
  padding: var(--space-md);
  background: var(--bg-1);
  border: 1px solid var(--border-subtle);
  border-radius: var(--r-md);
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.lab-check-archetyp p { margin: 0; }
.lab-check-archetyp__titel { font-size: var(--fs-sm); color: var(--text-100); }
.lab-check-archetyp__text { font-size: var(--fs-xs); line-height: 1.5; color: var(--text-300); }
.lab-check-archetyp a { color: var(--text-200); }

.lab-check-share {
  display: flex;
  align-items: flex-start;
  gap: var(--space-sm);
  padding: var(--space-md);
  background: var(--bg-1);
  border: 1px solid var(--border-subtle);
  border-radius: var(--r-md);
  cursor: pointer;
}

.lab-check-share input { margin-top: 3px; accent-color: var(--pink); }

.lab-check-share span { font-size: var(--fs-sm); color: var(--text-100); }

.lab-check-share small {
  display: block;
  margin-top: 4px;
  font-size: var(--fs-xs);
  color: var(--text-400);
  line-height: 1.5;
}

.lab-check-wartet {
  padding: var(--space-lg);
  background: var(--bg-2);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-lg);
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

.lab-check-wartet__titel { margin: 0; font-size: var(--fs-lg); color: var(--text-100); }

/* KI thinking indicator (22 §8.8) — the review runs for minutes, never in silence. */
.ki-denkt { display: inline-flex; align-items: center; gap: 12px;
  font-family: var(--mono); font-size: var(--fs-sm); color: var(--text-400); }
.ki-denkt__puls { display: inline-flex; align-items: flex-end; gap: 4px; height: 20px; }
.ki-denkt__puls i { display: block; width: 4.5px; height: 100%; border-radius: var(--r-pill);
  transform-origin: 50% 100%; animation: ki-denkt-puls var(--think-pulse) ease-in-out infinite; }
.ki-denkt__puls i:nth-child(1) { background: var(--lime); }
.ki-denkt__puls i:nth-child(2) { background: var(--text-100); animation-delay: var(--think-stagger); }
.ki-denkt__puls i:nth-child(3) { background: var(--text-100); animation-delay: calc(2 * var(--think-stagger)); }
.ki-denkt__puls i:nth-child(4) { background: var(--pink); animation-delay: calc(3 * var(--think-stagger)); }
.ki-denkt__wort { animation: ki-denkt-wort var(--think-word-in) var(--ease-out) both; }
@keyframes ki-denkt-puls { 0%, 100% { transform: scaleY(.4); opacity: .45; } 50% { transform: scaleY(1); opacity: 1; } }
@keyframes ki-denkt-wort { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .ki-denkt__puls i, .ki-denkt__wort { animation: none; } }

/* Die Beispiel-Zeile unter Formular/Review hält dieselbe Kante (Filip 01.10.). */


/* ---- Fitness Check Review (lab-v0.10.0, Entwurf 12.10. von Filip freigegeben):
   six numbered section cards, a table of contents that follows the reader,
   chapter marks into the read-back, figures from the member's own numbers.
   Markup: src/coach/ansicht.js · behaviour: public/review.js. ---- */

/* ---- Chart colours (contrast-checked: ≥ 3:1 against the card surface) ---- */
:root {
  --lab-rv-balken: #A3A3A3;          /* 7,3:1 on --bg-2 */
  --lab-rv-balken-hoch: #6B6B6B;     /* 3,5:1 — projection, lighter step */
  --lab-rv-ziel: var(--lime);        /* 11,4:1 */
  --lab-rv-meter: #B8B8B8;           /* 9,3:1 */
  /* SWOT „Chancen“ (Filip 12.10.): no CI blue exists — dark-calibrated like the
     status colours, carried by icon + word, never as text colour. */
  --lab-rv-blau: #60A5FA;
}
[data-theme="light"] {
  --lab-rv-balken: #5C5C5C;          /* 6,7:1 on white */
  --lab-rv-balken-hoch: #949494;     /* 3,0:1 */
  --lab-rv-ziel: var(--pink-dark);   /* 7,4:1 — lime is no graphic on white */
  --lab-rv-meter: #3A3A3A;           /* 11,4:1 */
}

/* ---- Layout: review + table of contents ---- */
.lab-rv-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 220px;
  gap: var(--space-xl);
  align-items: start;
}
.lab-rv { display: flex; flex-direction: column; gap: var(--space-xl); min-width: 0; }

/* Full width (0.18.0): the review grows with the page — grids and figures
   get the room, running text keeps a readable measure. */
.lab-rv-punkt__text, .lab-rv-empf__text, .lab-rv-frage__text, .lab-rv-widerspruch__text,
.lab-rv-entscheidung__text, .lab-rv-rechnung__fazit, .lab-rv-angebot__beleg, .lab-rv-entwurf__text,
.lab-rv-swot__text, .lab-rv-wb__zeile dd { max-width: 75ch; }
.lab-rv-blick__kern { max-width: 42ch; }

/* ---- Table of contents (sticky; scroll spy marks the current section) ---- */
.lab-rv-toc { position: sticky; top: var(--space-lg); display: flex; flex-direction: column; gap: var(--space-sm); }
.lab-rv-toc__titel {
  margin: 0 0 4px 13px;
  font-size: var(--fs-xs);
  font-weight: 500;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--text-400);
}
.lab-rv-toc__liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.lab-rv-toc__link {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  padding: 6px 10px;
  border-left: 3px solid transparent;
  border-radius: 0 var(--r-xs) var(--r-xs) 0;
  color: var(--text-300);
  font-size: var(--fs-sm);
  text-decoration: none;
}
.lab-rv-toc__link:hover { color: var(--text-100); background: var(--bg-2); }
.lab-rv-toc__link:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: -2px; }
.lab-rv-toc__link.is-aktiv { color: var(--text-100); font-weight: 500; border-left-color: var(--pink); background: var(--bg-2); }
.lab-rv-toc__nr { font-variant-numeric: tabular-nums; font-weight: 700; color: var(--text-400); min-width: 2ch; }
.lab-rv-toc__link.is-aktiv .lab-rv-toc__nr { color: var(--signal-text); }

/* ---- „Weiterlesen" bar ---- */
.lab-rv-weiter {
  position: sticky;
  bottom: var(--space-md);
  z-index: 4;
  box-shadow: var(--shadow-lg);
  display: flex;
  align-items: center;
  gap: var(--space-md);
  padding: var(--space-sm) var(--space-sm) var(--space-sm) var(--space-md);
  background: var(--bg-2);
  border: 1px solid var(--border-soft);
  border-left: 3px solid var(--pink);
  border-radius: var(--r-md);
  font-size: var(--fs-sm);
  color: var(--text-200);
}
.lab-rv-weiter p { margin: 0; flex: 1; }
.lab-rv-weiter a { color: var(--text-100); font-weight: 500; }
.lab-rv-weiter__zu {
  width: 44px; height: 44px; flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  background: transparent; border: 0; border-radius: var(--r-xs);
  color: var(--text-300); cursor: pointer;
  font-family: inherit; font-size: var(--fs-md);
}
.lab-rv-weiter__zu:hover { color: var(--text-100); background: var(--bg-3); }
.lab-rv-weiter__zu svg { width: 16px; height: 16px; }

/* ---- Section cards: big number + headline (22 §9.2) ---- */
.lab-rv-sektion {
  background: var(--bg-2);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-lg);
  padding: var(--space-xl) var(--space-xl) var(--space-xl);
  scroll-margin-top: var(--space-lg);
}
.lab-rv-sektion__kopf {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  column-gap: var(--space-md);
  row-gap: 6px;
  align-items: baseline;
  margin-bottom: var(--space-lg);
}
.lab-rv-sektion__nr {
  font-size: var(--fs-2xl);
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.03em;
  font-variant-numeric: tabular-nums;
  color: var(--signal-text);
}
.lab-rv-sektion__titel {
  margin: 0;
  font-size: var(--fs-xl);
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -0.02em;
  color: var(--text-100);
}
.lab-rv-sektion__intro { grid-column: 2; margin: 0; font-size: var(--fs-sm); line-height: 1.5; color: var(--text-300); max-width: 62ch; }

/* Sub-parts inside a section, separated by a hairline */
.lab-rv-teil + .lab-rv-teil { margin-top: var(--space-xl); padding-top: var(--space-xl); border-top: 1px solid var(--border-subtle); }
.lab-rv-teil__titel {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 var(--space-md);
  font-size: var(--fs-lg);
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--text-100);
}
.lab-rv-teil__icon { width: 20px; height: 20px; stroke: var(--text-300); flex: none; }
.lab-rv-anzahl {
  font-size: var(--fs-xs);
  font-weight: 500;
  color: var(--text-300);
  background: var(--bg-3);
  border-radius: var(--r-pill);
  padding: 2px 9px;
}

/* ---- Chapter references as chips (jump into „Dein Workbook in Textform") ---- */
.lab-rv-kap {
  color: var(--text-300);
  font-size: inherit;
  font-weight: 500;
  white-space: nowrap;
  text-decoration: underline dotted;
  text-decoration-color: var(--border-strong);
  text-underline-offset: 3px;
}
.lab-rv-kap:hover { color: var(--text-100); text-decoration-style: solid; text-decoration-color: currentColor; }
.lab-rv-kap:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; border-radius: 2px; }

/* ---- Items with title line ---- */
.lab-rv-punkte { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-lg); }
.lab-rv-punkt { display: grid; grid-template-columns: 24px minmax(0, 1fr); column-gap: 12px; }
.lab-rv-punkt__marke { width: 22px; height: 22px; margin-top: 1px; stroke: var(--text-300); }
.lab-rv-punkt__marke--warn { stroke: var(--warn-text); }
.lab-rv-punkt__titel { margin: 0 0 4px; font-size: var(--fs-md); font-weight: 700; line-height: 1.35; color: var(--text-100); }
.lab-rv-punkt__text { margin: 0; font-size: var(--fs-md); line-height: 1.6; color: var(--text-200); }

/* ---- Lead / „Auf einen Blick" ---- */
.lab-rv-eyebrow {
  margin: 0 0 var(--space-sm);
  font-size: var(--fs-xs);
  font-weight: 500;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--signal-text);
}
.lab-rv-blick__kern {
  margin: 0 0 var(--space-md);
  font-size: clamp(var(--fs-xl), 2.4vw, var(--fs-2xl));
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -0.02em;
  color: var(--text-100);
}
.lab-rv-blick__lead { margin: 0; font-size: var(--fs-md); line-height: 1.65; color: var(--text-200); max-width: 72ch; }

.lab-rv-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-sm); margin-top: var(--space-lg); }
.lab-rv-kpi { padding: var(--space-md); background: var(--bg-1); border: 1px solid var(--border-subtle); border-radius: var(--r-md); }
.lab-rv-kpi__label { margin: 0 0 6px; font-size: var(--fs-xs); font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-400); }
.lab-rv-kpi__wert { margin: 0; font-size: var(--fs-xl); font-weight: 800; letter-spacing: -0.02em; color: var(--text-100); }
.lab-rv-kpi__dazu { display: flex; align-items: center; gap: 4px; margin: 4px 0 0; font-size: var(--fs-sm); color: var(--text-300); }
.lab-rv-kpi__pfeil { width: 14px; height: 14px; flex: none; }
.lab-rv-kpi__pfeil--runter { stroke: var(--alert-text); }
.lab-rv-kpi__pfeil--hoch { stroke: var(--ok-text); }
.lab-rv-quelle { margin: var(--space-sm) 0 0; font-size: var(--fs-xs); color: var(--text-400); }

.lab-rv-blick__duo { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-md); margin-top: var(--space-lg); }
.lab-rv-blick__duo--eins { grid-template-columns: minmax(0, 1fr); }

/* Handwritten scans: what could not be read sits right under the core message. */
.lab-rv-hinweis { margin-top: var(--space-lg); padding: var(--space-md); background: var(--bg-1); border: 1px solid var(--border-soft); border-radius: var(--r-md); }
.lab-rv-hinweis h3 { margin: 0 0 6px; font-size: var(--fs-md); font-weight: 700; color: var(--text-100); }
.lab-rv-hinweis ul { margin: 0; padding-left: 1.2rem; font-size: var(--fs-md); line-height: 1.55; color: var(--text-200); }
.lab-rv-hinweis p { margin: 6px 0 0; font-size: var(--fs-sm); color: var(--text-300); }
.lab-rv-karte { padding: var(--space-lg); background: var(--bg-1); border: 1px solid var(--border-soft); border-radius: var(--r-md); }
.lab-rv-kompass { border-left: 3px solid var(--signal-text); display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.lab-rv-kompass .lab-rv-eyebrow { margin: 0; }
.lab-rv-kompass__name { margin: 0; font-size: var(--fs-xl); font-weight: 800; letter-spacing: -0.02em; color: var(--text-100); }
.lab-rv-kompass__dicht { margin: 0; font-size: var(--fs-sm); color: var(--text-300); }
.lab-rv-kompass__dicht strong { color: var(--text-200); font-weight: 500; }
.lab-rv-kompass details { width: 100%; font-size: var(--fs-sm); color: var(--text-200); }
.lab-rv-kompass summary { cursor: pointer; padding: 6px 0; color: var(--text-300); }
.lab-rv-kompass summary:hover { color: var(--text-100); }
.lab-rv-kompass details p { margin: 4px 0 0; line-height: 1.6; }
.lab-rv-kompass .lab-btn-ghost { margin-top: var(--space-sm); font-size: var(--fs-sm); }
.lab-rv-top3 h3 { margin: 0 0 var(--space-sm); }
.lab-rv-top3 ol { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.lab-rv-top3 a {
  display: grid; grid-template-columns: 2.2ch minmax(0, 1fr); gap: 10px; align-items: baseline;
  padding: 10px 0; border-top: 1px solid var(--border-subtle);
  color: var(--text-100); font-weight: 500; text-decoration: none; line-height: 1.4;
}
.lab-rv-top3 li:first-child a { border-top: 0; padding-top: 4px; }
.lab-rv-top3 a:hover { color: var(--signal-text); }
.lab-rv-top3 span { font-weight: 800; color: var(--signal-text); font-variant-numeric: tabular-nums; }

/* ---- Contradictions: two sides + verdict ---- */
.lab-rv-widersprueche { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-md); }
.lab-rv-widerspruch { padding: var(--space-md); background: var(--bg-1); border: 1px solid var(--border-soft); border-radius: var(--r-md); }
.lab-rv-widerspruch__paar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 28px minmax(0, 1fr);
  gap: var(--space-sm);
  align-items: stretch;
  margin-bottom: var(--space-sm);
}
.lab-rv-widerspruch__paar--eins { grid-template-columns: minmax(0, 1fr); }
.lab-rv-seite {
  padding: 8px 12px;
  background: var(--bg-2);
  border: 1px solid var(--border-subtle);
  border-radius: var(--r-sm);
  font-size: var(--fs-sm);
  font-weight: 500;
  line-height: 1.45;
  color: var(--text-100);
}
.lab-rv-gegen { display: flex; align-items: center; justify-content: center; }
.lab-rv-gegen__icon { width: 20px; height: 20px; stroke: var(--warn-text); }
.lab-rv-widerspruch__text { margin: 0; font-size: var(--fs-md); line-height: 1.6; color: var(--text-200); }

/* ---- Empty fields ---- */
.lab-rv-leerstellen { margin-top: var(--space-lg); padding: var(--space-md); border: 1px dashed var(--border-strong); border-radius: var(--r-md); }
.lab-rv-leerstellen h4 { margin: 0 0 var(--space-sm); font-size: var(--fs-md); font-weight: 700; color: var(--text-100); }
.lab-rv-leerstellen ul { list-style: none; margin: 0 0 var(--space-sm); padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.lab-rv-leerstellen li {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 6px 4px 10px;
  border: 1px dashed var(--border-strong);
  border-radius: var(--r-pill);
  font-size: var(--fs-sm);
  color: var(--text-200);
}
.lab-rv-leerstellen p { margin: 0; font-size: var(--fs-sm); color: var(--text-300); }

/* ---- SWOT: four fields; colour + icon + word (never colour alone) ---- */
.lab-rv-swot { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-md); }
.lab-rv-swot__feld {
  --swot: var(--text-400);
  padding: var(--space-md) var(--space-md) var(--space-lg);
  background: var(--bg-1);
  border: 1px solid var(--border-soft);
  border-top: 3px solid var(--swot);
  border-radius: var(--r-md);
}
.lab-rv-swot__feld--s { --swot: var(--status-green); }
.lab-rv-swot__feld--w { --swot: var(--status-red); }
.lab-rv-swot__feld--o { --swot: var(--lab-rv-blau); }
.lab-rv-swot__feld--t { --swot: var(--status-yellow); }
.lab-rv-swot__kopf { display: flex; align-items: center; gap: 10px; margin: 0 0 var(--space-md); font-size: var(--fs-lg); font-weight: 700; color: var(--text-100); }
.lab-rv-swot__icon {
  width: 32px; height: 32px; flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--r-sm);
  background: color-mix(in srgb, var(--swot) 22%, transparent);
}
.lab-rv-swot__svg { width: 18px; height: 18px; stroke: var(--text-100); }
.lab-rv-swot__liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-md); }
.lab-rv-swot__liste li { display: grid; grid-template-columns: 3ch minmax(0, 1fr); column-gap: 8px; }
.lab-rv-swot__nr { font-size: var(--fs-xs); font-weight: 700; color: var(--text-400); padding-top: 3px; font-variant-numeric: tabular-nums; }
.lab-rv-swot__titel { margin: 0 0 2px; font-size: var(--fs-md); font-weight: 700; line-height: 1.35; color: var(--text-100); }
.lab-rv-swot__text { margin: 0; font-size: var(--fs-sm); line-height: 1.55; color: var(--text-200); }

/* ---- Questions for the Q&A call ---- */
.lab-rv-fragen { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: var(--space-md); }
.lab-rv-frage { display: flex; flex-direction: column; gap: 8px; padding: var(--space-md); background: var(--bg-1); border: 1px solid var(--border-soft); border-radius: var(--r-md); }
/* Number and theme set apart from the question (Filip 13.10.): the number
   carries the colour, the question reads as regular text, not bold. */
.lab-rv-frage__kopf { display: flex; align-items: baseline; gap: 10px; margin: 0; }
.lab-rv-frage__nr { font-size: var(--fs-lg); font-weight: 800; line-height: 1; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; color: var(--signal-text); }
.lab-rv-frage__thema { font-size: var(--fs-xs); font-weight: 500; letter-spacing: 0.15em; text-transform: uppercase; color: var(--text-300); }
.lab-rv-frage__text { margin: 0; font-size: var(--fs-md); font-weight: 400; line-height: 1.55; color: var(--text-100); }

/* ---- Recommendations ---- */
.lab-rv-empfehlungen { list-style: none; margin: 0; padding: 0; }
.lab-rv-empf { display: grid; grid-template-columns: 3ch minmax(0, 1fr); column-gap: var(--space-md); padding: var(--space-md) 0; border-top: 1px solid var(--border-subtle); scroll-margin-top: var(--space-lg); }
.lab-rv-empf:first-child { border-top: 0; padding-top: 0; }
.lab-rv-empf__nr { font-size: var(--fs-xl); font-weight: 800; line-height: 1.1; letter-spacing: -0.02em; color: var(--signal-text); font-variant-numeric: tabular-nums; }
.lab-rv-empf__titel { margin: 2px 0 4px; font-size: var(--fs-md); font-weight: 700; line-height: 1.35; color: var(--text-100); }
.lab-rv-empf__text { margin: 0; font-size: var(--fs-md); line-height: 1.6; color: var(--text-200); }
.lab-rv-module { display: flex; flex-wrap: wrap; gap: 8px; margin-top: var(--space-sm); }
.lab-rv-modul {
  display: inline-flex; align-items: center; gap: 8px;
  min-height: 44px; padding: 0 14px;
  border: 1px solid var(--border-soft); border-radius: var(--r-md);
  background: var(--bg-3);
  color: var(--text-100); font-size: var(--fs-sm); font-weight: 500; text-decoration: none;
}
.lab-rv-modul:hover { border-color: var(--border-strong); background: var(--bg-4); }
.lab-rv-modul__icon { width: 16px; height: 16px; stroke: var(--signal-text); }

/* ---- Timeline: 48–72 h → 6 weeks, as checklists ---- */
.lab-rv-zeitachse { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-md); }
.lab-rv-etappe { padding: var(--space-lg); background: var(--bg-1); border: 1px solid var(--border-soft); border-radius: var(--r-md); }
.lab-rv-etappe__kopf { display: flex; align-items: center; gap: 12px; margin-bottom: var(--space-sm); }
.lab-rv-etappe__marke {
  width: 40px; height: 40px; flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%;
  border: 2px solid var(--signal-text);
  color: var(--text-100); font-size: var(--fs-xs); font-weight: 700;
}
.lab-rv-etappe__titel { margin: 0; font-size: var(--fs-lg); font-weight: 700; color: var(--text-100); line-height: 1.2; }
.lab-rv-etappe__sub { margin: 2px 0 0; font-size: var(--fs-sm); color: var(--text-300); }
.lab-rv-fortschritt { margin: var(--space-sm) 0 var(--space-md); }
.lab-rv-fortschritt__text { margin: 0 0 6px; font-size: var(--fs-xs); color: var(--text-400); }
.lab-rv-fortschritt__balken { height: 4px; border-radius: var(--r-pill); background: var(--bg-4); overflow: hidden; }
.lab-rv-fortschritt__balken span { display: block; height: 100%; width: 0; background: var(--grad-progress); transition: width var(--t) var(--ease); }
.lab-rv-haken { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.lab-rv-haken label {
  display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 12px; align-items: start;
  min-height: 44px; padding: 10px 0;
  border-top: 1px solid var(--border-subtle);
  font-size: var(--fs-sm); line-height: 1.5; color: var(--text-200);
  cursor: pointer;
}
.lab-rv-haken li:first-child label { border-top: 0; }
.lab-rv-haken input { width: 18px; height: 18px; margin: 1px 0 0; accent-color: var(--pink); cursor: pointer; }
.lab-rv-haken input:checked + span { color: var(--text-500); text-decoration: line-through; }
.lab-rv-haken input:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }

/* ---- 0.13.0: AI draft, the one decision, the goal reckoned, offers, marks ---- */
.lab-rv-entwurf {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--space-md); align-items: center;
  margin-bottom: var(--space-lg); padding: var(--space-md) var(--space-lg);
  background: var(--bg-1); border: 1px dashed var(--warn-text); border-radius: var(--r-md);
}
.lab-rv-entwurf__marke {
  margin: 0; padding: 4px 10px; border: 1px solid var(--warn-text); border-radius: var(--r-pill);
  font-size: var(--fs-xs); font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--warn-text);
}
.lab-rv-entwurf__text { margin: 0; font-size: var(--fs-sm); line-height: 1.55; color: var(--text-200); }
.lab-rv-entwurf__neu { font-size: var(--fs-sm); font-weight: 500; color: var(--text-200); white-space: nowrap; }
.lab-rv-entwurf__neu:hover { color: var(--text-100); }
.lab-rv-entscheidung {
  margin-top: var(--space-lg); padding: var(--space-md) var(--space-lg);
  background: var(--bg-1); border: 1px solid var(--border-soft); border-left: 3px solid var(--text-200); border-radius: var(--r-md);
}
.lab-rv-entscheidung .lab-rv-eyebrow { margin-bottom: 6px; color: var(--text-300); }
.lab-rv-entscheidung__text { margin: 0; font-size: var(--fs-lg); font-weight: 700; line-height: 1.35; color: var(--text-100); }
.lab-rv-marke {
  display: inline-block; margin-left: 2px; padding: 0 7px; border: 1px solid var(--border-strong); border-radius: var(--r-pill);
  font-size: var(--fs-xs); font-weight: 500; line-height: 1.6; color: var(--text-300); white-space: nowrap; vertical-align: 1px;
}
.lab-rv-marke--pruefen { border-color: var(--warn-text); color: var(--warn-text); }
.lab-rv-annahme { font-size: var(--fs-xs); font-weight: 400; color: var(--text-300); }
.lab-rv-rechnung { padding: var(--space-md); background: var(--bg-1); border: 1px solid var(--border-subtle); border-radius: var(--r-md); }
.lab-rv-rechnung__zeilen { margin: 0; }
.lab-rv-rechnung__zeile {
  display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: var(--space-md);
  padding: 8px 0; border-top: 1px solid var(--border-subtle); font-size: var(--fs-sm); line-height: 1.5;
}
.lab-rv-rechnung__zeile:first-child { border-top: 0; }
.lab-rv-rechnung__zeile dt { color: var(--text-300); }
.lab-rv-rechnung__zeile dd { margin: 0; color: var(--text-100); font-weight: 500; font-variant-numeric: tabular-nums; }
.lab-rv-rechnung__fazit { margin: var(--space-sm) 0 0; padding-top: var(--space-sm); border-top: 1px solid var(--border-soft); font-size: var(--fs-md); font-weight: 700; line-height: 1.5; color: var(--text-100); }
.lab-rv-angebote { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-sm); }
.lab-rv-angebot { display: grid; grid-template-columns: 11ch minmax(0, 1fr); gap: var(--space-md); align-items: start; }
.lab-rv-angebot__status {
  justify-self: start; padding: 2px 10px; border: 1px solid var(--border-strong); border-radius: var(--r-pill);
  font-size: var(--fs-xs); font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--text-300);
}
.lab-rv-angebot__status--verkauft { border-color: var(--ok-text); color: var(--ok-text); }
.lab-rv-angebot__status--angeboten { border-color: var(--warn-text); color: var(--warn-text); }
.lab-rv-angebot__name { margin: 0; font-size: var(--fs-md); font-weight: 700; color: var(--text-100); }
.lab-rv-angebot__beleg { margin: 2px 0 0; font-size: var(--fs-sm); line-height: 1.5; color: var(--text-300); }
.lab-rv-widerspruch--zuerst { border-color: var(--border-strong); }
.lab-rv-widerspruch__zuerst { margin: 0 0 var(--space-sm); font-size: var(--fs-xs); font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-300); }
/* 48–72 h and 6 weeks side by side, 3 months across the full width below. */
.lab-rv-zeitachse--drei > .lab-rv-etappe:nth-child(3) { grid-column: 1 / -1; }
.lab-rv-persoenlich {
  margin: var(--space-xl) 0; padding: var(--space-lg);
  background: var(--bg-1); border: 1px solid var(--border-soft); border-left: 3px solid var(--signal-text); border-radius: var(--r-md);
}
.lab-rv-persoenlich__titel { margin: 0 0 var(--space-sm); font-size: var(--fs-lg); font-weight: 700; color: var(--text-100); }
.lab-rv-persoenlich p { margin: 0; font-size: var(--fs-md); line-height: 1.6; color: var(--text-200); max-width: 72ch; }
.lab-rv-freigabe { display: flex; flex-wrap: wrap; gap: var(--space-sm); margin-top: var(--space-md); }
.lab-rv-freigabe__zurueck {
  display: inline-flex; align-items: center; min-height: 44px;
  padding: 0; background: none; border: 0; font: inherit; font-size: var(--fs-sm); color: var(--text-300);
  text-decoration: underline; text-underline-offset: 3px; cursor: pointer;
}
.lab-rv-freigabe__zurueck:hover { color: var(--text-100); }
.lab-rv-freigabe__bestaetigung {
  margin-top: var(--space-md); padding: var(--space-md); background: var(--bg-2);
  border: 1px solid var(--border-strong); border-radius: var(--r-md);
}
.lab-rv-freigabe__bestaetigung p { font-size: var(--fs-sm); }
.lab-rv-persoenlich .lab-alert:empty { display: none; }
.lab-rv-entwurf__privat { grid-column: 1 / -1; margin: 0; font-size: var(--fs-sm); color: var(--text-300); }
.lab-rv-entwurf__privat a { color: var(--text-200); }

/* ---- Figures: revenue chart + concentration meter ---- */
/* Side by side once the review is wide (0.18.0) — a chart stretched over the whole width reads flat. */
.lab-rv-figuren { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 26rem), 1fr)); align-items: start; gap: var(--space-md); }
.lab-rv-figur { margin: 0; padding: var(--space-md); background: var(--bg-1); border: 1px solid var(--border-subtle); border-radius: var(--r-md); }
.lab-rv-figur__titel { margin: 0 0 var(--space-sm); font-size: var(--fs-sm); font-weight: 700; color: var(--text-100); }
.lab-rv-figur figcaption { margin-top: var(--space-sm); font-size: var(--fs-xs); line-height: 1.5; color: var(--text-400); }
.lab-rv-chart { min-height: 240px; }
.lab-rv-chart__svg { display: block; overflow: visible; }
.lab-rv-chart__svg text { font-family: var(--font); font-size: 12px; fill: var(--text-400); }
.lab-rv-chart__svg .lab-rv-chart__wert { fill: var(--text-200); font-weight: 500; }
.lab-rv-chart__svg .lab-rv-chart__ziel-text { fill: var(--text-200); font-weight: 500; }
.lab-rv-chart__gitter { stroke: var(--border-subtle); stroke-width: 1; }
.lab-rv-chart__basis { stroke: var(--border-strong); stroke-width: 1; }
.lab-rv-chart__balken { fill: var(--lab-rv-balken); }
.lab-rv-chart__balken--hoch { fill: var(--lab-rv-balken-hoch); }
.lab-rv-chart__ziel { stroke: var(--lab-rv-ziel); stroke-width: 2; }
.lab-rv-chart__treffer { fill: transparent; cursor: default; }
.lab-rv-chart__treffer:focus-visible { outline: none; stroke: var(--focus-ring); stroke-width: 2; }
.lab-rv-chart__gruppe:hover .lab-rv-chart__balken, .lab-rv-chart__gruppe:focus-within .lab-rv-chart__balken { filter: brightness(1.15); }
[data-theme="light"] .lab-rv-chart__gruppe:hover .lab-rv-chart__balken { filter: brightness(0.85); }
.lab-rv-tabelle { margin-top: var(--space-sm); font-size: var(--fs-sm); color: var(--text-300); }
.lab-rv-tabelle summary { cursor: pointer; padding: 6px 0; }
.lab-rv-tabelle summary:hover { color: var(--text-100); }
.lab-rv-tabelle table { width: 100%; border-collapse: collapse; margin-top: 6px; font-variant-numeric: tabular-nums; }
.lab-rv-tabelle th, .lab-rv-tabelle td { padding: 6px 8px; text-align: right; border-top: 1px solid var(--border-subtle); color: var(--text-200); font-weight: 400; }
.lab-rv-tabelle th:first-child, .lab-rv-tabelle td:first-child { text-align: left; color: var(--text-300); }
.lab-rv-tabelle thead th { color: var(--text-400); font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: 0.08em; border-top: 0; }

.lab-rv-meter__zeile { display: flex; justify-content: space-between; gap: var(--space-md); margin: 0 0 6px; font-size: var(--fs-sm); color: var(--text-300); }
.lab-rv-meter__zeile strong { color: var(--text-100); font-weight: 500; }
.lab-rv-meter { display: block; width: 100%; height: 12px; }
.lab-rv-meter__spur { fill: var(--bg-4); }
.lab-rv-meter__wert { fill: var(--lab-rv-meter); }
.lab-rv-meter__fazit { display: flex; align-items: center; gap: 6px; margin: 8px 0 0; font-size: var(--fs-sm); color: var(--text-200); }
.lab-rv-meter__icon { width: 16px; height: 16px; stroke: var(--alert-text); flex: none; }

/* ---- Tooltip (values lead, labels follow) ---- */
.lab-rv-tooltip {
  position: fixed;
  z-index: 50;
  pointer-events: none;
  padding: 8px 12px;
  background: var(--bg-3);
  border: 1px solid var(--border-strong);
  border-radius: var(--r-sm);
  box-shadow: var(--shadow-md);
  font-size: var(--fs-sm);
  color: var(--text-300);
  max-width: 260px;
}
.lab-rv-tooltip strong { display: block; font-size: var(--fs-md); color: var(--text-100); }
.lab-rv-tooltip span { display: block; }
.lab-rv-tooltip span + strong { margin-top: 6px; }
.lab-rv-tooltip[hidden], .lab-rv-wb__aktionen[hidden] { display: none; }

/* ---- Workbook in text form: chapter by chapter, field by field ---- */
.lab-rv-wb__aktionen { display: flex; justify-content: flex-end; margin: -6px 0 var(--space-sm); }
.lab-rv-wb__aktionen button { min-height: 44px; font-size: var(--fs-sm); padding: 0 14px; }
.lab-rv-kapitel { border-top: 1px solid var(--border-subtle); scroll-margin-top: var(--space-lg); }
.lab-rv-kapitel:last-child { border-bottom: 1px solid var(--border-subtle); }
.lab-rv-kapitel summary {
  display: flex; align-items: center; gap: 12px;
  min-height: 48px; padding: 8px 4px;
  cursor: pointer; list-style: none;
  font-size: var(--fs-md); font-weight: 500; color: var(--text-100);
}
.lab-rv-kapitel summary::-webkit-details-marker { display: none; }
.lab-rv-kapitel summary:hover { background: var(--bg-3); border-radius: var(--r-xs); }
.lab-rv-kapitel summary:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: -2px; }
.lab-rv-kapitel__nr {
  min-width: 2.4ch; text-align: right;
  font-size: var(--fs-sm); font-weight: 700; color: var(--signal-text); font-variant-numeric: tabular-nums;
}
.lab-rv-kapitel__seiten { margin-left: auto; font-size: var(--fs-xs); color: var(--text-400); white-space: nowrap; }
.lab-rv-kapitel__pfeil { width: 18px; height: 18px; stroke: var(--text-300); flex: none; transform: rotate(90deg); transition: transform var(--t) var(--ease); }
.lab-rv-kapitel[open] .lab-rv-kapitel__pfeil { transform: rotate(-90deg); }
.lab-rv-kapitel[open] { background: color-mix(in srgb, var(--bg-1) 60%, transparent); border-radius: var(--r-xs); }
.lab-rv-kapitel.is-ziel summary { box-shadow: inset 3px 0 0 var(--pink); }
.lab-rv-wb__felder { margin: 0; padding: 0 4px var(--space-md) calc(2.4ch + 16px); }
.lab-rv-wb__zeile { display: grid; grid-template-columns: minmax(110px, 190px) minmax(0, 1fr); gap: 4px var(--space-md); padding: 8px 0; border-top: 1px solid var(--border-subtle); }
.lab-rv-wb__zeile:first-child { border-top: 0; }
.lab-rv-wb__zeile dt { font-size: var(--fs-xs); font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; line-height: 1.6; color: var(--text-400); }
.lab-rv-wb__zeile dd { margin: 0; font-size: var(--fs-sm); line-height: 1.6; color: var(--text-200); }
.lab-rv-wb__zeile--ganz { grid-template-columns: minmax(0, 1fr); }
.lab-rv-wb__gruppe { padding: var(--space-sm) 0 2px; font-size: var(--fs-sm); font-weight: 700; color: var(--text-100); }
.lab-rv-leer {
  display: inline-flex; align-items: center;
  padding: 0 8px; height: 20px;
  border: 1px dashed var(--border-strong); border-radius: var(--r-pill);
  font-size: var(--fs-xs); font-style: italic; color: var(--text-300);
  vertical-align: 1px;
}

.lab-rv-meta { margin: 0; padding-top: var(--space-md); border-top: 1px solid var(--border-subtle); font-size: var(--fs-xs); line-height: 1.6; color: var(--text-400); }

/* ---- Narrower screens: TOC becomes a sticky chip bar above the review ---- */
@media (max-width: 1320px) {
  .lab-rv-layout { grid-template-columns: minmax(0, 1fr); gap: var(--space-md); }
  .lab-rv-toc {
    order: -1;
    top: 0;
    z-index: 5;
    flex-direction: row;
    align-items: center;
    margin: 0 calc(-1 * var(--space-xl));
    padding: 0 var(--space-xl);
    background: var(--bg-1);
    border-bottom: 1px solid var(--border-subtle);
  }
  .lab-rv-toc__titel { display: none; }
  .lab-rv-toc__liste { flex-direction: row; gap: 2px; overflow-x: auto; scrollbar-width: none; }
  .lab-rv-toc__link { white-space: nowrap; border-left: 0; border-bottom: 3px solid transparent; border-radius: var(--r-xs) var(--r-xs) 0 0; }
  .lab-rv-toc__link.is-aktiv { border-bottom-color: var(--pink); }
  .lab-rv-sektion, .lab-rv-empf, .lab-rv-kapitel { scroll-margin-top: 64px; }
}

@media (max-width: 880px) {
  .lab-rv-toc { margin: 0 calc(-1 * var(--space-md)); padding: 0 var(--space-md); }
}

@media (max-width: 720px) {
  .lab-rv-sektion { padding: var(--space-lg) var(--space-md); border-radius: var(--r-md); }
  .lab-rv-sektion__kopf { grid-template-columns: minmax(0, 1fr); }
  .lab-rv-sektion__intro { grid-column: 1; }
  .lab-rv-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lab-rv-blick__duo, .lab-rv-swot, .lab-rv-zeitachse { grid-template-columns: minmax(0, 1fr); }
  .lab-rv-widerspruch__paar { grid-template-columns: minmax(0, 1fr); }
  .lab-rv-gegen { height: 20px; }
  .lab-rv-gegen__icon { transform: rotate(90deg); }
  .lab-rv-wb__felder { padding-left: 4px; }
  .lab-rv-wb__zeile { grid-template-columns: minmax(0, 1fr); }
  .lab-rv-fragen { grid-template-columns: minmax(0, 1fr); }
  .lab-rv-entwurf { grid-template-columns: minmax(0, 1fr); justify-items: start; gap: var(--space-sm); }
  .lab-rv-rechnung__zeile, .lab-rv-angebot { grid-template-columns: minmax(0, 1fr); gap: 4px; }
}

@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}

/* Workbook zum Ausfüllen auf der Fitness-Check-Seite (Filip 12.10.): die
   erste Handlung der Seite, deshalb ganz oben und mit eigenem Symbol. */
.lab-workbook {
  padding: var(--space-lg);
  background: var(--bg-2);
  border: 1px solid var(--border-strong);
  border-radius: var(--r-lg);
  display: flex;
  align-items: flex-start;
  gap: var(--space-md);
}

.lab-workbook__icon { flex: 0 0 auto; width: 32px; height: 32px; color: var(--text-200); }

.lab-workbook__text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-sm);
  min-width: 0;
}

.lab-workbook__text p { margin: 0; max-width: 72ch; }
.lab-workbook__beschreibung { color: var(--text-200); }

.lab-workbook__titel { margin: 0; font-size: var(--fs-lg); font-weight: 700; color: var(--text-100); }




/* ==== Coach view (P6, 0.16.0) ====
   A working view, not a reading page: the list uses the full main width,
   every row is one link (like the module bars), the columns stack into
   cards once the list itself gets narrow (container query — the sidebar
   decides how much room is left, not the window). Lime stays out — the
   view has no single signal. */
/* Set apart in the vertical sidebar only — in the mobile strip it is just the last item. */
@media (min-width: 881px) { .lab-sidebar__coach { margin-top: var(--space-md); } }

.lab-badge--warn { border-color: var(--warn-text); color: var(--warn-text); }

.lab-coach-zahlen { margin: 0; font-size: var(--fs-sm); color: var(--text-300); }

.lab-coach-liste {
  container-type: inline-size;
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
}
.lab-coach-liste__kopf,
.lab-coach-zeile {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1.2fr) minmax(0, 1.4fr) minmax(0, 0.9fr) 18px;
  align-items: center;
  gap: var(--space-md);
  padding: 14px 18px;
}
.lab-coach-liste__kopf {
  padding-block: 0 2px;
  font-size: var(--fs-xs);
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-300);
}
.lab-coach-zeile {
  min-height: 68px;
  background: var(--bg-2);
  border: 1px solid var(--border-subtle);
  border-radius: var(--r-md);
  font-size: var(--fs-sm);
  color: var(--text-200);
  text-decoration: none;
}
.lab-coach-zeile:hover { border-color: var(--border-strong); }
.lab-coach-zeile:hover .lab-modul__pfeil { color: var(--text-200); }
.lab-coach-zeile:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.lab-coach-zeile__wer { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.lab-coach-zeile__name { font-size: var(--fs-md); font-weight: 500; color: var(--text-100); }
.lab-coach-zeile__mail { color: var(--text-300); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lab-coach-zeile__zelle { min-width: 0; }
/* Column label per cell: for screen readers on wide screens (the header row
   is decoration), visible once the rows stack. */
.lab-coach-zeile__label {
  position: absolute;
  width: 1px; height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

@container (max-width: 780px) {
  .lab-coach-liste__kopf { display: none; }
  .lab-coach-zeile { grid-template-columns: 1fr 1fr; gap: var(--space-sm) var(--space-md); }
  .lab-coach-zeile__wer { grid-column: 1 / -1; }
  .lab-coach-zeile .lab-modul__pfeil { display: none; }
  .lab-coach-zeile__label {
    position: static;
    display: block;
    width: auto; height: auto;
    margin-bottom: 2px;
    clip: auto;
    font-size: var(--fs-xs);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--text-300);
  }
}

/* Detail: the member's entries as cards above the review. */
.lab-coach-akte {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-md);
}
@media (max-width: 1100px) { .lab-coach-akte { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { .lab-coach-akte { grid-template-columns: minmax(0, 1fr); } }
.lab-coach-karte {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  min-width: 0;
  padding: 18px 20px;
  background: var(--bg-2);
  border: 1px solid var(--border-subtle);
  border-radius: var(--r-md);
}
.lab-coach-karte__titel {
  margin: 0;
  font-size: var(--fs-xs);
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-300);
}
.lab-coach-karte__text { margin: 0; font-size: var(--fs-md); line-height: 1.5; color: var(--text-100); }
.lab-coach-leer { margin: 0; font-size: var(--fs-sm); line-height: 1.5; color: var(--text-300); }

.lab-coach-dateien { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.lab-coach-datei {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 44px;
  margin-inline: -10px;
  padding: 8px 10px;
  border-radius: var(--r-sm);
  color: var(--text-100);
  text-decoration: none;
}
.lab-coach-datei:hover { background: var(--bg-3); }
.lab-coach-datei:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 0; }
.lab-coach-datei__icon { flex: none; width: 20px; height: 20px; color: var(--text-300); }
.lab-coach-datei__text { display: flex; flex-direction: column; min-width: 0; }
.lab-coach-datei__name { font-size: var(--fs-sm); font-weight: 500; overflow-wrap: anywhere; }
.lab-coach-datei__art { font-size: var(--fs-xs); color: var(--text-300); }

.lab-coach-kompass { margin: 0; display: flex; flex-direction: column; gap: 8px; }
.lab-coach-kompass__zeile { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-sm); align-items: center; }
.lab-coach-kompass dt { font-size: var(--fs-sm); color: var(--text-200); }
.lab-coach-kompass dd { margin: 0; display: flex; align-items: center; gap: 10px; }
.lab-coach-kompass__balken { display: block; width: 88px; height: 8px; border-radius: 4px; overflow: hidden; }
.lab-coach-kompass__spur { fill: var(--bg-4); }
.lab-coach-kompass__wert { fill: var(--text-300); }
.lab-coach-kompass__zahl { min-width: 3.4em; text-align: right; font-size: var(--fs-sm); font-weight: 500; font-variant-numeric: tabular-nums; color: var(--text-100); }
.lab-coach-kompass__zahl small { font-weight: 400; color: var(--text-300); }

.lab-coach-felder {
  grid-column: 1 / -1;
  padding: 0 20px;
  background: var(--bg-2);
  border: 1px solid var(--border-subtle);
  border-radius: var(--r-md);
}
.lab-coach-felder summary { cursor: pointer; padding: 14px 0; font-size: var(--fs-sm); font-weight: 500; color: var(--text-200); }
.lab-coach-felder summary:hover { color: var(--text-100); }
.lab-coach-felder dl { margin: 0 0 18px; display: flex; flex-direction: column; gap: var(--space-md); }
.lab-coach-felder dt { margin-bottom: 4px; font-size: var(--fs-xs); color: var(--text-300); }
.lab-coach-felder dd { margin: 0; max-width: 80ch; white-space: pre-wrap; font-size: var(--fs-sm); line-height: 1.6; color: var(--text-100); }

/* ==== Page parts (0.19.0) ==== */
.lab-abschnitt { display: flex; flex-direction: column; gap: var(--space-sm); }
.lab-abschnitt > .lab-etappe-label { margin: 0; }
.lab-modul-intro { margin: 0; max-width: 72ch; font-size: var(--fs-md); line-height: 1.6; color: var(--text-200); }

/* Links into the Academy: outline-only rows with "Academy ↗" — never the
   filled Lab bar with the chevron, never a pink button next to them. */
.lab-extern-liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.lab-extern {
  display: grid;
  grid-template-columns: 2.6ch minmax(0, 1fr) auto auto;
  align-items: center;
  gap: var(--space-md);
  min-height: 52px;
  padding: 10px 18px;
  border: 1px solid var(--border-soft);
  border-radius: var(--r-md);
  color: var(--text-200);
  font-size: var(--fs-md);
  text-decoration: none;
}
a.lab-extern:hover { border-color: var(--border-strong); background: var(--bg-2); }
a.lab-extern:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.lab-extern--ohne { color: var(--text-300); }
.lab-extern__nr { font-family: var(--mono); font-size: var(--fs-xs); color: var(--text-400); }
.lab-extern-liste--ohne-nr .lab-extern { grid-template-columns: minmax(0, 1fr) auto auto; }
.lab-extern__titel { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; min-width: 0; font-weight: 500; color: var(--text-100); }
.lab-extern--ohne .lab-extern__titel { color: var(--text-300); }
.lab-extern__titel small { font-size: var(--fs-xs); font-weight: 400; color: var(--text-300); }
.lab-extern__meta { font-family: var(--mono); font-size: var(--fs-xs); color: var(--text-300); white-space: nowrap; }
.lab-extern__ziel { display: inline-flex; align-items: center; gap: 4px; font-size: var(--fs-xs); font-weight: 500; letter-spacing: 0.04em; color: var(--text-300); white-space: nowrap; }
a.lab-extern:hover .lab-extern__ziel { color: var(--text-100); }
.lab-extern__icon { width: 14px; height: 14px; }
@media (max-width: 640px) {
  .lab-extern { grid-template-columns: 2.6ch minmax(0, 1fr) auto; row-gap: 2px; }
  .lab-extern__meta { grid-column: 2; grid-row: 2; }
  .lab-extern__ziel { grid-column: 3; grid-row: 1 / span 2; }
}

/* Standort & Zielbild: the three stages as numbered steps on one line. */
.lab-etappen { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.lab-etappe { position: relative; display: grid; grid-template-columns: 36px minmax(0, 1fr); column-gap: var(--space-md); padding-bottom: var(--space-lg); }
.lab-etappe:last-child { padding-bottom: 0; }
.lab-etappe:not(:last-child)::before {
  content: '';
  position: absolute;
  left: 17px;
  top: 42px;
  bottom: 6px;
  width: 2px;
  background: var(--border-soft);
}
.lab-etappe__nr {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border: 1.5px solid var(--border-strong);
  border-radius: 50%;
  background: var(--bg-1);
  font-family: var(--mono);
  font-size: var(--fs-md);
  font-weight: 700;
  color: var(--text-100);
}
.lab-etappe__inhalt { display: flex; flex-direction: column; gap: var(--space-sm); min-width: 0; padding-top: 5px; }
.lab-etappe__titel { margin: 0; font-size: var(--fs-lg); font-weight: 700; color: var(--text-100); }
/* "Außerdem" below the steps lines up with the step contents. */
.lab-abschnitt--zu-etappen { margin-left: calc(36px + var(--space-md)); max-width: calc(var(--lab-inhalt) - 36px - var(--space-md)); }
@media (max-width: 640px) {
  /* On the phone the lists get the full width: number above the title, no rail. */
  .lab-abschnitt--zu-etappen { margin-left: 0; }
  .lab-etappe { grid-template-columns: minmax(0, 1fr); }
  .lab-etappe:not(:last-child)::before { display: none; }
  .lab-etappe__nr { width: 28px; height: 28px; font-size: var(--fs-sm); }
  .lab-etappe__inhalt { padding-top: var(--space-xs); }
}
.lab-etappe__frage { margin: -6px 0 2px; font-size: var(--fs-sm); color: var(--text-300); }

/* Table of contents of a course without per-lesson addresses: plain text,
   folded away — nothing here looks clickable. */
.lab-inhalt summary { cursor: pointer; padding: 4px 0; font-size: var(--fs-sm); color: var(--text-300); }
.lab-inhalt summary:hover { color: var(--text-100); }
.lab-inhalt__liste { margin: var(--space-xs) 0 0; padding-left: 1.6rem; columns: 2 22rem; column-gap: var(--space-xl); font-size: var(--fs-sm); line-height: 1.6; color: var(--text-200); }
.lab-inhalt__liste li { break-inside: avoid; }
.lab-inhalt__liste small { font-family: var(--mono); font-size: var(--fs-xs); color: var(--text-400); }

/* Chapter page: the way first; calls and recordings as an optional extra,
   folded away (0.19.1, Filip 20.10.). */
.lab-etappe-label__zusatz { margin-left: 10px; font-weight: 400; letter-spacing: 0.04em; text-transform: none; color: var(--text-300); }
.lab-vertiefen { margin-top: var(--space-sm); border-top: 1px solid var(--border-subtle); padding-top: var(--space-sm); }
.lab-vertiefen__kopf {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  min-height: 44px;
  cursor: pointer;
  list-style: none;
  color: var(--text-200);
}
.lab-vertiefen__kopf::-webkit-details-marker { display: none; }
.lab-vertiefen__kopf:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; border-radius: var(--r-xs); }
.lab-vertiefen__titel { font-size: var(--fs-md); font-weight: 500; color: var(--text-100); }
.lab-vertiefen__zahl { font-size: var(--fs-sm); color: var(--text-300); }
.lab-vertiefen__pfeil { width: 16px; height: 16px; color: var(--text-300); transform: rotate(90deg); transition: transform var(--t) var(--ease); }
.lab-vertiefen[open] .lab-vertiefen__pfeil { transform: rotate(-90deg); }
.lab-vertiefen__kopf:hover .lab-vertiefen__titel { text-decoration: underline; text-decoration-color: var(--border-strong); text-underline-offset: 3px; }
.lab-vertiefen__inhalt { display: flex; flex-direction: column; gap: var(--space-sm); padding-top: var(--space-xs); }
.lab-vertiefen__text { margin: 0; max-width: 72ch; font-size: var(--fs-sm); color: var(--text-300); }
@media (prefers-reduced-motion: reduce) { .lab-vertiefen__pfeil, .lab-rv-kapitel__pfeil { transition: none; } }

/* One disclosure form app-wide (24 §10): every folded block opens with the
   same chevron at the start of its head — down when closed, up when open —
   and the whole head is a 44 px target. Native details/summary stays. */
.lab-import summary,
.lab-check-ohne summary,
.lab-rv-kompass summary,
.lab-rv-tabelle summary,
.lab-coach-felder summary,
.lab-inhalt summary {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  list-style: none;
}
.lab-import summary::-webkit-details-marker,
.lab-check-ohne summary::-webkit-details-marker,
.lab-rv-kompass summary::-webkit-details-marker,
.lab-rv-tabelle summary::-webkit-details-marker,
.lab-coach-felder summary::-webkit-details-marker,
.lab-inhalt summary::-webkit-details-marker { display: none; }
.lab-import summary::before,
.lab-check-ohne summary::before,
.lab-rv-kompass summary::before,
.lab-rv-tabelle summary::before,
.lab-coach-felder summary::before,
.lab-inhalt summary::before {
  content: '';
  flex: none;
  width: 7px;
  height: 7px;
  margin: 0 3px 3px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  transition: transform var(--t) var(--ease);
}
.lab-import[open] > summary::before,
.lab-check-ohne[open] > summary::before,
.lab-rv-kompass details[open] > summary::before,
.lab-rv-tabelle[open] > summary::before,
.lab-coach-felder[open] > summary::before,
.lab-inhalt[open] > summary::before { transform: translateY(3px) rotate(-135deg); }
@media (prefers-reduced-motion: reduce) {
  .lab-import summary::before, .lab-check-ohne summary::before, .lab-rv-kompass summary::before,
  .lab-rv-tabelle summary::before, .lab-coach-felder summary::before, .lab-inhalt summary::before { transition: none; }
}
.lab-vertiefen__titel { white-space: nowrap; }
@media (max-width: 640px) {
  /* Arrow and title on one line, the count below them — no three-way wrap. */
  .lab-vertiefen__kopf { flex-wrap: wrap; row-gap: 0; }
  .lab-vertiefen__zahl { flex-basis: 100%; padding-left: calc(16px + var(--space-sm)); }
}

/* ==== Coach view: Money-Mindset-Challenge (admin, 27.10.) ====
   Internal admin for Birgit and Torsten — the normal lab look, not the
   challenge's gold. Key figures, codes, archetype distribution, then the
   participant table: it scrolls inside its own frame — sideways on small
   screens, downwards under a sticky head once it is taller than the
   screen (1000 rows) — never the page. */
.lab-ch-eingang .lab-modul__name small { color: var(--text-300); }

/* Notice after a change: one sentence, words carry the meaning, the edge
   marks success or failure (in light mode both edges stay quiet). */
.lab-ch-meldung {
  margin: 0;
  max-width: 75ch;
  padding: 12px 16px;
  background: var(--bg-2);
  border: 1px solid var(--border-subtle);
  border-left: 3px solid var(--ok-text);
  border-radius: var(--r-md);
  font-size: var(--fs-sm);
  line-height: 1.5;
  color: var(--text-100);
}
.lab-ch-meldung--fehler { border-left-color: var(--alert-text); }

.lab-ch-zahlen {
  margin: 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-sm);
}
.lab-ch-zahl {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: var(--space-md);
  background: var(--bg-2);
  border: 1px solid var(--border-subtle);
  border-radius: var(--r-md);
}
.lab-ch-zahl dd { margin: 0; }
.lab-ch-zahl__label {
  font-size: var(--fs-xs);
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-300);
}
.lab-ch-zahl__wert {
  font-size: var(--fs-xl);
  font-weight: 800;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
  color: var(--text-100);
}
.lab-ch-zahl__dazu { font-size: var(--fs-sm); color: var(--text-300); }

.lab-ch-raster {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-md);
  align-items: start;
}

/* Codes: label, current state, field + save, what the code does. */
.lab-ch-code { display: flex; flex-direction: column; gap: 6px; }
.lab-ch-code + .lab-ch-code { padding-top: var(--space-md); border-top: 1px solid var(--border-subtle); }
.lab-ch-code__label { font-size: var(--fs-md); font-weight: 500; color: var(--text-100); }
.lab-ch-code__stand { margin: 0; font-size: var(--fs-sm); color: var(--text-300); }
.lab-ch-code__stand strong { font-family: var(--mono); font-weight: 500; letter-spacing: 0.06em; color: var(--text-100); }
.lab-ch-code__zeile { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-xs); }
.lab-ch-code__input {
  flex: 0 1 14rem;
  min-height: 44px;
  font-family: var(--mono);
  font-size: var(--fs-md);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.lab-ch-code__wirkung { margin: 0; max-width: 60ch; font-size: var(--fs-sm); line-height: 1.5; color: var(--text-300); }

/* Distribution of the strongest archetype: name, bar, count. */
.lab-ch-verteilung { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.lab-ch-verteilung__zeile {
  display: grid;
  grid-template-columns: 8.5rem minmax(0, 1fr) 5ch;
  align-items: center;
  gap: var(--space-sm);
  font-size: var(--fs-sm);
}
.lab-ch-verteilung__name { color: var(--text-200); }
.lab-ch-verteilung__balken { display: block; width: 100%; height: 8px; border-radius: 4px; overflow: hidden; }
.lab-ch-verteilung__spur { fill: var(--bg-4); }
.lab-ch-verteilung__wert { fill: var(--text-300); }
.lab-ch-verteilung__zahl { text-align: right; font-weight: 500; font-variant-numeric: tabular-nums; color: var(--text-100); }

.lab-ch-hinweis { margin: 0; max-width: 75ch; font-size: var(--fs-xs); line-height: 1.5; color: var(--text-300); }

/* Close/KlickTipp card: one status line per system, then the catch-up button. */
.lab-ch-abgleich { margin: 0; padding-left: 1.2em; font-size: var(--fs-sm); color: var(--text-200); }
.lab-ch-abgleich li + li { margin-top: 2px; }

/* Participants: head, tools (filter + export), table. */
.lab-ch-teilnehmende { display: flex; flex-direction: column; gap: var(--space-sm); }
.lab-ch-teilnehmende__kopf { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px var(--space-md); }
.lab-ch-titel { margin: 0; font-size: var(--fs-lg); font-weight: 700; color: var(--text-100); }
.lab-ch-werkzeuge {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-sm) var(--space-md);
}
.lab-ch-filter { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-xs); }
.lab-ch-filter__label { margin-right: 4px; font-size: var(--fs-sm); color: var(--text-300); }
/* A width, not a flex-basis: the form sizes itself from its content, and a
   basis wider than the select's own width would push the button to a new line. */
.lab-ch-filter__select { flex: 0 1 auto; width: 15rem; max-width: 100%; min-height: 44px; }

.lab-ch-tabelle {
  /* Containing block for the screen-reader texts in the cells — without it
     they sit against the page and widen it on small screens. */
  position: relative;
  max-height: 75vh;
  overflow: auto;
  background: var(--bg-2);
  border: 1px solid var(--border-subtle);
  border-radius: var(--r-md);
}
.lab-ch-tabelle table {
  width: 100%;
  min-width: 1100px;
  border-collapse: collapse;
  font-size: var(--fs-sm);
}
.lab-ch-tabelle th,
.lab-ch-tabelle td {
  padding: 8px 14px;
  text-align: left;
  vertical-align: middle;
  border-top: 1px solid var(--border-subtle);
  color: var(--text-200);
}
.lab-ch-tabelle td { height: 60px; }
.lab-ch-tabelle thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  padding-block: 12px;
  border-top: 0;
  box-shadow: inset 0 -1px 0 var(--border-subtle);
  background: var(--bg-2);
  font-size: var(--fs-xs);
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
  color: var(--text-300);
}
.lab-ch-tabelle tbody tr:first-child td { border-top: 0; }
.lab-ch-tabelle tbody tr:hover td { background: var(--bg-3); }
/* The row just unlocked (#t-<id> after the redirect) stays marked. */
.lab-ch-tabelle tbody tr { scroll-margin-top: 48px; }
.lab-ch-tabelle tbody tr:target td { background: var(--bg-3); }
.lab-ch-tabelle tbody tr:target td:first-child { box-shadow: inset 3px 0 0 var(--ok-text); }
.lab-ch-zeit { white-space: nowrap; font-variant-numeric: tabular-nums; }
.lab-ch-tabelle .lab-ch-mail { min-width: 14rem; overflow-wrap: anywhere; color: var(--text-100); }
.lab-ch-leer { color: var(--text-300); }
/* Badge and button side by side — every row keeps the same height. */
.lab-ch-stand { display: flex; align-items: center; gap: var(--space-sm); white-space: nowrap; }
.lab-ch-stand .lab-btn-ghost { padding: 0 14px; font-size: var(--fs-sm); }
.lab-ch-seite {
  white-space: nowrap;
  color: var(--text-200);
  text-decoration: underline;
  text-decoration-color: var(--border-strong);
  text-underline-offset: 3px;
}
.lab-ch-seite:hover { color: var(--text-100); text-decoration-color: currentColor; }

@media (max-width: 1100px) { .lab-ch-raster { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 1100px) { .lab-ch-zahlen { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { .lab-ch-zahlen { grid-template-columns: minmax(0, 1fr); } }
