/* Zukunftsradar: Hell (Kompass-Farben), Dunkel (Signal) und Bernstein, umschaltbar über data-theme auf <html>.
   Ohne Wahl folgt die Darstellung der Systemeinstellung. Schriften lokal (SIL Open Font License). */

@font-face { font-family: "Space Grotesk"; src: url("fonts/space-grotesk-500.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "Space Grotesk"; src: url("fonts/space-grotesk-600.woff2") format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Space Grotesk"; src: url("fonts/space-grotesk-700.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("fonts/ibm-plex-sans-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("fonts/ibm-plex-sans-500.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("fonts/ibm-plex-sans-600.woff2") format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "JetBrains Mono"; src: url("fonts/jetbrains-mono-500.woff2") format("woff2"); font-weight: 500; font-display: swap; }

/* ---------- Farbsätze ---------- */
:root, :root[data-theme="light"] {
  color-scheme: light;
  --bg: #f3f5f8;
  --surface: #ffffff;
  --surface-2: #f7f9fb;
  --text: #16202c;
  --muted: #4e5b6c;
  --line: #dce2ea;
  --accent: #0e7c6e;
  --accent-ink: #ffffff;
  --focus: #0e7c6e;
  --bar: #15325c;
  --bar-ink: #ffffff;
  --bar-muted: #c9d4e3;
  --signal: #5ee6d0;
  --head-bg: #15325c;
  --head-ink: #ffffff;
  --head-muted: #b9cbe0;
  --good-bg: #e3f0e6; --good-ink: #1f5a30;
  --warn-bg: #fdf1d6; --warn-ink: #6b4a0e;
  --bad-bg: #fdecea;  --bad-ink: #a3201a;
  --info-bg: #e3ecf7; --info-ink: #1f4f7a;
  --neutral-bg: #eceff3; --neutral-ink: #4e5b6c;
  --orange-bg: #f7ebdf; --orange-ink: #7a4b1f;
  --ok: #1a7f37;
  --bad: #b42318;
  --radius: 10px;
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0a111e;
  --surface: #111b2e;
  --surface-2: #0d1627;
  --text: #e6edf7;
  --muted: #93a3bc;
  --line: #1e2b44;
  --accent: #5ee6d0;
  --accent-ink: #0a111e;
  --focus: #5ee6d0;
  --bar: #0d1627;
  --bar-ink: #e6edf7;
  --bar-muted: #93a3bc;
  --signal: #5ee6d0;
  --head-bg: #1b2a44;
  --head-ink: #ffffff;
  --head-muted: #a9bbd6;
  --good-bg: #173326; --good-ink: #9ee6b7;
  --warn-bg: #3a2f14; --warn-ink: #ffd58a;
  --bad-bg: #3d1a1d;  --bad-ink: #ffb4ad;
  --info-bg: #17304a; --info-ink: #a9d1f5;
  --neutral-bg: #1f2a3d; --neutral-ink: #b4c1d6;
  --orange-bg: #3a2717; --orange-ink: #f2c193;
  --ok: #5fd38a;
  --bad: #ff8a80;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    color-scheme: dark;
    --bg: #0a111e;
    --surface: #111b2e;
    --surface-2: #0d1627;
    --text: #e6edf7;
    --muted: #93a3bc;
    --line: #1e2b44;
    --accent: #5ee6d0;
    --accent-ink: #0a111e;
    --focus: #5ee6d0;
    --bar: #0d1627;
    --bar-ink: #e6edf7;
    --bar-muted: #93a3bc;
    --signal: #5ee6d0;
    --head-bg: #1b2a44;
    --head-ink: #ffffff;
    --head-muted: #a9bbd6;
    --good-bg: #173326; --good-ink: #9ee6b7;
    --warn-bg: #3a2f14; --warn-ink: #ffd58a;
    --bad-bg: #3d1a1d;  --bad-ink: #ffb4ad;
    --info-bg: #17304a; --info-ink: #a9d1f5;
    --neutral-bg: #1f2a3d; --neutral-ink: #b4c1d6;
    --orange-bg: #3a2717; --orange-ink: #f2c193;
    --ok: #5fd38a;
    --bad: #ff8a80;
  }
}

/* Bernstein: schwarz mit Bernstein-Akzent (angelehnt an die Gestaltung des Trend-Radar Chemnitz) */
:root[data-theme="amber"] {
  color-scheme: dark;
  --bg: #0a0a0a;
  --surface: #141414;
  --surface-2: #101010;
  --text: #fafafa;
  --muted: #a1a1aa;
  --line: #262626;
  --accent: #f59e0b;
  --accent-ink: #0a0a0a;
  --focus: #f59e0b;
  --bar: #0a0a0a;
  --bar-ink: #fafafa;
  --bar-muted: #a1a1aa;
  --signal: #f59e0b;
  --head-bg: #1c1c1c;
  --head-ink: #fafafa;
  --head-muted: #a1a1aa;
  --good-bg: #10301c; --good-ink: #4ade80;
  --warn-bg: #3a2a06; --warn-ink: #fbbf24;
  --bad-bg: #3b1212;  --bad-ink: #f87171;
  --info-bg: #2a2110; --info-ink: #fcd34d;
  --neutral-bg: #1f1f1f; --neutral-ink: #d4d4d8;
  --orange-bg: #3a210c; --orange-ink: #fb923c;
  --ok: #22c55e;
  --bad: #ef4444;
}

/* ---------- Grundlagen ---------- */
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--text); font: 15px/1.55 "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif; }
h1, h2, h3, .brand-name { font-family: "Space Grotesk", "IBM Plex Sans", system-ui, sans-serif; letter-spacing: -0.01em; }
h1 { font-size: 1.9rem; font-weight: 700; margin: 0 0 .5rem; }
h2 { font-size: 1.2rem; font-weight: 600; margin: 0 0 .5rem; }
h3 { font-weight: 600; }
a { color: var(--accent); }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.muted { color: var(--muted); }
.mono, .num, .stats dd { font-family: "JetBrains Mono", ui-monospace, Consolas, monospace; }

/* ---------- Kopfzeile ---------- */
.topbar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap;
  padding: .75rem 24px; background: var(--bar); color: var(--bar-ink); border-bottom: 1px solid var(--line); }
.brand { color: var(--bar-ink); text-decoration: none; display: flex; align-items: center; gap: .6rem; }
.brand svg { flex: none; }
.brand-name { font-size: 1.3rem; font-weight: 600; }
.brand-name .dot-accent { color: var(--signal); }
.topbar nav { display: flex; align-items: center; gap: 1.1rem; flex-wrap: wrap; }
.topbar nav a { color: var(--bar-muted); text-decoration: none; font-weight: 500; padding: .25rem 0; border-bottom: 2px solid transparent; }
.topbar nav a:hover, .topbar nav a[aria-current="page"] { color: var(--bar-ink); border-bottom-color: var(--signal); }
.tenant-chip { display: inline-flex; align-items: center; gap: .45rem; border: 1px solid color-mix(in srgb, var(--bar-ink) 25%, transparent);
  padding: .2rem .65rem .2rem .35rem; border-radius: 999px; }
.tenant-chip img { width: 26px; height: 21px; }
.topbar nav a.tenant-chip { color: var(--bar-ink); border-bottom-width: 1px; }
.who { color: var(--bar-muted); }
.topbar button.link { color: var(--bar-muted); }
.topbar button.link:hover { color: var(--bar-ink); }
.theme-toggle { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 8px;
  border: 1px solid color-mix(in srgb, var(--bar-ink) 25%, transparent); background: transparent; color: var(--bar-ink); padding: 0; }
.theme-toggle:hover { border-color: var(--signal); }
.theme-toggle .ti { display: none; }
:root:not([data-theme-pref]) .theme-toggle .ti-auto,
:root[data-theme-pref="auto"] .theme-toggle .ti-auto,
:root[data-theme-pref="light"] .theme-toggle .ti-light,
:root[data-theme-pref="dark"] .theme-toggle .ti-dark,
:root[data-theme-pref="amber"] .theme-toggle .ti-amber { display: inline; }

/* ---------- Seiten und Karten ---------- */
.page { max-width: 1100px; margin: 1.75rem auto; padding: 0 16px; }
.page.wide { max-width: 1680px; }
.narrow { max-width: 440px; margin: 8vh auto; padding: 0 16px; }
.card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.25rem; margin-bottom: 1rem; }
.card.highlight { border-color: var(--accent); }
.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); gap: 1rem; }
.facts { grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); }
.head-row { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; flex-wrap: wrap; }

