/* ----------------------------------------------------------------------------
 * ResQware Design System
 * Font/Color/Spacing tokens and component styles.
 * Target: Desktop 1280px+. Below 1024px a mobile gate takes over.
 * -------------------------------------------------------------------------- */

:root {
  /* Primary palette --------------------------------------------------- */
  --resq-navy:       #1a2744;
  --resq-navy-dark:  #111c33;
  --resq-navy-mid:   #2d4a7a;
  --resq-navy-950:   #0d1526;
  --resq-red:        #cc2222;
  --resq-red-light:  #fce8e8;

  /* UI greys ---------------------------------------------------------- */
  --resq-bg:              #f0f2f5;
  --resq-surface:         #ffffff;
  --resq-border:          #e5e7eb;
  --resq-border-strong:   #d1d5db;

  /* Text -------------------------------------------------------------- */
  --resq-text-primary:    #111827;
  --resq-text-secondary:  #6b7280;
  --resq-text-muted:      #9ca3af;
  --resq-text-on-dark:    #e5e7eb;
  --resq-text-on-dark-muted: #94a3b8;

  /* Status ------------------------------------------------------------ */
  --resq-blue:           #378add;
  --resq-blue-bg:        #e6f1fb;
  --resq-green:          #3b6d11;
  --resq-green-bg:       #eaf3de;
  --resq-amber:          #ba7517;
  --resq-amber-bg:       #faeeda;
  --resq-red-status:     #a32d2d;
  --resq-red-status-bg:  #fcebeb;

  /* Layout metrics ---------------------------------------------------- */
  --resq-sidebar-width: 220px;
  --resq-topbar-height: 48px;

  /* Shadows (subtle; no "card lift" look) ----------------------------- */
  --resq-shadow-sm: 0 1px 0 rgba(17, 24, 39, 0.04);
  --resq-shadow-md: 0 1px 2px rgba(17, 24, 39, 0.05),
                    0 1px 1px rgba(17, 24, 39, 0.04);
  --resq-shadow-menu: 0 10px 20px -10px rgba(17, 24, 39, 0.25),
                      0 4px 10px -6px rgba(17, 24, 39, 0.1);

  /* Radii (restrained; behördentauglich) ------------------------------ */
  --resq-radius-sm: 3px;
  --resq-radius:    5px;
  --resq-radius-lg: 8px;
}

/* Reset --------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: 'DM Sans', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  font-size: 14px;
  line-height: 1.5;
  color: var(--resq-text-primary);
  background: var(--resq-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
a { color: inherit; text-decoration: none; }
button { font-family: inherit; cursor: pointer; }
input, select, textarea { font-family: inherit; font-size: inherit; color: inherit; }

/* Typography ---------------------------------------------------------- */
.resq-display { font-family: 'Syne', sans-serif; font-weight: 500; letter-spacing: -0.01em; }
.resq-page-title {
  font-family: 'Syne', sans-serif;
  font-weight: 500;
  font-size: 16px;
  letter-spacing: -0.01em;
  margin: 0;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.resq-label {
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--resq-text-secondary);
}
.resq-muted { color: var(--resq-text-secondary); }
.resq-muted-light { color: var(--resq-text-muted); }

/* Formular-Beschreibung (Anzeige beim Ausfüllen) ----------------------- */
.resq-form-desc {
  color: var(--resq-text-primary);
  background: var(--resq-blue-bg);
  border: 1px solid var(--resq-blue);
  border-left-width: 4px;
  border-radius: 6px;
  padding: 12px 14px;
  font-size: 14px;
  line-height: 1.55;
}
/* „Beschreibung umrahmen" abgeschaltet: gleicher Kontrast, ohne Kasten. */
.resq-form-desc--plain {
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
}

/* Schriftgrößen aus dem Mini-Rich-Text-Editor (apps/forms/richtext.py) -- */
.resq-rt-sm { font-size: 0.85em; }
.resq-rt-lg { font-size: 1.3em; }
.resq-rt-xl { font-size: 1.6em; }

