/* ═══════════════════════════════════════════════════════════════
   KLEMMBRETT · assets/css/klemmbrett.css — DAS Stylesheet
   Alle Farben und Maße kommen aus /assets/theme.php (kb_config).
   Hier steht KEINE feste Farbe — nur var(--…).
   Kein PHP-Modul enthält eigenes CSS.
   Mobile-first, Touch-Ziele mindestens var(--touch).
   ═══════════════════════════════════════════════════════════════ */

*, *::before, *::after { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font: var(--schrift)/1.5 -apple-system, 'Segoe UI', Roboto, sans-serif;
  -webkit-tap-highlight-color: transparent;
}
a { color: var(--akzent); }
code { font-family: ui-monospace, monospace; font-size: .88em; }

/* ── Kopfleiste & Navigation ───────────────────────────────── */
.kb-top {
  position: sticky; top: 0; z-index: 50;
  display: flex; align-items: center; gap: 12px;
  padding: 10px 14px;
  background: var(--bg); border-bottom: 1px solid var(--border);
}
.kb-logo { font-weight: 900; font-size: 17px; text-decoration: none; color: var(--text); }
.kb-logo b { color: var(--akzent); }
.kb-user { margin-left: auto; font-size: 12px; color: var(--muted); white-space: nowrap; }
.kb-user a {
  color: var(--muted); text-decoration: none; border: 1px solid var(--border);
  border-radius: 8px; padding: 7px 11px;
  min-height: calc(var(--touch) - 6px); display: inline-flex; align-items: center;
}
/* Menüschalter — nur auf schmalen Geräten sichtbar */
.kb-burger {
  display: none; align-items: center; gap: 4px;
  min-width: var(--touch); min-height: var(--touch);
  padding: 8px 10px; background: transparent; cursor: pointer;
  border: 1px solid var(--border); border-radius: 10px; color: var(--text);
  flex-direction: column; justify-content: center;
}
.kb-burger span { display: block; width: 18px; height: 2px; background: var(--text); border-radius: 2px; }
.kb-burger em { font-style: normal; font-size: 9px; letter-spacing: .04em; color: var(--muted); margin-top: 2px; }
.kb-burger[aria-expanded="true"] { border-color: var(--akzent); }
.kb-burger[aria-expanded="true"] span { background: var(--akzent); }

/* Hauptnavigation — ruhige Reihe auf Desktop */
.kb-nav {
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
  padding: 8px 12px; border-bottom: 1px solid var(--border); background: var(--bg);
}
.kb-nav-link {
  white-space: nowrap; padding: 9px 15px; border-radius: 10px;
  font-size: 13.5px; font-weight: 700; text-decoration: none; color: var(--text);
  border: 1px solid transparent; cursor: pointer;
  min-height: calc(var(--touch) - 4px); display: inline-flex; align-items: center; gap: 7px;
}
.kb-nav-link i { font-style: normal; font-size: 15px; line-height: 1; }
.kb-nav-link:hover { border-color: var(--border); }
.kb-nav-link.on {
  border-color: var(--akzent); color: var(--akzent);
  background: rgba(var(--akzent-rgb), .12); box-shadow: inset 0 -2px 0 var(--akzent);
}
.kb-nav-admin { margin-left: auto; color: var(--muted); }

/* Aufklappmenü „Mehr" */
.kb-nav-mehr { position: relative; }
.kb-nav-mehr > summary { list-style: none; }
.kb-nav-mehr > summary::-webkit-details-marker { display: none; }
.kb-nav-mehr.on > summary { border-color: var(--akzent); color: var(--akzent); }
.kb-nav-klapp {
  position: absolute; z-index: 60; top: calc(100% + 6px); left: 0; min-width: 260px;
  display: flex; flex-direction: column; gap: 2px; padding: 8px;
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--r-gross); box-shadow: 0 14px 34px rgba(0,0,0,.45);
}
.kb-nav-klapp a {
  display: flex; flex-direction: column; gap: 1px; padding: 10px 12px;
  min-height: var(--touch); justify-content: center;
  border-radius: var(--r); text-decoration: none; color: var(--text);
}
.kb-nav-klapp a:hover { background: rgba(var(--akzent-rgb), .09); }
.kb-nav-klapp a.on { background: rgba(var(--akzent-rgb), .14); color: var(--akzent); }
.kb-nav-klapp small { color: var(--muted); font-size: 11.5px; }

/* Ausklapp-Panel für Tablet und Smartphone */
.kb-nav-panel {
  display: none; flex-direction: column; gap: 3px; padding: 10px 12px 14px;
  border-bottom: 1px solid var(--border); background: var(--bg-card);
}
.kb-nav-panel[hidden] { display: none; }
.kb-nav-panel.offen { display: flex; }
.kb-nav-panel-gruppe {
  font-size: 10.5px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase;
  color: var(--muted); margin: 10px 0 2px;
}
.kb-nav-panel a {
  display: flex; align-items: center; gap: 12px; padding: 11px 12px;
  min-height: var(--touch); border-radius: var(--r);
  text-decoration: none; color: var(--text); border: 1px solid var(--border);
}
.kb-nav-panel a.on { border-color: var(--akzent); color: var(--akzent); background: rgba(var(--akzent-rgb), .11); }
.kb-nav-panel a b { display: block; font-size: 14.5px; }
.kb-nav-panel a small { display: block; color: var(--muted); font-size: 11.5px; }
.kb-nav-panel-icon { font-size: 18px; width: 24px; text-align: center; flex: none; }

/* ── Grundgerüst ───────────────────────────────────────────── */
.kb-main { max-width: var(--max-breite); margin: 0 auto; padding: 16px 14px 70px; }
.kb-card {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--r-gross); padding: 18px; margin-bottom: 14px;
}
.kb-title {
  font-size: 12px; font-weight: 800; text-transform: uppercase;
  letter-spacing: .06em; color: var(--akzent); margin-bottom: 12px;
}
.kb-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 10px; }
.kb-zeile { display: flex; gap: 10px; flex-wrap: wrap; align-items: flex-end; }

/* ── Bedienelemente ────────────────────────────────────────── */
.kb-btn {
  padding: 12px 16px; border-radius: var(--r); border: 1px solid var(--border);
  background: transparent; color: var(--text);
  font-size: 14px; font-weight: 800; cursor: pointer;
  min-height: var(--touch); display: inline-flex; align-items: center; gap: 6px;
  text-decoration: none;
}
.kb-btn.p { background: var(--akzent); border-color: var(--akzent); color: var(--bg); }
.kb-btn.on { border-color: var(--akzent); color: var(--akzent); }
.kb-btn.klein { min-height: 36px; padding: 6px 12px; font-size: 12px; }
.kb-btn.gefahr { color: var(--fehler); }
.kb-btn[disabled] { opacity: .5; cursor: default; }

.kb-field label { display: block; font-size: 12px; font-weight: 700; color: var(--muted); margin-bottom: 4px; }
.kb-field input, .kb-field select, .kb-field textarea {
  width: 100%; padding: 11px 12px; border-radius: 9px;
  border: 1px solid var(--border); background: var(--bg); color: var(--text);
  font-size: 15px; min-height: var(--touch); font-family: inherit;
}
.kb-field textarea { min-height: 76px; }
.kb-field .hinweis { font-size: 11px; color: var(--muted); margin-top: 3px; }
input[type="color"] { padding: 4px; height: var(--touch); }

/* ── Kennzahlen, Chips, Balken ─────────────────────────────── */
.kb-kpi { border: 1px solid var(--border); border-radius: var(--r); padding: 12px 14px; }
.kb-kpi b { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); margin-bottom: 4px; }
.kb-kpi span { font-size: 20px; font-weight: 800; }
.kb-kpi small { display: block; font-size: 11px; color: var(--muted); margin-top: 2px; }
.kb-chip { font-size: 11.5px; font-weight: 800; padding: 4px 10px; border-radius: 10px; display: inline-block; }
.kb-bar { height: 10px; border-radius: 6px; background: rgba(var(--akzent-rgb), .12); overflow: hidden; }
.kb-bar > div { height: 100%; background: linear-gradient(90deg, var(--akzent-d), var(--akzent)); }