/* Standort-Kopf (Emblem) */
.region-hero { display: flex; align-items: center; gap: 1.5rem; flex-wrap: wrap; margin-bottom: 1.25rem; }
.region-hero img { width: 150px; height: auto; }
.region-hero .eyebrow { font-size: .8rem; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.region-hero h1 { font-size: 2.6rem; margin: .1rem 0; }
.emblem-slot { width: 64px; height: 76px; border: 1.5px dashed var(--muted); border-radius: 4px 4px 32px 32px; display: flex;
  align-items: center; justify-content: center; text-align: center; font-size: .65rem; color: var(--muted); padding: 4px; }

/* ---------- Formulare ---------- */
.stack { display: flex; flex-direction: column; gap: .8rem; margin-top: 1rem; }
.row { display: flex; flex-wrap: wrap; gap: .8rem; align-items: flex-end; }
label { display: flex; flex-direction: column; gap: .3rem; font-weight: 500; }
label small { color: var(--muted); font-weight: 400; }
input, select { font: inherit; padding: .5rem .6rem; border: 1px solid var(--line); border-radius: 6px; background: var(--surface-2); color: var(--text); }
button { font: inherit; cursor: pointer; border-radius: 6px; border: 1px solid var(--line); background: var(--surface); color: var(--text); padding: .45rem .8rem; }
button.primary { background: var(--accent); color: var(--accent-ink); border-color: var(--accent); font-weight: 600; padding: .55rem 1rem; }
button.small { padding: .25rem .55rem; font-size: .85rem; }
button.link { border: 0; background: none; color: var(--accent); padding: 0; }
form.inline { display: inline-flex; gap: .3rem; align-items: center; }
a.button { display: inline-block; padding: .45rem .8rem; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); text-decoration: none; }
.export-buttons { display: flex; gap: .5rem; flex-wrap: wrap; }
.filters { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin: 1rem 0 .5rem; }
.filters input[type=search] { min-width: 16rem; flex: 1 1 16rem; }