/* Scrollbar (WebKit) -------------------------------------------------- */
.resq-scroll::-webkit-scrollbar,
main::-webkit-scrollbar { width: 10px; height: 10px; }
.resq-scroll::-webkit-scrollbar-track,
main::-webkit-scrollbar-track { background: transparent; }
.resq-scroll::-webkit-scrollbar-thumb,
main::-webkit-scrollbar-thumb {
  background: var(--resq-border-strong);
  border-radius: 5px;
  border: 2px solid var(--resq-bg);
}
.resq-scroll::-webkit-scrollbar-thumb:hover,
main::-webkit-scrollbar-thumb:hover { background: #a6adba; }

/* ----------------------------------------------------------------------------
 * App shell: sidebar + topbar + main
 * -------------------------------------------------------------------------- */
.resq-app {
  display: grid;
  grid-template-columns: var(--resq-sidebar-width) 1fr;
  grid-template-rows: auto auto 1fr;
  grid-template-areas:
    "sidebar topbar"
    "sidebar actionbar"
    "sidebar main";
  min-height: 100vh;
}

.resq-sidebar {
  grid-area: sidebar;
  background: var(--resq-navy);
  color: var(--resq-text-on-dark);
  display: flex;
  flex-direction: column;
  border-right: 1px solid var(--resq-navy-950);
  position: sticky;
  top: 0;
  height: 100vh;
}
.resq-back-link {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 16px 6px;
  font-size: 11px;
  line-height: 1;
  color: rgba(255,255,255,0.55);
  letter-spacing: 0.02em;
  white-space: nowrap;
  transition: color .12s ease;
}
.resq-back-link:hover { color: rgba(255,255,255,0.95); }
.resq-back-link__icon { width: 12px; height: 12px; flex-shrink: 0; display: block; }
.resq-back-link__text { white-space: nowrap; }
.resq-sidebar__brand {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 16px 14px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.resq-sidebar__brand-mark {
  width: 24px; height: 24px;
  display: inline-flex;
  align-items: center; justify-content: center;
  color: var(--resq-red);
  flex-shrink: 0;
}
.resq-app-mark {
  width: 26px; height: 26px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--resq-red);
  color: #fff;
  border-radius: 6px;
  flex-shrink: 0;
}
.resq-sidebar__brand-text {
  font-family: 'Syne', sans-serif;
  font-weight: 500;
  font-size: 15px;
  letter-spacing: 0.01em;
  color: #ffffff;
  line-height: 1.2;
}
.resq-sidebar__brand-sub {
  font-size: 10px;
  color: rgba(255,255,255,0.4);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-top: 2px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.resq-sidebar__org {
  font-size: 11px;
  color: var(--resq-text-on-dark-muted);
  padding: 6px 16px 12px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

.resq-sidebar__nav {
  flex: 1;
  overflow-y: auto;
  /* Explizit: die Sidebar scrollt NIE seitlich. Ohne diese Zeile leitet der
     Browser aus `overflow-y: auto` ein `overflow-x: auto` ab — ein einzelnes
     zu langes Label erzeugt dann eine horizontale Scrollleiste in der Nav. */
  overflow-x: hidden;
  padding: 6px 8px 12px;
}
.resq-nav-group { padding: 10px 8px 4px; }
.resq-nav-group__label {
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--resq-text-on-dark-muted);
  padding: 6px 8px;
}
/* Beta-Gruppe: die Überschrift trägt die Kennzeichnung, nicht jeder Eintrag.
   Eigener Amber-Ton — `--resq-amber` ist für helle Flächen gedacht und auf
   dem Navy der Sidebar zu dunkel. */
.resq-nav-group__label--beta { color: #f5c451; }

/* Label in Sidebar-Einträgen und Gruppen-Togglern.
 *
 * `min-width: 0` hebt die automatische Mindestbreite von Flex-Items auf,
 * `overflow-wrap: anywhere` erlaubt zusätzlich das Brechen einzelner langer
 * Wörter. Ohne beides kann ein Wort wie „Abrechnungsprüfung" nicht schrumpfen
 * und schiebt den Eintrag über die 220 px der Sidebar hinaus.
 *
 * `hyphens: auto` (mit <html lang="de">) setzt die Trennung bei deutschen
 * Komposita an eine sinnvolle Stelle statt mitten in die Silbe. Der Text
 * bleibt dabei immer vollständig lesbar — es wird nichts abgeschnitten.
 */
.resq-nav-label {
  min-width: 0;
  overflow-wrap: anywhere;
  -webkit-hyphens: auto;
  hyphens: auto;
}

/* Aufklappbare Sidebar-Gruppe */
.resq-nav-group--collapsible { padding-top: 10px; }
.resq-nav-group__toggle {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  padding: 6px 8px;
  background: transparent;
  border: 0;
  cursor: pointer;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--resq-text-on-dark-muted);
  text-align: left;
  border-radius: var(--resq-radius);
  transition: color 0.12s ease, background-color 0.12s ease;
}
.resq-nav-group__toggle:hover {
  color: var(--resq-text-on-dark);
  background: rgba(255, 255, 255, 0.04);
}
.resq-nav-group__chevron {
  width: 12px;
  height: 12px;
  flex-shrink: 0;
  transition: transform 0.15s ease;
}
.resq-nav-group__chevron.is-open { transform: rotate(90deg); }

/* Deaktivierter Sidebar-Eintrag (App existiert noch nicht) */
.resq-nav-item--disabled {
  opacity: 0.5;
  cursor: default;
  pointer-events: auto;
}
.resq-nav-item--disabled:hover { background: transparent; }
.resq-nav-item__soon {
  margin-left: auto;
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--resq-text-on-dark-muted);
  background: rgba(255, 255, 255, 0.06);
  padding: 2px 6px;
  border-radius: 3px;
}
.resq-nav-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 10px;
  font-size: 13px;
  border-radius: var(--resq-radius);
  color: var(--resq-text-on-dark);
  transition: background-color 0.12s ease, color 0.12s ease;
}
.resq-nav-item:hover { background: var(--resq-navy-dark); }
.resq-nav-item.is-active {
  background: var(--resq-navy-dark);
  color: #ffffff;
  box-shadow: inset 2px 0 0 var(--resq-red);
}
.resq-nav-item__icon {
  width: 16px; height: 16px;
  flex-shrink: 0;
  opacity: 0.85;
}
.resq-nav-item.is-active .resq-nav-item__icon { opacity: 1; }
.resq-nav-badge {
  margin-left: auto;
  min-width: 18px;
  height: 18px;
  padding: 0 6px;
  border-radius: 9px;
  background: var(--resq-red);
  color: #ffffff;
  font-size: 10px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

.resq-sidebar__footer {
  padding: 10px 12px 14px;
  border-top: 1px solid var(--resq-navy-dark);
  background: var(--resq-navy-950);
}
.resq-storage {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 4px 4px 10px;
}
.resq-storage__label {
  display: flex; justify-content: space-between;
  font-size: 11px;
  color: var(--resq-text-on-dark-muted);
}
.resq-storage__bar {
  height: 4px;
  background: rgba(255,255,255,0.08);
  border-radius: 999px;
  overflow: hidden;
}
.resq-storage__fill {
  display: block;
  height: 100%;
  background: var(--resq-blue);
  transition: width 0.2s ease;
}
.resq-storage--warn .resq-storage__fill { background: var(--resq-amber); }
.resq-storage--crit .resq-storage__fill { background: var(--resq-red); }

.resq-user-chip {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px;
  border-radius: var(--resq-radius);
  color: var(--resq-text-on-dark);
}
.resq-user-chip:hover { background: var(--resq-navy-dark); }
.resq-avatar {
  width: 28px; height: 28px;
  border-radius: 999px;
  background: var(--resq-navy-mid);
  color: #fff;
  display: inline-flex;
  align-items: center; justify-content: center;
  font-size: 11px;
  font-weight: 500;
  flex-shrink: 0;
  overflow: hidden;
}
.resq-avatar img { width: 100%; height: 100%; object-fit: cover; }
.resq-user-chip__meta { line-height: 1.2; overflow: hidden; }
.resq-user-chip__name { font-size: 13px; color: #fff; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.resq-user-chip__role { font-size: 11px; color: var(--resq-text-on-dark-muted); }

/* Topbar -------------------------------------------------------------- */
.resq-topbar {
  grid-area: topbar;
  background: var(--resq-surface);
  border-bottom: 1px solid var(--resq-border);
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 6px 20px;
  min-height: var(--resq-topbar-height);
  position: sticky;
  top: 0;
  z-index: 20;
}
.resq-topbar__title {
  flex: 1; min-width: 0;
  display: flex; flex-direction: column;
  align-items: flex-start; justify-content: center; gap: 1px;
}
.resq-topbar__actions { display: flex; align-items: center; gap: 8px; }

/* Action-Bar (Sub-Topbar) — seiten-spezifische Buttons unter dem Header.
   Verhindert horizontales Scrollen auf schmalen Displays (z. B. 13"),
   wenn Topbar + Suche + Aktionen + User-Menü zusammen zu breit werden.
   Container ist immer im DOM, `:empty` versteckt ihn auf Seiten ohne
   Aktionen — keine zusätzliche Höhe. */
.resq-actionbar {
  grid-area: actionbar;
  background: var(--resq-surface);
  border-bottom: 1px solid var(--resq-border);
  padding: 8px 20px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  position: sticky;
  top: var(--resq-topbar-height);
  z-index: 19;
}
.resq-actionbar:empty { display: none; }

/* Main ---------------------------------------------------------------- */
.resq-main {
  grid-area: main;
  overflow-y: auto;
  padding: 24px 28px;
}
.resq-content-narrow { max-width: 960px; }

/* ----------------------------------------------------------------------------
 * Components
 * -------------------------------------------------------------------------- */

/* Breadcrumb */
.resq-breadcrumb {
  display: flex; align-items: center; gap: 6px;
  font-size: 12px; color: var(--resq-text-secondary);
}
.resq-breadcrumb__sep { color: var(--resq-text-muted); }
.resq-breadcrumb__item { color: var(--resq-text-secondary); }
.resq-breadcrumb__item--current { color: var(--resq-text-primary); font-weight: 500; }

/* Card / surface */
.resq-card {
  background: var(--resq-surface);
  border: 1px solid var(--resq-border);
  border-radius: var(--resq-radius);
  box-shadow: var(--resq-shadow-sm);
}
.resq-card__header {
  padding: 12px 16px;
  border-bottom: 1px solid var(--resq-border);
  display: flex; justify-content: space-between; align-items: center;
}
.resq-card__body { padding: 16px; }
.resq-card__title { font-size: 14px; font-weight: 500; margin: 0; }

/* Buttons */
.resq-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: var(--resq-radius);
  border: 1px solid var(--resq-border-strong);
  background: var(--resq-surface);
  color: var(--resq-text-primary);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.4;
  transition: background-color .12s ease, border-color .12s ease;
}
.resq-btn:hover { background: #f9fafb; border-color: #b8bfcc; }
.resq-btn--primary {
  background: var(--resq-navy);
  color: #fff;
  border-color: var(--resq-navy);
}
.resq-btn--primary:hover { background: var(--resq-navy-dark); border-color: var(--resq-navy-dark); }
.resq-btn--danger {
  background: var(--resq-red);
  color: #fff;
  border-color: var(--resq-red);
}
.resq-btn--danger:hover { background: var(--resq-red-status); border-color: var(--resq-red-status); }
.resq-btn--ghost {
  background: transparent;
  border-color: transparent;
  color: var(--resq-text-secondary);
}
.resq-btn--ghost:hover { background: #f3f4f6; color: var(--resq-text-primary); }
.resq-btn--sm { padding: 4px 8px; font-size: 12px; }
.resq-btn__icon { width: 14px; height: 14px; }

/* Tables */
.resq-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 13px;
}
.resq-table thead th {
  text-align: left;
  font-weight: 500;
  color: var(--resq-text-secondary);
  padding: 8px 12px;
  background: #f7f8fa;
  border-bottom: 1px solid var(--resq-border);
  position: sticky; top: 0;
}
.resq-table tbody td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--resq-border);
}
.resq-table tbody tr:hover { background: #fafbfc; }
.resq-table tbody tr:last-child td { border-bottom: none; }

/* Forms */
.resq-form-row { display: flex; flex-direction: column; gap: 4px; margin-bottom: 14px; }
.resq-form-row__label {
  font-size: 12px;
  font-weight: 500;
  color: var(--resq-text-primary);
}
.resq-input, .resq-select, .resq-textarea {
  width: 100%;
  padding: 8px 10px;
  border: 1px solid var(--resq-border-strong);
  border-radius: var(--resq-radius);
  background: var(--resq-surface);
  font-size: 13px;
  color: var(--resq-text-primary);
  transition: border-color .12s ease, box-shadow .12s ease;
}
.resq-input:focus, .resq-select:focus, .resq-textarea:focus {
  outline: none;
  border-color: var(--resq-navy-mid);
  box-shadow: 0 0 0 3px rgba(45, 74, 122, 0.15);
}
.resq-form-help { font-size: 12px; color: var(--resq-text-secondary); }
.resq-form-error { font-size: 12px; color: var(--resq-red-status); }

/* Badges */
.resq-badge {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.02em;
}
.resq-badge--info   { background: var(--resq-blue-bg);       color: var(--resq-blue); }
.resq-badge--ok     { background: var(--resq-green-bg);      color: var(--resq-green); }
.resq-badge--warn   { background: var(--resq-amber-bg);      color: var(--resq-amber); }
.resq-badge--danger { background: var(--resq-red-status-bg); color: var(--resq-red-status); }
.resq-badge--neutral{ background: #f3f4f6;                   color: var(--resq-text-secondary); }

/* Toast container (Alpine-driven) */
.resq-toast-stack {
  position: fixed;
  bottom: 20px; right: 20px;
  display: flex; flex-direction: column; gap: 8px;
  z-index: 50;
}
.resq-toast {
  background: var(--resq-surface);
  border: 1px solid var(--resq-border);
  border-left-width: 3px;
  border-left-color: var(--resq-navy-mid);
  box-shadow: var(--resq-shadow-menu);
  padding: 10px 14px;
  min-width: 260px;
  max-width: 420px;
  border-radius: var(--resq-radius);
  font-size: 13px;
}
.resq-toast--ok    { border-left-color: var(--resq-green); }
.resq-toast--warn  { border-left-color: var(--resq-amber); }
.resq-toast--error { border-left-color: var(--resq-red); }

/* AVV: in den Vertragstext eingesetzte bzw. noch fehlende Stammdaten */
.resq-avv-filled {
  background: rgba(24, 95, 165, 0.10);
  color: var(--resq-navy);
  font-weight: 600;
  border-radius: 3px;
  padding: 0 3px;
}
.resq-avv-missing {
  background: var(--resq-red-status-bg);
  color: var(--resq-red-status);
  font-weight: 600;
  border-radius: 3px;
  padding: 0 3px;
}
.resq-avv-neutral { color: var(--resq-text-muted); }

/* Funkskizzen-Wizard + Editor */
.fs-step {
  display: inline-flex; align-items: center;
  padding: 6px 12px; border-radius: 6px;
  font-size: 12px; font-weight: 500; text-decoration: none;
  border: 1px solid var(--resq-border);
  background: var(--resq-surface); color: var(--resq-text-muted);
}
.fs-step--active { border-color: var(--resq-navy); color: var(--resq-navy); background: rgba(24,95,165,0.06); font-weight: 600; }
.fs-step--done { color: var(--resq-green); border-color: rgba(34,197,94,0.4); }
.fs-canvas { border: 1px solid var(--resq-border); border-radius: 8px; background:
  linear-gradient(#f8fafc 1px, transparent 1px), linear-gradient(90deg, #f8fafc 1px, transparent 1px);
  background-size: 24px 24px; background-color: #fff; }
.fs-radio-card { display: flex; align-items: flex-start; gap: 10px; padding: 12px 14px;
  border: 1px solid var(--resq-border); border-radius: 8px; cursor: pointer; margin-bottom: 8px; }
.fs-radio-card:hover { border-color: var(--resq-navy); }
.fs-fg-chip { display: inline-flex; align-items: center; gap: 6px; padding: 3px 9px;
  border-radius: 14px; font-size: 12px; border: 1px solid var(--resq-border); background: var(--resq-surface); }
.fs-fg-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
.fs-canvas--editable .fs-node { cursor: grab; }
.fs-canvas--editable .fs-node text { -webkit-user-select: none; user-select: none; }
.fs-node--dragging { cursor: grabbing; }
.fs-node--dragging * { filter: drop-shadow(0 3px 5px rgba(15,23,42,0.25)); }

/* Modal */
.resq-modal-backdrop {
  position: fixed; inset: 0;
  background: rgba(13, 21, 38, 0.45);
  display: flex; align-items: center; justify-content: center;
  z-index: 40;
}
.resq-modal {
  background: var(--resq-surface);
  border-radius: var(--resq-radius-lg);
  box-shadow: var(--resq-shadow-menu);
  width: 480px; max-width: calc(100% - 48px);
  max-height: calc(100vh - 48px);
  display: flex; flex-direction: column;
  overflow: hidden;
}
.resq-modal__header {
  padding: 14px 18px;
  border-bottom: 1px solid var(--resq-border);
  display: flex; justify-content: space-between; align-items: center;
  flex-shrink: 0;
}
.resq-modal__body {
  padding: 18px;
  flex: 1 1 auto;
  overflow-y: auto;
  min-height: 0;
}
.resq-modal__footer {
  padding: 12px 18px;
  border-top: 1px solid var(--resq-border);
  display: flex; justify-content: flex-end; gap: 8px;
  flex-shrink: 0;
}

/* Empty state */
.resq-empty {
  display: flex; flex-direction: column; align-items: center;
  justify-content: center;
  text-align: center;
  padding: 48px 24px;
  color: var(--resq-text-secondary);
}
.resq-empty__icon {
  width: 44px; height: 44px;
  color: var(--resq-text-muted);
  margin-bottom: 12px;
}
.resq-empty__title { font-size: 14px; font-weight: 500; color: var(--resq-text-primary); }
.resq-empty__sub { font-size: 13px; margin-top: 4px; }

/* Auth / marketing centered layouts */
.resq-centered {
  min-height: 100vh;
  display: flex; align-items: center; justify-content: center;
  background: var(--resq-bg);
  padding: 24px;
}
.resq-auth-card {
  background: var(--resq-surface);
  border: 1px solid var(--resq-border);
  border-radius: var(--resq-radius-lg);
  box-shadow: var(--resq-shadow-md);
  width: 400px; max-width: 100%;
  padding: 28px;
  margin-left: auto;
  margin-right: auto;
}
.resq-auth-card__brand {
  display: flex; align-items: center; gap: 8px;
  margin-bottom: 18px;
  color: var(--resq-navy);
}
.resq-auth-card__brand strong {
  font-family: 'Syne', sans-serif;
  font-weight: 600;
  font-size: 16px;
}
/* Generische Form-Styles für die Auth-Card (Login, 2FA, allauth/MFA-
   Self-Service). Greift auch für allauth-Element-Templates, die rohe
   <input>/<textarea>/<select> ohne resq-Klassen ausgeben. */
.resq-auth-card form input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
.resq-auth-card form textarea,
.resq-auth-card form select {
  width: 100%;
  padding: 8px 10px;
  border: 1px solid var(--resq-border-strong);
  border-radius: var(--resq-radius);
  background: var(--resq-surface);
  font-size: 14px;
}
.resq-auth-card form input:focus,
.resq-auth-card form textarea:focus,
.resq-auth-card form select:focus {
  outline: none;
  border-color: var(--resq-navy-mid);
  box-shadow: 0 0 0 3px rgba(45, 74, 122, .15);
}
.resq-auth-card form label { display: block; font-size: 13px; margin-bottom: 4px; }
.resq-auth-card .resq-form-row { margin-bottom: 14px; }
.resq-auth-card section.resq-card { width: 100%; }

/* Marketing shell (resqware.de) */
.resq-marketing { background: #fff; color: var(--resq-text-primary); }
.resq-marketing__nav {
  max-width: 1180px; margin: 0 auto;
  padding: 20px 24px;
  display: flex; align-items: center; justify-content: space-between;
}
.resq-marketing__hero {
  max-width: 960px; margin: 0 auto;
  padding: 80px 24px 64px;
  text-align: left;
}
.resq-marketing__hero h1 {
  font-family: 'Syne', sans-serif;
  font-weight: 600;
  font-size: 44px;
  line-height: 1.1;
  margin: 0 0 18px;
  letter-spacing: -0.02em;
}
.resq-marketing__hero p {
  font-size: 16px;
  color: var(--resq-text-secondary);
  max-width: 560px;
}

/* ============================================================================
 * Globale Suche — Trigger + Modal
 * ============================================================================
 * Hierher verschoben aus base.html (war früher inline im Body, hat dort die
 * Mobile-Overrides via Cascade überschrieben).
 * --------------------------------------------------------------------------- */

/* Such-Trigger im Header (kompakter Button, der das Modal öffnet) */
.resq-gs-trigger-wrap { margin: 0 12px; }
.resq-gs-trigger {
  display: inline-flex; align-items: center; gap: 6px;
  background: #f5f7fb; border: 1px solid var(--resq-border);
  border-radius: 8px; padding: 5px 10px; cursor: pointer;
  font-size: 13px; color: #667; transition: all .1s;
  min-width: 200px;
}
.resq-gs-trigger:hover { background: #fff; border-color: var(--resq-navy); color: var(--resq-navy); }
.resq-gs-trigger > span { flex: 1; text-align: left; }
.resq-gs-trigger__kbd {
  background: #fff; border: 1px solid var(--resq-border); border-radius: 4px;
  padding: 1px 5px; font-size: 10px; font-family: inherit; color: #667;
}

/* Such-Modal */
.resq-search-modal-backdrop {
  position: fixed; inset: 0; background: rgba(15, 23, 42, 0.45);
  display: flex; align-items: flex-start; justify-content: center;
  padding-top: 12vh; z-index: 100;
}
.resq-search-modal {
  background: #fff; border-radius: 12px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
  width: 100%; max-width: 600px; margin: 0 16px;
  display: flex; flex-direction: column;
  max-height: 70vh;
}
.resq-search-modal .resq-gs__wrap {
  border-radius: 12px 12px 0 0; border-bottom: 1px solid var(--resq-border);
  border-left: 0; border-right: 0; border-top: 0; padding: 8px 14px;
  background: #fff;
}
.resq-gs__results--modal {
  position: static !important; margin-top: 0 !important; border: 0 !important;
  border-radius: 0 0 12px 12px !important; box-shadow: none !important;
  flex: 1; min-height: 0;
}

.resq-gs { position: relative; flex: 1; max-width: 480px; margin: 0 12px; }
.resq-gs__wrap {
  display: flex; align-items: center; gap: 6px;
  background: #f5f7fb; border: 1px solid var(--resq-border);
  border-radius: 8px; padding: 4px 8px;
  transition: border-color .1s;
}
.resq-gs__wrap:focus-within { border-color: var(--resq-navy); background: #fff; }
.resq-gs__icon { width: 16px; height: 16px; color: #667; flex-shrink: 0; }
.resq-gs__input {
  flex: 1; border: 0; background: transparent; outline: none;
  font-size: 13px; padding: 6px 2px; min-width: 0;
}
.resq-gs__camera {
  background: transparent; border: 0; padding: 4px 6px; cursor: pointer;
  color: #667; border-radius: 4px; display: flex; align-items: center;
}
.resq-gs__camera:hover { background: rgba(0,0,0,0.05); color: var(--resq-navy); }
.resq-gs__results {
  position: absolute; top: 100%; left: 0; right: 0; margin-top: 4px;
  background: #fff; border: 1px solid var(--resq-border); border-radius: 8px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.12); max-height: 70vh; overflow-y: auto;
  z-index: 50;
}
.resq-gs__loading, .resq-gs__empty {
  padding: 16px; font-size: 13px; color: #667; text-align: center;
}
.resq-gs__group { padding: 4px 0; }
.resq-gs__group + .resq-gs__group { border-top: 1px solid var(--resq-border); }
.resq-gs__group-label {
  font-size: 10px; text-transform: uppercase; letter-spacing: 0.08em;
  color: #889; padding: 8px 12px 4px; font-weight: 600;
}
.resq-gs__item {
  display: block; padding: 6px 12px; text-decoration: none; color: inherit;
}
.resq-gs__item:hover { background: #f5f7fb; }
.resq-gs__item-label { font-size: 13px; color: var(--resq-text); }
.resq-gs__item-sub { font-size: 11px; color: #889; margin-top: 1px; }
.resq-gs__camera-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,0.55); z-index: 200;
  display: flex; align-items: center; justify-content: center;
}
.resq-gs__camera-box {
  background: #fff; border-radius: 10px; overflow: hidden; width: 92%; max-width: 420px;
}
.resq-gs__camera-header {
  display: flex; justify-content: space-between; align-items: center;
  padding: 10px 14px; border-bottom: 1px solid var(--resq-border);
  font-weight: 500; font-size: 14px;
}
.resq-gs__camera-box video { width: 100%; height: auto; background: #000; display: block; }


/* ============================================================================
 * Mobile-Foundation
 * ============================================================================
 *
 * Bis 1023 px: Sidebar wird zum Slide-In-Drawer, Topbar bekommt Hamburger-Icon,
 * Layouts stacken (grid-2/3/4 → 1 Spalte), Modals sind fullscreen.
 *
 * Hamburger ist auf Desktop versteckt; Backdrop ebenfalls.
 * --------------------------------------------------------------------------- */

/* Bilder/Videos respektieren ihren Container */
img, video, svg, canvas, iframe { max-width: 100%; height: auto; }

/* Hamburger + Backdrop default versteckt */
.resq-topbar__hamburger {
  display: none;
  background: transparent;
  border: 0;
  padding: 8px;
  margin-right: 4px;
  cursor: pointer;
  color: var(--resq-text);
  border-radius: 6px;
  align-items: center;
  justify-content: center;
}
.resq-topbar__hamburger:hover { background: rgba(0,0,0,0.05); }
.resq-mobile-backdrop {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(13,21,38,0.55);
  z-index: 35;
}

/* === Grid-Utilities (Default — Desktop) ====================================
   Diese Default-Regeln müssen VOR dem @media-Mobile-Block stehen, damit die
   Mobile-Overrides bei gleicher Selektor-Spezifität gewinnen (späterer Wins).
   ============================================================================ */
.resq-grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.resq-grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.resq-grid-4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }

/* === Tablet & Mobile: ≤ 1023 px ============================================ */
@media (max-width: 1023px) {

  /* Globaler Overflow-Schutz nur auf Mobile: nichts horizontal raushängen
     lassen. Auf Desktop NICHT setzen — `overflow-x: hidden` auf html/body
     bricht `position: sticky` (Sidebar scrollt sonst mit).
     Einzelne Container, die echtes horizontales Scrollen brauchen
     (Tabellen, Chips), kapseln das selbst über `overflow-x: auto`. */
  html, body { overflow-x: hidden; max-width: 100vw; }

  /* App-Grid wird 1-spaltig — Sidebar ist nicht mehr Layout-Bestandteil,
     sondern overlayt als Drawer. */
  .resq-app {
    grid-template-columns: 1fr;
    grid-template-areas:
      "topbar"
      "actionbar"
      "main";
  }
  /* Auf Mobile kompakter — kleinere Buttons fühlen sich richtiger an. */
  .resq-actionbar { padding: 6px 10px; gap: 6px; }

  /* Sidebar als Drawer */
  .resq-sidebar {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: var(--resq-sidebar-width);
    z-index: 40;
    transform: translateX(-100%);
    transition: transform 0.22s ease;
    box-shadow: 4px 0 16px rgba(0,0,0,0.12);
    height: 100vh;
  }
  .is-mobile-nav-open .resq-sidebar { transform: translateX(0); }
  .is-mobile-nav-open .resq-mobile-backdrop { display: block; }

  /* Hamburger sichtbar machen */
  .resq-topbar__hamburger { display: inline-flex; }

  /* Topbar wird sticky am Top und passt sich dem Viewport an.
     KEIN overflow:hidden — sonst werden Dropdowns (Profilmenü) abgeschnitten.
     Statt dessen werden Title-Container und Page-Title für sich trunkiert. */
  .resq-topbar {
    position: sticky;
    top: 0;
    z-index: 25;
    background: var(--resq-surface);
    border-bottom: 1px solid var(--resq-border);
    padding: 0 10px;
    gap: 6px;
    min-width: 0;
  }
  .resq-topbar__title { min-width: 0; flex: 1 1 0; overflow: hidden; }
  .resq-page-title { font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
  .resq-topbar__actions { gap: 4px; flex-shrink: 0; }
  /* Such-Trigger als reine Lupe (Icon-Button) auf Mobile.
     Wrap fest auf 36 px begrenzen — sonst dehnt der Default-CSS-flex-Slot
     den Container und drückt den Page-Title weg. */
  .resq-gs-trigger-wrap {
    margin: 0;
    padding: 0;
    flex: 0 0 36px;
    width: 36px;
    max-width: 36px;
    min-width: 36px;
  }
  .resq-gs-trigger {
    min-width: 0;
    width: 36px; height: 36px;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .resq-gs-trigger:hover { background: rgba(0,0,0,0.05); }
  .resq-gs-trigger > span { display: none; }
  .resq-gs-trigger__kbd { display: none; }
  .resq-gs-trigger > svg { width: 18px; height: 18px; }

  /* Breadcrumb auf Mobile ausblenden — Page-Title reicht */
  .resq-breadcrumb { display: none; }

  /* Main-Content padding angepasst, sonst overflow */
  .resq-main { padding: 12px; min-width: 0; max-width: 100%; }
  .resq-main > * { max-width: 100%; }

  /* Grids stacken — kompakte Stats (.resq-grid-4) bleiben 2×2,
     große Detail-Splits (.resq-grid-2, -3) gehen auf 1 Spalte. */
  .resq-grid-2, .resq-grid-3 { grid-template-columns: 1fr; gap: 12px; }
  .resq-grid-4 { grid-template-columns: 1fr 1fr; gap: 10px; }
  /* Stat-Karten in .resq-grid-4 kompakter Padding */
  .resq-grid-4 .resq-card__body { padding: 12px; }

  /* Inline-Grids global auf 1 Spalte zwingen — fängt fast alle Templates
     mit `style="display:grid;grid-template-columns:1fr 320px"` etc. ab.
     Templates, die bewusst auf Mobile mehrspaltig bleiben sollen, müssen
     einen Klassen-Override mit höherer Spezifität setzen. */
  [style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  /* Inline grid-column-Spans (z. B. "1 / span 2") fügen sich auf Mobile
     in den Single-Column-Flow ein. */
  [style*="grid-column"] { grid-column: 1 / -1 !important; }

  /* Inline flex mit horizontalem Layout darf umbrechen */
  [style*="display:flex"]:not(.bb-fab):not(.resq-fab) {
    flex-wrap: wrap;
  }

  /* Inline-Styles mit fester `width:NNNpx` auf 100 % begrenzen */
  [style*="width:480px"], [style*="width: 480px"],
  [style*="width:560px"], [style*="width: 560px"],
  [style*="width:600px"], [style*="width: 600px"],
  [style*="width:640px"], [style*="width: 640px"],
  [style*="width:720px"], [style*="width: 720px"],
  [style*="width:780px"], [style*="width: 780px"],
  [style*="width:800px"], [style*="width: 800px"],
  [style*="width:960px"], [style*="width: 960px"] {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Inline-Styles mit min-width:NNNpx ebenso entschärfen */
  [style*="min-width:200px"], [style*="min-width: 200px"],
  [style*="min-width:240px"], [style*="min-width: 240px"],
  [style*="min-width:260px"], [style*="min-width: 260px"],
  [style*="min-width:280px"], [style*="min-width: 280px"],
  [style*="min-width:320px"], [style*="min-width: 320px"] {
    min-width: 0 !important;
  }

  /* Form-Elemente mit inline-width-style: pauschal 100 %.
     Fängt alle Filter-Forms (Lager, Personal, Schichtplan) zuverlässig ab. */
  input[style*="width:"],
  select[style*="width:"],
  textarea[style*="width:"] {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Modals fullscreen */
  .resq-modal {
    width: 100%;
    max-width: 100%;
    max-height: 100vh;
    height: 100vh;
    border-radius: 0;
  }
  .resq-modal-backdrop { padding: 0; align-items: stretch; }

  /* Tabellen scrollen horizontal in einem WRAPPER, nicht in der Card selbst.
     Das verhindert dass der gesamte Card-Inhalt scrollt. */
  .resq-card table {
    display: block;
    overflow-x: auto;
    width: 100%;
    -webkit-overflow-scrolling: touch;
  }

  /* Topbar-User-Menü: Avatar nur, Email versteckt */
  .resq-topbar__actions .resq-btn span:not([class]) { display: none; }
  .resq-user-chip__name, .resq-user-chip__role { display: none; }

  /* Forms: Inputs bleiben mind. 16px (iOS-Anti-Zoom) */
  input, select, textarea { font-size: 16px; }

  /* Touch-Targets ≥ 38 px für interaktive Elemente */
  .resq-btn { min-height: 38px; padding: 8px 14px; }
  .resq-btn--sm { min-height: 32px; padding: 6px 10px; }
  .resq-nav-item { padding-top: 10px; padding-bottom: 10px; }

  /* Inline-Elemente, die Texte mit fester Breite haben, brechen sauber um */
  pre, code { white-space: pre-wrap; word-break: break-word; }

  /* Cards selbst verhindern overflow */
  .resq-card { overflow: hidden; }

  /* ===========================================================================
   * Lagerverwaltung (Inventory) — Mobile-Anpassungen
   * ===========================================================================
   * - Bereichs-Kacheln stacken (.resq-inv-areas)
   * - Inv-Tabellen als Card-Layout (scoped per body-data-attr oder direkt)
   * ----------------------------------------------------------------------- */

  /* Bereichs-Kacheln auf Mobile in 1 Spalte */
  .resq-inv-areas {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }

  /* Inventar-Tabellen als Card-Layout. Wir scopen über `.resq-table`
     INNERHALB einer `inventory`-Seite über data-Attribut auf <body>.
     Templates können opt-out via `.resq-table--keep-rows`. */
  body[data-mod="inventory"] .resq-table:not(.resq-table--keep-rows) thead { display: none; }
  body[data-mod="inventory"] .resq-table:not(.resq-table--keep-rows),
  body[data-mod="inventory"] .resq-table:not(.resq-table--keep-rows) tbody,
  body[data-mod="inventory"] .resq-table:not(.resq-table--keep-rows) tr,
  body[data-mod="inventory"] .resq-table:not(.resq-table--keep-rows) td {
    display: block;
    width: 100%;
  }
  body[data-mod="inventory"] .resq-card .resq-table:not(.resq-table--keep-rows) {
    overflow-x: visible;
  }
  body[data-mod="inventory"] .resq-table:not(.resq-table--keep-rows) tr {
    border-bottom: 1px solid var(--resq-border);
    padding: 12px 14px;
  }
  body[data-mod="inventory"] .resq-table:not(.resq-table--keep-rows) tr:last-child {
    border-bottom: 0;
  }
  body[data-mod="inventory"] .resq-table:not(.resq-table--keep-rows) td {
    padding: 3px 0;
    border: 0;
    font-size: 13px;
  }
  /* Erste Zelle (meist Inventar-Nr. oder Datum) als Badge in eigener Zeile */
  body[data-mod="inventory"] .resq-table:not(.resq-table--keep-rows) td:first-child {
    font-weight: 500;
    margin-bottom: 4px;
  }

  /* Section-Heads (Cards mit Untertabellen) padding zurück */
  .resq-inv-section-head { padding: 10px 14px; font-size: 13px; }

  /* ===========================================================================
   * Drive (ResQDrive) — Mobile-Card-Layout
   * ===========================================================================
   * Tabellen-Struktur bleibt für a11y/Sort, wird aber als vertikale Karten
   * gerendert. Scope: nur `#drive-files`, damit andere Tabellen unberührt
   * bleiben.
   * ----------------------------------------------------------------------- */

  /* Header verstecken auf Mobile */
  #drive-files thead { display: none; }
  /* Tabelle, body, rows, cells alle als block */
  #drive-files,
  #drive-files tbody,
  #drive-files tr,
  #drive-files td { display: block; width: 100%; min-width: 0; }
  /* Tabelle nicht horizontal scrollen */
  .resq-card #drive-files { overflow-x: visible; }

  /* Jede Zeile = eine Card */
  #drive-files tr {
    border-bottom: 1px solid var(--resq-border);
    padding: 12px 14px;
    position: relative;
    min-height: 0;
  }
  #drive-files tr:last-child { border-bottom: 0; }
  #drive-files td { padding: 0; border: 0; }

  /* Spalte 1 (Icon): absolut links oben */
  #drive-files td:nth-child(1) {
    position: absolute;
    top: 12px; left: 14px;
    width: 36px;
    display: flex; align-items: center; justify-content: center;
  }
  #drive-files .resq-file-icon { width: 36px; height: 36px; font-size: 9px; font-weight: 700; }

  /* Spalte 2 (Name + Uploader): rechts vom Icon */
  #drive-files td:nth-child(2) {
    margin-left: 48px;
    margin-bottom: 6px;
    min-height: 36px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  #drive-files td:nth-child(2) a {
    font-size: 14px;
    line-height: 1.3;
    word-break: break-word;
  }

  /* Spalte 3 (Klassifizierung): inline mit Größe + Datum als Meta-Zeile */
  #drive-files td:nth-child(3),
  #drive-files td:nth-child(4),
  #drive-files td:nth-child(5) {
    display: inline-block;
    margin-right: 8px;
    margin-left: 48px;
    font-size: 11px;
  }
  #drive-files td:nth-child(3) { margin-left: 48px; margin-bottom: 4px; }
  #drive-files td:nth-child(4),
  #drive-files td:nth-child(5) { margin-left: 0; color: var(--resq-text-muted); }

  /* Spalte 6 (Aktionen): unten in eigener Zeile, immer sichtbar */
  #drive-files td:nth-child(6) {
    margin-left: 48px;
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid var(--resq-border);
  }
  /* Action-Buttons immer anzeigen — kein hover-only auf Touch */
  #drive-files .resq-row-actions {
    opacity: 1 !important;
    flex-wrap: wrap;
    gap: 6px;
  }
  #drive-files .resq-row-actions .resq-btn {
    min-height: 36px;
    padding: 6px 10px;
  }

  /* Drop-Zone kompakter auf Mobile, Klassifizierungs-Select darunter */
  .resq-dropzone {
    flex-direction: column;
    padding: 16px 14px !important;
    text-align: center;
    font-size: 13px;
  }

  /* Drive-Suche: feste 260px-Breite aus inline-style entschärfen */
  input[name="q"][hx-trigger] {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Topbar-Actions im Drive: Buttons als Icons, Text auf "+ Neu" / "↑" verkürzen */
  .resq-topbar__actions .resq-btn {
    padding: 8px 10px;
  }
  /* Auf sehr schmalem Mobile Button-Text verstecken (nur SVG bleibt) */
}

/* === Schmales Mobile: ≤ 480 px ============================================== */
@media (max-width: 480px) {
  .resq-main { padding: 10px 8px; }
  .resq-card__body { padding: 14px; }
  .resq-page-title { font-size: 15px; }
  /* Sidebar nimmt fast den gesamten Bildschirm */
  .resq-sidebar { width: 86vw; max-width: 280px; }

  /* Topbar-Buttons mit Text: Text verstecken, nur Icon auf sehr schmal */
  .resq-topbar__actions .resq-btn:not(.resq-btn--ghost) {
    font-size: 0;
    padding: 8px 10px;
  }
  .resq-topbar__actions .resq-btn:not(.resq-btn--ghost) .resq-btn__icon {
    width: 16px; height: 16px;
  }
}

/* Utility helpers used in templates ---------------------------------- */
.resq-flex { display: flex; }
.resq-flex-between { display: flex; justify-content: space-between; align-items: center; }
.resq-gap-2 { gap: 8px; } .resq-gap-3 { gap: 12px; } .resq-gap-4 { gap: 16px; }
.resq-mt-2 { margin-top: 8px; } .resq-mt-3 { margin-top: 12px; } .resq-mt-4 { margin-top: 16px; } .resq-mt-6 { margin-top: 24px; }
.resq-mb-2 { margin-bottom: 8px; } .resq-mb-4 { margin-bottom: 16px; } .resq-mb-6 { margin-bottom: 24px; }
/* Grid-Defaults entfernt — werden direkt vor dem @media-Mobile-Block
   definiert, damit Mobile-Overrides bei gleicher Spezifität gewinnen. */

/* ===========================================================================
 * Such-Dropdown / Combobox (static/js/searchable-select.js)
 * Natives <select> bleibt Formularfeld (display:none, submittet weiter);
 * sichtbar sind Textfeld + live gefilterte Trefferliste.
 * ======================================================================== */
.resq-combo { position: relative; }
.resq-combo__native { display: none; }
.resq-combo__input { width: 100%; cursor: text; }
.resq-combo.is-open .resq-combo__input {
  border-color: var(--resq-navy-mid);
  box-shadow: 0 0 0 3px rgba(45, 74, 122, .15);
}
.resq-combo__list {
  position: absolute; z-index: 50; left: 0; right: 0; top: calc(100% + 2px);
  max-height: 260px; overflow-y: auto;
  background: var(--resq-surface);
  border: 1px solid var(--resq-border-strong);
  border-radius: var(--resq-radius);
  box-shadow: var(--resq-shadow-md);
}
.resq-combo__opt {
  padding: 7px 10px; font-size: 13px; cursor: pointer;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.resq-combo__opt:hover,
.resq-combo__opt.is-active { background: #eff3f9; }
.resq-combo__opt.is-sel { font-weight: 600; color: var(--resq-navy); }
.resq-combo__none {
  padding: 8px 10px; font-size: 12px; color: var(--resq-text-muted);
}

/* ResQDrive — Virenscan / Quarantäne */
@keyframes resq-spin { to { transform: rotate(360deg); } }
.resq-scan-pending { opacity: .8; }
.resq-scan-pending td { background: var(--resq-surface-muted, rgba(0,0,0,.02)); }
.resq-section-title { font-weight: 600; color: var(--resq-text-primary); }

/* ── Erste Schritte (Onboarding-Checkliste auf dem Dashboard) ───────────── */
.resq-onboarding { border-left: 4px solid var(--resq-navy-mid); }

.resq-onboarding__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.resq-onboarding__title {
  font-family: Syne, sans-serif;
  font-weight: 600;
  font-size: 16px;
  color: var(--resq-text-primary);
}
.resq-onboarding__lead { margin: 2px 0 0; font-size: 13px; line-height: 1.5; }
.resq-onboarding__count {
  font-family: Syne, sans-serif;
  font-size: 22px;
  font-weight: 600;
  color: var(--resq-navy-mid);
  line-height: 1;
  white-space: nowrap;
}
.resq-onboarding__count span { font-size: 14px; color: var(--resq-text-muted); }

.resq-onboarding__bar {
  height: 6px;
  border-radius: 999px;
  background: var(--resq-border);
  overflow: hidden;
  margin: 12px 0 4px;
}
.resq-onboarding__bar span {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: var(--resq-navy-mid);
  transition: width .3s ease;
}

.resq-onboarding__list { list-style: none; margin: 0; padding: 0; }
.resq-onboarding__step {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--resq-border);
}
.resq-onboarding__step:last-child { border-bottom: 0; padding-bottom: 0; }

.resq-onboarding__mark {
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  margin-top: 1px;
  border-radius: 999px;
  border: 2px solid var(--resq-border-strong);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.resq-onboarding__mark svg { width: 12px; height: 12px; }
.resq-onboarding__step.is-done .resq-onboarding__mark {
  background: #1f7a5a;
  border-color: #1f7a5a;
}

.resq-onboarding__text { flex: 1 1 auto; min-width: 0; }
.resq-onboarding__label {
  display: block;
  font-size: 14px;
  font-weight: 500;
  color: var(--resq-text-primary);
  text-decoration: none;
}
a.resq-onboarding__label { color: var(--resq-navy-mid); }
a.resq-onboarding__label:hover { text-decoration: underline; }
.resq-onboarding__step.is-done .resq-onboarding__label {
  color: var(--resq-text-secondary);
}
.resq-onboarding__hint {
  display: block;
  font-size: 12px;
  line-height: 1.45;
  color: var(--resq-text-secondary);
  margin-top: 2px;
}
.resq-onboarding__state {
  flex: 0 0 auto;
  font-size: 11px;
  letter-spacing: .4px;
  text-transform: uppercase;
  color: #1f7a5a;
  padding-top: 3px;
}

@media (max-width: 640px) {
  .resq-onboarding__state { display: none; }
}

/* Alpine: mit x-cloak markierte Elemente bleiben verborgen, bis Alpine
   initialisiert ist (die CDN-Einbindung lädt mit defer). */
[x-cloak] { display: none !important; }

/* ---------------------------------------------------------------------------
   Abrechnungsprüfung — PDF-Layout-Editor
   Die linke Spalte bildet das PDF aus den Wortkoordinaten nach (kein Bild,
   kein Rendering-Backend): jedes Wort ist ein absolut positioniertes,
   anklickbares Element.
--------------------------------------------------------------------------- */
/* `.resq-main` trägt `overflow-y: auto`, wächst aber mit dem Inhalt und
   scrollt deshalb nie selbst — gescrollt wird das Fenster. Für `position:
   sticky` ist es trotzdem der nächste Scrollport, und ein Scrollport ohne
   Scrollweg lässt nichts kleben. Nur für die Editor-Seiten wird es deshalb
   wieder durchlässig gemacht, damit die Sticky-Spalten am Fenster hängen.
   (Die funktionierenden Stickies der Shell — Sidebar, Topbar — liegen
   außerhalb von `.resq-main` und waren davon nie betroffen.) */
.resq-main:has(.abr-editor),
.resq-main:has(.abr-regel-editor) { overflow: visible; }

.abr-editor {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 400px;
  gap: 16px;
  align-items: start;
}
/* Die PDF-Spalte bleibt stehen, die rechte Spalte (Vorschlags-/Regellisten
   werden lang) scrollt daran vorbei. Offset = sticky Topbar + Luft.
   Die Höhenbegrenzung ist Pflicht: Eine Spalte, die höher ist als das
   Sichtfeld, kann nicht oben kleben — sie wäre immer angeschnitten. */
.abr-editor__pdf {
  position: sticky;
  top: calc(var(--resq-topbar-height) + 12px);
  align-self: start;
  max-height: calc(100vh - var(--resq-topbar-height) - 24px);
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.abr-editor__seite { min-width: 0; }

.abr-pdf-scroll {
  flex: 1 1 auto;
  min-height: 120px;
  overflow: auto;
  background: var(--resq-bg-subtle, #f3f4f6);
  border: 1px solid var(--resq-border, #e5e7eb);
  border-radius: 8px;
  padding: 12px;
}
.abr-pdf-seite {
  position: relative;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .18);
  margin: 0 auto 16px;
  overflow: hidden;
}
.abr-pdf-seite:last-child { margin-bottom: 0; }

.abr-pdf-wort {
  position: absolute;
  white-space: nowrap;
  line-height: 1;
  cursor: pointer;
  border-radius: 2px;
  padding: 0 1px;
  color: #111827;
  user-select: none;
}
.abr-pdf-wort:hover { background: #dbeafe; outline: 1px solid #60a5fa; }
.abr-pdf-wort--belegt { background: #dcfce7; box-shadow: inset 0 -2px 0 #16a34a; }
.abr-pdf-wort--vorschlag { background: #ede9fe; box-shadow: inset 0 -2px 0 #7c3aed; }
.abr-pdf-wort--aktiv {
  background: #2563eb;
  color: #fff;
  outline: 1px solid #1d4ed8;
}
/* Trennstriche des Formularrahmens: sichtbar, aber nicht anklickbar —
   sie sind nie eine Beschriftung und waren als Klickziel nur Rauschen. */
.abr-pdf-wort--deko {
  color: #d1d5db;
  cursor: default;
  pointer-events: none;
  user-select: none;
}

/* Im PDF gezeichnetes Formularraster — die echte Feldstruktur. */
.abr-pdf-raster {
  position: absolute;
  border: 1px solid #cbd5e1;
  border-radius: 2px;
  pointer-events: none;
  z-index: 0;
}

/* Suchbereich eines Feldwerts. Liegt hinter den Wörtern, damit die
   Beschriftungen klickbar bleiben. */
.abr-pdf-kasten {
  position: absolute;
  border: 1px solid #60a5fa;
  background: rgba(96, 165, 250, .10);
  border-radius: 3px;
  pointer-events: none;
  z-index: 0;
}
/* Noch nicht übernommener Vorschlag — gleiche Geometrie, andere Farbe. */
.abr-pdf-kasten--vorschlag {
  border-color: #a78bfa;
  border-style: dashed;
  background: rgba(167, 139, 250, .10);
}
.abr-pdf-kasten--vorschlag .abr-pdf-kasten__name { background: #a78bfa; }
.abr-pdf-kasten--leer {
  border-style: dashed;
  border-color: #f59e0b;
  background: rgba(245, 158, 11, .10);
}
.abr-pdf-kasten__name {
  position: absolute;
  left: 0;
  bottom: 100%;
  font-size: 8px;
  line-height: 1.3;
  padding: 0 3px;
  border-radius: 2px 2px 0 0;
  background: #60a5fa;
  color: #fff;
  white-space: nowrap;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}
.abr-pdf-kasten--leer .abr-pdf-kasten__name { background: #f59e0b; }

.abr-legende {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  align-items: center;
  font-size: 11px;
}
.abr-legende__schalter { display: flex; gap: 5px; align-items: center; font-weight: 500; }
.abr-legende__punkt { display: flex; gap: 5px; align-items: center; color: var(--resq-text-muted, #6b7280); }
.abr-legende__probe { width: 12px; height: 12px; border-radius: 3px; display: inline-block; }
.abr-legende__probe--zugeordnet { background: #dcfce7; box-shadow: inset 0 -2px 0 #16a34a; }
.abr-legende__probe--vorschlag { background: #ede9fe; box-shadow: inset 0 -2px 0 #7c3aed; }
.abr-legende__probe--kasten { border: 1px solid #60a5fa; background: rgba(96, 165, 250, .18); }
.abr-legende__probe--leer { border: 1px dashed #f59e0b; background: rgba(245, 158, 11, .18); }
.abr-pdf-seitenzahl {
  position: absolute;
  right: 6px;
  bottom: 4px;
  font-size: 10px;
  color: #9ca3af;
  pointer-events: none;
}

/* Regel-Editor (Abrechenbarkeit) */
.abr-regel-editor {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 380px;
  gap: 16px;
  align-items: start;
}
.abr-regel-editor__seite {
  position: sticky;
  top: calc(var(--resq-topbar-height) + 12px);
  align-self: start;
  max-height: calc(100vh - var(--resq-topbar-height) - 24px);
  overflow-y: auto;
}
.abr-feldlabel {
  display: block;
  font-size: 12px;
  font-weight: 500;
  margin: 12px 0 4px;
}
.abr-feldlabel:first-child { margin-top: 0; }
.abr-hinweis { font-size: 11px; line-height: 1.45; margin-top: 4px; }
.abr-zwei-spalten {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
  margin-top: 12px;
}
.abr-bedingungen th { font-size: 11px; }
.abr-bedingungen td { vertical-align: top; padding-top: 6px; padding-bottom: 6px; }
.abr-bedingungen select,
.abr-bedingungen input[type="text"] { font-size: 12px; }

@media (max-width: 1100px) {
  .abr-regel-editor { grid-template-columns: minmax(0, 1fr); }
  .abr-regel-editor__seite {
    position: static;
    max-height: none;
    overflow-y: visible;
  }
}

/* Aufklappbare Kurzanleitung über dem Editor. */
.abr-hilfe > summary {
  cursor: pointer;
  padding: 10px 14px;
  font-size: 13px;
  font-weight: 600;
  list-style-position: inside;
}
.abr-hilfe[open] > summary { border-bottom: 1px solid var(--resq-border, #e5e7eb); }
.abr-hilfe__inhalt { font-size: 13px; line-height: 1.55; max-width: 78ch; }
.abr-hilfe__inhalt h3 {
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--resq-text-muted, #6b7280);
  margin: 18px 0 6px;
}
.abr-hilfe__inhalt h3:first-child { margin-top: 0; }
.abr-hilfe__inhalt p { margin: 0 0 8px; }
.abr-hilfe__inhalt ul,
.abr-hilfe__inhalt ol { margin: 0 0 8px; padding-left: 20px; }
.abr-hilfe__inhalt li { margin-bottom: 4px; }
.abr-hilfe__inhalt code {
  font-size: 12px;
  background: var(--resq-bg-subtle, #f3f4f6);
  border-radius: 3px;
  padding: 1px 4px;
}
.abr-hilfe__punkt {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin-right: 4px;
  vertical-align: baseline;
}

@media (max-width: 1100px) {
  /* Einspaltig steht die Vorschau über dem Formular — sticky würde das
     Formular überdecken statt es zu begleiten. */
  .abr-editor { grid-template-columns: minmax(0, 1fr); }
  .abr-editor__pdf {
    position: static;
    max-height: none;
    display: block;
  }
  .abr-pdf-scroll { max-height: 60vh; }
}

/* ---------------------------------------------------------------------------
   Formulare — Feld-Anhänge (PDF/Bild) im Modal
   Der Button steht in der Antwort-Maske unter Frage/Hinweis; das Modal baut
   `static/js/forms-attachment.js` zur Laufzeit. Ohne JS bleibt der Button ein
   normaler Link in einen neuen Tab.
--------------------------------------------------------------------------- */
.resq-attach-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 4px 0 10px;
  padding: 6px 12px;
  border: 1px solid var(--resq-border, #e2e8f0);
  border-radius: 6px;
  background: #f8fafc;
  color: var(--resq-navy, #1e3a5f);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.3;
  text-decoration: none;
  cursor: pointer;
}
.resq-attach-btn:hover { background: #eef2f7; border-color: #cbd5e1; }
.resq-attach-btn__icon { font-size: 15px; }

.resq-attach-modal {
  width: min(960px, 94vw);
  max-width: 94vw;
  height: min(88vh, 1100px);
  padding: 0;
  border: 0;
  border-radius: 10px;
  box-shadow: 0 18px 48px rgba(15, 23, 42, 0.28);
  overflow: hidden;
}
.resq-attach-modal::backdrop { background: rgba(15, 23, 42, 0.55); }
.resq-attach-modal__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--resq-border, #e2e8f0);
  background: #fff;
}
.resq-attach-modal__title {
  font-size: 13px;
  font-weight: 600;
  color: var(--resq-text, #0f172a);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.resq-attach-modal__actions { display: flex; gap: 6px; flex-shrink: 0; }
.resq-attach-modal__body {
  height: calc(100% - 49px);
  background: #f1f5f9;
  overflow: auto;
  text-align: center;
}
.resq-attach-modal__body iframe {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}
.resq-attach-modal__body img {
  max-width: 100%;
  height: auto;
  margin: 0 auto;
  display: block;
}

@media (max-width: 640px) {
  .resq-attach-modal { width: 100vw; max-width: 100vw; height: 100vh; border-radius: 0; }
}

/* ----------------------------------------------------------------------------
   Mini-Rich-Text-Editor (static/js/richtext.js)
   Fett / kursiv / unterstrichen für Formular-Texte. Die Fläche ist eine
   contenteditable-DIV; das eigentliche Formularfeld (.resq-rt__source) wird
   ausgeblendet und beim Tippen mitgeschrieben.
---------------------------------------------------------------------------- */
.resq-rt {
  border: 1px solid var(--resq-border, #e2e8f0);
  border-radius: 4px;
  background: #fff;
  overflow: hidden;
}
.resq-rt:focus-within { border-color: var(--resq-navy, #1e3a5f); }

.resq-rt__bar {
  display: flex;
  gap: 2px;
  padding: 3px 4px;
  background: #f8fafc;
  border-bottom: 1px solid var(--resq-border, #e2e8f0);
}
.resq-rt__btn {
  min-width: 26px;
  height: 24px;
  padding: 0 6px;
  border: 1px solid transparent;
  border-radius: 3px;
  background: transparent;
  color: #475569;
  font-family: inherit;
  font-size: 13px;
  line-height: 1;
  cursor: pointer;
}
.resq-rt__btn:hover { background: #eef2f7; border-color: #cbd5e1; }
.resq-rt__btn.is-active {
  background: #e2e8f0;
  border-color: #cbd5e1;
  color: var(--resq-navy, #1e3a5f);
}
.resq-rt__btn.is-bold { font-weight: 700; }
.resq-rt__btn.is-italic { font-style: italic; }
.resq-rt__btn.is-underline { text-decoration: underline; }
.resq-rt__size {
  margin-left: 6px;
  height: 24px;
  padding: 0 4px;
  border: 1px solid transparent;
  border-radius: 3px;
  background: transparent;
  color: #475569;
  font-family: inherit;
  font-size: 12px;
  cursor: pointer;
}
.resq-rt__size:hover { background: #eef2f7; border-color: #cbd5e1; }

.resq-rt__area {
  min-height: 34px;
  padding: 6px 8px;
  font-size: 13px;
  font-family: inherit;
  line-height: 1.5;
  outline: none;
  overflow-wrap: anywhere;
}
.resq-rt--block .resq-rt__area { min-height: 92px; }
.resq-rt__area:empty::before {
  content: attr(data-placeholder);
  color: var(--resq-text-muted, #94a3b8);
}
/* Das Original-Feld bleibt im DOM (Absenden, Validierung), aber unsichtbar.
   Element + Klasse, damit ein späteres `.resq-input` im Seiten-<style> die
   Maße nicht zurücksetzt. */
textarea.resq-rt__source {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  border: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
}
.resq-rt.is-invalid { border-color: var(--resq-red, #dc2626); }
.resq-rt__error {
  margin-top: 4px;
  font-size: 12px;
  color: var(--resq-red, #dc2626);
}

/* Einsatztagebuch / Vierfachvordruck — Klick-Bedienung (lage/_tagebuch_inhalt.html) */
.tb-form { display: grid; gap: 14px; }
.tb-form__zeile { display: grid; grid-template-columns: 70px 1fr; gap: 10px; align-items: center; }
.tb-form__vonan { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.tb-form textarea.resq-input { min-height: 96px; font-size: 15px; }
.tb-form input.resq-input { font-size: 15px; }
.tb-fehler { color: var(--resq-red); font-size: 13px; margin: 4px 0 0 0; }
.tb-seg { display: inline-flex; flex-wrap: wrap; gap: 6px; }
.tb-seg__btn {
  min-height: 40px; padding: 8px 18px; border-radius: var(--resq-radius);
  border: 2px solid var(--resq-border-strong); background: var(--resq-surface);
  color: var(--resq-text-primary); font-size: 14px; font-weight: 600; cursor: pointer;
}
.tb-seg__btn:hover { background: #f9fafb; }
.tb-seg__btn[aria-pressed="true"] { color: #fff; }
.tb-seg__btn--meldung[aria-pressed="true"]      { background: var(--resq-blue);  border-color: var(--resq-blue); }
.tb-seg__btn--entscheidung[aria-pressed="true"] { background: var(--resq-green); border-color: var(--resq-green); }
.tb-seg__btn--auftrag[aria-pressed="true"]      { background: var(--resq-amber); border-color: var(--resq-amber); }
.tb-seg__btn--vermerk[aria-pressed="true"]      { background: var(--resq-navy);  border-color: var(--resq-navy); }
.tb-seg__btn--eingang[aria-pressed="true"]      { background: var(--resq-blue);  border-color: var(--resq-blue); }
.tb-seg__btn--ausgang[aria-pressed="true"]      { background: var(--resq-navy);  border-color: var(--resq-navy); }
.tb-chips { display: grid; gap: 4px; margin-top: 6px; }
.tb-chips__gruppe { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }
.tb-chips__titel { font-size: 10px; text-transform: uppercase; letter-spacing: .05em; color: var(--resq-text-muted); min-width: 56px; }
.tb-chip {
  min-height: 30px; padding: 4px 10px; border-radius: 999px; font-size: 12px; font-weight: 500;
  border: 1px solid var(--resq-border-strong); background: var(--resq-surface); color: var(--resq-text-primary); cursor: pointer;
}
.tb-chip:hover { background: #f3f4f6; }
.tb-chip[aria-pressed="true"] { background: var(--resq-navy); border-color: var(--resq-navy); color: #fff; }
.tb-bezug {
  display: flex; justify-content: space-between; gap: 12px; align-items: flex-start;
  padding: 10px 12px; border-radius: var(--resq-radius); border-left: 4px solid var(--resq-blue); background: var(--resq-blue-bg);
}
.tb-bezug--korrektur { border-left-color: var(--resq-amber); background: var(--resq-amber-bg); }
.tb-bezug__text { font-size: 13px; margin-top: 2px; white-space: pre-line; }
.tb-typ { display: inline-block; padding: 2px 8px; border-radius: 4px; font-size: 12px; font-weight: 600; }
.tb-typ--meldung      { background: var(--resq-blue-bg);  color: var(--resq-blue); }
.tb-typ--entscheidung { background: var(--resq-green-bg); color: var(--resq-green); }
.tb-typ--auftrag      { background: var(--resq-amber-bg); color: var(--resq-amber); }
.tb-typ--vermerk      { background: #f3f4f6;              color: var(--resq-text-secondary); }
.tb-folgen { font-size: 12px; color: var(--resq-text-secondary); margin-top: 4px; }
.tb-folgen a { text-decoration: underline; }
.tb-zeile--korrigiert > td:nth-child(6) > div { text-decoration: line-through; color: var(--resq-text-muted); }
.tb-tabelle tr:target { background: var(--resq-amber-bg); }
.tb-tabelle .resq-badge { margin-bottom: 4px; display: inline-block; }
@media (max-width: 900px) {
  .tb-form__vonan { grid-template-columns: 1fr; }
  .tb-form__zeile { grid-template-columns: 1fr; }
}

/* Stabsfunktionen: Auswahl-Modal + Funktions-Dashboard (lage/_funktion_*.html) */
.fx-modal[hidden] { display: none; }
.fx-gruppe { margin-bottom: 14px; }
.fx-gruppe:last-child { margin-bottom: 0; }
.fx-gruppe__titel { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--resq-text-muted); margin: 0 0 6px 2px; }
.fx-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); gap: 8px; }
.fx-grid form { display: contents; }
.fx-karte {
  display: flex; flex-direction: column; align-items: flex-start; gap: 2px; text-align: left;
  width: 100%; height: 84px; padding: 10px 12px; border-radius: var(--resq-radius-lg);
  border: 2px solid var(--resq-border-strong); background: var(--resq-surface); cursor: pointer;
  overflow: hidden; box-sizing: border-box;
}
.fx-karte:hover { border-color: var(--resq-navy); background: #f9fafb; }
.fx-karte--aktiv { border-color: var(--resq-navy); background: var(--resq-blue-bg); }
.fx-karte__kurz { font-size: 17px; font-weight: 700; color: var(--resq-navy); line-height: 1.15; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fx-karte__label { font-size: 11px; line-height: 1.25; color: var(--resq-text-secondary); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.fx-karte__inhaber { margin-top: auto; font-size: 10px; color: var(--resq-green); }
.fx-karte__inhaber--frei { color: var(--resq-text-muted); }
.fx-kopf { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.fx-kopf__kurz { font-size: 28px; font-weight: 700; color: var(--resq-navy); line-height: 1; }
.fx-kopf__label { font-size: 14px; color: var(--resq-text-secondary); margin-top: 4px; }
.fx-kopf__rechts { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.fx-werkzeuge { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; border-top: 1px solid var(--resq-border); padding-top: 10px; padding-bottom: 10px; }
.fx-spalten { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: start; }
.fx-neu__zeile { display: grid; grid-template-columns: 56px 1fr; gap: 8px; align-items: center; }
.tb-seg__btn--sm { min-height: 32px; padding: 4px 12px; font-size: 13px; }
.tb-seg__btn.fx-prio--normal[aria-pressed="true"]   { background: var(--resq-navy); border-color: var(--resq-navy); }
.tb-seg__btn.fx-prio--dringend[aria-pressed="true"] { background: var(--resq-amber); border-color: var(--resq-amber); }
.tb-seg__btn.fx-prio--sofort[aria-pressed="true"]   { background: var(--resq-red); border-color: var(--resq-red); }
.tb-seg__btn:not(.fx-prio--normal):not(.fx-prio--dringend):not(.fx-prio--sofort)[aria-pressed="true"] { background: var(--resq-navy); border-color: var(--resq-navy); }
.fx-liste { display: grid; gap: 8px; padding: 10px 16px 14px; }
.fx-aufgabe { border: 1px solid var(--resq-border); border-left-width: 4px; border-radius: var(--resq-radius); padding: 10px 12px; display: grid; gap: 4px; background: var(--resq-surface); }
.fx-aufgabe--in_arbeit { border-left-color: var(--resq-blue); }
.fx-aufgabe--offen { border-left-color: var(--resq-border-strong); }
.fx-aufgabe--ueberfaellig { border-left-color: var(--resq-red); background: #fff7f7; }
.fx-aufgabe--erledigt { border-left-color: var(--resq-green); opacity: .8; }
.fx-aufgabe--fremd { border-left-color: var(--resq-amber); }
.fx-aufgabe__kopf { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; font-size: 12px; }
.fx-aufgabe__titel { font-size: 15px; font-weight: 600; }
.fx-aufgabe__text { font-size: 13px; white-space: pre-line; color: var(--resq-text-secondary); }
.fx-aufgabe__aktionen { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 4px; }
.fx-prio { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: 2px 7px; border-radius: 4px; }
.fx-prio--normal { background: #f3f4f6; color: var(--resq-text-secondary); }
.fx-prio--dringend { background: var(--resq-amber-bg); color: var(--resq-amber); }
.fx-prio--sofort { background: var(--resq-red-status-bg); color: var(--resq-red-status); }
.fx-faellig { font-size: 12px; color: var(--resq-text-secondary); }
.fx-faellig--rot { color: var(--resq-red); font-weight: 600; }
.fx-weiter summary { list-style: none; cursor: pointer; }
.fx-weiter summary::-webkit-details-marker { display: none; }
.fx-weiter__chips { display: flex; flex-wrap: wrap; gap: 4px; padding: 8px 0 2px; }
.fx-details { border-top: 1px solid var(--resq-border); }
.fx-details > summary { padding: 10px 16px; cursor: pointer; font-size: 13px; color: var(--resq-text-secondary); }
.fx-eintrag { border-bottom: 1px solid var(--resq-border); padding: 8px 0; display: grid; gap: 4px; }
.fx-eintrag:last-child { border-bottom: 0; }
.fx-eintrag__kopf { font-size: 12px; color: var(--resq-text-secondary); display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.fx-eintrag__text { white-space: pre-line; font-size: 14px; }
@media (max-width: 1000px) { .fx-spalten { grid-template-columns: 1fr; } }

/* Kräfte-Board + Einsatzabschnitte (lage/_kraefte_board.html, Funktions-Dashboard) */
.kb-neu { display: grid; grid-template-columns: 2fr 1fr; gap: 16px; align-items: start; }
.kb-frei { display: grid; grid-template-columns: 2fr 1fr 1fr 1.5fr auto auto; gap: 6px; align-items: center; }
.kb-frei input.resq-input { font-size: 13px; }
.kb-board { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 12px; align-items: start; }
.kb-spalte { background: var(--resq-surface); border: 1px solid var(--resq-border); border-top: 5px solid var(--sp-farbe, #9ca3af); border-radius: var(--resq-radius-lg); }
.kb-spalte__kopf { display: flex; justify-content: space-between; gap: 8px; padding: 10px 12px 6px; }
.kb-spalte__name { font-weight: 700; font-size: 15px; }
.kb-spalte__edit { padding: 0 12px 6px; font-size: 12px; }
.kb-spalte__edit > summary { cursor: pointer; }
.kb-karten { display: grid; gap: 8px; padding: 6px 10px 12px; }
.kb-kraft { border: 1px solid var(--resq-border); border-left: 5px solid var(--fms, #9ca3af); border-radius: var(--resq-radius); padding: 8px 10px; display: grid; gap: 4px; background: var(--resq-surface); }
.kb-kraft--fremd { background: #fffbf3; }
.kb-kraft__kopf { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.kb-kraft__aktionen { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin-top: 2px; }
.kb-inline { display: inline-flex; gap: 4px; align-items: center; flex-wrap: wrap; }
.kb-fms { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 6px; background: var(--fms, #9ca3af); color: #fff; font-weight: 700; font-size: 13px; flex: none; }
.fms-1, .fms-2 { --fms: #16a34a; }
.fms-3 { --fms: #eab308; }
.fms-4 { --fms: #dc2626; }
.fms-6 { --fms: #6b7280; }
.fms-7, .fms-8 { --fms: #2563eb; }
.tb-chip--aktiv { background: var(--resq-navy); border-color: var(--resq-navy); color: #fff; }
.tb-chip--ziel { border-color: var(--sp-farbe, var(--resq-border-strong)); border-left-width: 4px; }
.tb-chip--fremd { background: #fffbf3; }
.fx-karte--eal { border-left: 6px solid var(--ab-farbe, #2563eb); }
.fx-karte--leer { opacity: .6; cursor: default; }
@media (max-width: 900px) { .kb-neu { grid-template-columns: 1fr; } .kb-frei { grid-template-columns: 1fr 1fr; } }

/* S6 Funk & IuK: Schnellanlage Funkgruppe */
.fk-neu { display: grid; grid-template-columns: 1fr 1.5fr 1fr; gap: 6px; align-items: center; }
.fk-neu .tb-seg, .fk-neu > button { grid-column: 1 / -1; }

/* Tagebuch: Vorschläge aus Meldungen */
.tb-vorschlaege { background: #fffbeb; }
.tb-vorschlag { border: 1px solid #fcd34d; border-left-width: 4px; border-radius: var(--resq-radius); background: var(--resq-surface); padding: 8px 12px; margin-top: 6px; display: grid; gap: 4px; }
.tb-vorschlag__kopf { font-size: 12px; color: var(--resq-text-secondary); display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.tb-vorschlag__text { white-space: pre-line; font-size: 14px; }
.tb-vorschlag__aktionen { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }

/* Cockpit-Layout (Funktions-Dashboard, Kräfte-Board, Tagebuch) — feste Höhe, Zonen scrollen einzeln */
.vb-tabs { display: flex; gap: 4px; flex-wrap: wrap; }
.vb-kopf__zurueck--aktiv { background: rgba(255,255,255,.18); border-color: rgba(255,255,255,.5); }
.ck { display: grid; grid-template-columns: 230px minmax(0, 1.15fr) minmax(0, 1fr); gap: 10px; flex: 1 1 auto; min-height: 0; }
.ck-rail { display: flex; flex-direction: column; gap: 10px; overflow-y: auto; min-height: 0; }
.ck-rail__funktion, .ck-rail__block { background: var(--resq-surface); border: 1px solid var(--resq-border); border-radius: var(--resq-radius-lg); padding: 12px; }
.ck-rail__block { display: flex; flex-direction: column; gap: 4px; }
.ck-rail__meldung { min-height: 46px; font-size: 15px; justify-content: center; }
.ck-rail__link { display: block; padding: 6px 8px; border-radius: var(--resq-radius); font-size: 13px; color: var(--resq-text-primary); text-decoration: none; }
.ck-rail__link:hover { background: #f3f4f6; }
.ck-zaehler { display: flex; justify-content: space-between; font-size: 13px; padding: 3px 0; }
.ck-panel { display: flex; flex-direction: column; min-height: 0; background: var(--resq-surface); border: 1px solid var(--resq-border); border-radius: var(--resq-radius-lg); overflow: hidden; }
.ck-panel__kopf { display: flex; gap: 4px; flex-wrap: wrap; padding: 8px 10px; border-bottom: 1px solid var(--resq-border); background: #f9fafb; flex: none; }
.ck-panel__body { flex: 1 1 auto; overflow-y: auto; min-height: 0; padding: 10px 12px; }
.ck-tab { border: 1px solid transparent; background: transparent; border-radius: var(--resq-radius); padding: 6px 12px; font-size: 13px; font-weight: 600; color: var(--resq-text-secondary); cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.ck-tab:hover { background: #eef1f4; }
.ck-tab[aria-pressed="true"] { background: var(--resq-navy); color: #fff; }
.ck-tab__n { font-size: 11px; background: rgba(0,0,0,.08); border-radius: 999px; padding: 1px 7px; }
.ck-tab[aria-pressed="true"] .ck-tab__n { background: rgba(255,255,255,.22); }
.ck-aufgabe-neu { display: grid; gap: 6px; padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px solid var(--resq-border); }
.ck-aufgabe-neu__zeile { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.ck-aufgabe-neu__zeile > input.resq-input { flex: 1; min-width: 200px; font-size: 15px; }
.ck-details > summary { cursor: pointer; font-size: 12px; color: var(--resq-text-secondary); }
.ck-details textarea.resq-input { margin-top: 6px; width: 100%; }
.ck-item { padding: 8px 0; border-bottom: 1px solid var(--resq-border); display: grid; gap: 4px; }
.ck-item:last-of-type { border-bottom: 0; }
.ck-item__kopf { font-size: 12px; color: var(--resq-text-secondary); display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.ck-item__text { white-space: pre-line; font-size: 14px; }
.ck-item--vorschlag { background: #fffbeb; margin: 0 -12px; padding: 8px 12px; }
.ck-drawer { position: fixed; inset: 0; background: rgba(13,21,38,.35); z-index: 45; display: flex; justify-content: flex-end; }
.ck-drawer[hidden] { display: none; }
.ck-drawer__panel { width: 520px; max-width: 100%; height: 100%; background: var(--resq-surface); box-shadow: -8px 0 24px rgba(0,0,0,.2); display: flex; flex-direction: column; }
.ck-drawer__kopf { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 14px 18px; border-bottom: 1px solid var(--resq-border); flex: none; }
.ck-drawer__body { padding: 16px 18px; overflow-y: auto; flex: 1 1 auto; min-height: 0; }
.ck-board { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; gap: 8px; }
.ck-board__kopf { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; background: var(--resq-surface); border: 1px solid var(--resq-border); border-radius: var(--resq-radius-lg); padding: 8px 12px; flex: none; }
.ck-board .kb-board { flex: 1 1 auto; min-height: 0; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(300px, 1fr); overflow-x: auto; align-items: stretch; }
.ck-board .kb-spalte { display: flex; flex-direction: column; min-height: 0; }
.ck-board .kb-karten { flex: 1 1 auto; overflow-y: auto; min-height: 0; }
.ck-tb { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; gap: 8px; }
.ck-tb__kopf { flex: none; max-height: 55vh; overflow-y: auto; margin-bottom: 0; }
.ck-tb__liste { flex: 1 1 auto; min-height: 0; overflow-y: auto; }
.ck-tb__liste thead th { position: sticky; top: 0; background: var(--resq-surface); z-index: 1; }
@media (max-width: 1100px) {
  .ck { grid-template-columns: 1fr; overflow-y: auto; }
  .ck-panel { max-height: 70vh; }
  .ck-board .kb-board { grid-auto-flow: row; grid-auto-columns: auto; overflow-x: visible; }
}

/* Kräfte-Board v2: KPIs, feste Spalten, kompakte Karten, Drag & Drop */
.kb-kpis { display: flex; gap: 6px; flex-wrap: wrap; align-items: stretch; }
.kb-kpi { display: flex; flex-direction: column; align-items: flex-start; padding: 4px 10px; border-radius: var(--resq-radius); background: #f3f4f6; border-left: 4px solid var(--fms, #cbd5e1); min-width: 64px; }
.kb-kpi strong { font-size: 16px; line-height: 1.1; }
.kb-kpi span { font-size: 10px; color: var(--resq-text-secondary); text-transform: uppercase; letter-spacing: .04em; white-space: nowrap; }
.kb-kpi--leer { opacity: .5; }
.kb-kpi--warn { --fms: var(--resq-red); background: var(--resq-red-status-bg); }
.ck-board .kb-board { grid-auto-columns: 340px; justify-content: start; gap: 10px; padding-bottom: 6px; }
.kb-spalte--frei { border-style: dashed; background: #fafafa; }
.kb-spalte--platzhalter { border-style: dashed; background: transparent; border-top-color: var(--resq-border); }
.kb-spalte--ziel { outline: 3px solid var(--resq-blue); outline-offset: -3px; background: var(--resq-blue-bg); }
.kb-spalte__zahlen { text-align: right; line-height: 1.1; white-space: nowrap; }
.kb-spalte__zahlen strong { font-size: 18px; display: block; }
.kb-spalte__zahlen span { font-size: 11px; color: var(--resq-text-secondary); }
.kb-spalte__werkzeuge { display: flex; gap: 10px; padding: 0 12px 4px; font-size: 12px; }
.kb-spalte__werkzeuge .kb-spalte__edit { padding: 0; }
.kb-spalte__werkzeuge summary { color: var(--resq-text-secondary); }
.kb-leer { font-size: 12px; color: var(--resq-text-muted); text-align: center; padding: 18px 8px; border: 1px dashed var(--resq-border); border-radius: var(--resq-radius); }
.kb-kraft { cursor: grab; }
.kb-kraft--zieht { opacity: .4; }
.kb-kraft--warn { background: #fff5f5; }
.kb-kraft__name { font-size: 15px; }
.kb-kraft__meta { margin-left: auto; font-size: 11px; color: var(--resq-text-secondary); white-space: nowrap; }
.kb-kraft__info { font-size: 11px; color: var(--resq-text-secondary); }
.kb-status { display: inline-flex; border: 1px solid var(--resq-border-strong); border-radius: 6px; overflow: hidden; }
.kb-status__btn { border: 0; background: var(--resq-surface); padding: 5px 9px; font-size: 11px; font-weight: 600; color: var(--resq-text-secondary); cursor: pointer; border-right: 1px solid var(--resq-border); }
.kb-status__btn:last-child { border-right: 0; }
.kb-status__btn:hover { background: #f3f4f6; }
.kb-status__btn--aktiv { background: var(--fms, #9ca3af); color: #fff; }
.kb-mehr { margin-left: auto; position: relative; }
.kb-mehr > summary { list-style: none; cursor: pointer; padding: 2px 8px; border-radius: 6px; border: 1px solid var(--resq-border-strong); font-weight: 700; background: var(--resq-surface); }
.kb-mehr > summary::-webkit-details-marker { display: none; }
.kb-mehr__menu { position: absolute; right: 0; top: 30px; z-index: 20; background: var(--resq-surface); border: 1px solid var(--resq-border); border-radius: var(--resq-radius); box-shadow: 0 8px 24px rgba(0,0,0,.12); padding: 8px; display: grid; gap: 6px; min-width: 180px; }

/* S5 Presse */
.pr-kopf { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.pr-h { margin: 14px 0 6px; font-size: 13px; text-transform: uppercase; letter-spacing: .05em; color: var(--resq-text-secondary); }
.pr-sprach { border-left: 4px solid var(--resq-amber); background: var(--resq-amber-bg); border-radius: var(--resq-radius); padding: 8px 12px; }
.pr-sprach--leer { border-left-color: var(--resq-border-strong); background: #f9fafb; }
.ck-rail__block.pr-sprach { border-color: var(--resq-amber); }
.pr-liste { display: grid; gap: 6px; }
.pr-pm { display: block; text-decoration: none; color: inherit; border: 1px solid var(--resq-border); border-left-width: 4px; border-radius: var(--resq-radius); padding: 8px 10px; background: var(--resq-surface); }
.pr-pm:hover { background: #f9fafb; }
.pr-pm--freigabe { border-left-color: var(--resq-amber); }
.pr-pm--zurueck { border-left-color: var(--resq-red); }
.pr-pm--freigegeben, .pr-pm--veroeffentlicht { border-left-color: var(--resq-green); }
.pr-pm__kopf { display: flex; gap: 6px; align-items: center; font-size: 12px; color: var(--resq-text-secondary); }
.pr-pm__titel { font-weight: 600; font-size: 14px; margin-top: 2px; }
.pr-pm__anm { font-size: 12px; color: var(--resq-red); margin-top: 2px; }
.pr-fakten { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.pr-fakten > div { background: #f3f4f6; border-radius: var(--resq-radius); padding: 6px 8px; display: flex; flex-direction: column; }
.pr-fakten span { font-size: 10px; text-transform: uppercase; letter-spacing: .04em; color: var(--resq-text-secondary); }
.pr-fakten strong { font-size: 13px; }
.pr-text { white-space: pre-line; font-size: 15px; line-height: 1.5; padding: 10px 12px; border: 1px solid var(--resq-border); border-radius: var(--resq-radius); background: #fff; }
.pr-kurz { margin-top: 8px; padding: 6px 10px; background: #f3f4f6; border-radius: var(--resq-radius); font-size: 13px; }
.pr-aktionen { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 12px; }
.pr-verteiler { display: grid; gap: 2px; max-height: 200px; overflow-y: auto; }
.pr-freigabe { border: 1px solid var(--resq-amber); background: var(--resq-amber-bg); border-radius: var(--resq-radius); padding: 8px 10px; display: grid; gap: 6px; }
.pr-freigabe__text { white-space: pre-line; font-size: 13px; }

/* ---- S1 Stabspersonal (.ps-*) ------------------------------------------- */
.ps-hinweise { display: grid; gap: 4px; margin: 8px 0 4px; }
.ps-hinweis { display: flex; align-items: center; gap: 10px; padding: 6px 10px; border-radius: var(--resq-radius); font-size: 13px; border-left: 4px solid var(--resq-amber); background: var(--resq-amber-bg); }
.ps-hinweis--abloesung, .ps-hinweis--unbesetzt { border-left-color: var(--resq-red); background: var(--resq-red-status-bg); }
.ps-hinweis--bald { border-left-color: var(--resq-amber); background: #fffbeb; }
.ps-hinweis--schicht { border-left-color: var(--resq-blue); background: var(--resq-blue-bg); }
.ps-hinweis__text { flex: 1; }
.ps-hinweis form { flex: none; }
.ps-liste { display: grid; gap: 6px; }
.ps-person { border: 1px solid var(--resq-border); border-left: 5px solid var(--resq-green); border-radius: var(--resq-radius); padding: 8px 10px; display: grid; gap: 5px; background: var(--resq-surface); }
.ps-person--pause { border-left-color: var(--resq-amber); background: #fffdf5; }
.ps-person--bald { border-left-color: var(--resq-amber); }
.ps-person--faellig { border-left-color: var(--resq-red); background: #fff7f7; }
.ps-person--bereit { border-left-color: var(--resq-border-strong); }
.ps-person--abgemeldet { border-left-color: #d1d5db; opacity: .75; }
.ps-liste--kompakt .ps-person { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 12px; padding: 6px 10px; }
.ps-person__kopf { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ps-funktion { display: inline-block; min-width: 38px; text-align: center; font-weight: 700; font-size: 12px; padding: 2px 7px; border-radius: 4px; background: var(--resq-navy); color: #fff; }
.ps-name { font-size: 15px; }
.ps-meta { font-size: 11px; }
.ps-dienst { display: flex; align-items: center; gap: 10px; }
.ps-bar { flex: 0 0 160px; height: 8px; border-radius: 4px; background: #e5e7eb; overflow: hidden; }
.ps-bar__fuell { height: 100%; background: linear-gradient(90deg, var(--resq-green) 0 70%, var(--resq-amber) 70% 90%, var(--resq-red) 90% 100%); background-size: 160px 100%; }
.ps-dienst__text { font-size: 12px; color: var(--resq-text-secondary); }
.ps-aktionen { display: flex; gap: 6px; flex-wrap: wrap; align-items: flex-start; }
.ps-inline { display: inline-flex; gap: 4px; align-items: center; flex-wrap: wrap; }
.ps-unbesetzt { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin-top: 8px; font-size: 12px; }
.ps-zeit { overflow-x: auto; border: 1px solid var(--resq-border); border-radius: var(--resq-radius); background: var(--resq-surface); }
.ps-zeit__innen { min-width: 100%; }
.ps-zeit__zeile { display: flex; align-items: stretch; border-bottom: 1px solid var(--resq-border); min-height: 34px; }
.ps-zeit__zeile:last-child { border-bottom: 0; }
.ps-zeit__zeile--kopf { min-height: 26px; background: #f9fafb; position: sticky; top: 0; z-index: 2; }
.ps-zeit__label { flex: 0 0 110px; padding: 6px 8px; font-weight: 700; font-size: 12px; border-right: 1px solid var(--resq-border); background: #f9fafb; position: sticky; left: 0; z-index: 1; display: flex; align-items: center; }
.ps-zeit__spur { flex: 1; position: relative; min-height: 34px; }
.ps-zeit__tick { position: absolute; top: 4px; transform: translateX(-50%); font-size: 11px; color: var(--resq-text-secondary); white-space: nowrap; }
.ps-zeit__tick em { font-style: normal; font-size: 9px; display: block; line-height: 1; }
.ps-zeit__raster { position: absolute; top: 0; bottom: 0; width: 1px; background: #f1f5f9; }
.ps-zeit__jetzt { position: absolute; top: 0; bottom: 0; width: 2px; background: var(--resq-red); z-index: 3; }
.ps-block { position: absolute; top: 6px; height: 22px; line-height: 22px; font-size: 11px; padding: 0 6px; border-radius: 4px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; box-sizing: border-box; }
.ps-block--ist { background: var(--resq-navy); color: #fff; z-index: 2; }
.ps-block--ist.ps-block--warn { background: var(--resq-red); }
.ps-block--plan { background: var(--resq-blue-bg); color: var(--resq-blue); border: 1px solid var(--resq-blue); top: 8px; height: 18px; line-height: 16px; z-index: 1; }
.ps-block--plan.ps-block--erledigt { background: var(--resq-green-bg); color: var(--resq-green); border-color: var(--resq-green); }
.ps-block--plan.ps-block--steht_an { background: var(--resq-amber-bg); color: var(--resq-amber); border-color: var(--resq-amber); }
.ps-block--plan.ps-block--vorbei { opacity: .5; }
.ps-block--offen { background: repeating-linear-gradient(45deg, #fee2e2 0 4px, #fff 4px 8px); color: var(--resq-red); border: 1px dashed var(--resq-red); top: 8px; height: 18px; line-height: 16px; }
.ps-schichten { display: grid; gap: 4px; margin-top: 8px; }
.ps-schicht { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 5px 8px; border: 1px solid var(--resq-border); border-left: 4px solid var(--resq-blue); border-radius: var(--resq-radius); font-size: 13px; background: var(--resq-surface); }
.ps-schicht--steht_an { border-left-color: var(--resq-amber); background: #fffbeb; }
.ps-schicht--erledigt { border-left-color: var(--resq-green); }
.ps-schicht--vorbei { opacity: .6; }
.ps-schicht__aktionen { margin-left: auto; display: inline-flex; gap: 4px; align-items: center; }

/* ---- S3 Einsatz (.es-*) / S4 Versorgung (.vs-*) -------------------------- */
.es-liste { display: grid; gap: 6px; }
.es-befehl { border: 1px solid var(--resq-border); border-left: 5px solid var(--resq-amber); border-radius: var(--resq-radius); padding: 8px 10px; display: grid; gap: 6px; background: var(--resq-surface); }
.es-befehl--erteilt { border-left-color: var(--resq-blue); }
.es-befehl--bestaetigt { border-left-color: var(--resq-green); }
.es-befehl--abgeschlossen { border-left-color: var(--resq-border-strong); opacity: .8; }
.es-befehl--aufgehoben { border-left-color: var(--resq-red); opacity: .6; }
.es-befehl__kopf { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 14px; }
.es-befehl__schema { display: grid; gap: 2px; font-size: 13px; }
.es-befehl__schema > div { display: grid; grid-template-columns: 110px 1fr; gap: 8px; }
.es-befehl__schema span { font-size: 10px; text-transform: uppercase; letter-spacing: .04em; color: var(--resq-text-secondary); padding-top: 3px; }
.es-anf { border: 1px solid var(--resq-border); border-left: 4px solid var(--resq-border-strong); border-radius: var(--resq-radius); padding: 7px 10px; display: grid; gap: 5px; background: var(--resq-surface); margin-bottom: 6px; }
.es-anf--in_arbeit { border-left-color: var(--resq-amber); }
.es-anf--zugesagt { border-left-color: var(--resq-blue); }
.es-anf--erledigt { border-left-color: var(--resq-green); opacity: .75; }
.es-anf--abgelehnt { border-left-color: var(--resq-red); opacity: .6; }
.es-anf--warn { background: #fff7f7; border-left-color: var(--resq-red); }
.es-anf__kopf { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 13px; }
.es-anf__verlauf { font-size: 11px; color: var(--resq-text-secondary); white-space: pre-line; border-left: 2px solid var(--resq-border); padding-left: 8px; }
.vs-matrix { border: 1px solid var(--resq-border); border-radius: var(--resq-radius); overflow: hidden; background: var(--resq-surface); }
.vs-zeile { display: grid; grid-template-columns: 170px 1fr; border-bottom: 1px solid var(--resq-border); }
.vs-zeile:last-child { border-bottom: 0; }
.vs-zeile--leer .vs-zeile__leistung { color: var(--resq-text-secondary); }
.vs-zeile__leistung { padding: 8px 10px; font-weight: 700; font-size: 13px; background: #f9fafb; border-right: 1px solid var(--resq-border); display: flex; align-items: center; gap: 6px; }
.vs-zeile__wer { padding: 6px 10px; display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center; font-size: 13px; }
.vs-wer { display: inline-flex; align-items: center; gap: 6px; }
.vs-checks ul { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 2px 12px; font-size: 13px; }
.vs-checks label { display: flex; gap: 6px; align-items: center; }

/* ---- Meldungs-Glocke (.gl-*) -------------------------------------------- */
.gl { position: relative; display: inline-flex; align-items: center; }
.gl-btn { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 32px; border: 1px solid var(--resq-border); border-radius: var(--resq-radius); background: var(--resq-surface); color: var(--resq-text); cursor: pointer; }
.gl-btn:hover { background: #f3f4f6; }
.gl-btn--hell { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.35); color: #fff; }
.gl-btn--hell:hover { background: rgba(255,255,255,.2); }
.gl-badge { position: absolute; top: -6px; right: -6px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--resq-amber); color: #fff; font-size: 11px; font-weight: 700; line-height: 18px; text-align: center; }
.gl-badge--sofort { background: var(--resq-red); animation: gl-puls 1.2s ease-in-out infinite; }
@keyframes gl-puls { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.18); } }
.gl-panel { position: absolute; top: 40px; right: 0; width: 380px; max-width: 92vw; max-height: 70vh; display: flex; flex-direction: column; background: var(--resq-surface); color: var(--resq-text); border: 1px solid var(--resq-border); border-radius: var(--resq-radius); box-shadow: 0 12px 32px rgba(0,0,0,.22); z-index: 70; text-transform: none; letter-spacing: 0; font-size: 13px; }
.gl-panel[hidden] { display: none; }
.gl-panel__kopf { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-bottom: 1px solid var(--resq-border); }
.gl-panel__kopf strong { flex: 1; }
.gl-ton { font-size: 12px; display: inline-flex; align-items: center; gap: 3px; cursor: pointer; }
.gl-panel__liste { overflow-y: auto; flex: 1 1 auto; min-height: 0; }
.gl-panel__fuss { padding: 6px 10px; border-top: 1px solid var(--resq-border); font-size: 12px; }
.gl-item { padding: 8px 10px; border-bottom: 1px solid var(--resq-border); border-left: 4px solid var(--resq-blue); display: grid; gap: 4px; }
.gl-item--dringend { border-left-color: var(--resq-amber); }
.gl-item--sofort { border-left-color: var(--resq-red); background: #fff7f7; }
.gl-item__kopf { font-size: 12px; color: var(--resq-text-secondary); }
.gl-item__text { white-space: pre-line; }
.gl-wartet { color: var(--resq-red); font-weight: 600; }
.gl-toast { position: fixed; right: 18px; bottom: 18px; z-index: 80; width: 340px; max-width: 90vw; background: #1a2744; color: #fff; padding: 10px 14px; border-radius: 8px; box-shadow: 0 10px 28px rgba(0,0,0,.3); display: grid; gap: 3px; cursor: pointer; font-size: 13px; border-left: 5px solid var(--resq-blue); transition: opacity .4s, transform .4s; }
.gl-toast + .gl-toast { bottom: 100px; }
.gl-toast--sofort { border-left-color: var(--resq-red); }
.gl-toast--weg { opacity: 0; transform: translateY(10px); }

/* ---- Führungs-Cockpit (.fh-*) ------------------------------------------- */
.fh-ent { display: flex; align-items: center; gap: 8px; padding: 6px 10px; margin-bottom: 4px; border: 1px solid var(--resq-border); border-left: 4px solid var(--resq-amber); border-radius: var(--resq-radius); background: var(--resq-surface); font-size: 13px; }
.fh-ent--sofort { border-left-color: var(--resq-red); background: #fff7f7; }
.fh-ent__text { flex: 1; }
.fh-stab { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 8px; }
.fh-fx { border: 1px solid var(--resq-border); border-left: 5px solid var(--resq-green); border-radius: var(--resq-radius); padding: 8px 10px; background: var(--resq-surface); display: grid; gap: 6px; font-size: 13px; }
.fh-fx--stumm { border-left-color: var(--resq-amber); background: #fffdf5; }
.fh-fx--unbesetzt { border-left-color: var(--resq-red); background: #fff7f7; }
.fh-fx__kopf { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.fh-fx__inhaber { font-weight: 600; }
.fh-fx__sachstand { background: var(--resq-blue-bg); border-radius: 4px; padding: 6px 8px; font-size: 12.5px; }
.fh-fx__liste { display: grid; gap: 3px; }
.fh-fx__item { font-size: 12.5px; color: var(--resq-text); }
.fh-sachstaende { display: grid; gap: 6px; margin: 6px 0; }
.fh-sachstand { display: grid; grid-template-columns: auto 1fr; gap: 8px; align-items: start; font-size: 13px; padding: 6px 8px; background: var(--resq-blue-bg); border-radius: 4px; }

.fh-lesend { font-size: 12px; color: var(--resq-text-secondary); background: var(--resq-blue-bg); border-radius: var(--resq-radius); padding: 6px 10px; margin-bottom: 8px; }

.mono { font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-size: .92em; letter-spacing: .02em; }

/* ---- Einheitsführung Trainee (.eh-*) -------------------------------------- */
.eh { display: grid; grid-template-columns: 280px minmax(0, 1fr) 300px; gap: 6px; flex: 1 1 auto; min-height: 0; position: relative; }
.eh--links-zu { grid-template-columns: 0 minmax(0, 1fr) 300px; }
.eh--rechts-zu { grid-template-columns: 280px minmax(0, 1fr) 0; }
.eh--links-zu.eh--rechts-zu { grid-template-columns: 0 minmax(0, 1fr) 0; }
.eh-links { grid-column: 1; } .eh-karte { grid-column: 2; } .eh-rechts { grid-column: 3; }
.eh--links-zu .eh-links, .eh--rechts-zu .eh-rechts { display: none; }
.eh [hidden] { display: none !important; }
.eh-kopf-aktionen { display: flex; gap: 6px; margin-right: 8px; }
.eh-kopf-btn { display: inline-flex; align-items: center; gap: 6px; color: #fff; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.35); border-radius: 6px; padding: 6px 12px; font-size: 13px; font-weight: 600; cursor: pointer; min-height: 34px; }
.eh-kopf-btn:hover { background: rgba(255,255,255,.18); }
.eh-kopf-btn--primary { background: var(--resq-blue); border-color: var(--resq-blue); }
.eh-kopf-btn--primary:hover { filter: brightness(1.12); }
.eh-kopf-btn--aktiv { box-shadow: 0 0 0 2px rgba(255,255,255,.55) inset; }
/* Atemschutzüberwachung (Trainee) */
.eh-pa { border: 1px solid var(--resq-border); border-left: 4px solid var(--resq-green); border-radius: 6px; padding: 5px 8px; display: grid; gap: 4px; background: #fff; }
.eh-pa__kopf { display: flex; gap: 6px; align-items: baseline; font-size: 12.5px; }
.eh-pa__druck { margin-left: auto; font-weight: 700; font-variant-numeric: tabular-nums; font-size: 15px; }
.eh-pa__balken { position: relative; height: 8px; border-radius: 4px; background: #e5e7eb; overflow: hidden; }
.eh-pa__fuellung { height: 100%; background: var(--resq-green); transition: width 1s linear; }
.eh-pa__marke { position: absolute; top: 0; bottom: 0; width: 2px; background: #111; opacity: .6; }
.eh-pa__fuss { display: flex; align-items: center; gap: 6px; font-size: 11.5px; }
.eh-pa--warn { border-left-color: var(--resq-amber); } .eh-pa--warn .eh-pa__fuellung { background: var(--resq-amber); }
.eh-pa--rueckzug { border-left-color: var(--resq-red); background: #fff7f7; } .eh-pa--rueckzug .eh-pa__fuellung { background: var(--resq-red); } .eh-pa--rueckzug .eh-pa__druck { color: var(--resq-red); }
.eh-pa--notfall { border-left-color: var(--resq-red); background: #fee2e2; animation: eh-blink 1s step-end infinite; } .eh-pa--notfall .eh-pa__fuellung { background: var(--resq-red); } .eh-pa--notfall .eh-pa__druck { color: var(--resq-red); }
@keyframes eh-blink { 50% { box-shadow: 0 0 0 3px rgba(220,38,38,.35); } }
.eh-pa--ende { opacity: .7; border-left-color: #9ca3af; } .eh-pa--ende .eh-pa__fuellung { background: #9ca3af; }
/* Wasserförderung (FwDV 10): Profil-Whiteboard (Hauptfläche) + Karte (Nebenfenster) */
.ws-karte { display: grid; grid-template-rows: minmax(0, 1fr); background: #fff; }
.ws--karte-an .ws-karte { grid-template-rows: minmax(0, 1fr) 280px; }
.ws-profil { position: relative; display: grid; grid-template-rows: auto minmax(0, 1fr); min-height: 0; background: #fff; }
.ws-profil__kopf { display: flex; align-items: center; gap: 8px; padding: 6px 30px; font-size: 12.5px; border-bottom: 1px solid var(--resq-border); }
.ws-profil svg { display: block; width: 100%; height: 100%; touch-action: none; user-select: none; }
.ws-profil__legende { position: absolute; left: 30px; bottom: 6px; display: flex; gap: 12px; font-size: 11px; color: #555; pointer-events: none; }
.ws-profil__legende i { display: inline-block; width: 12px; height: 4px; vertical-align: middle; margin-right: 4px; }
.ws-check { display: flex; gap: 4px; align-items: center; font-size: 12px; cursor: pointer; }
.ws-map-wrap { position: relative; border-top: 1px solid var(--resq-border); min-height: 0; }
#ws-map { position: absolute; inset: 0; }
.ws .eh-karte-status { bottom: 8px; right: 10px; }
.ws-map-wrap .eh-karte-status { bottom: 8px; right: 10px; }
.ws-pumpe-svg { cursor: grab; } .ws-pumpe-svg--aktiv { cursor: grabbing; }
.ws-tap { cursor: crosshair; }
.ws-mk-entnahme, .ws-mk-abgabe { width: 26px; height: 26px; border-radius: 50%; color: #fff; font-weight: 700; font-size: 13px; display: flex; align-items: center; justify-content: center; border: 2px solid #fff; box-shadow: 0 1px 4px rgba(0,0,0,.4); }
.ws-mk-entnahme { background: #1d4ed8; } .ws-mk-abgabe { background: var(--resq-red); }
.ws-mk-pumpe { display: flex; flex-direction: column; align-items: center; cursor: grab; }
.ws-mk-pumpe img { width: 44px; height: 34px; object-fit: contain; background: rgba(255,255,255,.94); border-radius: 4px; padding: 2px; box-shadow: 0 1px 4px rgba(0,0,0,.4); border: 2px solid transparent; }
.ws-mk-pumpe__box { width: 40px; height: 28px; border-radius: 4px; background: var(--resq-blue); color: #fff; font-size: 11px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.ws-mk-pumpe__text { font-size: 11px; font-weight: 600; background: rgba(255,255,255,.92); padding: 0 4px; border-radius: 3px; margin-top: 2px; white-space: nowrap; }
.ws-mk-pumpe--nok img { border-color: var(--resq-red); } .ws-mk-pumpe--aus img { filter: grayscale(1); opacity: .6; } .ws-mk-pumpe--aus .ws-mk-pumpe__text { background: var(--resq-red); color: #fff; }
.ws-mk-stoerung { width: 24px; height: 24px; border-radius: 50%; background: var(--resq-red); color: #fff; font-weight: 700; display: flex; align-items: center; justify-content: center; border: 2px solid #fff; box-shadow: 0 1px 4px rgba(0,0,0,.4); animation: eh-blink 1s step-end infinite; }
.ws-pumpe { border: 1px solid var(--resq-border); border-left: 4px solid var(--resq-green); border-radius: 6px; padding: 6px 8px; display: grid; gap: 4px; font-size: 12px; background: #fff; }
.ws-pumpe--nok { border-left-color: var(--resq-red); background: #fff7f7; } .ws-pumpe--aus { border-left-color: #9ca3af; opacity: .75; }
.ws-pumpe__kopf { font-size: 12.5px; } .ws-pumpe__zeile { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ws-pumpe__zeile input[type=range] { flex: 1; min-width: 80px; }
.ws-tab th, .ws-tab td { padding: 3px 5px; font-size: 11.5px; } .ws-nok td { background: #fff1f1; }
/* Befehlsleiste über der Karte */
.eh-bf { flex: none; background: var(--resq-surface); border-radius: var(--resq-radius); padding: 8px 10px; box-shadow: 0 1px 6px rgba(0,0,0,.12); display: grid; gap: 8px; font-size: 12.5px; border: 1px solid var(--resq-blue); }
.eh-bf__kopf { display: flex; align-items: center; font-size: 13.5px; }
.eh-bf__zeile { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.eh-bf__fuss { display: flex; gap: 6px; justify-content: flex-end; border-top: 1px solid var(--resq-border); padding-top: 8px; }
.eh--befehl { grid-template-columns: 280px minmax(0, 1fr) 360px; }
.eh--befehl.eh--links-zu { grid-template-columns: 0 minmax(0, 1fr) 360px; }
.eh-ziel-hinweis { position: absolute; top: 10px; left: 50%; transform: translateX(-50%); z-index: 8; background: var(--resq-blue); color: #fff; font-weight: 600; font-size: 13px; padding: 6px 14px; border-radius: 999px; box-shadow: 0 2px 8px rgba(0,0,0,.25); pointer-events: none; }
.eh-bf__schritt { flex: 0 0 100%; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px; color: var(--resq-text-muted); background: #f3f4f6; border-radius: 4px; padding: 3px 8px; }
.eh-bf__schritt--aktiv { background: var(--resq-blue); color: #fff; }
.eh-bf__schritt--fertig { background: var(--resq-green); color: #fff; }
.eh-bf__chips { display: flex; gap: 4px; flex-wrap: wrap; }
.eh-bf__chip { border: 1px solid var(--resq-border); background: #fff; border-radius: 999px; padding: 4px 10px; font-size: 12.5px; cursor: pointer; line-height: 1.2; white-space: nowrap; }
.eh-bf__chip small { color: var(--resq-text-muted); font-weight: 400; }
.eh-bf__chips--klein .eh-bf__chip { padding: 2px 8px; font-size: 11.5px; }
.eh-bf__chip:hover { border-color: var(--resq-blue); }
.eh-bf__chip--an { background: var(--resq-blue); border-color: var(--resq-blue); color: #fff; }
.eh-bf__chip--an small { color: rgba(255,255,255,.8); }
.eh-bf__chip--dim { opacity: .4; }
.eh-bf__chip--selbst { border-style: dashed; border-color: var(--resq-navy, #1a2744); }
.eh-bf--selbst #eh-pa-chip, .eh-bf--selbst #eh-bf-mittel, .eh-bf--selbst #eh-mittel, .eh-bf--selbst #eh-bf-weg, .eh-bf--selbst #eh-weg { display: none; }
.eh-bf__hinweis { font-size: 12px; color: var(--resq-blue); font-weight: 600; }
.eh-bf__input { font-size: 12.5px; padding: 4px 8px; min-height: 0; width: 100%; }
.eh-bf__zu { margin-left: auto; border: none; background: transparent; cursor: pointer; font-size: 14px; color: var(--resq-text-muted); }
.eh-bf__senden { min-height: 34px; }
.eh-bf__senden[disabled] { opacity: .5; cursor: not-allowed; }
.eh-mk-ziel { width: 16px; height: 16px; border-radius: 50% 50% 50% 0; transform: rotate(-45deg); background: var(--resq-red); border: 2px solid #fff; box-shadow: 0 1px 4px rgba(0,0,0,.4); }
.eh-trupp [data-befehl-trupp] { line-height: 1; }
/* Eigene Planübungs-Karte (uebung-einheit-karte.js) */
.eh-karte { position: relative; min-width: 0; min-height: 0; border-radius: 8px; overflow: hidden; background: #e5e7eb; border: 1px solid var(--resq-border); }
#eh-karte { position: absolute; inset: 0; }
.eh-klapp { position: absolute; top: 50%; transform: translateY(-50%); z-index: 6; width: 18px; height: 60px; border: 1px solid var(--resq-border); background: rgba(255,255,255,.92); cursor: pointer; font-size: 10px; color: var(--resq-text-muted); padding: 0; }
.eh-klapp--links { left: 0; border-left: none; border-radius: 0 6px 6px 0; }
.eh-klapp--rechts { right: 0; border-right: none; border-radius: 6px 0 0 6px; }
.eh-klapp:hover { background: var(--resq-blue-bg); color: var(--resq-blue); }
.eh-wind { position: absolute; top: 10px; left: 28px; z-index: 5; background: rgba(255,255,255,.93); border-radius: 6px; padding: 4px 10px; font-size: 12px; display: flex; gap: 8px; align-items: center; box-shadow: 0 1px 4px rgba(0,0,0,.15); }
.eh-wind__pfeil { display: inline-block; font-size: 18px; line-height: 1; color: var(--resq-blue); transition: transform .3s; }
.eh-legende { position: absolute; top: 10px; right: 52px; z-index: 5; background: rgba(255,255,255,.93); border-radius: 6px; padding: 4px 10px; font-size: 12px; display: flex; gap: 12px; align-items: center; box-shadow: 0 1px 4px rgba(0,0,0,.15); }
.eh-legende label { display: flex; gap: 4px; align-items: center; cursor: pointer; white-space: nowrap; }
.eh-ablage { position: absolute; left: 28px; right: 28px; bottom: 10px; z-index: 5; background: rgba(255,255,255,.95); border-radius: 8px; padding: 6px 10px 8px; box-shadow: 0 1px 8px rgba(0,0,0,.2); }
.eh-ablage__titel { font-size: 11px; text-transform: uppercase; letter-spacing: .5px; color: var(--resq-text-muted); margin-bottom: 4px; font-weight: 600; }
.eh-ablage__liste { display: flex; gap: 8px; overflow-x: auto; }
.eh-fzk { display: flex; align-items: center; gap: 8px; border: 1px solid var(--resq-border); border-radius: 6px; padding: 4px 8px; background: #fff; cursor: grab; user-select: none; min-width: 160px; font-size: 12px; flex: none; }
.eh-fzk img { width: 42px; height: 30px; object-fit: contain; }
.eh-fzk--wartet { opacity: .55; cursor: not-allowed; }
.eh-fzk--aktiv { outline: 2px solid var(--resq-blue); }
.eh-karte-status { position: absolute; bottom: 10px; right: 10px; z-index: 5; font-size: 11px; background: rgba(255,255,255,.85); padding: 2px 6px; border-radius: 4px; }
.eh-ablage:not([hidden]) ~ .eh-karte-status { bottom: 82px; }
.eh-mk-fz { display: flex; flex-direction: column; align-items: center; cursor: grab; }
.eh-mk-fz img { width: 46px; height: 36px; object-fit: contain; background: rgba(255,255,255,.94); border-radius: 4px; padding: 2px; box-shadow: 0 1px 4px rgba(0,0,0,.4); }
.eh-mk-fz__box { width: 40px; height: 28px; border-radius: 4px; background: var(--resq-blue); color: #fff; font-size: 11px; font-weight: 700; display: flex; align-items: center; justify-content: center; box-shadow: 0 1px 4px rgba(0,0,0,.4); }
.eh-mk-text { font-size: 11px; font-weight: 600; background: rgba(255,255,255,.92); padding: 0 4px; border-radius: 3px; margin-top: 2px; white-space: nowrap; color: #222; }
.eh-mk-text--klein { font-weight: 500; font-size: 10px; }
.eh-mk-text:empty { display: none; }
/* Dichte Lagen: Chips erst im Nahzoom, sonst per Hover (Flächen: Popup am Zeiger) */
.eh-mk-fz--eng .eh-mk-text { display: none; }
.eh-mk-fz--eng:hover .eh-mk-text { display: block; }
.eh-mk-trupp-wrap .eh-mk-text--klein { display: none; }
.eh-mk-trupp-wrap:hover .eh-mk-text--klein { display: block; }
.eh-mk-fz:hover, .eh-mk-trupp-wrap:hover { z-index: 5; }
.eh-hover .maplibregl-popup-content { padding: 3px 8px; font-size: 12px; font-weight: 600; border-radius: 6px; box-shadow: 0 1px 4px rgba(0,0,0,.25); }
.eh-hover .maplibregl-popup-tip { display: none; }
.eh-mk-label { font-size: 11px; font-weight: 600; background: rgba(255,255,255,.88); padding: 1px 6px; border-radius: 10px; border: 1.5px solid #999; color: #1f2937; white-space: nowrap; pointer-events: none; }
.eh-mk-sym { width: 18px; height: 18px; border-radius: 50%; border: 2px solid #fff; box-shadow: 0 1px 4px rgba(0,0,0,.4); }
.eh-mk-sym--hydrant { border-radius: 4px; background: #1d4ed8; color: #fff; font-size: 11px; font-weight: 700; display: flex; align-items: center; justify-content: center; width: 20px; height: 20px; }
.eh-mk-trupp-wrap { display: flex; flex-direction: column; align-items: center; }
.eh-mk-trupp { width: 30px; height: 30px; border-radius: 50%; background: var(--resq-red); color: #fff; font-weight: 700; font-size: 11px; display: flex; align-items: center; justify-content: center; border: 2px solid #fff; box-shadow: 0 1px 4px rgba(0,0,0,.4); }
.eh-mk-trupp--ruestet { background: var(--resq-amber); }
.eh-mk-trupp--eingesetzt { background: var(--resq-red); }
.eh-mk-trupp--bereit { background: var(--resq-blue); }
.eh-mk-trupp--gang { background: #1a2744; border-style: dashed; }
.eh-mk-punkt { width: 28px; height: 28px; border-radius: 50%; background: var(--resq-amber); color: #fff; font-size: 14px; display: flex; align-items: center; justify-content: center; border: 2px solid #fff; box-shadow: 0 1px 4px rgba(0,0,0,.4); cursor: pointer; }
.eh-mk-punkt--ok { background: var(--resq-green); font-weight: 700; }
.eh-mk-punkt--zu { background: #9ca3af; }
/* Brand-Overlay: Flammen + Rauch (Größe --fg aus der Flächengröße, Rauch zieht mit --dx/--dy = Wind) */
.eh-mk-feuer { --fg: 60px; --dx: 0; --dy: -1; display: flex; flex-direction: column; align-items: center; pointer-events: none; }
.eh-mk-feuer__flammen { width: var(--fg); height: var(--fg); position: relative; filter: drop-shadow(0 0 6px rgba(249,115,22,.7)); }
.eh-mk-feuer__flammen svg { width: 100%; height: 100%; overflow: visible; }
.eh-fl { transform-origin: 32px 62px; animation: eh-flacker 1.1s ease-in-out infinite; }
.eh-fl--2 { animation-duration: .85s; animation-delay: -.3s; }
.eh-fl--1 { animation-duration: .65s; animation-delay: -.5s; }
@keyframes eh-flacker { 0%, 100% { transform: scale(1, 1) skewX(0deg); } 30% { transform: scale(1.06, 1.12) skewX(-4deg); } 60% { transform: scale(.96, .94) skewX(4deg); } 80% { transform: scale(1.03, 1.08) skewX(-2deg); } }
.eh-mk-feuer--1 .eh-fl--3 { opacity: .55; }
.eh-mk-feuer--kontrolliert .eh-mk-feuer__flammen { filter: none; opacity: .8; }
.eh-mk-feuer--kontrolliert .eh-fl--3 { opacity: .25; }
.eh-mk-feuer__rauch { position: absolute; left: 50%; bottom: calc(var(--fg) * .75); width: 0; height: 0; }
.eh-rauch { position: absolute; left: -10px; top: -10px; width: 20px; height: 20px; border-radius: 50%; background: rgba(75,85,99,.55); animation: eh-rauch 3.2s linear infinite; }
.eh-rauch--1 { animation-delay: -.8s; } .eh-rauch--2 { animation-delay: -1.6s; } .eh-rauch--3 { animation-delay: -2.4s; }
.eh-mk-feuer--1 .eh-rauch { background: rgba(107,114,128,.5); }
.eh-mk-feuer--3 .eh-rauch { background: rgba(31,41,55,.6); width: 26px; height: 26px; }
.eh-mk-feuer--kontrolliert .eh-rauch { background: rgba(156,163,175,.45); }
@keyframes eh-rauch { 0% { transform: translate(0, 0) scale(.6); opacity: .8; } 100% { transform: translate(calc(var(--dx) * var(--fg) * 1.4), calc(var(--dy) * var(--fg) * 1.4)) scale(2.6); opacity: 0; } }
.eh-mk-feuer__text { background: rgba(220,38,38,.92); color: #fff; font-weight: 700; margin-top: -4px; }
.eh-mk-feuer--kontrolliert .eh-mk-feuer__text { background: rgba(107,114,128,.9); }
.eh-popup { font-size: 13px; min-width: 160px; max-width: 260px; display: grid; gap: 6px; }
.eh-popup__text { font-size: 12.5px; }
.eh-aktualisiert { position: absolute; left: 50%; top: 8px; transform: translateX(-50%); z-index: 20; background: var(--resq-blue); color: #fff; font-size: 12px; padding: 4px 10px; border-radius: 999px; opacity: 0; transition: opacity .3s; pointer-events: none; }
.eh-aktualisiert--an { opacity: 1; }
.eh-aktualisiert { position: absolute; left: 50%; top: 8px; transform: translateX(-50%); z-index: 20; background: var(--resq-blue); color: #fff; font-size: 12px; padding: 4px 10px; border-radius: 999px; opacity: 0; transition: opacity .3s; pointer-events: none; }
.eh-aktualisiert--an { opacity: 1; }
.eh-links, .eh-rechts { display: flex; flex-direction: column; gap: 8px; overflow-y: auto; min-height: 0; }
.eh-block { background: var(--resq-surface); border: 1px solid var(--resq-border); border-radius: var(--resq-radius); padding: 8px 10px; display: grid; gap: 6px; font-size: 13px; }
.eh-block--strom { flex: 1 1 auto; min-height: 120px; overflow-y: auto; }
.eh-rechts__inhalt { display: flex; flex-direction: column; gap: 8px; flex: 1 1 auto; min-height: 0; }
.eh-fz { border-left: 4px solid var(--resq-border-strong); padding: 4px 8px; background: #f9fafb; border-radius: 4px; display: grid; gap: 2px; }
.eh-fz--ok { border-left-color: var(--resq-green); }
.eh-fz--warn { border-left-color: var(--resq-red); background: #fff7f7; }
.eh-trupp { display: flex; gap: 6px; align-items: center; font-size: 13px; }
.eh-auftrag { border-left: 4px solid var(--resq-blue); padding: 4px 8px; background: var(--resq-blue-bg); border-radius: 4px; display: grid; gap: 3px; }
.eh-erk { padding: 4px 8px; border-radius: 4px; background: #f9fafb; border-left: 4px solid var(--resq-amber); display: grid; gap: 2px; }
.eh-erk--ok { border-left-color: var(--resq-green); }
.eh-erk--laeuft { border-left-color: var(--resq-blue); display: flex; justify-content: space-between; align-items: baseline; gap: 6px; font-size: 12.5px; }
@media (max-width: 1100px) { .eh, .eh--links-zu, .eh--rechts-zu, .eh--befehl, .eh--befehl.eh--links-zu { grid-template-columns: 1fr; height: auto; } .eh--befehl .eh-rechts { order: -1; } .eh-links, .eh-karte, .eh-rechts { grid-column: 1; } .eh-klapp { display: none; } .eh-karte { height: 60vh; } }
.eh-lage { padding: 5px 8px; border-radius: 4px; background: #f9fafb; border-left: 4px solid var(--resq-amber); display: grid; gap: 2px; }
.eh-lage--krit { border-left-color: var(--resq-red); background: #fff7f7; }
.eh-lage--verdeckt { border-left-color: #9ca3af; border-left-style: dashed; opacity: .85; background: repeating-linear-gradient(135deg, transparent 0 8px, rgba(0,0,0,.03) 8px 16px); }
.eh-lage--halt { border-left-color: var(--resq-blue); background: var(--resq-blue-bg); }
.eh-lage--ok { border-left-color: var(--resq-green); }

/* ---- Warte-Overlay (lange Aktionen: KI, PDF) ---- */
.resq-warten { position: fixed; inset: 0; z-index: 90; background: rgba(13,21,38,.45); display: flex; align-items: center; justify-content: center; backdrop-filter: blur(1px); }
.resq-warten__box { background: var(--resq-surface); color: var(--resq-text); border-radius: 10px; padding: 26px 32px; min-width: 300px; max-width: 420px; text-align: center; box-shadow: 0 16px 40px rgba(0,0,0,.3); display: grid; gap: 10px; justify-items: center; }
.resq-warten__spinner { width: 44px; height: 44px; border-radius: 50%; border: 4px solid var(--resq-border); border-top-color: var(--resq-navy); animation: resq-spin .9s linear infinite; }
.resq-warten__text { font-weight: 600; font-size: 15px; }
.resq-warten__zeit { font-size: 13px; color: var(--resq-text-secondary); font-variant-numeric: tabular-nums; }
.resq-warten__geduld { font-size: 12px; color: var(--resq-amber); max-width: 34ch; }
@media (prefers-reduced-motion: reduce) { .resq-warten__spinner { animation-duration: 3s; } }

/* Szenario-Editor: Vorschau Wasserförderung (FwDV 10, ohne Übung) */
.ws-vorschau__kpi{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px;margin:10px 0}
.ws-vorschau__kpi .wsv-k{background:#f3f4f6;border-radius:8px;padding:8px 10px;min-height:52px}
.ws-vorschau__kpi .wsv-k b{display:block;font-size:19px;line-height:1.15;color:#111}
.ws-vorschau__kpi .wsv-k span{font-size:11.5px;color:#6b7280}
.ws-vorschau__kpi .wsv-k--ok b{color:#15803d}
.ws-vorschau__kpi .wsv-k--warn b{color:#b45309}
.ws-vorschau__kpi .wsv-k--rot b{color:#dc2626}
.ws-vorschau__svg{width:100%;height:280px;display:block;background:#fff;border:1px solid #e5e7eb;border-radius:8px}
.ws-vorschau__pumpen{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;font-size:12.5px}
.ws-vorschau__pumpen .wsv-p{background:#111;color:#fff;border-radius:999px;padding:2px 10px}
.ws-vorschau__hinweise{margin-top:8px;font-size:12.5px;display:grid;gap:4px}
.ws-vorschau__hinweise .wsv-h{padding:5px 9px;border-radius:6px;background:#fef3c7;color:#78350f}
.ws-vorschau__hinweise .wsv-a{padding:5px 9px;border-radius:6px;background:#eff6ff;color:#1e3a8a}
.ws-vorschau__hinweise .wsv-f{padding:8px 10px;border-radius:6px;background:#f3f4f6;color:#374151}
.ws-vorschau__empfehlung{margin-top:10px;font-size:12.5px}
.ws-vorschau__empfehlung .wsv-e__kopf{margin-bottom:4px}
.ws-vorschau__empfehlung .wsv-e__text{padding:6px 9px;border-radius:6px;background:#ecfdf5;color:#065f46;margin-bottom:6px}
.ws-vorschau__empfehlung .wsv-e__tab td,.ws-vorschau__empfehlung .wsv-e__tab th{padding:3px 6px;font-size:12px}
.ws-vorschau__empfehlung .wsv-e--ok td:first-child{color:#15803d;font-weight:600}
.ws-vorschau__empfehlung .wsv-e--warn td:first-child{color:#b45309}
.ws-vorschau__empfehlung .wsv-e--nok td{color:#9ca3af}
.ws-vorschau__empfehlung .wsv-e--aktuell td{background:#f8fafc}
.ws-empfehlung{margin-top:6px;padding:6px 8px;border-radius:6px;background:#fef3c7;color:#78350f;font-size:11.5px;line-height:1.35}
.ws-empfehlung--ok{background:#ecfdf5;color:#065f46}

/* ── MANV-Planübung (dynamische Patientensimulation) ── .mp-* ── */
.mp-sk { display: inline-block; padding: 1px 7px; border-radius: 4px; color: #fff; font-size: 11px; font-weight: 700; letter-spacing: .3px; white-space: nowrap; }
.mp-sk--sk1 { background: #C0271D; } .mp-sk--sk2 { background: #B07E00; } .mp-sk--sk3 { background: #1E7A34; } .mp-sk--sk4 { background: #2F5E88; } .mp-sk--ex { background: #3A3530; } .mp-sk--none { background: #9ca3af; }
.mp-hinweis { background: #fef3c7; border: 1px solid #f59e0b; border-radius: 8px; padding: 8px 10px; font-size: 13px; margin: 0 0 10px; }
.mp-verlauf { display: grid; gap: 8px; }
.mp-zustand { border: 1px solid var(--resq-border); border-radius: 8px; padding: 8px 10px; }
.mp-zustand--tod { background: #f3f4f6; }
.mp-zustand__kopf { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 4px; }
.mp-vitals { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 6px; font-size: 13px; }
.mp-vitals span small { display: block; font-size: 10px; color: var(--resq-text-secondary); text-transform: uppercase; letter-spacing: .04em; }
.mp-vitals--gross { gap: 8px; }
.mp-vitals--gross span { background: #f3f4f6; border-radius: 8px; padding: 6px 10px; font-size: 18px; font-weight: 700; min-width: 84px; }
.mp-vitals--gross span small { font-weight: 500; }
.mp-row--tod td { opacity: .55; }
/* Übungsfläche */
.mp-ueb { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 12px; padding: 12px; height: 100%; min-height: 0; overflow: auto; }
.mp-ueb__spalte { display: grid; gap: 10px; align-content: start; min-width: 0; }
.mp-werkzeuge { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 8px; }
.mp-werkzeug { display: grid; gap: 2px; border: 1px solid var(--resq-border); border-radius: 8px; padding: 10px 12px; text-decoration: none; color: inherit; background: #fff; }
.mp-werkzeug span { font-size: 11.5px; color: var(--resq-text-secondary); }
.mp-werkzeug:hover { border-color: var(--resq-blue); }
.mp-werkzeug--primary { border-color: #7C3AED; background: #f5f3ff; }
.mp-meldung { border-left: 4px solid #cbd5e1; padding: 4px 8px; margin-bottom: 6px; font-size: 13px; background: #fff; border-radius: 0 6px 6px 0; }
.mp-meldung--dringend { border-left-color: #B07E00; } .mp-meldung--sofort { border-left-color: #C0271D; }
/* Patientenkarte (Tablet) */
.mp { max-width: 720px; margin: 0 auto; padding: 12px; }
.mp-schritt { display: none; background: #fff; border-radius: 12px; padding: 16px; }
.mp-schritt.aktiv { display: block; }
.mp-titel { font-size: 20px; font-weight: 700; margin: 0 0 12px; text-align: center; }
.mp-info { text-align: center; color: #6b7280; font-size: 14px; margin: 8px 0; }
.mp-reihe { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.mp-input { font-size: 22px; padding: 12px; text-transform: uppercase; }
#mp-video { width: 100%; border-radius: 10px; background: #000; max-height: 42vh; object-fit: cover; }
.mp-btn { border: none; border-radius: 10px; padding: 14px 12px; font-size: 17px; font-weight: 800; color: #fff; cursor: pointer; }
.mp-btn:disabled { opacity: .4; cursor: not-allowed; }
.mp-btn--dunkel { background: #1f2937; } .mp-btn--hell { background: #e5e7eb; color: #1f2937; padding: 8px 12px; font-size: 14px; }
.mp-btn--sk1 { background: #C0271D; } .mp-btn--sk2 { background: #B07E00; } .mp-btn--sk3 { background: #1E7A34; } .mp-btn--sk4 { background: #2F5E88; } .mp-btn--ex { background: #3A3530; }
.mp-karte__kopf { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.mp-kennung { font-size: 32px; font-weight: 800; font-variant-numeric: tabular-nums; line-height: 1; }
.mp-befund { font-size: 18px; line-height: 1.35; margin: 12px 0; padding: 12px; background: #fff7ed; border: 1px solid #fdba74; border-radius: 10px; }
.mp-status { font-size: 14px; color: #374151; margin: 8px 0 12px; display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.mp-label { font-size: 11px; text-transform: uppercase; letter-spacing: .5px; color: #6b7280; margin: 12px 0 6px; }
.mp-sk-reihe { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; }
.mp-massnahmen { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 6px; }
.mp-m { border: 2px solid #d1d5db; border-radius: 8px; background: #fff; padding: 10px 8px; font-size: 14px; font-weight: 600; cursor: pointer; text-align: left; }
.mp-m:disabled { opacity: .35; cursor: not-allowed; }
.mp-m--erw { border-style: dashed; } .mp-m--getan { background: #1f2937; color: #fff; border-color: #1f2937; }
.mp-getan { font-size: 12.5px; color: #374151; margin-top: 10px; display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.mp-getan span { background: #f3f4f6; border-radius: 4px; padding: 1px 6px; }
.mp-bediener { font-size: 12px; background: rgba(255,255,255,.18); border-radius: 12px; padding: 2px 10px; cursor: pointer; margin-right: 8px; }
/* Evakuierungsrechner */
.ev-hinweise{display:grid;gap:4px;margin-top:8px}
.ev-hinweis{padding:5px 9px;border-radius:6px;background:#fef3c7;color:#78350f;font-size:12.5px}
.ev-hinweis--info{background:#eff6ff;color:#1e3a8a}
.ev-legende{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px;font-size:11.5px;color:#374151}
.ev-legende span{display:inline-flex;align-items:center;gap:4px}
.ev-legende i{width:12px;height:12px;border-radius:3px;display:inline-block;border:1px solid #0002}
.ev-filter{display:flex;flex-wrap:wrap;gap:4px}
.ev-filter button{font-size:11.5px;padding:2px 9px;border-radius:999px;border:1px solid #d1d5db;background:#fff;cursor:pointer}
.ev-filter button.ist-aktiv{background:#111;color:#fff;border-color:#111}
.ev-absperr{display:inline-flex;gap:5px;align-items:center;padding:3px 9px;border-radius:999px;background:#fee2e2;color:#7f1d1d;font-size:12px;cursor:pointer}
.ev-popup{font-size:12.5px;min-width:220px}
.ev-popup h4{margin:0 0 4px;font-size:13px}
.ev-popup .ev-popup__status{display:flex;flex-wrap:wrap;gap:3px;margin:6px 0}
.ev-popup .ev-popup__status button{font-size:11px;padding:2px 7px;border-radius:999px;border:1px solid #d1d5db;background:#fff;cursor:pointer}
.ev-popup .ev-popup__status button.ist-aktiv{background:#15803d;color:#fff;border-color:#15803d}
.ev-popup label{display:block;font-size:11px;color:#6b7280;margin-top:4px}
.ev-popup input{width:100%;font-size:12px;padding:2px 5px;border:1px solid #d1d5db;border-radius:4px}
.ev-mk-sammel{width:26px;height:26px;border-radius:50%;background:#15803d;color:#fff;border:2px solid #fff;box-shadow:0 1px 4px #0006;font:700 13px/22px sans-serif;text-align:center;cursor:pointer}
.ev-mk-sammel--notunterkunft{background:#7c3aed}.ev-mk-sammel--betreuung{background:#0e7490}.ev-mk-sammel--bushalt{background:#b45309}
.ev-mk-absperr{min-width:22px;height:22px;padding:0 5px;border-radius:4px;background:#dc2626;color:#fff;border:2px solid #fff;box-shadow:0 1px 4px #0006;font:700 11px/18px sans-serif;text-align:center;cursor:pointer}
.ev-mk-zentrum{width:14px;height:14px;border-radius:50%;background:#111;border:2px solid #fff;box-shadow:0 0 0 2px #dc2626}
.ev-inline{font-size:12px;padding:2px 5px}

/* ---------------------------------------------------------------------------
 * Lagerverwaltung — Bereichskopf (Kennzahl- + Funktions-Kacheln über der Liste)
 * ------------------------------------------------------------------------- */
.inv-kopf{display:flex;flex-direction:column;gap:10px;margin-bottom:16px;}
.inv-kopf__zeile{display:grid;gap:8px;}
.inv-kopf__zeile--kpi{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));}
.inv-kopf__zeile--fn{grid-template-columns:repeat(auto-fill,minmax(170px,1fr));}
.inv-kpi{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border:1px solid var(--resq-border);border-radius:10px;background:var(--resq-surface);text-decoration:none;color:var(--resq-text);transition:border-color .15s,box-shadow .15s;}
.inv-kpi:hover{border-color:var(--resq-navy);box-shadow:0 1px 8px rgba(24,95,165,.08);}
.inv-kpi.is-active{border-color:var(--resq-navy);box-shadow:inset 0 0 0 1px var(--resq-navy);}
.inv-kpi__wert{font-size:22px;font-weight:700;line-height:1.1;}
.inv-kpi__label{font-size:11px;color:var(--resq-text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.inv-kpi--warn{border-color:#fecaca;background:#fef2f2;}
.inv-kpi--warn .inv-kpi__wert{color:#b91c1c;}
.inv-fn{display:flex;align-items:center;gap:10px;padding:9px 12px;border:1px solid var(--resq-border);border-radius:10px;background:var(--resq-surface);text-decoration:none;color:var(--resq-text);font-size:13px;font-weight:600;transition:border-color .15s,box-shadow .15s;}
.inv-fn:hover{border-color:var(--resq-navy);box-shadow:0 1px 8px rgba(24,95,165,.08);}
.inv-fn__icon{font-size:18px;width:24px;text-align:center;flex-shrink:0;display:inline-flex;justify-content:center;align-items:center;color:var(--resq-navy);}
.inv-fn__label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
@media (max-width: 900px){
  .inv-kopf__zeile{display:flex;overflow-x:auto;padding-bottom:4px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;}
  .inv-kpi{min-width:130px;flex:0 0 auto;scroll-snap-align:start;}
  .inv-fn{min-width:170px;flex:0 0 auto;scroll-snap-align:start;}
}

/* ---------------------------------------------------------------------------
 * Brandverhütungsschau (apps/objects, Präfix .bvs-) — Ampel, Kennzahlen,
 * Vor-Ort-Tablet-Formular
 * ------------------------------------------------------------------------- */
.bvs-ampel{display:inline-block;width:10px;height:10px;border-radius:50%;flex-shrink:0;vertical-align:middle;background:#9ca3af;}
.bvs-ampel--rot{background:#dc2626;box-shadow:0 0 0 3px #fee2e2;}
.bvs-ampel--gelb{background:#eab308;box-shadow:0 0 0 3px #fef9c3;}
.bvs-ampel--gruen{background:#16a34a;box-shadow:0 0 0 3px #dcfce7;}
.bvs-ampel--grau{background:#cbd5e1;}
.bvs-status{display:inline-flex;align-items:center;gap:6px;padding:2px 9px 2px 7px;border-radius:999px;font-size:12px;font-weight:500;white-space:nowrap;background:#f3f4f6;color:#4b5563;}
.bvs-status--rot{background:#fef2f2;color:#b91c1c;}
.bvs-status--gelb{background:#fefce8;color:#854d0e;}
.bvs-status--gruen{background:#f0fdf4;color:#166534;}
.bvs-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;margin-bottom:14px;}
.bvs-kpi{display:flex;gap:10px;align-items:center;padding:10px 12px;border:1px solid var(--resq-border);border-radius:10px;background:var(--resq-surface);text-decoration:none;color:var(--resq-text-primary);transition:border-color .15s,box-shadow .15s;}
.bvs-kpi:hover{border-color:var(--resq-navy);}
.bvs-kpi.is-active{border-color:var(--resq-navy);box-shadow:inset 0 0 0 1px var(--resq-navy);}
.bvs-kpi__wert{font-size:22px;font-weight:700;line-height:1;}
.bvs-kpi__label{font-size:11.5px;color:var(--resq-text-secondary);}
.bvs-kpi--rot .bvs-kpi__wert{color:#b91c1c;}
.bvs-kpi--gelb .bvs-kpi__wert{color:#a16207;}
.bvs-kpi--gruen .bvs-kpi__wert{color:#15803d;}
.bvs-zeile-rot td:first-child{box-shadow:inset 3px 0 0 #dc2626;}
.bvs-zeile-gelb td:first-child{box-shadow:inset 3px 0 0 #eab308;}
.bvs-zeile-gruen td:first-child{box-shadow:inset 3px 0 0 #16a34a;}
.bvs-legende{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--resq-text-secondary);margin:4px 0 12px;}
.bvs-legende span{display:inline-flex;align-items:center;gap:6px;}
.bvs-kachel{display:block;padding:14px 16px;border:1px solid var(--resq-border);border-radius:10px;background:var(--resq-surface);text-decoration:none;color:var(--resq-text-primary);}
.bvs-kachel:hover{border-color:var(--resq-navy);}
.bvs-liste{display:flex;flex-direction:column;}
.bvs-liste__eintrag{display:flex;gap:12px;align-items:center;padding:12px 16px;border-bottom:1px solid var(--resq-border);min-height:56px;}
.bvs-liste__eintrag:last-child{border-bottom:0;}
.bvs-liste__haupt{flex:1;min-width:0;}
.bvs-liste__titel{font-weight:600;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.bvs-liste__meta{font-size:12px;color:var(--resq-text-secondary);}
.bvs-btn-gross{min-height:44px;padding:0 18px;font-size:14px;}

/* --- Vor-Ort-Formular (Tablet, ohne Sidebar) ----------------------------- */
.bvs-vo{min-height:100vh;background:var(--resq-bg);display:flex;flex-direction:column;}
.bvs-vo__kopf{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:12px;padding:8px 14px;background:var(--resq-navy);color:#fff;min-height:56px;}
.bvs-vo__zurueck{display:inline-flex;align-items:center;justify-content:center;min-width:44px;height:40px;padding:0 10px;border-radius:8px;border:1px solid rgba(255,255,255,.25);color:#fff;text-decoration:none;font-size:13px;gap:6px;}
.bvs-vo__zurueck:hover{background:rgba(255,255,255,.1);}
.bvs-vo__titel{flex:1;min-width:0;line-height:1.25;}
.bvs-vo__titel strong{display:block;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.bvs-vo__titel span{font-size:12px;opacity:.75;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;}
.bvs-save{font-size:12px;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;padding:4px 10px;border-radius:999px;background:rgba(255,255,255,.12);}
.bvs-save::before{content:"";width:8px;height:8px;border-radius:50%;background:#4ade80;}
.bvs-save--laeuft::before{background:#fde047;}
.bvs-save--offline::before{background:#f97316;}
.bvs-save--fehler::before{background:#ef4444;}
.bvs-vo__rumpf{flex:1;display:grid;grid-template-columns:250px minmax(0,1fr);gap:0;}
.bvs-vo__nav{position:sticky;top:56px;align-self:start;max-height:calc(100vh - 56px);overflow-y:auto;padding:12px 8px;border-right:1px solid var(--resq-border);background:var(--resq-surface);}
.bvs-nav__eintrag{display:flex;align-items:center;gap:8px;width:100%;text-align:left;padding:10px 12px;min-height:44px;border:0;background:transparent;border-radius:8px;font:inherit;font-size:13.5px;color:var(--resq-text-primary);cursor:pointer;}
.bvs-nav__eintrag:hover{background:#f3f4f6;}
.bvs-nav__eintrag.is-active{background:var(--resq-navy);color:#fff;}
.bvs-nav__eintrag .bvs-nav__zahl{margin-left:auto;font-size:11px;min-width:20px;height:20px;border-radius:10px;padding:0 6px;display:inline-flex;align-items:center;justify-content:center;background:#e5e7eb;color:#374151;}
.bvs-nav__eintrag.is-active .bvs-nav__zahl{background:rgba(255,255,255,.2);color:#fff;}
.bvs-nav__eintrag .bvs-nav__zahl--rot{background:#fee2e2;color:#b91c1c;}
.bvs-nav__trenner{height:1px;background:var(--resq-border);margin:8px 6px;}
.bvs-vo__main{padding:16px 18px 120px;max-width:960px;width:100%;}
.bvs-sek__titel{font-family:Syne,sans-serif;font-size:19px;font-weight:600;margin:0 0 4px;}
.bvs-sek__hinweis{font-size:13px;color:var(--resq-text-secondary);background:#f8fafc;border:1px solid var(--resq-border);border-radius:8px;padding:8px 12px;margin:8px 0 14px;white-space:pre-wrap;}
.bvs-karte{background:var(--resq-surface);border:1px solid var(--resq-border);border-radius:12px;padding:14px 16px;margin-bottom:12px;}
.bvs-feld{margin-bottom:16px;}
.bvs-feld:last-child{margin-bottom:0;}
.bvs-feld__label{display:block;font-size:13px;font-weight:600;margin-bottom:6px;}
.bvs-feld__label em{color:#b91c1c;font-style:normal;}
.bvs-feld__hilfe{font-size:12px;color:var(--resq-text-secondary);margin-top:4px;}
.bvs-vo .resq-input,.bvs-vo .resq-select,.bvs-vo textarea{font-size:16px;min-height:44px;}
.bvs-vo textarea.resq-input{min-height:88px;line-height:1.45;}
.bvs-seg{display:inline-flex;flex-wrap:wrap;gap:6px;}
.bvs-seg__opt{min-height:44px;min-width:88px;padding:0 16px;border-radius:10px;border:1px solid var(--resq-border-strong);background:var(--resq-surface);font:inherit;font-size:14px;cursor:pointer;color:var(--resq-text-primary);}
.bvs-seg__opt.is-on{background:var(--resq-navy);border-color:var(--resq-navy);color:#fff;}
.bvs-seg__opt--ja.is-on{background:#15803d;border-color:#15803d;}
.bvs-seg__opt--nein.is-on{background:#b91c1c;border-color:#b91c1c;}
.bvs-seg__opt--teilweise.is-on{background:#a16207;border-color:#a16207;}
.bvs-maengel__kopf{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:18px 0 8px;flex-wrap:wrap;}
.bvs-maengel__kopf h3{font-size:15px;font-weight:600;margin:0;}
.bvs-mangel{display:grid;grid-template-columns:34px minmax(0,1fr);gap:10px;background:var(--resq-surface);border:1px solid var(--resq-border);border-left:3px solid #b91c1c;border-radius:10px;padding:12px;margin-bottom:10px;}
.bvs-mangel__nr{width:28px;height:28px;border-radius:50%;background:#fef2f2;color:#b91c1c;font-weight:700;font-size:13px;display:flex;align-items:center;justify-content:center;}
.bvs-mangel__meta{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:8px;}
.bvs-mangel__meta .resq-input{flex:1;min-width:160px;}
.bvs-mangel__frist{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--resq-text-secondary);}
.bvs-mangel__frist .resq-input{min-width:150px;flex:0 0 auto;}
.bvs-leer{font-size:13px;color:var(--resq-text-secondary);padding:14px;border:1px dashed var(--resq-border-strong);border-radius:10px;text-align:center;}
.bvs-sheet__bg{position:fixed;inset:0;background:rgba(17,24,39,.45);z-index:60;}
.bvs-sheet{position:fixed;left:0;right:0;bottom:0;z-index:61;background:var(--resq-surface);border-radius:16px 16px 0 0;max-height:86vh;display:flex;flex-direction:column;box-shadow:0 -10px 30px rgba(0,0,0,.2);max-width:980px;margin:0 auto;}
.bvs-sheet__kopf{padding:14px 16px 10px;border-bottom:1px solid var(--resq-border);display:flex;flex-direction:column;gap:10px;}
.bvs-sheet__griff{width:44px;height:4px;border-radius:2px;background:#d1d5db;margin:0 auto 4px;}
.bvs-sheet__inhalt{overflow-y:auto;padding:6px 8px 20px;}
.bvs-chips{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px;-webkit-overflow-scrolling:touch;}
.bvs-chip{flex:0 0 auto;min-height:36px;padding:0 12px;border-radius:999px;border:1px solid var(--resq-border-strong);background:var(--resq-surface);font:inherit;font-size:13px;cursor:pointer;white-space:nowrap;}
.bvs-chip.is-on{background:var(--resq-navy);border-color:var(--resq-navy);color:#fff;}
.bvs-satz{display:block;width:100%;text-align:left;padding:12px;min-height:56px;border:0;border-bottom:1px solid var(--resq-border);background:transparent;font:inherit;cursor:pointer;border-radius:8px;}
.bvs-satz:hover,.bvs-satz:focus-visible{background:#f3f4f6;}
.bvs-satz__kopf{font-size:13px;font-weight:600;display:flex;gap:8px;align-items:baseline;}
.bvs-satz__nr{font-family:ui-monospace,monospace;color:var(--resq-text-secondary);font-weight:600;}
.bvs-satz__text{font-size:13px;color:var(--resq-text-secondary);margin-top:2px;line-height:1.4;}
.bvs-psv{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--resq-border);}
.bvs-psv:last-child{border-bottom:0;}
.bvs-psv__name{font-weight:600;font-size:14px;}
.bvs-psv__meta{font-size:12px;color:var(--resq-text-secondary);}
.bvs-psv__form{grid-column:1 / -1;background:#f8fafc;border:1px solid var(--resq-border);border-radius:10px;padding:12px;display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;}
.bvs-psv__form label{font-size:12px;font-weight:600;display:block;margin-bottom:4px;}
.bvs-fotos{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;}
.bvs-foto{position:relative;border-radius:10px;overflow:hidden;border:1px solid var(--resq-border);background:#f3f4f6;aspect-ratio:4/3;}
.bvs-foto img{width:100%;height:100%;object-fit:cover;display:block;}
.bvs-foto__weg{position:absolute;top:6px;right:6px;width:32px;height:32px;border-radius:50%;border:0;background:rgba(17,24,39,.65);color:#fff;font-size:16px;cursor:pointer;}
.bvs-foto__cap{position:absolute;left:0;right:0;bottom:0;padding:4px 8px;font-size:11px;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.6));}
.bvs-sig{border:1px dashed var(--resq-border-strong);border-radius:10px;background:#fff;touch-action:none;width:100%;height:180px;display:block;}
.bvs-fussleiste{position:fixed;left:250px;right:0;bottom:0;z-index:25;display:flex;gap:10px;justify-content:space-between;align-items:center;padding:10px 18px;background:rgba(255,255,255,.96);border-top:1px solid var(--resq-border);backdrop-filter:blur(6px);}
.bvs-fehlerliste{background:#fef2f2;border:1px solid #fecaca;color:#991b1b;border-radius:10px;padding:10px 14px;font-size:13px;margin-bottom:12px;}
.bvs-fehlerliste ul{margin:4px 0 0 18px;padding:0;}
.bvs-banner{padding:10px 14px;border-radius:10px;font-size:13px;margin-bottom:12px;}
.bvs-banner--warn{background:#fffbeb;border:1px solid #fde68a;color:#92400e;}
.bvs-banner--info{background:#eff6ff;border:1px solid #bfdbfe;color:#1e40af;}
@media (max-width: 900px){
  .bvs-vo__rumpf{grid-template-columns:minmax(0,1fr);}
  .bvs-vo__nav{position:sticky;top:56px;z-index:20;max-height:none;display:flex;gap:6px;overflow-x:auto;border-right:0;border-bottom:1px solid var(--resq-border);padding:8px;}
  .bvs-nav__eintrag{width:auto;flex:0 0 auto;white-space:nowrap;}
  .bvs-nav__trenner{display:none;}
  .bvs-vo__main{padding:14px 12px 120px;}
  .bvs-fussleiste{left:0;}
}

/* --- Schablonen-Editor ----------------------------------------------------- */
.bvs-ed__abschnitt{border:1px solid var(--resq-border);border-radius:10px;background:var(--resq-surface);margin-bottom:12px;}
.bvs-ed__kopf{display:flex;gap:8px;align-items:center;padding:10px 12px;border-bottom:1px solid var(--resq-border);background:#f8fafc;border-radius:10px 10px 0 0;flex-wrap:wrap;}
.bvs-ed__kopf .resq-input{flex:1;min-width:200px;font-weight:600;}
.bvs-ed__rumpf{padding:10px 12px;}
.bvs-ed__feld{display:grid;grid-template-columns:minmax(0,2fr) 170px auto;gap:8px;align-items:start;padding:8px 0;border-bottom:1px dashed var(--resq-border);}
.bvs-ed__feld:last-child{border-bottom:0;}
.bvs-ed__zusatz{grid-column:1 / -1;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:8px;}
.bvs-ed__klein{font-size:11px;color:var(--resq-text-secondary);display:block;margin-bottom:2px;}
.bvs-ed__knopf{min-width:34px;height:34px;border-radius:6px;border:1px solid var(--resq-border);background:#fff;cursor:pointer;font-size:13px;}
.bvs-ed__knopf:hover{border-color:var(--resq-navy);}
@media (max-width: 700px){.bvs-ed__feld{grid-template-columns:minmax(0,1fr);}}

/* ============================================================================
   Medien & Presse (apps/medien) — Präfix .med-
   ========================================================================== */
.med-alben { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; }
.med-album { display: block; text-decoration: none; color: inherit; border: 1px solid var(--resq-border); border-radius: var(--resq-radius-lg); background: var(--resq-surface); overflow: hidden; }
.med-album:hover { border-color: var(--resq-navy); }
.med-album__bild { position: relative; aspect-ratio: 4 / 3; background: #0b1220; }
.med-album__bild img { width: 100%; height: 100%; object-fit: cover; display: block; }
.med-album__leer { display: flex; align-items: center; justify-content: center; height: 100%; color: #94a3b8; font-size: 12px; }
.med-album__badge { position: absolute; right: 8px; top: 8px; background: rgba(16,185,129,.92); color: #fff; font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 999px; }
.med-album__text { padding: 8px 10px; font-size: 13.5px; }
.med-drop { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; padding: 14px; border: 2px dashed var(--resq-border-strong, #cbd5e1); border-radius: var(--resq-radius-lg); }
.med-drop.is-over { border-color: var(--resq-navy); background: #f3f4f6; }
.med-progress { height: 6px; background: #e5e7eb; border-radius: 3px; overflow: hidden; margin-top: 4px; }
.med-progress div { height: 100%; background: var(--resq-navy); transition: width .2s; }
.med-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.med-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 8px; }
.med-grid--klein { grid-template-columns: repeat(auto-fill, minmax(90px, 1fr)); }
.med-kachel { position: relative; border: 2px solid transparent; border-radius: var(--resq-radius); background: var(--resq-surface); overflow: hidden; }
.med-kachel.is-sel { border-color: var(--resq-navy); }
.med-kachel__check { position: absolute; left: 6px; top: 6px; z-index: 2; background: rgba(255,255,255,.9); border-radius: 4px; padding: 2px 4px; display: flex; }
.med-kachel__check input { width: 16px; height: 16px; margin: 0; }
.med-kachel__bild { display: block; aspect-ratio: 1; background: #0b1220; }
.med-kachel__bild img { width: 100%; height: 100%; object-fit: cover; display: block; }
.med-kachel__leer { display: flex; align-items: center; justify-content: center; height: 100%; color: #94a3b8; font-size: 11.5px; padding: 8px; text-align: center; }
.med-kachel__fuss { display: flex; justify-content: space-between; align-items: center; gap: 4px; padding: 4px 6px; font-size: 11px; }
.med-kachel__titel { padding: 0 6px 6px; font-size: 12px; }
.med-stufe { display: inline-block; font-size: 10.5px; font-weight: 600; padding: 1px 7px; border-radius: 999px; background: #e5e7eb; color: #374151; white-space: nowrap; }
.med-stufe--entwurf { background: #fef3c7; color: #92400e; }
.med-stufe--intern { background: #dbeafe; color: #1e40af; }
.med-stufe--presse { background: #d1fae5; color: #065f46; }
.med-stufe--oeffentlich { background: #111827; color: #fff; }
.med-hinweis { border-left: 4px solid var(--resq-amber, #f59e0b); background: var(--resq-amber-bg, #fffbeb); border-radius: var(--resq-radius); padding: 8px 12px; font-size: 13px; line-height: 1.45; }
.med-dl { display: grid; grid-template-columns: max-content 1fr; gap: 4px 12px; margin: 10px 0 0; font-size: 12.5px; }
.med-dl dt { color: var(--resq-text-muted); }
.med-dl dd { margin: 0; }
.med-link { display: flex; gap: 6px; align-items: center; margin: 10px 0; }
.med-link input { flex: 1; }
.med-public__kopf { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }
.med-public__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; margin-top: 16px; }
.med-public__foto { margin: 0; border: 1px solid var(--resq-border); border-radius: var(--resq-radius-lg); overflow: hidden; background: var(--resq-surface); }
.med-public__foto img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; display: block; background: #0b1220; }
.med-public__foto figcaption { padding: 10px 12px; font-size: 13px; line-height: 1.45; }
@media (max-width: 720px) { .med-grid { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); } .med-dl { grid-template-columns: 1fr; } }

/* ==========================================================================
   Krisenstab (apps/krisenstab) — Präfix .ks-*
   ========================================================================== */
.ks-nav { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 14px; }
.ks-nav__tabs { display: flex; gap: 6px; flex-wrap: wrap; }
.ks-nav__status { display: flex; gap: 8px; align-items: center; font-size: 12px; flex-wrap: wrap; }
.ks-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--resq-text-muted); vertical-align: middle; margin-left: 4px; }
.ks-dot--live { background: #16a34a; box-shadow: 0 0 0 3px rgba(22,163,74,.2); }
.ks-h3 { margin: 18px 0 10px; font-size: 15px; font-weight: 600; }
.ks-h3--erste { margin-top: 0; }
.ks-h4 { margin: 14px 0 6px; font-size: 13px; font-weight: 600; }
.ks-klein { font-size: 12px; }
.ks-intro { max-width: 78ch; margin: 0 0 14px; font-size: 13px; }
.ks-mt { margin-top: 14px; } .ks-mt-klein { margin-top: 8px; } .ks-mb { margin-bottom: 14px; }
.ks-schmal { max-width: 640px; }
.ks-inline { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.ks-rechts { text-align: right; } .ks-rechts-auto { margin-left: auto; }
.ks-select-auto { width: auto; font-size: 12px; }
.ks-input-klein { width: 170px; } .ks-input-mittel { width: 220px; } .ks-input-breit { flex: 1; min-width: 260px; }
.ks-check { display: flex; gap: 8px; align-items: center; font-size: 13px; cursor: pointer; }
.ks-check input { width: auto; }
.ks-fehler { color: var(--resq-red-status, #b91c1c); font-size: 12px; }
.ks-hinweis { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; justify-content: space-between; }
.ks-warn { color: #b45309; }
.ks-tabelle { overflow-x: auto; }
.ks-inaktiv { opacity: .55; }
.ks-anlass { white-space: pre-wrap; font-size: 14px; }
.ks-lagekarte { display: block; text-decoration: none; color: inherit; margin-bottom: 10px; }
.ks-lagekarte__kopf { display: flex; gap: 10px; align-items: center; justify-content: space-between; }
.ks-kpis { display: flex; gap: 16px; flex-wrap: wrap; font-size: 12px; margin-top: 8px; color: var(--resq-text-secondary); }
.ks-kpis b { color: var(--resq-text-primary, #111); font-size: 14px; }
.ks-kpi-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; margin-bottom: 16px; }
.ks-kpi { text-decoration: none; color: inherit; }
.ks-kpi__zahl { font-size: 28px; font-weight: 600; line-height: 1.1; margin: 2px 0; font-variant-numeric: tabular-nums; }
.ks-zwei { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.ks-zwei--breit { grid-template-columns: 3fr 2fr; }
@media (max-width: 960px) { .ks-zwei, .ks-zwei--breit { grid-template-columns: 1fr; } }
.ks-zeile { display: flex; gap: 10px; align-items: baseline; padding: 6px 0; border-bottom: 1px solid var(--resq-border, #eef0f3); font-size: 13px; }
.ks-zeile:last-child { border-bottom: 0; }
.ks-zeile--block { flex-direction: column; gap: 2px; align-items: stretch; }
.ks-zeile--ueberfaellig { background: #fff7ed; }
.ks-zeile .ks-text { flex: 1; }
.ks-nr { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-weight: 600; white-space: nowrap; font-size: 12.5px; }
.ks-zeit { min-width: 84px; white-space: nowrap; }
.ks-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.ks-chip { display: inline-flex; gap: 5px; align-items: center; padding: 3px 9px; border-radius: 999px; background: #f3f4f6; font-size: 12px; border: 1px solid transparent; }
.ks-chip--anwesend { background: #dcfce7; border-color: #86efac; }
.ks-chip--arbeitsphase { background: #dbeafe; border-color: #93c5fd; }
.ks-chip--einberufen { background: #fef3c7; border-color: #fcd34d; }
.ks-chip--abgemeldet { background: #f3f4f6; opacity: .6; }
.ks-chip--leer { background: #fff; border-color: var(--resq-border, #e5e7eb); color: var(--resq-text-secondary); }
.ks-tag { display: inline-block; font-family: ui-monospace, Menlo, monospace; font-size: 11.5px; padding: 1px 6px; border-radius: 4px; background: #eef2ff; color: #3730a3; margin-right: 3px; }
.ks-tag--fertig { background: #dcfce7; color: #166534; text-decoration: line-through; }
.ks-details summary { cursor: pointer; color: var(--resq-text-secondary); list-style: none; }
.ks-details summary::-webkit-details-marker { display: none; }
.ks-details--rechts { position: relative; }
.ks-popover { position: absolute; right: 0; z-index: 30; background: #fff; border: 1px solid var(--resq-border, #e5e7eb); border-radius: 8px; box-shadow: 0 10px 30px rgba(0,0,0,.12); padding: 10px; min-width: 420px; text-align: left; }
@media (max-width: 640px) { .ks-popover { position: static; min-width: 0; } }
/* Stab */
.ks-besetzung { padding: 8px 0; border-bottom: 1px solid var(--resq-border, #eef0f3); }
.ks-besetzung:last-child { border-bottom: 0; }
.ks-besetzung__kopf { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.ks-besetzung__aktionen { margin-top: 6px; display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
/* Sitzung */
.ks-phasen { display: flex; gap: 4px; margin-bottom: 12px; flex-wrap: wrap; }
.ks-phase { flex: 1 1 130px; margin: 0; }
.ks-phase button { width: 100%; display: flex; gap: 8px; align-items: center; border: 0; cursor: pointer; font: inherit; font-size: 13px; font-weight: 600; padding: 9px 12px 9px 16px; background: #e5e7eb; color: #4b5563; clip-path: polygon(0 0, calc(100% - 11px) 0, 100% 50%, calc(100% - 11px) 100%, 0 100%, 11px 50%); text-align: left; }
.ks-phase:first-child button { clip-path: polygon(0 0, calc(100% - 11px) 0, 100% 50%, calc(100% - 11px) 100%, 0 100%); }
.ks-phase button:disabled { cursor: default; }
.ks-phase--fertig button { background: #cbd5e1; color: #334155; }
.ks-phase--aktiv button { background: #1a2744; color: #fff; }
.ks-phase__nr { display: inline-flex; width: 20px; height: 20px; border-radius: 50%; background: rgba(255,255,255,.35); align-items: center; justify-content: center; font-size: 11px; }
.ks-phase--aktiv .ks-phase__nr { background: rgba(255,255,255,.25); }
.ks-sitzung-kopf { display: flex; justify-content: space-between; gap: 12px; align-items: center; flex-wrap: wrap; margin-bottom: 14px; font-size: 13px; }
.ks-anwesend { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 4px 14px; }
.ks-vortrag { padding: 10px 0; border-bottom: 1px solid var(--resq-border, #eef0f3); }
.ks-vortrag:last-child { border-bottom: 0; }
.ks-vortrag--fertig { opacity: .7; }
.ks-vortrag__kopf { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.ks-vortrag__text { margin-top: 6px; font-size: 13px; white-space: normal; }
.ks-prognose { color: #7a4b00; margin-top: 4px; }
.ks-sammeln { display: flex; gap: 8px; align-items: center; margin-bottom: 10px; flex-wrap: wrap; }
.ks-sammeln .resq-input { flex: 1; min-width: 220px; }
.ks-metaplan { display: flex; flex-direction: column; gap: 6px; }
.ks-streifen { display: flex; gap: 10px; align-items: center; padding: 8px 12px; background: #fffbeb; border: 1px solid #fcd34d; border-radius: 4px; font-size: 14px; box-shadow: 1px 2px 0 rgba(0,0,0,.06); }
.ks-streifen--neu { background: #fef9c3; }
.ks-streifen--block { flex-direction: column; align-items: stretch; gap: 6px; }
.ks-streifen__kopf { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.ks-streifen__nr { font-family: ui-monospace, Menlo, monospace; font-weight: 700; white-space: nowrap; }
.ks-streifen__text { flex: 1; }
.ks-streifen__rang { display: inline-flex; width: 26px; height: 26px; border-radius: 50%; background: #1a2744; color: #fff; align-items: center; justify-content: center; font-weight: 700; font-size: 13px; flex-shrink: 0; }
.ks-rangliste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.ks-rang-knoepfe { display: flex; gap: 4px; }
.ks-auftrag-form { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.ks-auftrag-form .resq-input:first-of-type { flex: 1; min-width: 220px; }
.ks-listen-kopf { margin-bottom: 8px; }
.ks-rueck { max-width: 260px; }
/* Arbeitsphase */
.ks-auftrag { padding: 10px 0; border-bottom: 1px solid var(--resq-border, #eef0f3); }
.ks-auftrag:last-child { border-bottom: 0; }
.ks-auftrag--ueberfaellig { border-left: 3px solid #f59e0b; padding-left: 10px; }
.ks-auftrag__kopf { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
/* Tagebuch */
.ks-tb-zeile { display: flex; gap: 8px; margin-bottom: 6px; flex-wrap: wrap; }
.ks-berichtigt td { text-decoration: line-through; color: var(--resq-text-secondary); }
.ks-berichtigt td:last-child { text-decoration: none; }
.ks-proto-kopf { margin-bottom: 8px; }
/* Krisenstab Phase 2 — Infrastruktur, Prognosen, Zeitstrahl, Monitor */
.ks-inline-form { display: inline; }
.ks-link { background: none; border: 0; color: var(--resq-blue, #1d4ed8); cursor: pointer; font: inherit; font-size: 12px; padding: 0 4px; }
.ks-link:hover { text-decoration: underline; }
.ks-tag--sektor { background: #ecfeff; color: #155e75; }
.ks-tag--prognose { background: #fff7ed; color: #9a3412; white-space: normal; }
.ks-kacheln { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; }
.ks-kacheln--einzel { grid-template-columns: 1fr; }
.ks-kachel { background: #fff; border: 1px solid var(--resq-border, #e5e7eb); border-left: 6px solid #9ca3af; border-radius: 8px; padding: 10px 12px; font-size: 13px; display: flex; flex-direction: column; gap: 5px; }
.ks-kachel--normal { border-left-color: #16a34a; }
.ks-kachel--eingeschraenkt { border-left-color: #f59e0b; background: #fffbeb; }
.ks-kachel--ausgefallen { border-left-color: #dc2626; background: #fef2f2; }
.ks-kachel--unbekannt { border-left-color: #9ca3af; }
.ks-kachel--leer { opacity: .7; }
.ks-kachel__kopf { display: flex; gap: 8px; align-items: center; }
.ks-kachel__kopf a { color: inherit; text-decoration: none; }
.ks-kachel__status { margin-left: auto; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .03em; }
.ks-kachel--ausgefallen .ks-kachel__status { color: #b91c1c; } .ks-kachel--eingeschraenkt .ks-kachel__status { color: #b45309; } .ks-kachel--normal .ks-kachel__status { color: #15803d; }
.ks-kachel__meta { font-size: 11.5px; color: var(--resq-text-secondary); }
.ks-kachel__text { font-size: 13px; }
.ks-kachel__liste { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 3px; }
.ks-kachel__liste li { display: flex; gap: 6px; align-items: baseline; flex-wrap: wrap; }
.ks-kachel__folgen { font-size: 12px; color: #7c2d12; background: #fff7ed; border-radius: 4px; padding: 4px 6px; }
.ks-kachel__fuss { display: flex; gap: 4px; flex-wrap: wrap; margin-top: 2px; }
.ks-ampel { display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: #9ca3af; flex-shrink: 0; }
.ks-ampel--klein { width: 9px; height: 9px; }
.ks-ampel--normal { background: #16a34a; } .ks-ampel--eingeschraenkt { background: #f59e0b; } .ks-ampel--ausgefallen { background: #dc2626; box-shadow: 0 0 0 3px rgba(220,38,38,.18); } .ks-ampel--unbekannt { background: #9ca3af; }
.ks-segment { display: flex; gap: 4px; flex-wrap: wrap; }
.ks-segment__item { display: inline-flex; gap: 6px; align-items: center; padding: 5px 10px; border: 1px solid var(--resq-border, #e5e7eb); border-radius: 999px; font-size: 12.5px; cursor: pointer; background: #fff; }
.ks-segment__item input { width: auto; margin: 0; }
.ks-segment__item:has(input:checked) { border-color: #1a2744; background: #eef1f7; font-weight: 600; }
.ks-segment__item--ausgefallen:has(input:checked) { border-color: #dc2626; background: #fef2f2; }
.ks-segment__item--eingeschraenkt:has(input:checked) { border-color: #f59e0b; background: #fffbeb; }
.ks-segment__item--normal:has(input:checked) { border-color: #16a34a; background: #f0fdf4; }
.ks-offen td { background: #f8fafc; }
.ks-prognose-karte { padding: 10px 0; border-bottom: 1px solid var(--resq-border, #eef0f3); }
.ks-prognose-karte:last-child { border-bottom: 0; }
.ks-prognose-karte--ueberholt { opacity: .55; }
.ks-prognose-karte__kopf { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.ks-prognose-karte__text { font-size: 14px; margin: 4px 0 2px; }
.ks-legende { display: flex; gap: 14px; flex-wrap: wrap; font-size: 12px; color: var(--resq-text-secondary); align-items: center; }
.ks-legende i.zt-balken { position: static; display: inline-block; width: 22px; height: 10px; vertical-align: middle; margin-right: 4px; }
/* Zeitstrahl */
.zt { display: flex; flex-direction: column; gap: 2px; font-size: 12px; overflow-x: auto; }
.zt-achse, .zt-spur { display: grid; grid-template-columns: 150px minmax(480px, 1fr); align-items: stretch; }
.zt-achse__spur { position: relative; height: 34px; border-bottom: 1px solid var(--resq-border, #e5e7eb); }
.zt-tick { position: absolute; bottom: 0; transform: translateX(-50%); color: var(--resq-text-secondary); font-size: 11px; white-space: nowrap; }
.zt-tick i { display: block; width: 1px; height: 6px; background: #cbd5e1; margin: 0 auto 2px; }
.zt-tick b { display: block; font-size: 10px; }
.zt-jetzt { position: absolute; top: 0; transform: translateX(-50%); color: #b91c1c; font-weight: 700; font-size: 11px; }
.zt-spur__name { padding: 6px 8px 6px 0; font-weight: 600; color: var(--resq-text-secondary); font-size: 12px; text-align: right; border-right: 2px solid var(--resq-border, #e5e7eb); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.zt-spur--infra .zt-spur__name { font-weight: 500; }
.zt-spur__lauf { position: relative; min-height: 30px; padding: 4px 0; border-bottom: 1px dashed var(--resq-border, #eef0f3); background: linear-gradient(90deg, rgba(0,0,0,.025) 50%, transparent 50%); }
.zt-jetzt-linie { position: absolute; top: 0; bottom: 0; width: 2px; background: #dc2626; opacity: .7; transform: translateX(-1px); z-index: 2; }
.zt-balken { position: absolute; top: 5px; height: 20px; border-radius: 4px; background: #94a3b8; color: #fff; font-size: 11px; line-height: 20px; padding: 0 6px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; box-sizing: border-box; z-index: 1; }
.zt-balken span { pointer-events: none; }
.zt-punkt { position: absolute; top: 4px; transform: translateX(-50%); z-index: 1; display: flex; flex-direction: column; align-items: center; max-width: 160px; }
.zt-punkt i { display: block; width: 10px; height: 10px; border-radius: 50%; background: #64748b; border: 2px solid #fff; box-shadow: 0 0 0 1px #64748b; }
.zt-punkt span { font-size: 10.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 160px; color: var(--resq-text-secondary); }
.zt-leer { color: #cbd5e1; padding: 0 6px; line-height: 22px; }
.zt-sitzung { background: #1a2744; } .zt-sitzung i { background: #1a2744; box-shadow: 0 0 0 1px #1a2744; }
.zt-geplant i { background: #fff; }
.zt-auftrag { background: #2563eb; } .zt-auftrag i { background: #2563eb; box-shadow: 0 0 0 1px #2563eb; }
.zt-auftrag.zt-ueberfaellig { background: #dc2626; }
.zt-auftrag.zt-fertig { background: #16a34a; opacity: .75; }
.zt-infra.zt-normal { background: #86efac; color: #14532d; } .zt-infra.zt-eingeschraenkt { background: #fbbf24; color: #78350f; } .zt-infra.zt-ausgefallen { background: #ef4444; } .zt-infra.zt-unbekannt { background: #cbd5e1; color: #334155; }
.zt-prognose { background: #fdba74; color: #7c2d12; border: 1px dashed #c2410c; line-height: 18px; } .zt-prognose i { background: #fb923c; box-shadow: 0 0 0 1px #c2410c; }
.zt-prognose.zt-wahrscheinlich { background: #fb923c; color: #fff; }
.zt-prognose.zt-unwahrscheinlich { background: #fff7ed; }
.zt-prognose.zt-p-eingetreten { border-style: solid; border-color: #b91c1c; } .zt-prognose.zt-p-nicht_eingetreten { opacity: .5; text-decoration: line-through; }
.zt-etb i { background: #7c3aed; box-shadow: 0 0 0 1px #7c3aed; }
/* Monitor (Vollbild) */
.ks-monitor { min-height: 100vh; background: #0f172a; color: #e2e8f0; padding: 14px 18px; display: flex; flex-direction: column; gap: 12px; font-size: 14px; }
.ks-monitor__kopf { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; border-bottom: 2px solid #334155; padding-bottom: 8px; }
.ks-monitor__titel { font-size: 24px; font-weight: 700; }
.ks-monitor__sub { color: #94a3b8; margin-left: 8px; }
.ks-monitor__kpis { display: flex; gap: 22px; align-items: center; flex-wrap: wrap; }
.ks-monitor__kpis b { font-size: 20px; }
.ks-monitor__uhr { font-family: ui-monospace, Menlo, monospace; font-size: 28px; font-weight: 700; letter-spacing: .04em; }
.ks-kacheln--monitor .ks-kachel { background: #1e293b; border-color: #334155; color: #e2e8f0; }
.ks-kacheln--monitor .ks-kachel--eingeschraenkt { background: #3a2a10; } .ks-kacheln--monitor .ks-kachel--ausgefallen { background: #451a1a; }
.ks-kacheln--monitor .ks-kachel__meta, .ks-kacheln--monitor .resq-muted { color: #94a3b8; }
.ks-kacheln--monitor .ks-kachel__folgen { background: #3a2a10; color: #fdba74; }
.ks-monitor__zeit .zt { background: #1e293b; border-radius: 8px; padding: 8px; }
.ks-monitor__zeit .zt-spur__name, .ks-monitor__zeit .zt-tick, .ks-monitor__zeit .zt-punkt span { color: #cbd5e1; }
.ks-monitor__zeit .zt-spur__lauf { background: linear-gradient(90deg, rgba(255,255,255,.04) 50%, transparent 50%); border-color: #334155; }
.ks-monitor__listen { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 12px; }
.ks-monitor__listen > div { background: #1e293b; border-radius: 8px; padding: 10px 12px; }
.ks-monitor__listen h3 { margin: 0 0 6px; font-size: 14px; color: #94a3b8; text-transform: uppercase; letter-spacing: .05em; }
.ks-monitor__listen .ks-zeile { border-color: #334155; } .ks-monitor__listen .ks-zeile--ueberfaellig { background: #451a1a; }
.ks-monitor .resq-muted { color: #94a3b8; }
.ks-chip--sektor { text-decoration: none; color: inherit; }
.ks-chip--sektor:hover { border-color: #1a2744; }
/* Krisenstab Phase 3 — Meldewesen, Warnung, BuMA, Vorhaben, EMS-Zugang */
.ks-zugang { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; }
.ks-zugang__qr { width: 150px; height: 150px; border: 1px solid var(--resq-border, #e5e7eb); border-radius: 6px; background: #fff; }
.ks-zugang .resq-input { font-family: ui-monospace, Menlo, monospace; font-size: 12px; }
.ks-banner { display: flex; gap: 12px; align-items: center; padding: 10px 14px; border-radius: 8px; font-size: 13px; margin-bottom: 14px; }
.ks-banner--warn { background: #fff7ed; border: 1px solid #fdba74; color: #7c2d12; }
.ks-banner--ok { background: #f0fdf4; border: 1px solid #86efac; color: #14532d; }
.ks-meldung { padding: 10px 0; border-bottom: 1px solid var(--resq-border, #eef0f3); }
.ks-meldung:last-child { border-bottom: 0; }
.ks-meldung__kopf { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.ks-meldung-text { white-space: pre-wrap; font-family: ui-monospace, Menlo, monospace; font-size: 12.5px; background: var(--resq-code-bg, #f8fafc); border: 1px solid var(--resq-border, #e5e7eb); border-radius: 6px; padding: 12px; }
.ks-warn-karte { padding: 10px 12px; border-radius: 8px; border: 1px solid var(--resq-border, #e5e7eb); margin-bottom: 8px; font-size: 13px; }
.ks-warn-karte--warnen, .ks-warn-karte--aktualisieren { border-left: 5px solid #dc2626; background: #fef2f2; }
.ks-warn-karte--entwarnung { border-left: 5px solid #16a34a; background: #f0fdf4; }
.ks-warn-karte--nicht_warnen { border-left: 5px solid #9ca3af; }
.ks-kanaele { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 4px 12px; font-size: 13px; }
.ks-kanaele label { display: flex; gap: 6px; align-items: center; }
.ks-kanaele input { width: auto; }
.ks-buma { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; }
.ks-buma__karte { background: #fff; border: 1px solid var(--resq-border, #e5e7eb); border-radius: 8px; padding: 10px 12px; }
.ks-buma__zahl { font-size: 24px; font-weight: 600; font-variant-numeric: tabular-nums; line-height: 1.1; }
.ks-buma__reihe { display: flex; gap: 14px; margin-top: 4px; }
.ks-vorhaben { padding: 10px 0; border-bottom: 1px solid var(--resq-border, #eef0f3); }
.ks-vorhaben:last-child { border-bottom: 0; }
.ks-vorhaben__kopf { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.ks-fortschritt { height: 8px; background: #e5e7eb; border-radius: 999px; overflow: hidden; width: 160px; display: inline-block; vertical-align: middle; }
.ks-fortschritt > i { display: block; height: 100%; background: #1a2744; }
.ks-fortschritt--kritisch > i { background: #dc2626; }
.ks-meilenstein { display: grid; grid-template-columns: 26px 1fr; gap: 8px; padding: 8px 0; border-bottom: 1px dashed var(--resq-border, #eef0f3); font-size: 13px; }
.ks-meilenstein__punkt { width: 18px; height: 18px; border-radius: 50%; border: 3px solid #94a3b8; background: #fff; margin-top: 2px; }
.ks-meilenstein--erreicht .ks-meilenstein__punkt { background: #16a34a; border-color: #16a34a; }
.ks-meilenstein--verfehlt .ks-meilenstein__punkt { background: #dc2626; border-color: #dc2626; }
.ks-meilenstein--kritisch .ks-meilenstein__punkt { border-color: #dc2626; box-shadow: 0 0 0 3px rgba(220,38,38,.2); }
.ks-meilenstein--blockiert { opacity: .7; }
.zt-vorhaben { background: #0f766e; } .zt-vorhaben.zt-fertig { opacity: .6; }
.zt-meilenstein i { background: #fff; border: 3px solid #0f766e; box-shadow: none; transform: rotate(45deg); border-radius: 2px; width: 9px; height: 9px; }
.zt-meilenstein.zt-m-erreicht i { background: #0f766e; } .zt-meilenstein.zt-m-verfehlt i, .zt-meilenstein.zt-ueberfaellig i { border-color: #dc2626; background: #dc2626; }
.zt-warnung { background: #b91c1c; } .zt-warnung i { background: #b91c1c; box-shadow: 0 0 0 1px #b91c1c; }
/* EMS-Fläche */
.ks-ems { max-width: 900px; margin: 0 auto; padding: 16px; font-size: 14px; }
.ks-ems__kopf { display: flex; justify-content: space-between; gap: 12px; align-items: center; flex-wrap: wrap; border-bottom: 2px solid #1a2744; padding-bottom: 8px; margin-bottom: 14px; }
.ks-ems__titel { font-size: 20px; font-weight: 700; }
.ks-ems .resq-card { margin-bottom: 12px; }
/* Krisenstab Phase 4 — Übung: Uhr, Regie, Beobachter-Bogen */
.ks-uhr { display: inline-flex; gap: 8px; align-items: baseline; padding: 3px 10px; border-radius: 6px; background: #1a2744; color: #fff; font-variant-numeric: tabular-nums; }
.ks-uhr__label { font-size: 10px; text-transform: uppercase; letter-spacing: .06em; opacity: .75; }
.ks-uhr__zeit { font-family: ui-monospace, Menlo, monospace; font-weight: 700; font-size: 14px; }
.ks-uhr__status { font-size: 11px; background: rgba(255,255,255,.18); padding: 0 6px; border-radius: 999px; }
.ks-uhr--laeuft .ks-uhr__zeit { color: #86efac; }
.ks-regie-uhr { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }
.ks-regie-uhr__anzeige .ks-uhr { font-size: 16px; padding: 6px 14px; }
.ks-regie-uhr__anzeige .ks-uhr__zeit { font-size: 20px; }
.ks-beob { display: grid; grid-template-columns: 1fr auto; gap: 4px 12px; padding: 6px 0; border-bottom: 1px dashed var(--resq-border, #eef0f3); font-size: 13px; align-items: center; }
.ks-beob__wahl { display: flex; gap: 10px; white-space: nowrap; }
.ks-beob__wahl label { display: inline-flex; gap: 4px; align-items: center; }
.ks-beob__wahl input { width: auto; }
.ks-beob__notiz { grid-column: 1 / -1; font-size: 12px; }
.ks-uebungsraum { border-left: 5px solid #0f766e; }

/* Krisenstab: Rollenwahl-Modal + Rollen-Dashboard (Arbeitsphase) */
.ks-rolle-btn { white-space: nowrap; }
.ks-rolle-modal__box { width: 820px; max-width: calc(100vw - 32px); }
.ks-rolle-modal__fuss { justify-content: space-between; }
.ks-rollen-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 6px; margin-bottom: 8px; }
.ks-rolle-karte { display: flex; flex-direction: column; gap: 2px; align-items: flex-start; padding: 8px 10px; border: 1px solid var(--resq-border, #e5e7eb); border-radius: 8px; background: #fff; cursor: pointer; font: inherit; text-align: left; color: inherit; }
.ks-rolle-karte:hover { border-color: #1a2744; box-shadow: 0 2px 8px rgba(0,0,0,.08); }
.ks-rolle-karte--besetzt { background: #f8fafc; }
.ks-rolle-karte--meine { background: #dbeafe; border-color: #93c5fd; }
.ks-rolle-karte__kurz { font-family: ui-monospace, Menlo, monospace; font-weight: 700; font-size: 13px; }
.ks-rolle-karte__name { font-size: 12px; line-height: 1.25; }
.ks-rolle-karte__wer { font-size: 11px; color: var(--resq-text-secondary); }
.ks-dash-kopf { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin-bottom: 14px; }
.ks-dash-kopf__rolle { display: flex; flex-direction: column; }
.ks-dash-kopf__rolle b { font-size: 18px; }
.ks-dash-kpis { display: flex; gap: 14px; flex-wrap: wrap; margin-left: auto; font-size: 12px; color: var(--resq-text-secondary); }
.ks-dash-kpis b { font-size: 16px; color: var(--resq-text-primary, #111); font-variant-numeric: tabular-nums; }
.ks-massnahme { display: flex; gap: 10px; align-items: baseline; padding: 6px 0; border-bottom: 1px solid var(--resq-border, #eef0f3); font-size: 13px; flex-wrap: wrap; }
.ks-massnahme:last-child { border-bottom: 0; }
.ks-massnahme .ks-text { flex: 1; min-width: 200px; }
.ks-massnahme--laufend { background: #eff6ff; margin: 0 -6px; padding-left: 6px; padding-right: 6px; }
.ks-massnahme--kompakt { padding: 3px 0; }
.ks-massnahme__form { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; width: 100%; }
.ks-massnahme__form .resq-input { flex: 1; min-width: 160px; }
.ks-dash-sektoren .ks-kachel { margin-bottom: 8px; }
@media (max-width: 900px) { .ks-zwei, .ks-zwei--breit { grid-template-columns: 1fr; } }