/* ── Meldungen ─────────────────────────────────────────────── */
.kb-flash { padding: 12px 15px; border-radius: var(--r); margin-bottom: 12px; font-size: 14px; }
.kb-flash.success { background: rgba(var(--akzent-rgb), .1); border: 1px solid var(--akzent); color: var(--akzent); }
.kb-flash.error   { background: rgba(248,113,113,.1); border: 1px solid var(--fehler); color: var(--fehler); }
.kb-flash.info    { background: rgba(56,189,248,.1); border: 1px solid var(--info); color: var(--info); }
.kb-note { padding: 12px 14px; border-radius: var(--r); font-size: 13px; }
.kb-note.warn { background: rgba(245,158,11,.1); border: 1px solid var(--warn); color: var(--warn); }
.kb-note.ok   { background: rgba(var(--akzent-rgb), .07); border: 1px solid var(--border); }

/* ── Tabellen ──────────────────────────────────────────────── */
table.kb-t { width: 100%; border-collapse: collapse; font-size: 14px; }
table.kb-t th {
  font-size: 11px; text-transform: uppercase; color: var(--muted);
  text-align: left; padding: 6px 8px; border-bottom: 1px solid var(--border);
}
table.kb-t td { padding: 9px 8px; border-bottom: 1px solid var(--border); vertical-align: top; }
table.kb-t td.r, table.kb-t th.r { text-align: right; }
.kb-tabellenwrap { overflow-x: auto; }

/* ── Zustandsfarben (Hilfsklassen statt Inline-Styles) ─────── */
.kb-ok    { color: var(--akzent); }
.kb-warn  { color: var(--warn); }
.kb-error { color: var(--fehler); }
.kb-muted { color: var(--muted); }
.kb-mono  { font-family: ui-monospace, monospace; font-size: 11.5px; word-break: break-word; }
.kb-detail { margin-top: 4px; max-height: 110px; overflow: auto; }

/* ── Upload ────────────────────────────────────────────────── */
.kb-upload { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.kb-upload input[type=file] { flex: 1; min-width: 180px; }

/* ── Login ─────────────────────────────────────────────────── */
.kb-login-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; }
.kb-login {
  width: min(92vw, 380px); background: var(--bg-card);
  border: 1px solid var(--border); border-radius: var(--r-gross); padding: 28px;
}
.kb-login .logo { font-size: 24px; font-weight: 900; text-align: center; margin-bottom: 4px; }
.kb-login .logo b { color: var(--akzent); }
.kb-login .sub { text-align: center; font-size: 12px; color: var(--muted); margin-bottom: 22px; }
.kb-login label { margin-top: 12px; }
.kb-login button { width: 100%; margin-top: 18px; justify-content: center; }

/* ── Checkbox-Zeile & Projektwahl (Phase 2) ────────────────── */
.kb-check {
  display: flex; align-items: center; gap: 10px;
  font-size: 14px; font-weight: 600; min-height: var(--touch);
}
.kb-check input[type=checkbox] {
  width: 22px; height: 22px; min-height: 0; flex: none; accent-color: var(--akzent);
}
.kb-projektwahl { align-items: flex-end; font-size: 14px; }
.kb-projektwahl .kb-field { min-width: 200px; }