.notice, .error { padding: .6rem .8rem; border-radius: 6px; }
.notice { background: var(--info-bg); color: var(--info-ink); }
.error { background: var(--bad-bg); color: var(--bad-ink); }

.choice { list-style: none; padding: 0; margin: 1rem 0 0; display: flex; flex-direction: column; gap: .5rem; }
.choice-btn { width: 100%; text-align: left; display: flex; justify-content: space-between; gap: 1rem; padding: .8rem 1rem; }
.choice-btn.active { border-color: var(--accent); }
.choice-btn span { color: var(--muted); }
.qr { display: flex; justify-content: center; margin: 1rem 0; }
.qr img { background: #fff; padding: 8px; border-radius: 6px; }
.secret { word-break: break-all; }
.copy { width: 100%; }

.stats { display: flex; gap: 1.75rem; margin: .8rem 0 0; }
.stats dt { color: var(--muted); font-size: .85rem; }
.stats dd { margin: 0; font-size: 1.6rem; font-weight: 500; }

/* ---------- Tabellen ---------- */
.table-wrap { overflow-x: auto; margin-bottom: 1rem; }
table { width: 100%; border-collapse: collapse; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); }
th, td { text-align: left; padding: .55rem .7rem; border-bottom: 1px solid var(--line); vertical-align: top; }
table thead th { background: var(--head-bg); color: var(--head-ink); font-weight: 600; border-bottom: 0; }
table.kv th { background: none; color: var(--muted); font-weight: 500; width: 40%; }
td.actions { display: flex; flex-wrap: wrap; gap: .4rem; }
table.companies td { font-size: .92rem; }
table.companies .desc { max-width: 26rem; }
table.companies td.small .badge { white-space: nowrap; }
table.members td { font-size: .9rem; }
.table-wrap.sticky-head { max-height: calc(100vh - 230px); overflow: auto; border: 1px solid var(--line); border-radius: var(--radius); }
.table-wrap.sticky-head table { border: 0; border-radius: 0; }
.table-wrap.sticky-head thead th { position: sticky; top: 0; z-index: 2; }
a.sort, a.sort.active { color: var(--head-ink); text-decoration: none; white-space: nowrap; }
a.sort:hover { text-decoration: underline; }
a.sort.active { font-weight: 700; }
a.sort .arrow { font-size: .75em; margin-left: .3em; color: var(--head-muted); }
a.sort.active .arrow { color: var(--signal); }

/* ---------- Kennzeichnungen ---------- */
table.runs td.result { min-width: 28rem; }
table.runs td.num, table.runs th.num { white-space: nowrap; }
.desc { color: var(--muted); font-size: .85rem; max-width: 42rem; }
.small { font-size: .82rem; }
.num { text-align: right; font-variant-numeric: tabular-nums; }
.url { word-break: break-all; }
.badge { display: inline-block; font-size: .75rem; padding: .05rem .4rem; border-radius: 4px; background: var(--neutral-bg); color: var(--neutral-ink); }
.badge.warn { background: var(--bad-bg); color: var(--bad-ink); }
.area, .rel, .status, .bind, .review, .crit { white-space: nowrap; padding: .05rem .45rem; border-radius: 4px; font-size: .82rem; }
.area-stadt { background: var(--info-bg); color: var(--info-ink); }
.area-landkreis { background: var(--good-bg); color: var(--good-ink); }
.area-ausserhalb { background: var(--orange-bg); color: var(--orange-ink); }
.rel-hoch, .status-fertig, .bind-hoch { background: var(--good-bg); color: var(--good-ink); }
.rel-mittel, .bind-mittel { background: var(--warn-bg); color: var(--warn-ink); }
.rel-gering { background: var(--neutral-bg); color: var(--neutral-ink); }
.status-laeuft { background: var(--info-bg); color: var(--info-ink); }
.status-fehler, .status-abgebrochen, .bind-gering { background: var(--bad-bg); color: var(--bad-ink); }
.error-text { color: var(--bad); max-width: 30rem; }
.dot { display: inline-block; width: .7rem; height: .7rem; border-radius: 50%; margin-right: .5rem; }
.dot.ok { background: var(--ok); }
.dot.bad { background: var(--bad); }
pre.corpus { white-space: pre-wrap; word-wrap: break-word; font: .9rem/1.5 "JetBrains Mono", ui-monospace, Consolas, monospace; margin: 0; max-height: 75vh; overflow: auto; }

/* ---------- Firmenprofil ---------- */
.kv-list { display: grid; grid-template-columns: 9.5rem 1fr; gap: .35rem .8rem; margin: .4rem 0; }
.kv-list dt { color: var(--muted); min-width: 0; overflow-wrap: anywhere; hyphens: auto; }
.kv-list dd { margin: 0; }
.capability h3 { margin: 0 0 .4rem; font-size: 1.05rem; }
.quote { margin: .5rem 0; padding: .4rem .7rem; border-left: 3px solid var(--accent); background: var(--surface-2); font-size: .9rem; }
.quote cite { display: block; font-style: normal; font-size: .8rem; color: var(--muted); margin-top: .2rem; }
details > summary { cursor: pointer; }
.inline-h { display: inline; }
@media (max-width: 560px) { .kv-list { grid-template-columns: 1fr; } }

/* ---------- Standortmuster ---------- */
.pattern-index { display: flex; flex-wrap: wrap; gap: .4rem; margin: 1rem 0; }
.chip { padding: .25rem .6rem; border-radius: 999px; border: 1px solid var(--line); background: var(--surface); text-decoration: none; font-size: .85rem; color: var(--text); }
.pattern h2 { margin: 0; }
.pattern h3 { font-size: .95rem; margin: .6rem 0 .2rem; color: var(--muted); }
.badges { display: flex; flex-wrap: wrap; gap: .3rem; }
.badge.strength-stark, .chip.strength-stark { background: var(--good-bg); color: var(--good-ink); border-color: transparent; }
.badge.strength-mittel, .chip.strength-mittel { background: var(--warn-bg); color: var(--warn-ink); border-color: transparent; }
.badge.strength-schwach, .chip.strength-schwach { background: var(--neutral-bg); color: var(--neutral-ink); }
.badge.strength-hypothese, .chip.strength-hypothese { background: var(--bad-bg); color: var(--bad-ink); }
.badge.hyp { background: var(--head-bg); color: var(--head-ink); }
.criteria { display: flex; flex-wrap: wrap; gap: .3rem; margin: .6rem 0; }
.crit { font-size: .78rem; cursor: help; }
.crit-erfuellt { background: var(--good-bg); color: var(--good-ink); }
.crit-teilweise { background: var(--warn-bg); color: var(--warn-ink); }
.crit-nicht { background: var(--bad-bg); color: var(--bad-ink); }
.crit-unbekannt { background: var(--neutral-bg); color: var(--neutral-ink); }
.jev-gehoert_dazu { color: var(--ok); font-weight: 600; }
.jev-gehoert_nicht_dazu { color: var(--bad); font-weight: 600; }
.jev-unklar { color: var(--warn-ink); }

/* ---------- Review ---------- */
.review { font-size: .78rem; background: var(--neutral-bg); color: var(--neutral-ink); }
.review-akzeptiert { background: var(--good-bg); color: var(--good-ink); }
.review-abgelehnt { background: var(--bad-bg); color: var(--bad-ink); }
.review-ueberarbeiten { background: var(--warn-bg); color: var(--warn-ink); }
.review-abgelehnt-card { opacity: .7; border-style: dashed; }
.review-box { margin-top: .6rem; border-top: 1px solid var(--line); padding-top: .5rem; }
.review-form { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; margin: .3rem 0; }
.review-form input[name=comment], .review-form input[name=reason] { flex: 1 1 18rem; }
.comments { list-style: none; padding: 0; margin: .3rem 0; }
.comments li { padding: .35rem .5rem; background: var(--surface-2); border-radius: 6px; margin-bottom: .3rem; }
.inline-remove summary { color: var(--bad); }
.inline-remove form { display: flex; gap: .3rem; margin-top: .3rem; }

@media (max-width: 720px) {
  .topbar { padding: .6rem 16px; }
  .region-hero h1 { font-size: 2rem; }
}