/* ── Druck ─────────────────────────────────────────────────── */
@media print {
  .kb-top, .kb-nav, .kb-nav-panel, .kb-burger, .kb-stepper, .kb-step-lage, .kb-btn, .kb-upload, form { display: none !important; }
  body { background: #fff; color: #000; }
  .kb-card { border-color: #999; break-inside: avoid; }
}

/* ── Dashboard ─────────────────────────────────────────────── */
.kb-projekt-name { font-size: 19px; font-weight: 900; }
.kb-projekt-meta { font-size: 12.5px; color: var(--muted); }
.kb-chip-zahl { font-size: 12px; margin-right: 6px; }
.kb-listenzeile { padding: 5px 0; border-bottom: 1px solid var(--border); }
.kb-listenzeile:last-child { border-bottom: none; }
.kb-leer { text-align: center; padding: 36px; }
.kb-leer-icon { font-size: 34px; }
.kb-leer-text { font-weight: 800; margin: 8px 0 4px; }
.kb-rechner { align-items: end; }

/* ── Steuerzentrale ────────────────────────────────────────── */
.kb-tabs { display: flex; gap: 6px; flex-wrap: wrap; }
.kb-tab {
  padding: 9px 15px; border-radius: 20px; font-size: 13.5px; font-weight: 700;
  text-decoration: none; min-height: var(--touch); display: inline-flex; align-items: center;
  border: 1px solid var(--border); color: var(--text);
}
.kb-tab.on { border-color: var(--akzent); color: var(--akzent); background: rgba(var(--akzent-rgb), .09); }
.kb-hinweiskarte { border-color: rgba(var(--akzent-rgb), .3); }
.kb-log-zeit { white-space: nowrap; font-size: 12px; color: var(--muted); }
.kb-log-meta { margin-top: 3px; font-size: 11px; color: var(--muted); }
.kb-farbfeld { display: flex; gap: 8px; align-items: center; }
.kb-farbfeld input[type=color] { width: 56px; flex: none; }
.kb-farbfeld input[type=text] { flex: 1; }
.kb-kpi-klein { font-size: 15px; }

/* ── Abstands-Hilfsklassen (statt Inline-Styles) ───────────── */
.mt-s { margin-top: 8px; }  .mt-m { margin-top: 12px; }  .mt-l { margin-top: 14px; }
.mb-s { margin-bottom: 8px; } .mb-m { margin-bottom: 12px; } .mb-l { margin-bottom: 14px; }
.txt-s { font-size: 11.5px; } .txt-m { font-size: 12.5px; } .txt-l { font-size: 13px; }
.wachsen { flex: 1; min-width: 180px; }
.eng { width: 130px; }
.fett { font-weight: 800; }
.kb-chip-akzent { background: rgba(var(--akzent-rgb), .15); color: var(--akzent); }

/* ── V2 Wizard / mobile Kontrollansicht ───────────────────── */
.kb-wizard-head,.kb-vc-row { display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap; }
.kb-vc-row { padding:12px 0;border-bottom:1px solid var(--border); }
.kb-vc-row:last-child { border-bottom:0; }
/* ── Fortschrittsanzeiger ──────────────────────────────────── */
.kb-stepper {
  display: flex; gap: 6px; list-style: none; margin: 0 0 6px; padding: 2px 0 6px;
  overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch;
}
.kb-stepper::-webkit-scrollbar { display: none; }
.kb-step { flex: 0 0 auto; }
.kb-step a, .kb-step .kb-step-tot {
  min-height: var(--touch); display: flex; align-items: center; gap: 7px;
  padding: 8px 13px; border: 1px solid var(--border); border-radius: 999px;
  color: var(--muted); text-decoration: none; font-size: 12.5px; font-weight: 700;
}
.kb-step-nr {
  width: 22px; height: 22px; flex: none; border-radius: 50%;
  display: grid; place-items: center; border: 1px solid var(--border);
  font-size: 11px; font-weight: 800;
}
.kb-step-text { white-space: nowrap; }
.kb-step.is-erledigt a { color: var(--akzent); border-color: rgba(var(--akzent-rgb), .45); }
.kb-step.is-erledigt .kb-step-nr { background: var(--akzent); color: var(--bg); border-color: var(--akzent); }
.kb-step.is-begonnen a { color: var(--text); }
.kb-step.is-begonnen .kb-step-nr { border-color: var(--warn); color: var(--warn); }
.kb-step.is-aktuell a, .kb-step.is-aktuell .kb-step-tot {
  color: var(--akzent); border-color: var(--akzent);
  background: rgba(var(--akzent-rgb), .12); box-shadow: 0 0 0 1px var(--akzent) inset;
}
.kb-step.is-aktuell .kb-step-nr { border-color: var(--akzent); color: var(--akzent); }
.kb-step-lage { margin: 0 0 14px; font-size: 12px; color: var(--muted); }

/* ── Antwortflächen der Prüffragen ─────────────────────────── */
.kb-frage-kopf { padding: 13px 14px 4px; display: flex; flex-direction: column; gap: 2px; }
.kb-frage-kopf b { font-size: 15px; line-height: 1.35; }
.kb-frage-kopf small { font-size: 11.5px; }
.kb-antwort {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 7px; padding: 6px 14px 13px;
}
.kb-antwort-flaeche {
  position: relative; display: flex; align-items: center; gap: 9px;
  min-height: max(var(--touch), 48px); padding: 9px 12px;
  border: 1.5px solid var(--border); border-radius: var(--r);
  cursor: pointer; background: var(--bg); color: var(--text);
  font-size: 13.5px; font-weight: 650; line-height: 1.25;
}
.kb-antwort-flaeche input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.kb-antwort-symbol {
  width: 26px; height: 26px; flex: none; border-radius: 7px;
  display: grid; place-items: center; font-size: 14px; font-weight: 900;
  border: 1.5px solid currentColor;
}
.kb-antwort-flaeche.ist-ok      { color: #4ade80; }
.kb-antwort-flaeche.ist-warn    { color: #eab308; }
.kb-antwort-flaeche.ist-mangel  { color: #f97316; }
.kb-antwort-flaeche.ist-gefahr  { color: #f87171; }
.kb-antwort-flaeche.ist-neutral { color: var(--muted); }
.kb-antwort-flaeche.on {
  border-color: currentColor; background: rgba(255,255,255,.05);
  box-shadow: 0 0 0 2px currentColor inset;
}
.kb-antwort-flaeche.on .kb-antwort-symbol { background: currentColor; color: var(--bg); }
.kb-antwort-flaeche input:focus-visible + .kb-antwort-symbol { outline: 2px solid var(--akzent); outline-offset: 2px; }
.kb-antwort-text { color: var(--text); }
.kb-antwort-flaeche.on .kb-antwort-text { color: currentColor; }
.kb-antwort-offen { margin: 0 14px 12px; font-size: 12px; color: var(--warn); }

/* ── Messungen ─────────────────────────────────────────────── */
.kb-messblock { margin-top: 14px; padding: 12px; border: 1px dashed var(--border); border-radius: var(--r); }
.kb-messkopf { display: flex; flex-direction: column; gap: 2px; margin-bottom: 9px; }
.kb-pflicht {
  display: inline-block; padding: 1px 7px; border-radius: 999px; font-size: 11px;
  background: rgba(245,158,11,.16); color: var(--warn); font-weight: 800;
}
.kb-messliste { display: flex; flex-direction: column; gap: 10px; margin-bottom: 10px; }
.kb-messzeile { border: 1px solid var(--border); border-radius: var(--r); padding: 11px; margin: 0; }
.kb-messgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(165px, 1fr)); gap: 9px; }
.kb-messgrid .eng { max-width: 120px; }
.kb-messfuss { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 9px; flex-wrap: wrap; }

/* ── Lagebild im Beurteilungsschritt ───────────────────────── */
.kb-lage { border: 1px solid var(--border); border-left-width: 4px; border-radius: var(--r); padding: 13px 15px; }
.kb-lage.ist-prio1 { border-left-color: #f87171; }
.kb-lage.ist-prio2 { border-left-color: #f97316; }
.kb-lage.ist-prio3 { border-left-color: var(--info); }
.kb-lage.ist-prio4 { border-left-color: #eab308; }
.kb-lage.ist-prio5 { border-left-color: var(--akzent); }
.kb-lage-stufe { font-size: 16px; font-weight: 850; margin-bottom: 3px; }
.kb-lage-grund { font-size: 13px; color: var(--muted); }
.kb-lage-zahlen { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 10px; }
.kb-lage-zahl { font-size: 12px; font-weight: 700; padding: 4px 9px; border-radius: 999px; border: 1px solid var(--border); }
.kb-lage-zahl.ist-ok { color: #4ade80; } .kb-lage-zahl.ist-warn { color: #eab308; }
.kb-lage-zahl.ist-mangel { color: #f97316; } .kb-lage-zahl.ist-gefahr { color: #f87171; }
.kb-lage-zahl.ist-neutral { color: var(--muted); }

.kb-empf-liste { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-direction: column; gap: 7px; }
.kb-empf {
  border: 1px solid var(--border); border-left: 4px solid var(--border);
  border-radius: var(--r); padding: 10px 13px; display: flex; flex-direction: column; gap: 2px;
}
.kb-empf.ist-prio1 { border-left-color: #f87171; } .kb-empf.ist-prio2 { border-left-color: #f97316; }
.kb-empf.ist-prio3 { border-left-color: var(--info); } .kb-empf.ist-prio4 { border-left-color: #eab308; }
.kb-empf.ist-prio5 { border-left-color: var(--akzent); }
.kb-empf small { font-size: 11.5px; color: var(--muted); }
.kb-bestaetigen { border-color: var(--akzent); }

/* ── Offene Aufgaben vor dem Abschluss ─────────────────────── */
.kb-aufgaben { border-color: var(--warn); }
.kb-aufgaben-liste { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.kb-aufgaben-liste li {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  padding: 11px 13px; border: 1px solid var(--border); border-radius: var(--r);
  background: rgba(245,158,11,.06);
}
.kb-aufgaben-liste small { display: block; font-size: 11.5px; margin-top: 2px; }
.kb-umbruch { word-break: break-word; overflow-wrap: break-word; }
.kb-chip.ist-ok { color: #4ade80; } .kb-chip.ist-warn { color: #eab308; }
.kb-chip.ist-mangel { color: #f97316; } .kb-chip.ist-gefahr { color: #f87171; }
.kb-chip.ist-neutral { color: var(--muted); }
.kb-wizard-actions { position:sticky;bottom:0;z-index:30;display:flex;gap:8px;align-items:center;justify-content:flex-end;flex-wrap:wrap;padding:10px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r-gross); }
.kb-autosave-status { margin-right:auto;color:var(--muted);font-size:12px; }
.kb-position-title { font-size:17px;font-weight:850;margin-bottom:10px; }
.kb-position-title { display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap; }
.kb-section-title { margin:24px 2px 10px;padding:9px 12px;border-left:4px solid var(--akzent);background:rgba(var(--akzent-rgb),.08);border-radius:0 var(--r) var(--r) 0;font-size:17px; }
.kb-measurement { border:1px solid var(--border);border-radius:var(--r);padding:0 12px 12px;background:rgba(var(--akzent-rgb),.035); }
.kb-measurement summary { min-height:var(--touch);display:flex;align-items:center;color:var(--akzent);font-weight:800;cursor:pointer;touch-action:manipulation; }
.kb-measurement[open] summary { border-bottom:1px solid var(--border); }
.kb-scope,.kb-choice-grid,.kb-sign-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;margin-top:12px; }
.kb-check-card { min-height:var(--touch);display:flex;gap:10px;align-items:flex-start;border:1px solid var(--border);border-radius:var(--r);padding:12px; }
.kb-check-card input { width:24px;height:24px;flex:none;accent-color:var(--akzent); }
.kb-signature { border:1px solid var(--border);border-radius:var(--r);padding:12px; }
.kb-signature canvas { display:block;width:100%;height:180px;background:#fff;border:1px solid var(--border);border-radius:8px;margin:8px 0;touch-action:none; }
.kb-review-html { background:#fff;color:#17211d;border-radius:var(--r-gross);padding:16px;margin-bottom:14px;overflow:auto; }
.kb-review-html a { color:#167b50; }.kb-review-html .page-break { border-top:2px dashed #9aa9a0;margin:24px 0; }.kb-review-html .footer{display:none;}
.kb-final { text-align:center; }.kb-final .kb-btn { justify-content:center; }
.kb-photo-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px; }
.kb-photo-card { border:1px solid var(--border);border-radius:var(--r);padding:10px; }
.kb-photo-card img { width:100%;height:220px;object-fit:contain;background:var(--bg);border-radius:8px;margin-bottom:8px; }
.kb-photo-preview { display:block;max-width:100%;max-height:340px;object-fit:contain;margin-top:10px;border:1px solid var(--border);border-radius:8px; }
.kb-scope-cards { display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin:18px 0; }
.kb-scope-card { position:relative;min-height:150px;display:flex;gap:14px;align-items:flex-start;padding:20px;border:2px solid var(--border);border-radius:18px;background:var(--bg-card);cursor:pointer;transition:.16s ease; }
.kb-scope-card:hover { transform:translateY(-1px);border-color:var(--muted); }
.kb-scope-card.on { border-color:var(--akzent);box-shadow:0 0 0 3px rgba(var(--akzent-rgb),.12);background:rgba(var(--akzent-rgb),.06); }
.kb-scope-card.aus { opacity:.55;cursor:not-allowed; }
.kb-scope-card input { position:absolute;right:14px;top:14px;width:26px;height:26px;accent-color:var(--akzent); }
.kb-scope-icon { width:48px;height:48px;display:grid;place-items:center;border-radius:14px;background:rgba(var(--akzent-rgb),.12);font-size:25px;flex:none; }
.kb-scope-card b { display:block;padding-right:28px;font-size:19px; }.kb-scope-card small,.kb-scope-card em { display:block;margin-top:7px;color:var(--muted);font-size:12px;line-height:1.45; }.kb-scope-card em { color:var(--warn);font-style:normal;font-weight:750; }
.kb-stamm-preview { padding:12px 14px;border-radius:var(--r);background:rgba(var(--akzent-rgb),.06);border:1px solid var(--border); }
.kb-module-intro { display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap; }
.kb-all-clear { min-height:52px;border-color:var(--ok);color:var(--ok);font-weight:850; }
.kb-quick-list { display:grid;gap:9px;margin-bottom:14px; }
.kb-quick-card { border:1px solid var(--border);border-radius:var(--r-gross);background:var(--bg-card);overflow:hidden; }
.kb-quick-main { min-height:64px;display:grid;grid-template-columns:minmax(210px,1fr) minmax(190px,300px);align-items:center;gap:14px;padding:12px 14px; }
.kb-quick-main select,.kb-quick-main input { width:100%;min-height:44px; }
.kb-quick-details { border-top:1px solid var(--border);padding:0 14px 14px;background:rgba(var(--akzent-rgb),.025); }
.kb-quick-details summary { min-height:42px;display:flex;align-items:center;color:var(--muted);font-size:12px;font-weight:800;cursor:pointer; }
.kb-photo-strip { display:flex;gap:10px;overflow-x:auto;padding-bottom:8px; }
.kb-photo-strip>div { flex:0 0 150px; }.kb-photo-strip img { display:block;width:150px;height:105px;object-fit:cover;border-radius:9px;border:1px solid var(--border); }.kb-photo-strip small { display:block;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.kb-scope-summary { display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;margin-top:12px; }.kb-scope-result { display:flex;flex-direction:column;gap:4px;padding:13px;border:1px solid var(--border);border-radius:var(--r);text-decoration:none;color:inherit;background:rgba(var(--akzent-rgb),.035); }.kb-scope-result span { color:var(--akzent);font-weight:850; }.kb-scope-result small { color:var(--muted); }
.kb-finish-btn { min-height:58px;font-size:16px;padding-left:24px;padding-right:24px; }.kb-success-panel { display:flex;align-items:center;gap:18px;border-color:var(--ok);background:rgba(74,222,128,.07); }.kb-success-icon { width:56px;height:56px;display:grid;place-items:center;border-radius:50%;background:var(--ok);color:var(--bg);font-size:30px;font-weight:900;flex:none; }
.kb-direct-actions { display:flex;gap:9px;align-items:center;flex-wrap:wrap; }
.kb-check-start { display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap;background:linear-gradient(135deg,rgba(var(--akzent-rgb),.12),rgba(var(--akzent-rgb),.025)); }.kb-start-btn { min-height:58px;padding:12px 22px;font-size:16px; }
.kb-dashboard-hero { display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;background:linear-gradient(135deg,rgba(var(--akzent-rgb),.14),rgba(var(--akzent-rgb),.02)); }.kb-home-kpis a { color:inherit;text-decoration:none; }.kb-home-kpis a:hover { border-color:var(--akzent); }
.kb-checkmodule-admin { display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:12px;margin:14px 0; }.kb-checkmodule-admin>.kb-card { margin:0; }
@media (max-width:700px){
  .kb-main{padding-left:10px;padding-right:10px}.kb-card{padding:14px}.kb-position .kb-grid{grid-template-columns:1fr}.kb-position-title .kb-btn{width:100%;justify-content:center}.kb-wizard-actions .kb-btn{flex:1;justify-content:center}.kb-autosave-status{width:100%;order:-1}.kb-review-html{padding:10px}.kb-review-html .grid{font-size:11px}.kb-review-html .signatures{display:block}.kb-review-html .sig{display:block;width:100%;margin-bottom:12px}.kb-signature canvas{height:150px}.kb-scope-cards{grid-template-columns:1fr}.kb-scope-card{min-height:125px}.kb-quick-main{grid-template-columns:1fr;gap:7px}.kb-all-clear{width:100%;justify-content:center}
}
@media (min-width:701px) and (max-width:1100px) and (orientation:landscape){.kb-position .kb-grid{grid-template-columns:repeat(3,1fr)}}

/* Auf Tablet und Smartphone übernimmt der Menüschalter. */
@media (max-width: 900px) {
  .kb-burger { display: inline-flex; }
  .kb-nav { display: none; }
  .kb-nav-panel[hidden] { display: none; }
  .kb-nav-panel.offen { display: flex; }
  .kb-antwort { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); }
  .kb-messgrid { grid-template-columns: 1fr 1fr; }
  .kb-messgrid .kb-field.wachsen { grid-column: 1 / -1; }
  .kb-stepper { margin-left: -10px; margin-right: -10px; padding-left: 10px; padding-right: 10px; }
}
@media (max-width: 520px) {
  .kb-antwort { grid-template-columns: 1fr 1fr; }
  .kb-messgrid { grid-template-columns: 1fr; }
  .kb-messgrid .eng { max-width: none; }
  .kb-step-text { max-width: 92px; overflow: hidden; text-overflow: ellipsis; }
  .kb-aufgaben-liste li { flex-direction: column; align-items: stretch; }
  .kb-aufgaben-liste .kb-btn { width: 100%; justify-content: center; }
}

/* ── Einstellungen: Kataloglisten und Navigationsvorschau ───── */
.kb-katalog-liste { display: flex; flex-direction: column; gap: 10px; margin: 14px 0; }
.kb-katalog-zeile { border: 1px solid var(--border); border-radius: var(--r); padding: 12px; }
.kb-katalog-kopf { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 9px; }
.kb-katalog-kopf b { font-family: ui-monospace, monospace; font-size: 12.5px; color: var(--akzent); }
.kb-katalog-neu {
  border: 1px dashed var(--border); border-radius: var(--r); padding: 12px; margin-top: 16px;
}
.kb-katalog-neu legend { padding: 0 8px; font-size: 12px; font-weight: 800; color: var(--muted); text-transform: uppercase; letter-spacing: .06em; }

.kb-nav-vorschau { border: 1px solid var(--border); border-radius: var(--r); padding: 12px; margin-top: 12px; }
.kb-nav-vorschau-titel { font-size: 11.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; color: var(--muted); margin-bottom: 8px; }
.kb-nav-vorschau-reihe { display: flex; flex-wrap: wrap; gap: 6px; }
.kb-nav-vorschau-chip {
  display: inline-flex; align-items: center; gap: 6px; padding: 7px 13px;
  border: 1px solid var(--border); border-radius: 10px; font-size: 13px; font-weight: 700;
}
.kb-nav-vorschau-chip.admin { color: var(--muted); margin-left: auto; }
.kb-nav-vorschau-chip.mehr { border-style: dashed; color: var(--muted); }
.kb-nav-vorschau-mehr { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; padding-left: 12px; }
.kb-nav-vorschau-mehr span { font-size: 12px; color: var(--muted); padding: 4px 9px; border: 1px solid var(--border); border-radius: 8px; }

/* Autosave-Rückmeldung */
[data-autosave-status] { font-size: 12.5px; color: var(--muted); }
[data-autosave-status][data-art="laeuft"] { color: var(--info); }
[data-autosave-status][data-art="ok"]     { color: var(--akzent); }
[data-autosave-status][data-art="fehler"] { color: var(--fehler); font-weight: 700; }

/* Antwortstatus-Auswahl im Fragenkatalog */
.kb-status-auswahl { display: flex; flex-wrap: wrap; gap: 8px 16px; }
.kb-status-auswahl .kb-check { min-height: var(--touch); display: inline-flex; align-items: center; gap: 7px; font-size: 13px; }

/* ── Vereinsübersicht und Vereinsdetail ─────────────────────── */
.kb-verein-liste { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 12px; }
.kb-verein-karte { border: 1px solid var(--border); border-radius: var(--r-gross); padding: 14px; background: var(--bg-card); }
.kb-verein-kopf { display: flex; align-items: flex-start; gap: 11px; text-decoration: none; color: var(--text); }
.kb-verein-kopf b { display: block; font-size: 16px; line-height: 1.3; }
.kb-verein-kopf small { display: block; font-size: 12px; margin-top: 2px; }
.kb-verein-kopf > span:nth-child(2) { flex: 1; min-width: 0; }
.kb-verein-icon { font-size: 22px; line-height: 1; flex: none; }
.kb-verein-zahlen { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin: 13px 0; }
.kb-verein-zahlen div { text-align: center; }
.kb-verein-zahlen dt { font-size: 10.5px; color: var(--muted); line-height: 1.25; }
.kb-verein-zahlen dd { margin: 2px 0 0; font-size: 19px; font-weight: 800; }
.kb-verein-aktionen { display: flex; gap: 8px; flex-wrap: wrap; }

.kb-filterleiste { display: flex; gap: 10px; align-items: flex-end; flex-wrap: wrap; }
.kb-statistik { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px; margin: 0; }
.kb-statistik div { border: 1px solid var(--border); border-radius: var(--r); padding: 10px 12px; }
.kb-statistik dt { font-size: 11px; color: var(--muted); }
.kb-statistik dd { margin: 3px 0 0; font-size: 20px; font-weight: 800; }

.kb-bereich-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 12px; }
.kb-liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 7px; }
.kb-liste li { padding: 9px 11px; border: 1px solid var(--border); border-radius: var(--r); }
.kb-liste li a { text-decoration: none; color: var(--text); }
.kb-liste li a:hover b { color: var(--akzent); }
.kb-liste li small { display: block; margin-top: 2px; }

/* ── Breadcrumbs ────────────────────────────────────────────── */
.kb-breadcrumb { margin: 0 0 12px; }
.kb-breadcrumb ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 2px; }
.kb-breadcrumb li { display: flex; align-items: center; font-size: 12.5px; }
.kb-breadcrumb li + li::before { content: "›"; color: var(--muted); margin: 0 7px; }
.kb-breadcrumb a { color: var(--muted); text-decoration: none; padding: 5px 2px; }
.kb-breadcrumb a:hover { color: var(--akzent); text-decoration: underline; }
.kb-breadcrumb span[aria-current] { color: var(--text); font-weight: 700; }

/* ── Musterprotokoll-Vorschau ───────────────────────────────── */
.kb-musterrahmen iframe { width: 100%; height: 78vh; min-height: 520px; border: 1px solid var(--border);
  border-radius: var(--r); background: #fff; }

@media (max-width: 520px) {
  .kb-verein-zahlen { grid-template-columns: repeat(2, 1fr); }
  .kb-musterrahmen iframe { height: 62vh; }
}

/* ── Textkatalog: Liste zum Lesen, nicht zum Ausfüllen ─────────
   Über hundert Bausteine gleichzeitig als Formular waren unlesbar.
   Die Liste zeigt jetzt den Text groß, alles Weitere klein daneben. */
.kb-tabs { display: flex; flex-wrap: wrap; gap: 6px; }
.kb-tab-zahl {
  display: inline-block; margin-left: 6px; padding: 1px 7px; border-radius: 999px;
  background: rgba(255,255,255,.09); font-size: 11px; font-weight: 700; color: var(--muted);
}
.kb-tab.on .kb-tab-zahl { background: rgba(var(--akzent-rgb), .22); color: var(--akzent); }

.kb-bausteine { display: flex; flex-direction: column; gap: 4px; }
.kb-baustein-gruppe {
  font-size: 11.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
  color: var(--muted); margin: 16px 0 4px; padding-bottom: 4px;
  border-bottom: 1px solid var(--border);
}
.kb-baustein-gruppe:first-child { margin-top: 0; }

.kb-baustein {
  display: grid; grid-template-columns: 84px 1fr auto; gap: 12px; align-items: start;
  padding: 11px 13px; border: 1px solid var(--border); border-radius: var(--r);
  text-decoration: none; color: var(--text); min-height: var(--touch);
}
.kb-baustein:hover { border-color: var(--akzent); background: rgba(var(--akzent-rgb), .06); }
.kb-baustein.inaktiv { opacity: .55; }
.kb-baustein-code {
  font-family: ui-monospace, monospace; font-size: 12px; font-weight: 700;
  color: var(--akzent); padding-top: 1px;
}
.kb-baustein-text b { display: block; font-size: 14.5px; font-weight: 650; line-height: 1.35; }
.kb-baustein-text small {
  display: block; margin-top: 3px; font-size: 12.5px; line-height: 1.45; color: var(--muted);
}
.kb-baustein-meta { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; justify-content: flex-end; max-width: 260px; }
.kb-mini {
  font-size: 11px; padding: 2px 8px; border-radius: 999px;
  border: 1px solid var(--border); color: var(--muted); white-space: nowrap;
}
.kb-mini.aus { border-color: var(--warn); color: var(--warn); }

.kb-baustein-edit {
  border: 1.5px solid var(--akzent); border-radius: var(--r); padding: 14px;
  background: rgba(var(--akzent-rgb), .05);
}
.kb-baustein-edit-kopf {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  margin-bottom: 12px; padding-bottom: 10px; border-bottom: 1px solid var(--border);
}
.kb-baustein-edit-kopf b { font-family: ui-monospace, monospace; font-size: 14px; color: var(--akzent); }

/* Kompakte Tabellen für die kleineren Kataloge */
.kb-t-kompakt th { font-size: 11.5px; white-space: nowrap; }
.kb-t-kompakt td { padding: 5px 6px; vertical-align: middle; }
.kb-t-kompakt input, .kb-t-kompakt select { font-size: 13px; padding: 6px 8px; }
.kb-t-kompakt input.eng, .kb-t-kompakt select.eng { max-width: 76px; }
.kb-t-gruppe td {
  background: rgba(255,255,255,.04); font-size: 11.5px; font-weight: 800;
  letter-spacing: .07em; text-transform: uppercase; color: var(--muted); padding: 9px 8px;
}

/* SMTP-Gesprächsprotokoll */
.kb-smtp-log {
  font-family: ui-monospace, monospace; font-size: 11.5px; line-height: 1.55;
  background: var(--bg); border: 1px solid var(--border); border-radius: var(--r);
  padding: 10px 12px; margin: 8px 0 4px; max-height: 320px; overflow: auto;
  white-space: pre-wrap; word-break: break-word;
}

@media (max-width: 720px) {
  .kb-baustein { grid-template-columns: 1fr; gap: 6px; }
  .kb-baustein-meta { justify-content: flex-start; max-width: none; }
}

/* ── Mehrfachbefunde je Prüfpunkt ───────────────────────────── */
.kb-befundblock { margin-top: 14px; padding: 12px; border: 1px dashed var(--border); border-radius: var(--r); }
.kb-befundliste { display: flex; flex-direction: column; gap: 12px; }
.kb-befundkarte {
  border: 1px solid var(--border); border-left: 3px solid var(--akzent);
  border-radius: var(--r); padding: 12px; margin: 0;
}
.kb-befundkarte-kopf {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  margin-bottom: 10px; padding-bottom: 8px; border-bottom: 1px solid var(--border);
}
.kb-befundkarte-kopf b { font-size: 13.5px; color: var(--akzent); }
.kb-befundkarte-werkzeuge { margin-left: auto; display: flex; gap: 4px; }
.kb-befund-aktionen { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 12px; }
.kb-baustein-tap { border-style: dashed; font-size: 12px; }
.kb-summary-zahl {
  display: inline-block; margin-left: 8px; padding: 1px 8px; border-radius: 999px;
  background: rgba(var(--akzent-rgb), .16); color: var(--akzent); font-size: 11.5px; font-weight: 700;
}

/* Bausteinsuche in der Karte — die frühere Überlagerung (position:absolute)
   ist entfallen. Sie legte die Trefferliste über die Formularfelder; auf dem
   Tablet war dadurch nur die halbe Auswahl lesbar. Ersatz: das Kachelraster
   im Nachtrag am Ende dieser Datei. */
.kb-baustein-leer { padding: 10px 12px; font-size: 12.5px; color: var(--muted); }

/* Angesprungene Frage kurz hervorheben */
.kb-quick-card.ist-gesucht {
  border-color: var(--warn); box-shadow: 0 0 0 2px rgba(245,158,11,.28);
  scroll-margin-top: 90px;
}

@media (max-width: 520px) {
  .kb-befundkarte-werkzeuge { margin-left: 0; width: 100%; }
}

/* ═══════════════════════════════════════════════════════════════
   V3.07 · Nachtrag
   Diese Klassen wurden in den PHP-Dateien bereits verwendet, hatten
   hier aber keine Regel. Sichtbare Folge: Kacheln, Listen und
   Schnelllinks fielen auf den Browser-Standard zurück — Text lief
   ineinander, Karten waren keine Karten. Reihenfolge wie im Ablauf.
   ═══════════════════════════════════════════════════════════════ */

/* ── Schnellzugriff auf der Startseite ──────────────────────── */
.kb-schnelllinks { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 10px; }
.kb-schnelllinks a {
  display: grid; grid-template-columns: 42px 1fr; grid-template-rows: auto auto;
  column-gap: 12px; row-gap: 2px; align-items: start;
  min-height: max(var(--touch), 66px); padding: 13px 14px;
  border: 1px solid var(--border); border-radius: var(--r-gross);
  background: var(--bg-card); color: var(--text); text-decoration: none;
}
.kb-schnelllinks a:hover { border-color: var(--akzent); background: rgba(var(--akzent-rgb), .06); }
.kb-schnelllinks a > span:first-child {
  grid-row: 1 / span 2; width: 42px; height: 42px; border-radius: 12px;
  display: grid; place-items: center; font-size: 21px;
  background: rgba(var(--akzent-rgb), .12);
}
.kb-schnelllinks a b     { grid-column: 2; font-size: 15px; line-height: 1.3; }
.kb-schnelllinks a small { grid-column: 2; font-size: 12px; color: var(--muted); line-height: 1.4; }

/* ── Auswahlfluss „Verein → Parzelle → Prüfart" ─────────────── */
.kb-auswahlfluss { display: flex; flex-direction: column; gap: 14px; }
.kb-auswahl-schritte { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; align-items: end; }
.kb-auswahl-schritt, .kb-auswahl-start { display: flex; gap: 12px; align-items: flex-start; }
.kb-auswahl-schritt .kb-field { flex: 1; min-width: 0; }
.kb-auswahl-nr {
  flex: none; width: 28px; height: 28px; margin-top: 22px; border-radius: 999px;
  display: grid; place-items: center; font-size: 13px; font-weight: 800;
  color: var(--akzent); background: rgba(var(--akzent-rgb), .14);
  border: 1px solid var(--akzent);
}
.kb-auswahl-start {
  align-items: center; flex-wrap: wrap; gap: 12px;
  padding: 14px; border: 1px dashed var(--border); border-radius: var(--r-gross);
  background: rgba(var(--akzent-rgb), .04);
}
.kb-auswahl-start .kb-auswahl-nr { margin-top: 0; }
.kb-auswahl-start > div { flex: 1; min-width: 190px; }
.kb-auswahl-start b     { display: block; font-size: 15px; }
.kb-auswahl-start small { display: block; margin-top: 3px; font-size: 12px; color: var(--muted); }
.kb-auswahl-start .kb-btn { margin-left: auto; }
.kb-btn.ist-deaktiviert { opacity: .5; cursor: not-allowed; pointer-events: none; }

/* ── Listen von Vorabchecks und Protokollen ─────────────────── */
.kb-vc-list { display: flex; flex-direction: column; gap: 9px; }

/* ── Parzellentabelle: lange Spalten dürfen umbrechen ───────── */
.kb-parzellen-tabelle td { vertical-align: top; }
.kb-parzellen-tabelle td:last-child { white-space: nowrap; text-align: right; }

/* ── Gemeinsam bearbeiten (Tablet + Handy) ──────────────────── */
.kb-zusammenarbeit {
  display: flex; flex-wrap: wrap; align-items: center; gap: 12px;
  padding: 13px 14px; margin-bottom: 14px;
  border: 1px solid var(--border); border-radius: var(--r-gross);
  background: rgba(var(--akzent-rgb), .05);
}
.kb-zusammenarbeit-text { flex: 1; min-width: 200px; }
.kb-zusammenarbeit-text b     { display: block; font-size: 14px; }
.kb-zusammenarbeit-text small { display: block; margin-top: 2px; font-size: 12px; color: var(--muted); }
.kb-live-foto-info { display: flex; flex-direction: column; gap: 2px; font-size: 13px; }
.kb-live-foto-info b { color: var(--akzent); font-size: 15px; }
.kb-live-thumbs { display: flex; gap: 5px; }
.kb-live-thumbs img {
  width: 44px; height: 44px; object-fit: cover;
  border-radius: 8px; border: 1px solid var(--border);
}

/* ── Prüffragen-Formular ────────────────────────────────────── */
.kb-vc-compact { display: block; }

/* ── Schnellauswahl je Prüfpunkt (sachliche Feststellung) ───── */
.kb-schnellauswahl {
  padding: 4px 14px 10px;
  border-bottom: 1px dashed var(--border);
}
.kb-schnellauswahl .kb-zeile { display: flex; flex-wrap: wrap; gap: 6px; }
.kb-schnellauswahl .kb-btn.on {
  border-color: var(--akzent); color: var(--akzent);
  background: rgba(var(--akzent-rgb), .14); font-weight: 800;
}

/* ── Beurteilungs- und Empfehlungsbausteine ─────────────────── */
.kb-beurteilung-bausteine {
  padding: 12px 13px; border: 1px solid var(--border);
  border-radius: var(--r); background: rgba(var(--akzent-rgb), .04);
}
.kb-beurteilung-bausteine .kb-zeile { display: flex; flex-wrap: wrap; gap: 6px; }

/* ═══════════════════════════════════════════════════════════════
   Bausteinwahl in der Befundkarte — Kacheln statt Überlagerung
   Die frühere Trefferliste lag als position:absolute-Menü über den
   Feldern und war auf dem Tablet nur zur Hälfte lesbar. Jetzt liegt
   die Auswahl im Fluss und schiebt den Inhalt nach unten.
   ═══════════════════════════════════════════════════════════════ */
.kb-bausteinwahl {
  margin-top: 4px; border: 1px solid var(--border);
  border-radius: var(--r); background: rgba(var(--akzent-rgb), .04);
}
.kb-bausteinwahl-kopf {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 10px 12px; min-height: var(--touch);
}
.kb-bausteinwahl-kopf b { font-size: 13.5px; }
.kb-bausteinwahl-kopf .kb-btn { margin-left: auto; }
.kb-bausteinwahl-body { padding: 0 12px 12px; }
.kb-bausteinwahl-body input[type=search] { width: 100%; }
.kb-bausteinwahl-hinweis {
  margin: 0 0 8px; font-size: 12px; color: var(--muted);
}
.kb-baustein-kacheln { margin-top: 10px; }
.kb-baustein-raster {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(232px, 1fr));
  gap: 8px; max-height: 460px; overflow-y: auto; padding-right: 2px;
}
.kb-baustein-kachel {
  position: relative; display: flex; flex-direction: column; gap: 4px;
  min-height: max(var(--touch), 74px); padding: 11px 38px 11px 12px;
  text-align: left; cursor: pointer;
  border: 1.5px solid var(--border); border-radius: var(--r);
  background: var(--bg); color: var(--text); font: inherit;
}
.kb-baustein-kachel:hover { border-color: var(--akzent); background: rgba(var(--akzent-rgb), .07); }
.kb-baustein-kachel:focus-visible { outline: 2px solid var(--akzent); outline-offset: 2px; }
.kb-baustein-kachel.on {
  border-color: var(--akzent); background: rgba(var(--akzent-rgb), .12);
  box-shadow: 0 0 0 2px rgba(var(--akzent-rgb), .22);
}
/* Kästchen wie beim Prüfumfang — die Auswahl bleibt sichtbar. */
.kb-baustein-haken {
  position: absolute; top: 10px; right: 10px;
  width: 22px; height: 22px; flex: none;
  border: 1.5px solid var(--border); border-radius: 6px;
  background: var(--bg-card);
}
.kb-baustein-kachel.on .kb-baustein-haken {
  border-color: var(--akzent); background: var(--akzent);
}
.kb-baustein-kachel.on .kb-baustein-haken::after {
  content: '✓'; position: absolute; inset: 0;
  display: grid; place-items: center;
  font-size: 14px; font-weight: 900; color: var(--bg);
}
.kb-baustein-kopf { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.kb-bausteinwahl-code {
  font-family: ui-monospace, monospace; font-size: 10.5px;
  letter-spacing: .2px; color: var(--akzent);
}
.kb-baustein-bezug {
  padding: 1px 7px; border-radius: 999px;
  font-size: 10.5px; font-weight: 800; white-space: nowrap;
  border: 1px solid currentColor; color: var(--muted);
}
.kb-baustein-bezug.ist-io      { color: var(--ok); }
.kb-baustein-bezug.ist-hinweis { color: var(--warn); }
.kb-baustein-bezug.ist-mangel  { color: var(--fehler); }
.kb-baustein-bezug.ist-sicherheitsrelevanter_mangel { color: var(--gefahr); font-weight: 900; }
.kb-baustein-kachel b     { font-size: 13.5px; font-weight: 700; line-height: 1.3; }
.kb-baustein-kachel small { font-size: 11.5px; color: var(--muted); line-height: 1.4; }
/* Baustein, der genau zu diesem Prüfpunkt gehört — steht vorn. */
.kb-baustein-kachel.ist-eigen { border-left-width: 4px; border-left-color: var(--akzent); }
.kb-baustein-weiter { margin-top: 9px; width: 100%; justify-content: center; }

@media (max-width: 520px) {
  .kb-baustein-raster { grid-template-columns: 1fr; max-height: none; }
  .kb-auswahl-start .kb-btn { margin-left: 0; width: 100%; justify-content: center; }
  .kb-bausteinwahl-kopf .kb-btn { margin-left: 0; width: 100%; justify-content: center; }
  .kb-schnelllinks a { grid-template-columns: 36px 1fr; }
  .kb-schnelllinks a > span:first-child { width: 36px; height: 36px; font-size: 18px; }
}

/* ═══════════════════════════════════════════════════════════════
   V3.08 · Maßnahmen je Parzelle
   Die Übersicht muss auf dem Tablet mit dem Daumen bedienbar sein:
   große Flächen, keine Tabellen mit Mini-Schaltern.
   ═══════════════════════════════════════════════════════════════ */

/* ── Was steht im Verein an ─────────────────────────────────── */
.kb-massnahme-summen {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(232px, 1fr));
  gap: 8px; margin-top: 10px;
}
.kb-massnahme-summe {
  display: grid; grid-template-columns: 46px 1fr; gap: 11px; align-items: center;
  min-height: max(var(--touch), 58px); padding: 9px 12px;
  border: 1.5px solid var(--border); border-radius: var(--r-gross);
  background: var(--bg-card); color: var(--text); text-decoration: none;
}
.kb-massnahme-summe:hover { border-color: var(--akzent); }
.kb-massnahme-summe.on { border-color: var(--akzent); background: rgba(var(--akzent-rgb), .12); }
.kb-massnahme-zahl {
  width: 46px; height: 38px; border-radius: 10px; display: grid; place-items: center;
  font-size: 18px; font-weight: 800; background: rgba(var(--akzent-rgb), .12); color: var(--akzent);
}
.kb-massnahme-summe b     { display: block; font-size: 14px; line-height: 1.3; }
.kb-massnahme-summe small { display: block; font-size: 11.5px; color: var(--muted); margin-top: 2px; }
/* Farbe nach Dringlichkeit — dieselbe Bedeutung wie im Protokoll. */
.kb-massnahme-summe.ist-gefahr .kb-massnahme-zahl { background: rgba(248,113,113,.16); color: var(--fehler); }
.kb-massnahme-summe.ist-mangel .kb-massnahme-zahl { background: rgba(245,158,11,.18);  color: var(--warn); }
.kb-massnahme-summe.ist-warn   .kb-massnahme-zahl { background: rgba(245,158,11,.14);  color: var(--warn); }
.kb-massnahme-summe.ist-ok     .kb-massnahme-zahl { background: rgba(var(--akzent-rgb), .16); color: var(--ok); }
.kb-massnahme-summe.ist-neutral .kb-massnahme-zahl { background: rgba(255,255,255,.06); color: var(--muted); }
.kb-massnahme-summe.ist-alle   .kb-massnahme-zahl { background: transparent; border: 1px dashed var(--border); }

.kb-massnahme-schalter { flex-wrap: wrap; align-items: center; gap: 7px; }
.kb-massnahme-schalter .kb-btn.on {
  border-color: var(--akzent); color: var(--akzent);
  background: rgba(var(--akzent-rgb), .14); font-weight: 800;
}

/* ── Karte je Parzelle ──────────────────────────────────────── */
.kb-parzellenkarte { scroll-margin-top: 90px; }
.kb-parzellenkopf {
  display: flex; flex-wrap: wrap; gap: 12px; align-items: center;
  padding-bottom: 11px; margin-bottom: 11px; border-bottom: 1px solid var(--border);
}
.kb-parzellenkopf > div:first-child { flex: 1; min-width: 190px; }
.kb-parzellenkopf b     { display: block; font-size: 16px; }
.kb-parzellenkopf small { display: block; font-size: 12px; margin-top: 2px; }
.kb-parzellenstand { display: flex; flex-direction: column; gap: 3px; align-items: flex-start; }

/* ── Einzelne Maßnahme ──────────────────────────────────────── */
.kb-massnahme-liste { display: grid; grid-template-columns: repeat(auto-fit, minmax(268px, 1fr)); gap: 9px; }
.kb-massnahme {
  position: relative;
  border: 1px solid var(--border); border-left: 3.5px solid var(--muted);
  border-radius: var(--r); padding: 10px 38px 10px 12px; background: var(--bg);
}
.kb-massnahme.ist-gefahr  { border-left-color: var(--fehler); }
.kb-massnahme.ist-mangel  { border-left-color: var(--warn); }
.kb-massnahme.ist-warn    { border-left-color: var(--warn); }
.kb-massnahme.ist-ok      { border-left-color: var(--ok); }
.kb-massnahme.ist-neutral { border-left-color: var(--border); }
/* Erledigtes bleibt sichtbar, tritt aber zurück — es ist Nachweis,
   keine Aufgabe mehr. */
.kb-massnahme.ist-abgehakt { opacity: .58; border-left-color: var(--ok); }
.kb-massnahme-kopf { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.kb-massnahme-kopf b { font-size: 14px; }
.kb-massnahme small { display: block; font-size: 11.5px; line-height: 1.45; margin-top: 4px; }
.kb-massnahme-notiz { color: var(--akzent); }
.kb-massnahme-aktionen { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 9px; }
/* Entfernen sitzt oben rechts in der Karte: es ist kein Bearbeitungs-
   stand, sondern das Zurücknehmen des Eintrags. In einer Reihe mit
   „Geplant/Erledigt/Entfällt" wäre es dauernd der falsche Nachbar. */
/* Fest in der Ecke statt am Zeilenende: bei einem langen Titel rutschte
   das ✕ sonst in die zweite Zeile und stand mitten im Text. */
.kb-massnahme-weg { position: absolute; top: 8px; right: 8px; margin: 0; }
.kb-massnahme-weg-btn {
  min-width: 28px; min-height: 28px; padding: 0 6px; cursor: pointer;
  border: 1px solid var(--border); border-radius: 8px;
  background: transparent; color: var(--muted); font-size: 12px; line-height: 1;
}
.kb-massnahme-weg-btn:hover { border-color: var(--fehler); color: var(--fehler); }
.kb-massnahme-aktionen form { display: inline; }

.kb-massnahme-neu { margin-top: 12px; border-top: 1px dashed var(--border); padding-top: 4px; }
.kb-massnahme-neu summary {
  min-height: var(--touch); display: flex; align-items: center;
  cursor: pointer; color: var(--muted); font-size: 12.5px; font-weight: 700;
}
.kb-massnahme-neu .kb-zeile { flex-wrap: wrap; gap: 9px; align-items: flex-end; }

@media (max-width: 620px) {
  .kb-massnahme-liste  { grid-template-columns: 1fr; }
  .kb-massnahme-summen { grid-template-columns: 1fr; }
  .kb-parzellenkopf .kb-direct-actions { width: 100%; }
  .kb-massnahme-neu .kb-zeile .kb-btn { width: 100%; justify-content: center; }
}

/* ═══════════════════════════════════════════════════════════════
   V3.09 · Vorschläge und fachliche Grundlagen im Beurteilungsschritt
   ═══════════════════════════════════════════════════════════════ */

/* Vorschlag zur Lage — sichtbar als Angebot, nicht als gesetzter Text. */
.kb-vorschlag {
  border: 1px dashed var(--akzent); border-radius: var(--r);
  background: rgba(var(--akzent-rgb), .05); padding: 11px 13px;
}
.kb-vorschlag-kopf { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.kb-vorschlag-kopf b { font-size: 13.5px; }
.kb-vorschlag-kopf .kb-btn { margin-left: auto; }
.kb-vorschlag-text { margin: 8px 0 0; font-size: 13px; line-height: 1.55; color: var(--muted); }

/* ── Normenauswahl ──────────────────────────────────────────── */
.kb-normwahl { display: flex; flex-direction: column; gap: 14px; }
.kb-normgruppe-kopf {
  font-size: 11.5px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase;
  color: var(--akzent); padding-bottom: 5px; margin-bottom: 7px;
  border-bottom: 1px solid var(--border);
}
.kb-normzeile {
  display: grid; grid-template-columns: 26px 1fr minmax(190px, 300px);
  gap: 10px; align-items: start;
  padding: 9px 11px; margin-bottom: 6px; cursor: pointer;
  border: 1.5px solid var(--border); border-radius: var(--r); background: var(--bg);
}
.kb-normzeile:hover { border-color: var(--muted); }
.kb-normzeile.on { border-color: var(--akzent); background: rgba(var(--akzent-rgb), .07); }
.kb-normzeile input[type=checkbox] { width: 22px; height: 22px; margin-top: 2px; accent-color: var(--akzent); }
.kb-normtext b     { display: block; font-size: 13.5px; line-height: 1.35; }
.kb-normtext small { display: block; font-size: 11.5px; color: var(--muted); line-height: 1.45; margin-top: 2px; }
.kb-normhinweis    { color: var(--akzent) !important; }
/* Ein nicht bestätigter Ausgabestand muss man sehen, bevor man ihn ins
   Protokoll übernimmt — nicht erst, wenn der Kunde nachfragt. */
.kb-normstatus {
  display: inline-block; margin-left: 6px; padding: 1px 7px; border-radius: 999px;
  font-size: 10.5px; font-weight: 800; font-style: normal; letter-spacing: .04em;
  border: 1px solid currentColor; color: var(--muted);
}
.kb-normstatus.ist-ungeprueft   { color: var(--warn); }
.kb-normstatus.ist-recherchiert { color: var(--info); }
.kb-normstatus.ist-zurueckgezogen { color: var(--fehler); }
.kb-normzusatz { display: flex; flex-direction: column; gap: 5px; }
.kb-normzusatz input { font-size: 12.5px; min-height: 34px; }
.kb-normfrei summary {
  min-height: var(--touch); display: flex; align-items: center; cursor: pointer;
  color: var(--muted); font-size: 12.5px; font-weight: 700;
}

@media (max-width: 720px) {
  .kb-normzeile { grid-template-columns: 26px 1fr; }
  .kb-normzusatz { grid-column: 1 / -1; }
  .kb-vorschlag-kopf .kb-btn { margin-left: 0; width: 100%; justify-content: center; }
}

/* ── Beteiligte Personen (1..n Prüfer) ──────────────────────── */
.kb-pruefer-liste { display: flex; flex-direction: column; gap: 9px; }
.kb-pruefer {
  display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end;
  padding: 10px 12px; border: 1px solid var(--border);
  border-left: 3.5px solid var(--warn); border-radius: var(--r); background: var(--bg);
}
.kb-pruefer.ist-signiert { border-left-color: var(--ok); }
.kb-pruefer-kopf { flex: 1 1 190px; display: flex; flex-wrap: wrap; gap: 7px; align-items: center; }
.kb-pruefer-kopf b { font-size: 14.5px; }
.kb-pruefer-form { display: flex; flex-wrap: wrap; gap: 9px; align-items: flex-end; }
.kb-pruefer-form .kb-field { margin: 0; }
.kb-pruefer-pflicht {
  display: flex; align-items: center; gap: 6px;
  min-height: var(--touch); font-size: 12.5px; white-space: nowrap; cursor: pointer;
}
.kb-pruefer-pflicht input { width: 22px; height: 22px; accent-color: var(--akzent); }
.kb-pruefer-neu { flex-wrap: wrap; gap: 10px; align-items: flex-end; }

@media (max-width: 620px) {
  .kb-pruefer, .kb-pruefer-form, .kb-pruefer-neu { flex-direction: column; align-items: stretch; }
  .kb-pruefer .kb-btn, .kb-pruefer-neu .kb-btn { width: 100%; justify-content: center; }
}

/* ══ V3.11 · Normen mit Vorbehalt ═══════════════════════════════════
   Zeilen, bei denen die Recherche eine Frage offengelassen hat,
   bekommen eine ruhige Markierung — kein Rot: das bleibt den
   sicherheitsrelevanten Befunden vorbehalten. Die Farbe trägt die
   Aussage nicht allein, der Text „Entwurf läuft" steht daneben. */
.kb-t tr.ist-vorbehalt > td { border-left: 0; }
.kb-t tr.ist-vorbehalt > td:first-child { box-shadow: inset 3px 0 0 var(--warn); }

.kb-liste-eng { margin: 8px 0 0; padding-left: 18px; line-height: 1.5; }
.kb-liste-eng li { margin-bottom: 3px; }

/* Statusspalte der Normenliste: Fundstelle, Vermerk und Knopf stehen
   untereinander. Ohne Mindestbreite fiel die Fundstelle auf ein Wort
   je Zeile herunter, und die beiden Vermerke liefen ineinander. */
.kb-t-normen td small { display: block; margin-top: 4px; line-height: 1.45; }
.kb-t-normen .sp-status { min-width: 230px; }
.kb-t-normen .sp-status select { width: 100%; }