/* ---------- Logo und Standort-Umriss (SVG über Klassen) ---------- */
.logo .logo-arc { stroke: var(--signal); stroke-width: 2.2; stroke-linecap: round; fill: none; }
.logo .logo-arc-2 { stroke-opacity: .6; }
.logo .logo-arc-3 { stroke-opacity: .35; }
.logo .logo-beam { stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; }
.logo .logo-blip { fill: var(--signal); }
.logo .logo-origin { fill: currentColor; }
.region .region-outline { fill: var(--signal); fill-opacity: .16; stroke: var(--signal); stroke-width: 2; stroke-linejoin: round; }
.region .region-kern { fill: var(--signal); fill-opacity: .75; }
.region .region-grenzen { fill: none; stroke: var(--signal); stroke-opacity: .55; stroke-width: .8; stroke-dasharray: 2.5 1.5; }
.region-hero .region .region-outline { fill: var(--accent); stroke: var(--accent); }
.region-hero .region .region-kern { fill: var(--accent); }
.region-hero .region .region-grenzen { stroke: var(--accent); }
.tenant-chip .region .region-grenzen { display: none; }
.tenant-chip .region .region-outline { stroke-width: 6; }

/* Übersicht: Projektkarte in voller Breite, Kennzahlen gleichmäßig */
.project-list { display: flex; flex-direction: column; gap: 1rem; }
.project-card { padding: 1.5rem 1.75rem; }
.stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 1.25rem 2rem; }
.stats-grid > div { border-top: 3px solid var(--head-bg); padding-top: .6rem; }
.stats-grid dd { font-size: 2.1rem; line-height: 1.15; }
.stats-grid dd a { text-decoration: none; }
.stats-grid dd a:hover { text-decoration: underline; }

.region-hero img.emblem { width: 84px; height: auto; filter: drop-shadow(0 1px 2px rgb(0 0 0 / .18)); }

/* Kopfleiste bleibt beim Scrollen stehen (nicht auf schmalen Geräten) */
@media (min-width: 721px) { .topbar { position: sticky; top: 0; z-index: 20; } }

/* Standortprofil auf der Übersicht */
.profile-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr)); gap: 1rem; }
.profile-grid .card h2 { margin-top: 0; }
.profile-text p { margin: .2rem 0 .8rem; }
.person-list { list-style: none; padding: 0; margin: 0; }
.person-list li { padding: .45rem 0; border-bottom: 1px solid var(--line); }
.person-list li:last-child { border-bottom: 0; }
.person-list .role { display: block; font-size: .78rem; color: var(--muted); text-transform: uppercase; letter-spacing: .06em; }

/* ---------- Smartphone ---------- */
.menu-toggle, .mobile-sort { display: none; }
.mobile-sort .chip.active { border-color: var(--accent); font-weight: 600; }

@media (max-width: 720px) {
  body { font-size: 15px; }
  .page { margin: 1rem auto; }
  h1 { font-size: 1.55rem; }
  .card { padding: 1rem; }
  .project-card { padding: 1rem; }

  /* Kopfleiste: Logo, Menü-Knopf; Navigation klappt darunter auf */
  .topbar { gap: .5rem; }
  .brand-name { font-size: 1.15rem; }
  .topbar.js-menu .menu-toggle { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px;
    border-radius: 8px; border: 1px solid color-mix(in srgb, var(--bar-ink) 25%, transparent); background: transparent; color: var(--bar-ink); padding: 0; }
  .topbar.js-menu nav { display: none; }
  .topbar nav { width: 100%; flex-direction: column; align-items: stretch; gap: 0; padding-top: .4rem; }
  .topbar.js-menu.menu-open nav { display: flex; }
  .topbar nav a, .topbar nav .who, .topbar nav form.inline { padding: .65rem .2rem; border-bottom: 1px solid color-mix(in srgb, var(--bar-ink) 12%, transparent); }
  .topbar nav a[aria-current="page"] { border-bottom-color: var(--signal); }
  .topbar nav a.tenant-chip { border-radius: 8px; margin: .2rem 0 .4rem; border: 1px solid color-mix(in srgb, var(--bar-ink) 25%, transparent); }
  .topbar nav .theme-toggle { margin-top: .5rem; }

  /* Übersicht */
  .region-hero { gap: .9rem; }
  .region-hero h1 { font-size: 1.7rem; }
  .region-hero img.emblem { width: 56px; }
  .region-hero svg.region { width: 96px; height: auto; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); gap: 1rem; }
  .stats-grid dd { font-size: 1.6rem; }
  .stats { flex-wrap: wrap; gap: 1rem; }

  /* Filter untereinander, volle Breite */
  .filters input[type=search] { min-width: 0; flex: 1 1 100%; }
  .filters select { flex: 1 1 45%; min-width: 0; max-width: 100%; }
  .head-row > * { min-width: 0; max-width: 100%; }
  .head-row .filters { width: 100%; }
  .mobile-sort { display: flex; flex-wrap: wrap; gap: .35rem; align-items: center; margin: 0 0 .8rem; font-size: .85rem; color: var(--muted); }

  /* Tabellen werden Karten: jede Zeile ein Block, Spaltenname links neben dem Wert */
  .table-wrap.sticky-head { max-height: none; overflow: visible; border: 0; }
  table.cardify, table.cardify tbody, table.cardify tr, table.cardify td { display: block; width: 100%; }
  table.cardify { background: none; border: 0; }
  table.cardify thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  table.cardify tr { display: flex; flex-direction: column; }
  table.cardify td.primary { order: -1; }
  table.cardify tr { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: .6rem .8rem; margin-bottom: .7rem; }
  table.cardify td { border: 0; padding: .2rem 0; display: grid; grid-template-columns: 6.8rem minmax(0, 1fr); gap: .6rem; text-align: left; font-size: .9rem; }
  table.cardify td::before { content: attr(data-label); color: var(--muted); font: .78rem/1.55 "IBM Plex Sans", system-ui, sans-serif; padding-top: .1rem; }
  table.cardify td:not([data-label])::before { content: none; }
  table.cardify td:not([data-label]), table.cardify td.primary { display: block; }
  table.cardify td.primary { font-size: 1rem; padding-bottom: .35rem; margin-bottom: .2rem; border-bottom: 1px solid var(--line); }
  table.cardify td.primary::before { content: none; }
  table.cardify td.is-empty { display: none; }
  table.cardify td.result, table.cardify td.long { grid-template-columns: 1fr; gap: 0; }
  table.cardify tr.row-note td { display: block; }
  table.cardify td.actions { display: flex; }
  table.cardify a, table.cardify .cell { overflow-wrap: anywhere; min-width: 0; }
  .page { overflow-wrap: break-word; }
  table.companies .desc, .desc, .error-text { max-width: none; }
  table.runs td.result { min-width: 0; }
}

/* Extraktion v3: Kriterienraster, Belegstufe, Kontrolle, KI-Einordnung */
.bind-unklar, .answer-unklar { background: var(--warn-bg); color: var(--warn-ink); }
.bind-B2B, .bind-B2C, .bind-oeffentlich, .bind-gemischt { background: var(--neutral-bg); color: var(--neutral-ink); }
.answer { display: inline-block; font-size: .8rem; padding: .05rem .4rem; border-radius: 4px; }
.answer-ja { background: var(--good-bg); color: var(--good-ink); }
.answer-nein { background: var(--neutral-bg); color: var(--neutral-ink); }
.raster { margin: .5rem 0; }
.raster-table { width: 100%; border-collapse: collapse; margin-top: .4rem; }
.raster-table td { vertical-align: top; padding: .35rem .5rem; border-top: 1px solid var(--line); }
.raster-table td:first-child { width: 28%; }
.raster-table td:nth-child(2) { width: 18%; }
.raster-table .quote { margin: 0 0 .3rem; }
.badge.level-stark { background: var(--good-bg); color: var(--good-ink); }
.badge.level-mittel { background: var(--warn-bg); color: var(--warn-ink); }
.badge.level-zu_pruefen { background: var(--bad-bg); color: var(--bad-ink); }
.check-beanstandet { color: var(--bad-ink); }
div.check-beanstandet { background: var(--bad-bg); padding: .4rem .6rem; border-radius: 4px; margin: .3rem 0; }
ol.levels { margin: 0; padding-left: 1.2rem; }
ol.levels li { margin: .1rem 0; }
.ai-context { border: 1px dashed var(--line); border-radius: 6px; padding: .4rem .7rem; margin: .5rem 0; }
.ai-context p { margin: .2rem 0; }
@media (max-width: 700px) {
  .raster-table td { display: block; width: auto !important; border-top: none; padding: .2rem 0; }
  .raster-table tr { display: block; border-top: 1px solid var(--line); padding: .3rem 0; }
}
@media print {
  header, nav, .no-print { display: none !important; }
  .anhang-entry { break-inside: avoid; }
}

/* Prüfliste: Schnelleingabe Einstufung */
.pruef-item { padding: .6rem .9rem; }
.pruef-item h3 { margin: 0; font-size: 1rem; }
.pruef-item p { margin: .25rem 0; }
.pruef-done { opacity: .65; }
.einstufung-form { display: flex; flex-wrap: wrap; gap: .4rem .6rem; align-items: flex-end; margin-top: .4rem; }
.einstufung-form label { display: flex; flex-direction: column; gap: .1rem; }
.einstufung-form input[name=note] { flex: 2 1 16rem; }
.einstufung-form input[name=source_url] { flex: 1 1 10rem; }
.manual-note { font-size: .8rem; color: var(--muted); }

/* DEMO-Mandant */
.demo-tag { display: inline-block; font-size: .68rem; font-weight: 700; letter-spacing: .12em; padding: .05rem .4rem;
  border-radius: 4px; background: #f2c230; color: #1b1b1b; vertical-align: middle; }
.demo-banner { background: repeating-linear-gradient(135deg, #f2c230 0 14px, #f6d566 14px 28px); color: #1b1b1b;
  padding: .35rem 1rem; font-size: .85rem; text-align: center; }
.motto { font-style: italic; margin: .1rem 0 .3rem; color: var(--muted); }
@media print { .demo-banner { background: none; border: 1px solid #000; } }

/* FMO: Passungsmatrix und Passungen */
.notice.warn { background: var(--warn-bg); color: var(--warn-ink); }
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: .8rem; margin: .6rem 0; }
.kpis > div { display: flex; flex-direction: column; gap: .15rem; }
.kpis strong { font-size: 1.5rem; }
.grid2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 1rem; }
.fit-badge { display: inline-block; min-width: 1.8em; text-align: center; font-weight: 700; font-size: .8rem;
  padding: .05rem .35rem; border-radius: 4px; }
.fit-hi { background: var(--good-ink); color: var(--good-bg); }
.fit-good { background: var(--good-bg); color: var(--good-ink); }
.fit-mid { background: var(--warn-bg); color: var(--warn-ink); }
.fit-low { background: var(--neutral-bg); color: var(--neutral-ink); }
.fit-none { color: var(--muted, #888); }
table.fmo-matrix td.fit { text-align: center; font-weight: 600; font-variant-numeric: tabular-nums; }
table.fmo-matrix th.mt { font-size: .75rem; font-weight: 600; max-width: 6.5rem; white-space: normal; text-align: center; }
table.fmo-matrix td.fit-none { font-weight: 400; opacity: .55; }
.fmo-match { border-top: 1px solid var(--line); padding: .6rem 0; }
.fmo-match .head-row { align-items: baseline; flex-wrap: wrap; gap: .4rem; }
.fmo-match q { font-style: italic; }

/* Navigation: Suche */
.nav-search input { width: 9rem; padding: .25rem .5rem; font-size: .85rem; border-radius: 6px; border: 1px solid var(--bar-muted);
  background: transparent; color: var(--bar-ink); }
.nav-search input::placeholder { color: var(--bar-muted); }
.search-list { list-style: none; padding: 0; margin: 0; }
.search-list li { padding: .4rem 0; border-top: 1px solid var(--line); }
.search-list li:first-child { border-top: 0; }

/* FMO: Diagramme (SVG, Breiten als Attribute wegen CSP) */
svg.chart { width: 100%; height: auto; display: block; }
svg.chart .lbl { font-size: 12px; fill: var(--text); }
svg.chart .val { font-size: 11px; fill: var(--muted); }
svg.chart a:hover .lbl { text-decoration: underline; }
svg.chart .bar { fill: var(--neutral-ink); }
svg.chart .bar.fit-hi { fill: var(--good-ink); }
svg.chart .bar.fit-good { fill: color-mix(in srgb, var(--good-ink) 65%, var(--surface)); }
svg.chart .bar.fit-mid { fill: color-mix(in srgb, var(--warn-ink) 55%, var(--surface)); }
svg.chart .bar.fit-low { fill: color-mix(in srgb, var(--neutral-ink) 45%, var(--surface)); }
.kpis .of { font-size: .9rem; font-weight: 400; color: var(--muted); }

/* FMO: Heatmap-Matrix mit Regler */
.fmo-controls { align-items: center; }
.fmo-controls .slider { display: inline-flex; align-items: center; gap: .4rem; font-size: .9rem; }
.fmo-controls .slider input { width: 12rem; accent-color: var(--accent); }
.fmo-controls output { font-weight: 700; min-width: 1.4em; }
.fmo-controls .check { display: inline-flex; align-items: center; gap: .3rem; font-size: .85rem; }
table.heat td.fit { transition: background-color .15s, opacity .15s; }
table.heat td.heat-1, table.heat td.heat-2 { background: color-mix(in srgb, var(--good-ink) 10%, var(--surface)); }
table.heat td.heat-3, table.heat td.heat-4 { background: color-mix(in srgb, var(--good-ink) 22%, var(--surface)); }
table.heat td.heat-5 { background: color-mix(in srgb, var(--good-ink) 34%, var(--surface)); }
table.heat td.heat-6 { background: color-mix(in srgb, var(--good-ink) 44%, var(--surface)); }
table.heat td.heat-7 { background: color-mix(in srgb, var(--good-ink) 56%, var(--surface)); color: var(--surface); }
table.heat td.heat-8 { background: color-mix(in srgb, var(--good-ink) 68%, var(--surface)); color: var(--surface); }
table.heat td.heat-9 { background: color-mix(in srgb, var(--good-ink) 82%, var(--surface)); color: var(--surface); }
table.heat td.heat-10 { background: var(--good-ink); color: var(--surface); }
table.heat td.heat-0 { opacity: .45; font-weight: 400; }
table.heat.no-heat td.fit { background: transparent; color: var(--text); }
table.heat td.fit.below { background: transparent; color: var(--muted); opacity: .3; }

/* FMO: Umschalter, Modellseite, Vergleich */
.fmo-switch .leitfrage, .leitfrage { font-style: italic; border-left: 3px solid var(--accent); padding-left: .6rem; margin: .4rem 0; }
.fmo-switch .chip.active, .badges .chip.active { background: var(--accent); color: var(--accent-ink); border-color: var(--accent); }
dl.kv { display: grid; grid-template-columns: max-content 1fr; gap: .2rem .8rem; margin: 0; }
dl.kv dt { color: var(--muted); }
dl.kv dd { margin: 0; }
.grid-models { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: .8rem; margin: .8rem 0; }
ul.plain { list-style: none; padding: 0; margin: .2rem 0 0; }
table.fmo-compare td { vertical-align: top; min-width: 12rem; }
.pre-line { white-space: pre-line; }

/* FMO: Balken als HTML-Raster (Text skaliert nicht mit, lange Namen brechen um) */
.hbars { display: grid; grid-template-columns: minmax(7rem, 15rem) 1fr minmax(5.5rem, auto); gap: .35rem .7rem; align-items: center; }
.hbar-row { display: contents; color: var(--text); text-decoration: none; }
.hbar-row:hover .hbar-label { text-decoration: underline; }
.hbar-label { font-size: .9rem; line-height: 1.2; overflow-wrap: anywhere; }
svg.hbar { width: 100%; height: 1.1rem; display: block; background: var(--surface-2); border-radius: 3px; }
.hbar-val { font-size: .8rem; color: var(--muted); white-space: nowrap; }
.vbars { display: grid; grid-template-columns: repeat(10, 1fr); gap: .5rem; align-items: end; height: 14rem; }
.vbar { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; justify-items: center; height: 100%; min-height: 0; }
.vbar svg { width: 70%; height: 100%; min-height: 0; display: block; overflow: hidden; }
.vbar-val { font-size: .8rem; color: var(--muted); min-height: 1.1em; }
.vbar-lbl { font-size: .85rem; margin-top: .2rem; }
svg.hbar .bar, .vbar svg .bar { fill: var(--neutral-ink); }
svg.hbar .bar.fit-hi, .vbar svg .bar.fit-hi { fill: var(--good-ink); }
svg.hbar .bar.fit-good, .vbar svg .bar.fit-good { fill: color-mix(in srgb, var(--good-ink) 65%, var(--surface)); }
svg.hbar .bar.fit-mid, .vbar svg .bar.fit-mid { fill: color-mix(in srgb, var(--warn-ink) 55%, var(--surface)); }
svg.hbar .bar.fit-low, .vbar svg .bar.fit-low { fill: color-mix(in srgb, var(--neutral-ink) 45%, var(--surface)); }
@media (max-width: 640px) { .hbars { grid-template-columns: minmax(6rem, 9rem) 1fr auto; } }

/* Admin */
.admin-tile { text-decoration: none; color: var(--text); display: block; }
.admin-tile:hover { border-color: var(--accent); }
.admin-nav { margin: .4rem 0 1rem; }
pre.log { white-space: pre-wrap; word-wrap: break-word; font: .8rem/1.45 "JetBrains Mono", ui-monospace, Consolas, monospace;
  max-height: 50vh; overflow: auto; background: var(--surface-2); padding: .6rem; border-radius: 6px; margin: 0; }
.status-laeuft, .status-bestaetigt { background: var(--info-bg); color: var(--info-ink); }
.status-fehler, .status-abgebrochen, .status-abbruch_angefordert { background: var(--bad-bg); color: var(--bad-ink); }
.status-geplant { background: var(--warn-bg); color: var(--warn-ink); }

/* Sicherheit */
.security-head { display: flex; gap: 1.2rem; align-items: center; flex-wrap: wrap; }
.score-box { min-width: 8rem; text-align: center; border-radius: var(--radius); padding: .8rem 1rem; background: var(--good-bg); color: var(--good-ink); }
.score-box.score-C, .score-box.score-D { background: var(--warn-bg); color: var(--warn-ink); }
.score-box.score-E { background: var(--bad-bg); color: var(--bad-ink); }
.score-note { font-size: 2.6rem; font-weight: 700; line-height: 1; }
.score-num { font-size: 1.2rem; font-weight: 600; }
.checklist { list-style: none; padding: 0; margin: 0; }
.checklist li { padding: .3rem 0; border-top: 1px solid var(--line); }
.checklist li:first-child { border-top: 0; }
.checklist .mark { display: inline-block; width: 1.4em; font-weight: 700; }
.checklist .ok .mark { color: var(--ok); }
.checklist .nok .mark { color: var(--bad); }
.day-bars { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(1.2rem, 1fr); gap: .3rem; align-items: end; height: 10rem; overflow-x: auto; }
.day-bar { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; justify-items: center; height: 100%; min-height: 0; }
.day-bar svg { width: 70%; height: 100%; min-height: 0; display: block; }
.day-bar svg .bar { fill: color-mix(in srgb, var(--accent) 70%, var(--surface)); }
.day-bar .vbar-lbl { font-size: .7rem; }