/* ============================================================
     DESIGN TOKENS – zentrale Farbsemantik (systemweit konsistent)
     ============================================================ */
  :root{
    /* Grundfarben */
    --bg-app:#f1f5f9;
    --bg-surface:#ffffff;
    --bg-sidebar:#0f172a;
    --bg-topbar:#0f172a;
    --border:#e2e8f0;
    --border-strong:#cbd5e1;

    /* Text */
    --text:#0f172a;
    --text-muted:#64748b;
    --text-faint:#94a3b8;
    --text-on-dark:#e2e8f0;
    --text-on-dark-muted:#94a3b8;

    /* Markenfarbe / Aktion */
    --brand:#2563eb;
    --brand-hover:#1d4ed8;
    --brand-soft:#eff6ff;

    /* STATUS-SEMANTIK (Farbe + immer mit Icon + Label) */
    --st-neu-fg:#1d4ed8;       --st-neu-bg:#eff6ff;       --st-neu-dot:#2563eb;
    --st-bear-fg:#1d4ed8;      --st-bear-bg:#eff6ff;      --st-bear-dot:#3b82f6;
    --st-wait-fg:#92400e;      --st-wait-bg:#fef3c7;      --st-wait-dot:#f59e0b;
    --st-erl-fg:#166534;       --st-erl-bg:#dcfce7;       --st-erl-dot:#22c55e;

    /* PRIORITÄT-SEMANTIK (Farbe + Icon + Label) */
    --pr-hoch-fg:#b91c1c;      --pr-hoch-bg:#fef2f2;      --pr-hoch-bd:#fecaca;
    --pr-mittel-fg:#a16207;    --pr-mittel-bg:#fefce8;    --pr-mittel-bd:#fde68a;
    --pr-niedrig-fg:#15803d;   --pr-niedrig-bg:#f0fdf4;   --pr-niedrig-bd:#bbf7d0;

    --radius:8px;
    --radius-sm:6px;
    --shadow-sm:0 1px 2px rgba(15,23,42,.06);
    --shadow-md:0 4px 12px rgba(15,23,42,.08);
    --shadow-lg:0 12px 32px rgba(15,23,42,.18);
    --font:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  }

  *{box-sizing:border-box;margin:0;padding:0}
  html,body{height:100%}
  body{
    font-family:var(--font);
    background:var(--bg-app);
    color:var(--text);
    font-size:14px;
    line-height:1.45;
    -webkit-font-smoothing:antialiased;
  }
  button{font-family:inherit;cursor:pointer;border:none;background:none}
  input,select{font-family:inherit}

  /* ============================================================ LAYOUT */
  .app{display:flex;height:100vh;overflow:hidden}

  /* -------------------- SIDEBAR -------------------- */
  .sidebar{
    width:240px;flex-shrink:0;background:var(--bg-sidebar);
    display:flex;flex-direction:column;color:var(--text-on-dark);
    position:sticky;top:0;height:100vh;
  }
  .brand{
    display:flex;align-items:center;gap:11px;padding:20px 20px;
    border-bottom:1px solid rgba(255,255,255,.07);
  }
  .brand .logo{
    width:40px;height:40px;border-radius:8px;
    display:flex;align-items:center;justify-content:center;flex-shrink:0;
  }
  .brand .logo img{width:100%;height:100%;object-fit:contain}
  .brand .b-title{font-weight:700;font-size:14px;letter-spacing:.02em;line-height:1.15}
  .brand .b-sub{font-size:10px;color:var(--text-on-dark-muted);letter-spacing:.08em;text-transform:uppercase}

  .nav{flex:1;padding:14px 12px;overflow-y:auto}
  .nav-item{
    display:flex;align-items:center;gap:12px;width:100%;
    padding:9px 12px;border-radius:var(--radius-sm);color:var(--text-on-dark-muted);
    font-size:14px;font-weight:500;text-align:left;margin-bottom:2px;
    transition:background .12s,color .12s;
  }
  .nav-item svg{width:18px;height:18px;flex-shrink:0;stroke-width:1.9}
  .nav-item:hover{background:rgba(255,255,255,.06);color:#fff}
  .nav-item.active{background:var(--brand);color:#fff}
  .nav-item .badge{
    margin-left:auto;background:#ef4444;color:#fff;font-size:11px;font-weight:700;
    min-width:20px;height:20px;border-radius:10px;display:flex;align-items:center;
    justify-content:center;padding:0 6px;
  }
  .nav-item.active .badge{background:rgba(255,255,255,.25)}
  /* App: Nav-Einträge sind teils <a> statt <button> – Browser-Unterstreichung entfernen (Vorlage nutzt <button>). */
  .sidebar .nav-item,.sidebar .nav-subitem{text-decoration:none}

  .sidebar-foot{padding:14px 12px;border-top:1px solid rgba(255,255,255,.07)}
  .switch-btn{
    display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;
    border:1px solid rgba(255,255,255,.14);border-radius:var(--radius-sm);
    color:var(--text-on-dark);font-size:13px;font-weight:500;
  }
  .switch-btn:hover{background:rgba(255,255,255,.06)}
  .switch-btn svg{width:16px;height:16px}
  .sysstatus{margin-top:14px;padding:0 4px}
  .sysstatus .lbl{font-size:11px;color:var(--text-on-dark-muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px}
  .sysstatus .val{display:flex;align-items:center;gap:8px;font-size:13px;color:#cbd5e1}
  .sysstatus .val .dot{width:8px;height:8px;border-radius:50%;background:#22c55e}

  /* -------------------- MAIN -------------------- */
  .main{flex:1;display:flex;flex-direction:column;min-width:0;min-height:0}

  /* Hamburger (nur Mobil sichtbar) */
  .hamburger{display:none;align-items:center;justify-content:center;width:40px;height:40px;border-radius:8px;color:var(--text-on-dark);flex-shrink:0}
  /* "Aktive Rolle wechseln" im Profil-Dropdown nur mobil zeigen – auf Desktop
     gibt es den Switcher schon in der Topbar. Doppelte Klasse für höhere
     Spezifität, sonst überschreibt die spätere .tb-item-Regel das display:none. */
  .tb-item.tb-item--mobilrolle{display:none}
  .hamburger:hover{background:rgba(255,255,255,.08)}
  .hamburger svg{width:22px;height:22px}
  .sidebar-backdrop{display:none}

  /* TOPBAR */
  .topbar{
    background:linear-gradient(180deg,#162236 0%,#0f172a 100%);
    color:var(--text-on-dark);
    display:flex;align-items:center;padding:0 20px;height:66px;flex-shrink:0;
    gap:18px;position:sticky;top:0;z-index:40;
    box-shadow:0 1px 0 rgba(255,255,255,.04) inset, 0 8px 24px -12px rgba(0,0,0,.6);
  }
  /* feine Glanzkante unten */
  .topbar::after{content:'';position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,transparent,rgba(99,102,241,.35),rgba(56,189,248,.25),transparent)}

  /* AKTIVE LAGE – schlicht, ohne Karte */
  .lage{display:flex;flex-direction:column;justify-content:center}
  .lage .lage-lbl{font-size:10px;color:var(--text-on-dark-muted);text-transform:uppercase;letter-spacing:.08em;font-weight:600}
  .lage .lage-name{display:flex;align-items:center;gap:8px;font-weight:700;font-size:15px;margin-top:1px;letter-spacing:-.01em;color:#fff}
  .lage .lage-name .pulse{width:9px;height:9px;border-radius:50%;background:#ef4444;box-shadow:0 0 0 0 rgba(239,68,68,.5), 0 0 8px 1px rgba(239,68,68,.7);animation:pulse 2s infinite}
  @keyframes pulse{0%{box-shadow:0 0 0 0 rgba(239,68,68,.5),0 0 8px 1px rgba(239,68,68,.7)}70%{box-shadow:0 0 0 7px rgba(239,68,68,0),0 0 8px 1px rgba(239,68,68,.4)}100%{box-shadow:0 0 0 0 rgba(239,68,68,0),0 0 8px 1px rgba(239,68,68,.7)}}
  .lage .lage-time{font-size:11px;color:var(--text-on-dark-muted);margin-top:1px}
  /* Status-Farbcodierung der aktiven Lage (Topbar) */
  .lage{border-left:3px solid transparent;padding-left:11px;transition:border-color .2s}
  .lage.st-aktiv{border-left-color:#16a34a}
  .lage.st-pausiert{border-left-color:#d97706}
  .lage.st-beendet{border-left-color:#64748b}
  .lage.st-aktiv .pulse{background:#16a34a;box-shadow:0 0 0 0 rgba(22,163,74,.5),0 0 8px 1px rgba(22,163,74,.7);animation:pulseG 2s infinite}
  .lage.st-pausiert .pulse{background:#d97706;box-shadow:none;animation:none}
  .lage.st-beendet .pulse{background:#64748b;box-shadow:none;animation:none}
  @keyframes pulseG{0%{box-shadow:0 0 0 0 rgba(22,163,74,.5),0 0 8px 1px rgba(22,163,74,.7)}70%{box-shadow:0 0 0 7px rgba(22,163,74,0),0 0 8px 1px rgba(22,163,74,.4)}100%{box-shadow:0 0 0 0 rgba(22,163,74,0),0 0 8px 1px rgba(22,163,74,.7)}}
  /* Status-Farbcodierung der Einsatz-Cards */
  .es-card.es-st-aktiv{border-left:4px solid #16a34a}
  .es-card.es-st-pausiert{border-left:4px solid #d97706}
  .es-card.es-st-beendet{border-left:4px solid #64748b}
  .es-rolerow{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:8px 16px;border-top:1px solid var(--border);font-size:12.5px;color:var(--text-muted)}
  .es-rolerow b{color:var(--text)}
  .es-rolerow .es-code{margin-left:auto;font-family:ui-monospace,monospace;background:var(--bg-app);border:1px solid var(--border);border-radius:6px;padding:2px 8px}

  .topbar-spacer{flex:1}
  /* Trenner zwischen Topbar-Gruppen */
  .tb-divider{width:1px;height:30px;background:linear-gradient(180deg,transparent,rgba(255,255,255,.12),transparent);flex-shrink:0}

  .stabsstelle-pick{
    display:flex;align-items:center;gap:12px;padding:7px 12px;
    border:1px solid rgba(255,255,255,.1);border-radius:11px;min-width:210px;
    background:rgba(255,255,255,.035);transition:.15s;
  }
  .stabsstelle-pick:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18)}
  .stabsstelle-pick .ss-badge-tb{width:32px;height:32px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;flex-shrink:0;background:rgba(99,102,241,.2);color:#a5b4fc}
  .stabsstelle-pick .ss-texts{display:flex;flex-direction:column;line-height:1.1;flex:1;min-width:0}
  .stabsstelle-pick .ss-lbl{font-size:9px;color:var(--text-on-dark-muted);text-transform:uppercase;letter-spacing:.08em;font-weight:600}
  .stabsstelle-pick .ss-val{font-weight:700;font-size:13.5px;margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fff}
  .stabsstelle-pick > svg{width:15px;height:15px;color:var(--text-on-dark-muted);flex-shrink:0}

  .icon-btn{
    width:40px;height:40px;border-radius:11px;display:flex;align-items:center;justify-content:center;
    color:var(--text-on-dark);position:relative;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);transition:.15s;
  }
  .icon-btn:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.16);transform:translateY(-1px)}
  .icon-btn svg{width:18px;height:18px}
  .icon-btn .notif{position:absolute;top:-5px;right:-5px;background:linear-gradient(135deg,#f87171,#ef4444);color:#fff;font-size:10px;font-weight:700;min-width:18px;height:18px;padding:0 4px;border-radius:9px;display:flex;align-items:center;justify-content:center;border:2px solid #0f172a;box-shadow:0 0 8px rgba(239,68,68,.6)}

  .userchip{display:flex;align-items:center;gap:10px;padding:5px 12px 5px 5px;border-radius:11px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);transition:.15s}
  .userchip:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.16)}
  .userchip .ava{width:36px;height:36px;border-radius:9px;background:linear-gradient(135deg,#6366f1,#4f46e5);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;position:relative;box-shadow:0 2px 8px rgba(79,70,229,.4)}
  .userchip .ava::after{content:'';position:absolute;bottom:-2px;right:-2px;width:11px;height:11px;border-radius:50%;background:#22c55e;border:2px solid #0f172a}
  .userchip .u-name{font-weight:700;font-size:13.5px;line-height:1.1;color:#fff}
  .userchip .u-role{font-size:10.5px;color:var(--text-on-dark-muted);margin-top:1px}
  .userchip > svg{width:15px;height:15px;color:var(--text-on-dark-muted)}

  /* ===== Topbar-Dropdowns (Stabsstelle, Glocke, User) ===== */
  .tb-wrap{position:relative}
  .tb-menu{position:absolute;top:calc(100% + 8px);right:0;min-width:240px;background:#fff;border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow-lg);padding:6px;z-index:80;display:none;animation:tbpop .14s ease}
  .tb-menu.open{display:block}
  .tb-menu.left{right:auto;left:0}
  @keyframes tbpop{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
  .tb-menu-head{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--text-faint);padding:8px 10px 6px}
  .tb-item{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:8px;cursor:pointer;font-size:13.5px;color:var(--text);width:100%;text-align:left}
  .tb-item:hover{background:#f1f5f9}
  .tb-item.sel{background:var(--brand-soft);color:var(--brand);font-weight:600}
  .tb-item .tb-badge{width:30px;height:24px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;flex-shrink:0}
  .tb-item .tb-check{margin-left:auto;color:var(--brand);display:none}
  .tb-item.sel .tb-check{display:block}
  .tb-item .tb-check svg{width:16px;height:16px}
  /* Dropdown-Eintrag, der nur auf Mobil erscheint (z. B. Rollenwahl) */
  .tb-item--mobile{display:none}
  .tb-sep{height:1px;background:var(--border);margin:5px 0}

  /* Benachrichtigungen */
  .notif-menu{min-width:320px;max-width:340px}
  .notif-item{display:flex;gap:11px;padding:11px 10px;border-radius:9px;cursor:pointer}
  .notif-item:hover{background:#f8fafc}
  .notif-item.unread{background:var(--brand-soft)}
  .notif-item.unread:hover{background:#dbeafe}
  .notif-dot{width:34px;height:34px;border-radius:9px;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:#fff}
  .notif-dot svg{width:16px;height:16px}
  .notif-txt{flex:1;min-width:0}
  .notif-txt .nt-title{font-size:13px;font-weight:600;line-height:1.25}
  .notif-txt .nt-sub{font-size:12px;color:var(--text-muted);line-height:1.3;margin-top:1px}
  .notif-txt .nt-time{font-size:11px;color:var(--text-faint);margin-top:3px}
  .notif-foot{padding:8px 10px 4px;text-align:center}
  .notif-foot button{font-size:12.5px;color:var(--brand);font-weight:600;cursor:pointer}
  .lage-name{transition:opacity .35s}

  /* CONTENT */
  .content{flex:1;padding:26px 30px;overflow-y:auto;min-height:0}
  .page-head{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:22px;gap:20px}
  .page-title{display:flex;align-items:center;gap:8px;font-size:24px;font-weight:700;letter-spacing:-.01em}
  .page-title .info{color:var(--text-faint)}
  .page-title .info svg{width:17px;height:17px}
  .page-sub{color:var(--text-muted);font-size:14px;margin-top:3px}
  .head-actions{display:flex;gap:10px;flex-shrink:0}

  .btn{
    display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:var(--radius);
    font-weight:600;font-size:14px;transition:background .12s,border-color .12s,box-shadow .12s;
  }
  .btn svg{width:17px;height:17px}
  .btn-primary{background:var(--brand);color:#fff;box-shadow:var(--shadow-sm)}
  .btn-primary:hover{background:var(--brand-hover)}
  .btn-ghost{background:var(--bg-surface);color:var(--text);border:1px solid var(--border-strong)}
  .btn-ghost:hover{background:#f8fafc;border-color:#94a3b8}
  .btn-sm{padding:8px 13px;font-size:13px}

  /* PANEL (Tabelle) */
  .panel{background:var(--bg-surface);border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow-sm);overflow:hidden}
  .table-wrap{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}

  /* FILTERLEISTE */
  .filterbar{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px;padding:16px 18px;border-bottom:1px solid var(--border)}
  #filterToggle{display:none}
  .search{position:relative;flex:1;min-width:220px}
  .search svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--text-faint)}
  .search input{
    width:100%;padding:9px 12px 9px 36px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);
    font-size:14px;color:var(--text);background:#fff;
  }
  .search input::placeholder{color:var(--text-faint)}
  .search input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}

  .fld{display:flex;flex-direction:column;gap:4px}
  .fld label{font-size:11px;color:var(--text-muted);font-weight:500;padding-left:2px}
  .fld select,.fld .datebox{
    padding:8px 11px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);
    font-size:14px;color:var(--text);background:#fff;min-width:130px;cursor:pointer;
  }
  .fld select:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
  .datebox{display:flex;align-items:center;gap:8px;color:var(--text-muted)}
  .datebox svg{width:15px;height:15px}
  .reset-btn{display:inline-flex;align-items:center;gap:7px;color:var(--text-muted);font-size:13px;font-weight:500;padding:8px 6px}
  .reset-btn:hover{color:var(--brand)}
  .reset-btn svg{width:15px;height:15px}

  .resultbar{display:flex;align-items:center;justify-content:space-between;padding:13px 18px;border-bottom:1px solid var(--border)}
  .resultbar .count{font-size:13px;color:var(--text-muted);font-weight:500}
  .resultbar .sort{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text-muted)}
  .resultbar .sort label{white-space:nowrap}
  .resultbar .sort select{padding:6px 28px 6px 10px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);font-size:13px;font-weight:600;color:var(--text);background:#fff;cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 9px center}
  .resultbar .sort select:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
  .resultbar .rb-right{display:flex;align-items:center;gap:16px}

  /* Erledigte ausblenden – dezenter Toggle */
  .hide-done{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--text-muted);cursor:pointer;user-select:none}
  .hide-done input{appearance:none;width:34px;height:19px;border-radius:10px;background:var(--border-strong);position:relative;cursor:pointer;transition:background .18s;flex-shrink:0}
  .hide-done input::after{content:'';position:absolute;top:2px;left:2px;width:15px;height:15px;border-radius:50%;background:#fff;transition:transform .18s;box-shadow:0 1px 2px rgba(0,0,0,.2)}
  .hide-done input:checked{background:var(--brand)}
  .hide-done input:checked::after{transform:translateX(15px)}
  /* deaktiviert (z. B. im Board – Erledigte ohnehin nicht sichtbar) */
  .hide-done.disabled{opacity:.45;cursor:not-allowed}
  .hide-done.disabled input{cursor:not-allowed}

  /* Ansicht-Switch (Liste / Board) – nur Desktop */
  .view-switch{display:inline-flex;border:1px solid var(--border-strong);border-radius:8px;overflow:hidden}
  .vs-btn{width:36px;height:32px;display:flex;align-items:center;justify-content:center;color:var(--text-muted);background:#fff;cursor:pointer;border-right:1px solid var(--border-strong)}
  .vs-btn:last-child{border-right:none}
  .vs-btn:hover{background:#f1f5f9;color:var(--text)}
  .vs-btn.active{background:var(--brand);color:#fff}
  .vs-btn svg{width:17px;height:17px}

  /* ============================================================
     BOARD-Ansicht: 3 Status-Spalten, Karten als Solitaire-Stapel
     ============================================================ */
  .board{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding:18px;align-items:start}
  .bcol{background:var(--bg-app);border:1px solid var(--border);border-radius:14px;padding:0 13px 18px;min-height:200px;overflow:hidden}
  /* Kopfbereich: dezenter Farbverlauf + oberer Akzentbalken je Status */
  .bcol-head{display:flex;align-items:center;gap:11px;padding:14px 13px 13px;margin:0 -13px 14px;position:relative;border-bottom:1px solid var(--border)}
  .bcol-head::before{content:'';position:absolute;top:0;left:0;right:0;height:3px}
  .bcol-ico{width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
  .bcol-ico svg{width:18px;height:18px}
  .bcol-titles{display:flex;flex-direction:column;line-height:1.15;min-width:0}
  .bcol-title{font-size:14px;font-weight:700;color:var(--text);letter-spacing:-.01em}
  .bcol-sub{font-size:11px;color:var(--text-faint);font-weight:500;margin-top:1px}
  .bcol-count{margin-left:auto;font-size:13px;font-weight:700;min-width:26px;height:26px;border-radius:13px;display:flex;align-items:center;justify-content:center;padding:0 8px;color:#fff;flex-shrink:0}

  /* Farbgebung je Status-Spalte */
  .bcol--neu .bcol-head{background:linear-gradient(180deg,#eff6ff 0%,rgba(239,246,255,0) 100%)}
  .bcol--neu .bcol-head::before{background:linear-gradient(90deg,#2563eb,#60a5fa)}
  .bcol--neu .bcol-ico{background:#dbeafe;color:#2563eb}
  .bcol--neu .bcol-count{background:#2563eb}

  .bcol--bear .bcol-head{background:linear-gradient(180deg,#eef2ff 0%,rgba(238,242,255,0) 100%)}
  .bcol--bear .bcol-head::before{background:linear-gradient(90deg,#6366f1,#a5b4fc)}
  .bcol--bear .bcol-ico{background:#e0e7ff;color:#4f46e5}
  .bcol--bear .bcol-count{background:#4f46e5}

  .bcol--wait .bcol-head{background:linear-gradient(180deg,#fffbeb 0%,rgba(255,251,235,0) 100%)}
  .bcol--wait .bcol-head::before{background:linear-gradient(90deg,#f59e0b,#fcd34d)}
  .bcol--wait .bcol-ico{background:#fef3c7;color:#d97706}
  .bcol--wait .bcol-count{background:#d97706}
  /* Stapel-Container: relative Positionierung, Karten überlappen */
  .bstack{position:relative}
  .bcard{background:#fff;border:1px solid var(--border-strong);border-radius:11px;padding:12px 13px;box-shadow:var(--shadow-sm);cursor:pointer;
          transition:transform .22s cubic-bezier(.34,1.3,.64,1), box-shadow .2s, margin .22s;position:relative}
  /* Überlappung: jede Karte zieht sich über die vorherige (außer der ersten) */
  .bcard:not(:first-child){margin-top:-46px}
  .bcard:hover{box-shadow:var(--shadow-lg);border-color:var(--brand);z-index:5}
  /* Solitaire-Auffächern: beim Hover über den Stapel rücken die Karten auseinander */
  .bstack:hover .bcard:not(:first-child){margin-top:-14px}
  .bcard .bc-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:7px}
  .bcard .bc-id{font-size:11px;font-weight:700;color:var(--text-faint);font-variant-numeric:tabular-nums}
  .bcard .bc-betreff{font-size:13.5px;font-weight:600;color:var(--text);line-height:1.3;margin-bottom:8px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .bcard .bc-foot{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
  .bcard .bc-melder{font-size:11.5px;color:var(--text-muted);margin-top:6px;display:flex;align-items:center;gap:5px}
  .bcard .bc-melder svg{width:12px;height:12px;flex-shrink:0}
  .bcol-empty{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;font-size:12.5px;color:var(--text-faint);padding:30px 8px}
  .bcol-empty svg{width:26px;height:26px;opacity:.5}
  /* Board nur ab Desktop sinnvoll – auf kleineren Screens Switch ausblenden */
  @media(max-width:900px){
    .view-switch{display:none}
    .board{display:none !important}
    #listView{display:block !important}
  }

  /* ============================================================
     STABSSTELLEN-ANSICHT
     ============================================================ */
  .ssv-cards{display:flex;flex-direction:column;gap:12px;padding:20px 24px}
  .ssv-card{border:1px solid var(--border);border-radius:14px;background:#fff;overflow:hidden;transition:box-shadow .15s,border-color .15s}
  .ssv-card:hover{box-shadow:var(--shadow-sm)}
  .ssv-card.open{box-shadow:var(--shadow-md);border-color:var(--border-strong)}
  .ssv-card-head{display:flex;align-items:center;gap:14px;width:100%;padding:14px 16px;cursor:pointer;text-align:left;background:none}
  .ssv-card-head:hover{background:#fafbfc}
  .ssv-card-badge{width:42px;height:42px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;flex-shrink:0}
  .ssv-card-main{display:flex;flex-direction:column;min-width:0;flex:1}
  .ssv-card-name{font-size:15px;font-weight:700;color:var(--text);letter-spacing:-.01em}
  .ssv-card-sub{font-size:12.5px;color:var(--text-muted);margin-top:1px}
  .ssv-card-stats{display:flex;align-items:center;gap:16px;flex-shrink:0}
  .ssv-stat{font-size:12.5px;color:var(--text-muted);white-space:nowrap}
  .ssv-stat b{color:var(--text);font-weight:700}
  .ssv-stat-dienst{display:flex;align-items:center;gap:5px}
  .ssv-stat-dienst .dot{width:7px;height:7px;border-radius:50%;background:#22c55e;box-shadow:0 0 6px rgba(34,197,94,.5)}
  .ssv-stat-load{background:#eff6ff;color:#2563eb;font-weight:600;border-radius:20px;padding:3px 10px;font-size:11.5px}
  .ssv-chev{width:18px;height:18px;color:var(--text-faint);flex-shrink:0;transition:transform .2s}
  .ssv-card.open .ssv-chev{transform:rotate(180deg)}
  @media(max-width:760px){.ssv-card-stats{display:none}}

  /* Team-Liste (aufgeklappt) */
  .ssv-team{border-top:1px solid var(--border);padding:8px}
  .ssv-member{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;transition:background .12s}
  .ssv-member:hover{background:#fafbfc}
  .ssv-mem-ava{width:34px;height:34px;border-radius:9px;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:12px;flex-shrink:0}
  .ssv-mem-main{display:flex;flex-direction:column;flex:1;min-width:0}
  .ssv-mem-name{font-size:13.5px;font-weight:600;color:var(--text);display:flex;align-items:center;gap:7px}
  .ssv-leiter-tag{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:#9333ea;background:#f3e8ff;border-radius:10px;padding:1px 7px}
  .ssv-mem-role{font-size:12px;color:var(--text-muted);margin-top:1px}
  .ssv-mem-status{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:600;border-radius:20px;padding:4px 11px;flex-shrink:0}
  .ssv-mem-status .dot{width:7px;height:7px;border-radius:50%}
  .sst-online{color:#166534;background:#dcfce7}
  .sst-online .dot{background:#22c55e;box-shadow:0 0 0 0 rgba(34,197,94,.55);animation:ssPulse 1.8s infinite}
  @keyframes ssPulse{0%{box-shadow:0 0 0 0 rgba(34,197,94,.5)}70%{box-shadow:0 0 0 5px rgba(34,197,94,0)}100%{box-shadow:0 0 0 0 rgba(34,197,94,0)}}
  .sst-dienst{color:#1d4ed8;background:#eff6ff}
  .sst-dienst .dot{background:#3b82f6}
  .sst-bereit{color:#92400e;background:#fef3c7}
  .sst-bereit .dot{background:#f59e0b}
  .sst-abwesend{color:#64748b;background:#f1f5f9}
  .sst-abwesend .dot{background:#94a3b8}
  /* klickbarer Status (Leitung darf händisch setzen) */
  .ssv-mem-status.clickable{cursor:pointer;transition:filter .12s,box-shadow .12s}
  .ssv-mem-status.clickable:hover{filter:brightness(.97);box-shadow:0 0 0 2px rgba(15,23,42,.06)}
  .ssv-mem-actions{display:flex;gap:4px;flex-shrink:0}
  .ssv-mem-btn{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;color:var(--text-muted);border:1px solid var(--border);background:#fff;cursor:pointer;transition:.12s}
  .ssv-mem-btn:hover{border-color:var(--brand);color:var(--brand);background:var(--brand-soft)}
  .ssv-mem-btn svg{width:15px;height:15px}
  .ssv-mem-del:hover{border-color:#dc2626;color:#dc2626;background:#fef2f2}
  .ssv-team-foot{padding:9px 12px 5px}
  .ssv-perm-note{display:inline-flex;align-items:center;gap:7px;font-size:12px;color:#7c3aed}
  .ssv-perm-note svg{width:14px;height:14px}
  .ssv-perm-note.ro{color:var(--text-faint)}
  @media(max-width:600px){
    .ssv-mem-status{display:none}
    .ssv-member{gap:9px}
  }

  /* ============================================================
     STABSSTELLEN – KARTENANSICHT (Tirol-Silhouette + Standorte)
     ============================================================ */
  .ss-head-right{display:flex;align-items:center;gap:12px}
  .vs-btn[data-ssmode]{width:auto;padding:0 12px;gap:7px;font-size:13px;font-weight:600}
  .vs-btn[data-ssmode] span{white-space:nowrap}
  @media(max-width:560px){.vs-btn[data-ssmode] span{display:none}.vs-btn[data-ssmode]{padding:0;width:36px}}

  .ssmap-wrap{padding:20px 24px}
  .ssmap-card{position:relative;background:linear-gradient(160deg,#f8fafc,#eef2f7);border:1px solid var(--border);border-radius:16px;padding:18px;overflow:hidden;box-shadow:var(--shadow-sm)}
  .ssmap-legend{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;flex-wrap:wrap}
  .ssmap-legend .t{font-size:13.5px;font-weight:700;color:var(--text);display:flex;align-items:center;gap:7px}
  .ssmap-legend .t svg{width:16px;height:16px;color:var(--brand)}
  .ssmap-legend .h{font-size:12px;color:var(--text-muted)}
  .ssmap-stage{position:relative;width:100%;max-width:940px;margin:0 auto;aspect-ratio:1000/660;
    --ssTilt:44deg;perspective:900px;perspective-origin:50% 30%}
  /* gekippte Karten-Ebene -> oberer Teil nach hinten (3D-Eindruck) */
  .ssmap-plane{position:absolute;inset:0;transform-style:preserve-3d;
    transform:rotateX(var(--ssTilt));transform-origin:50% 72%}
  .ssmap-plane>*{transform-style:preserve-3d}
  .ssmap-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
  .ssmap-svg path{fill:#dbeafe;stroke:#93b4f0;stroke-width:1.4;stroke-linejoin:round;
    filter:drop-shadow(0 14px 16px rgba(37,99,235,.16))}
  .ssmap-grid{position:absolute;inset:0;background-image:
      linear-gradient(rgba(148,163,184,.10) 1px,transparent 1px),
      linear-gradient(90deg,rgba(148,163,184,.10) 1px,transparent 1px);
    background-size:46px 46px;border-radius:12px;pointer-events:none}

  /* Bodenschatten der Marker (liegen auf der gekippten Ebene) */
  .ssmap-ground{position:absolute;inset:0;pointer-events:none}
  .ssmap-shadow{position:absolute;transform:translate(-50%,-50%);height:11px;border-radius:50%;
    background:radial-gradient(ellipse at center,rgba(15,23,42,.30),rgba(15,23,42,0) 72%)}
  .ssmap-anchor{position:absolute;width:1px;height:1px;transform:translate(-50%,-50%)}

  /* Flache Marker-Ebene ÜBER der gekippten Karte: Marker bleiben aufrecht & scharf,
     werden per JS an die gekippte Bildschirmposition ihres Bodenpunkts gesetzt. */
  .ssmap-markers{position:absolute;inset:0;pointer-events:none;z-index:8}
  .ssmap-mk{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;
    align-items:center;gap:3px;cursor:pointer;pointer-events:auto}
  .ssmap-mk:hover,.ssmap-mk.sel{z-index:6}
  .ssmap-dot{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;
    font-size:11px;font-weight:800;color:#fff;border:2.5px solid #fff;
    box-shadow:0 4px 10px rgba(15,23,42,.32);transition:transform .14s,box-shadow .14s}
  .ssmap-mk:hover .ssmap-dot,.ssmap-pin-stk:hover .ssmap-dot{transform:scale(1.16)}
  .ssmap-mk.sel .ssmap-dot,.ssmap-pin-stk.sel .ssmap-dot{transform:scale(1.16);box-shadow:0 0 0 4px rgba(37,99,235,.25),0 6px 12px rgba(15,23,42,.34)}
  .ssmap-mk .lbl{font-size:11px;font-weight:600;color:var(--text);background:rgba(255,255,255,.9);
    border:1px solid var(--border);border-radius:6px;padding:1px 6px;white-space:nowrap;
    box-shadow:var(--shadow-sm)}

  /* Cluster (mehrere Stabsstellen am selben Ort, z.B. Innsbruck): Kreise gestapelt, ein Label */
  .ssmap-cluster-dots{position:relative;width:30px;height:30px}
  .ssmap-pin-stk{position:absolute;left:50%;top:50%;cursor:pointer;
    transform:translate(calc(-50% + var(--ox)),calc(-50% + var(--oy)))}
  .ssmap-pin-stk:hover,.ssmap-pin-stk.sel{z-index:6}

  /* Popover-Detailkarte am Marker */
  .ssmap-pop{position:absolute;z-index:30;width:288px;max-width:calc(100% - 16px);
    background:#fff;border:1px solid var(--border-strong);border-radius:14px;
    box-shadow:var(--shadow-lg);overflow:hidden;animation:ssPopIn .14s ease-out}
  @keyframes ssPopIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
  .ssmap-pop-head{display:flex;align-items:center;gap:11px;padding:13px 14px;border-bottom:1px solid var(--border)}
  .ssmap-pop-badge{width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;flex-shrink:0}
  .ssmap-pop-tt{display:flex;flex-direction:column;min-width:0;flex:1}
  .ssmap-pop-tt .n{font-size:14px;font-weight:700;color:var(--text)}
  .ssmap-pop-tt .o{font-size:12px;color:var(--text-muted);margin-top:1px;display:flex;align-items:center;gap:4px}
  .ssmap-pop-tt .o svg{width:12px;height:12px;flex-shrink:0}
  .ssmap-pop-close{width:28px;height:28px;border-radius:7px;border:1px solid var(--border);background:#fff;color:var(--text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0}
  .ssmap-pop-close:hover{background:#f1f5f9;color:var(--text)}
  .ssmap-pop-close svg{width:14px;height:14px}
  .ssmap-pop-stats{display:flex;gap:8px;padding:11px 14px;border-bottom:1px solid var(--border)}
  .ssmap-pop-stat{flex:1;background:#f8fafc;border:1px solid var(--border);border-radius:9px;padding:7px 9px;text-align:center}
  .ssmap-pop-stat .v{font-size:16px;font-weight:800;color:var(--text);line-height:1}
  .ssmap-pop-stat .l{font-size:10.5px;color:var(--text-muted);margin-top:3px;text-transform:uppercase;letter-spacing:.03em}
  .ssmap-pop-stat.load .v{color:var(--brand)}
  .ssmap-pop-team{max-height:188px;overflow:auto;padding:6px}
  .ssmap-pop-mem{display:flex;align-items:center;gap:9px;padding:6px 8px;border-radius:8px}
  .ssmap-pop-mem:hover{background:#fafbfc}
  .ssmap-pop-ava{width:28px;height:28px;border-radius:7px;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:11px;flex-shrink:0}
  .ssmap-pop-mem .mm{display:flex;flex-direction:column;min-width:0;flex:1}
  .ssmap-pop-mem .mm .nm{font-size:12.5px;font-weight:600;color:var(--text);display:flex;align-items:center;gap:6px}
  .ssmap-pop-mem .mm .rl{font-size:11px;color:var(--text-muted)}
  .ssmap-pop-mem .sdot{width:8px;height:8px;border-radius:50%;flex-shrink:0}

  @media(max-width:560px){
    .ssmap-card{padding:12px}
    .ssmap-stage{--ssTilt:32deg}
    .ssmap-dot{width:26px;height:26px;font-size:10px}
    .ssmap-mk .lbl{display:none}
    .ssmap-mk.sel .lbl{display:block}
  }

  /* TABLE */
  table{width:100%;border-collapse:collapse}
  thead th{
    text-align:left;font-size:11px;font-weight:600;color:var(--text-muted);
    text-transform:uppercase;letter-spacing:.04em;padding:12px 18px;border-bottom:1px solid var(--border);
    background:#fafbfc;
  }
  tbody tr{border-bottom:1px solid var(--border);transition:background .1s;cursor:pointer}
  tbody tr:last-child{border-bottom:none}
  /* ultradezente Zebra-Streifen (gerade Zeilen minimal getönt) */
  tbody tr:nth-child(even){background:#fcfcfd}
  tbody tr:hover{background:#f8fafc}
  tbody tr.selected{background:var(--brand-soft)}
  tbody td{padding:14px 18px;vertical-align:top}

  .c-datetime .d{font-weight:600;font-size:13px}
  .c-datetime .t{color:var(--text-muted);font-size:13px;margin-top:1px}
  .c-betreff{max-width:260px}
  .c-betreff .bt{font-weight:600;font-size:14px}
  .c-betreff .desc{color:var(--text-muted);font-size:13px;margin-top:2px;max-width:230px}
  .c-melder .m{font-size:14px}
  .c-melder .phone{display:flex;align-items:center;gap:5px;color:var(--text-muted);font-size:13px;margin-top:2px}
  .c-melder .phone svg{width:13px;height:13px}

  /* Maskierte Telefonnummer (Übersicht): nur letzte 3 Ziffern klar, davor verschwommener Block */
  .phone-masked{display:inline-flex;align-items:center;gap:0;font-variant-numeric:tabular-nums}
  .phone-masked .pm-pre{color:var(--text-muted)}
  .phone-masked .pm-blur{filter:blur(3.5px);user-select:none;color:var(--text-muted);letter-spacing:.5px;padding:0 1px;pointer-events:none}
  .phone-masked .pm-last{color:var(--text-muted)}
  .c-stab{font-size:14px;font-weight:500}

  /* Stabsstellen-Chips (federführend + beteiligt) */
  .ss-chips{display:flex;flex-wrap:wrap;gap:5px;align-items:center;max-width:240px}
  .ss-chip{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:20px;font-size:12.5px;font-weight:600;white-space:nowrap;border:1px solid var(--border-strong);background:#f8fafc;color:var(--text)}
  .ss-chip.lead{background:var(--brand-soft);border-color:#bfdbfe;color:var(--brand-hover)}
  /* Vorläufige Zuteilung (S3-Freigabe ausstehend, §Punkt 4): gleiche Chip-Optik, gestrichelt & gedämpft */
  .ss-chip.pend{border-style:dashed;background:transparent;color:var(--text-muted);opacity:.75;cursor:help}
  .ss-chip.lead .star{width:12px;height:12px;flex-shrink:0}
  .ss-chip .x{display:flex;cursor:pointer;color:var(--text-faint);margin-left:2px}
  .ss-chip .x:hover{color:#ef4444}
  .ss-chip .x svg{width:12px;height:12px}
  .ss-more{font-size:12px;color:var(--text-muted);font-weight:600}

  /* Multiselect im Modal */
  .ms-box{border:1px solid var(--border-strong);border-radius:var(--radius-sm);padding:8px;min-height:44px;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
  .ms-box:focus-within{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
  .ms-box select{border:none;flex:1;min-width:120px;padding:4px;font-size:14px;background:transparent}
  .ms-box select:focus{outline:none;box-shadow:none}
  .checkrow{display:flex;align-items:center;gap:10px;padding:11px 12px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);cursor:pointer;transition:.12s}
  .checkrow:hover{border-color:var(--brand);background:var(--brand-soft)}
  .checkrow input{width:18px;height:18px;accent-color:var(--brand);cursor:pointer;flex-shrink:0}
  .checkrow .cr-txt{font-size:13.5px}
  .checkrow .cr-txt b{font-weight:600}
  .checkrow .cr-txt .cr-sub{color:var(--text-muted);font-size:12.5px}

  /* BADGES – Priorität & Status (Farbe + Icon + Label) */
  .badge-pill{display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:20px;font-size:12.5px;font-weight:600;white-space:nowrap}
  .badge-pill svg{width:14px;height:14px;flex-shrink:0}
  .badge-pill .dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}
  /* Voll-/Kurzlabel-Umschaltung (Default Desktop: voll sichtbar) */
  .lbl-short{display:none}
  .lbl-full{display:inline}

  .pr-hoch{color:var(--pr-hoch-fg);background:var(--pr-hoch-bg);border:1px solid var(--pr-hoch-bd)}
  .pr-mittel{color:var(--pr-mittel-fg);background:var(--pr-mittel-bg);border:1px solid var(--pr-mittel-bd)}
  .pr-niedrig{color:var(--pr-niedrig-fg);background:var(--pr-niedrig-bg);border:1px solid var(--pr-niedrig-bd)}

  .st-neu{color:var(--st-neu-fg);background:var(--st-neu-bg)}
  .st-neu .dot{background:var(--st-neu-dot)}
  .st-bear{color:var(--st-bear-fg);background:var(--st-bear-bg)}
  .st-bear .dot{background:var(--st-bear-dot)}
  .st-wait{color:var(--st-wait-fg);background:var(--st-wait-bg)}
  .st-wait .dot{background:var(--st-wait-dot)}
  .st-erl{color:var(--st-erl-fg);background:var(--st-erl-bg)}
  .st-erl .dot{background:var(--st-erl-dot)}

  /* PAGINATION */
  .pagination{display:flex;align-items:center;justify-content:space-between;padding:14px 18px}
  .rows-per{display:flex;align-items:center;gap:9px;font-size:13px;color:var(--text-muted)}
  .rows-per select{padding:5px 9px;border:1px solid var(--border-strong);border-radius:6px;font-size:13px}
  .pages{display:flex;align-items:center;gap:4px}
  .pg{min-width:34px;height:34px;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;font-size:13px;font-weight:500;color:var(--text-muted);border:1px solid transparent}
  .pg:hover:not(:disabled){background:#f1f5f9;color:var(--text)}
  .pg.active{background:var(--brand);color:#fff}
  .pg:disabled{opacity:.35;cursor:default}
  .pg svg{width:15px;height:15px}
  #pgNums{display:inline-flex;gap:4px}
  .pg-info{font-size:13px;color:var(--text-muted);margin-right:8px}

  /* ============================================================ DETAIL DRAWER */
  .overlay{position:fixed;inset:0;background:rgba(15,23,42,.4);opacity:0;pointer-events:none;transition:opacity .2s;z-index:40}
  .overlay.show{opacity:1;pointer-events:auto}

  .drawer{
    /* Halbe Bildschirmbreite statt fixer 480px — Untergrenze 560px, damit das
       zweispaltige Detail-Layout nie kollabiert bevor die Grid-Regeln unten
       greifen; mobil (max-width:720px) übersteuert die 100vw-Regel. */
    position:fixed;top:0;right:0;height:100vh;width:50vw;min-width:560px;max-width:94vw;background:var(--bg-surface);
    box-shadow:var(--shadow-lg);transform:translateX(100%);transition:transform .25s cubic-bezier(.4,0,.2,1);
    z-index:50;display:flex;flex-direction:column;
    visibility:hidden;pointer-events:none;
  }
  .drawer.show{transform:translateX(0);visibility:visible;pointer-events:auto}
  .drawer-head{display:flex;align-items:center;gap:12px;padding:20px 22px 16px;border-bottom:1px solid var(--border)}
  .drawer-head .d-id{font-size:19px;font-weight:700}
  .drawer-head .close{margin-left:auto;width:34px;height:34px;border-radius:7px;display:flex;align-items:center;justify-content:center;color:var(--text-muted)}
  .drawer-head .close:hover{background:#f1f5f9;color:var(--text)}
  .drawer-head .close svg{width:19px;height:19px}

  .tabs{display:flex;gap:2px;padding:0 22px;border-bottom:1px solid var(--border)}
  .tab{padding:13px 4px;margin-right:16px;font-size:13.5px;font-weight:500;color:var(--text-muted);border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap}
  .tab:hover{color:var(--text)}
  .tab.active{color:var(--brand);border-bottom-color:var(--brand);font-weight:600}

  .drawer-body{flex:1;overflow-y:auto;padding:20px 22px}
  /* App-spezifisch: Inhalt wird in #drawerHost injiziert (Vorlage rendert direkt in .drawer).
     Diese Regel stellt die Flex-Höhenkette her, damit .drawer-body scrollt – ändert keine Vorlagen-Regel. */
  #drawerHost{flex:1;min-height:0;display:flex;flex-direction:column}
  .d-card{border:1px solid var(--border);border-radius:10px;padding:16px 18px;margin-bottom:16px}
  .d-card-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
  .d-card-head h3{font-size:15px;font-weight:700}
  .d-card-head .edit{width:30px;height:30px;border-radius:6px;display:flex;align-items:center;justify-content:center;color:var(--text-faint)}
  .d-card-head .edit:hover{background:#f1f5f9;color:var(--brand)}
  .d-card-head .edit svg{width:15px;height:15px}

  .d-row{display:grid;grid-template-columns:140px 1fr;gap:12px;padding:7px 0;font-size:14px}
  .d-row .k{color:var(--text-muted)}
  .d-row .v{color:var(--text);font-weight:500}
  .d-block{padding:9px 0}
  .d-block .k{color:var(--text-muted);font-size:14px;margin-bottom:3px}
  .d-block .v{font-size:14px;line-height:1.5}
  .d-phone{display:inline-flex;align-items:center;gap:6px;color:var(--text-muted)}
  .d-phone svg{width:14px;height:14px}
  .d-divider{height:1px;background:var(--border);margin:6px 0}

  .drawer-foot{display:flex;gap:10px;padding:16px 22px;border-top:1px solid var(--border)}

  /* ===== Drawer-Innenlayout (halbe Bildschirmbreite) =====
     d-grid2: Auftragsinhalt links (breiter) | Rahmendaten rechts.
     d-cards2: zwei Karten nebeneinander (Ergänzung | Letzte Rückmeldung).
     d-meta-strip: kompakte Verwaltungszeile in voller Kartenbreite. */
  .d-grid2{display:grid;grid-template-columns:1.35fr 1fr;gap:4px 24px;align-items:start}
  .d-col-meta{border-left:1px solid var(--border);padding-left:22px}
  /* Kompakte Rahmendaten: schmale Label-Spalte + engere Zeilen, damit Werte
     wie „25.06.2026, 07:44" einzeilig bleiben und die Karte kurz bleibt */
  .d-col-meta .d-row{grid-template-columns:118px 1fr;padding:5px 0;font-size:13.5px;gap:10px}
  .d-col-meta .d-block{padding:6px 0}
  .d-col-meta .d-block .k{font-size:13px}
  .d-col-meta .d-divider{margin:4px 0}
  .d-cards2{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:stretch;margin-bottom:16px}
  .d-cards2 .d-card{margin-bottom:0}
  .d-meta-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding-top:6px}
  .d-meta-strip .k{color:var(--text-muted);font-size:12.5px;margin-bottom:3px}
  .d-meta-strip .v{font-size:13.5px;font-weight:500;color:var(--text)}
  /* Schmale Fenster: Drawer ~560px breit → einspaltig, Meta-Spalte rückt unter
     den Inhalt (Trennlinie oben statt links) */
  @media(max-width:1080px){
    .d-grid2{grid-template-columns:1fr}
    .d-col-meta{border-left:none;padding-left:0;border-top:1px solid var(--border);padding-top:12px;margin-top:12px}
    .d-cards2{grid-template-columns:1fr}
    .d-meta-strip{grid-template-columns:1fr;gap:8px}
  }

  /* ESIS/ETB Ja-Nein-Anzeige */
  .jn{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:6px;font-size:12px;font-weight:600}
  .jn.ja{background:var(--st-erl-bg);color:var(--st-erl-fg)}
  .jn.nein{background:#f1f5f9;color:var(--text-muted)}
  .jn svg{width:12px;height:12px}
  .esis-etb{display:flex;gap:18px}
  .esis-etb .ee-item{display:flex;align-items:center;gap:8px}
  .esis-etb .ee-lbl{font-size:13px;color:var(--text-muted)}

  /* Stabsleiter-Ergänzung – hervorgehobener Weisungsblock */
  .d-card.leiter{border-color:#ddd6fe;background:linear-gradient(0deg,#faf5ff,#fff)}
  .d-card.leiter .d-card-head h3{color:#6d28d9;display:flex;align-items:center;gap:8px}
  .d-card.leiter .d-card-head h3 svg{width:16px;height:16px}
  .leiter-text{font-size:13.5px;line-height:1.55;color:var(--text)}
  .leiter-empty{font-size:13px;color:var(--text-faint);font-style:italic}
  /* "Nur Leitung"-Badge, wenn keine Bearbeitungsrechte */
  .d-card.leiter .ro-badge{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:600;color:#7c3aed;background:#f3e8ff;border:1px solid #ddd6fe;border-radius:14px;padding:3px 9px;cursor:help}
  .d-card.leiter .ro-badge svg{width:12px;height:12px}
  /* Inline-Editor */
  .leiter-edit{width:100%;min-height:90px;border:1px solid #c4b5fd;border-radius:9px;padding:10px 12px;font-size:13.5px;font-family:inherit;line-height:1.5;color:var(--text);resize:vertical;box-shadow:0 0 0 3px #ede9fe}
  .leiter-edit:focus{outline:none;border-color:#7c3aed}
  .leiter-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:9px}

  /* ===== RÜCKMELDUNGS-THREAD ===== */
  .thread{display:flex;flex-direction:column;gap:14px}
  .thread-empty{text-align:center;color:var(--text-faint);font-size:13.5px;padding:28px 12px}
  .rm{display:flex;flex-direction:column;max-width:88%}
  .rm.own{align-self:flex-end;align-items:flex-end}
  .rm.other{align-self:flex-start;align-items:flex-start}
  .rm-head{display:flex;align-items:center;gap:8px;margin-bottom:4px;font-size:12px}
  .rm-avatar{width:26px;height:26px;border-radius:7px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#fff;flex-shrink:0}
  .rm-meta{line-height:1.2}
  .rm-meta .who{font-weight:600;color:var(--text);font-size:12.5px}
  .rm-meta .ss-tag{color:var(--text-muted);font-size:11.5px}
  .rm-time{color:var(--text-faint);font-size:11px;white-space:nowrap}
  .rm-bubble{padding:10px 13px;border-radius:12px;font-size:13.5px;line-height:1.5;border:1px solid var(--border)}
  .rm.other .rm-bubble{background:#f8fafc;border-top-left-radius:3px}
  .rm.own .rm-bubble{background:var(--brand-soft);border-color:#bfdbfe;border-top-right-radius:3px}
  /* Stabsleiter-Weisung im Thread (zentral, hervorgehoben) */
  .rm-weisung{align-self:center;max-width:96%;width:100%;margin:2px 0}
  .rm-weisung .wb{border:1px solid #ddd6fe;background:linear-gradient(0deg,#faf5ff,#fff);border-radius:12px;padding:11px 14px}
  .rm-weisung .wb-head{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:#6d28d9;margin-bottom:5px}
  .rm-weisung .wb-head svg{width:14px;height:14px}
  .rm-weisung .wb-text{font-size:13px;line-height:1.5;color:var(--text)}
  .rm-weisung .wb-time{font-size:11px;color:var(--text-faint);margin-top:5px}
  /* Status-Änderung innerhalb einer Rückmeldung */
  .rm-statuschange{display:inline-flex;align-items:center;gap:6px;margin-top:8px;padding:5px 10px;border-radius:8px;background:rgba(15,23,42,.04);font-size:12px;font-weight:500;color:var(--text-muted)}
  .rm-statuschange svg{width:13px;height:13px}
  .rm-statuschange .badge-pill{padding:3px 8px;font-size:11px}
  .rm-respchange{display:flex;align-items:center;gap:6px;margin-top:8px;padding:6px 10px;border-radius:8px;background:var(--brand-soft);border:1px solid #bfdbfe;font-size:12px;font-weight:500;color:#1e40af}
  .rm-respchange svg{width:13px;height:13px;flex-shrink:0;color:var(--brand)}
  .rm-respchange b{font-weight:700}
  /* Datei-Anhang in Rückmeldung */
  .rm-files{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
  .rm-file{display:inline-flex;align-items:center;gap:7px;padding:7px 10px;border:1px solid var(--border-strong);border-radius:8px;background:#fff;font-size:12.5px;cursor:pointer;transition:.12s}
  .rm-file:hover{border-color:var(--brand);background:var(--brand-soft)}
  .rm-file svg{width:15px;height:15px;color:var(--text-muted);flex-shrink:0}
  .rm-file .fsize{color:var(--text-faint);font-size:11px}
  /* Offene Anforderung (wartet auf Antwort) */
  .rm-pending{display:flex;align-items:center;gap:9px;padding:10px 13px;border:1px dashed var(--pr-mittel-bd);background:var(--pr-mittel-bg);border-radius:10px;font-size:12.5px;color:var(--pr-mittel-fg);font-weight:500}
  .rm-pending svg{width:15px;height:15px;flex-shrink:0}

  /* ===== EINGABEFELD (Composer) ===== */
  .composer{border-top:1px solid var(--border);padding:12px 22px;background:#fff}
  .composer-row{display:flex;gap:9px;align-items:flex-end}
  .composer textarea{flex:1;border:1px solid var(--border-strong);border-radius:10px;padding:10px 12px;font-size:13.5px;font-family:inherit;resize:none;min-height:42px;max-height:120px;line-height:1.4}
  .composer textarea:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
  .composer-tools{display:flex;align-items:center;gap:6px;margin-top:9px;flex-wrap:wrap}
  .composer-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border:1px solid var(--border-strong);border-radius:8px;font-size:12.5px;color:var(--text-muted);font-weight:500;cursor:pointer;transition:.12s}
  .composer-chip:hover{border-color:var(--brand);color:var(--brand)}
  .composer-chip svg{width:14px;height:14px}
  .composer-chip.active{border-color:var(--brand);background:var(--brand-soft);color:var(--brand)}

  /* Status-Picker (klappt auf) */
  .composer-status{display:none;align-items:center;gap:7px;flex-wrap:wrap;margin-top:9px;padding:9px 11px;background:#f8fafc;border:1px solid var(--border);border-radius:9px}
  .composer-status.show{display:flex}
  .composer-status .cs-lbl{font-size:12px;font-weight:600;color:var(--text-muted)}
  .cs-opt{padding:5px 11px;border:1px solid var(--border-strong);border-radius:14px;font-size:12.5px;font-weight:600;color:var(--text-muted);background:#fff;cursor:pointer;transition:.12s}
  .cs-opt:hover{border-color:#94a3b8}
  .cs-opt.sel{border-color:var(--brand);background:var(--brand);color:#fff}

  /* Zuständigkeit übergeben / hinzuziehen */
  .composer-resp{display:none;flex-direction:column;gap:9px;margin-top:9px;padding:11px 12px;background:#f8fafc;border:1px solid var(--border);border-radius:9px}
  .composer-resp.show{display:flex}
  .composer-resp .cr-lbl{font-size:12px;font-weight:700;color:var(--text-muted);letter-spacing:.01em}
  .resp-mode{display:grid;grid-template-columns:1fr 1fr;gap:7px}
  .resp-mode-opt{display:flex;flex-direction:column;gap:2px;padding:9px 11px;border:1.5px solid var(--border);border-radius:9px;background:#fff;cursor:pointer;transition:.13s;text-align:left}
  .resp-mode-opt b{font-size:12.5px;font-weight:700;color:var(--text)}
  .resp-mode-opt span{font-size:11px;color:var(--text-faint);line-height:1.35}
  .resp-mode-opt:hover{border-color:var(--brand)}
  .resp-mode-opt.sel{border-color:var(--brand);background:var(--brand-soft)}
  .resp-mode-opt.sel b{color:var(--brand)}
  .resp-mode-opt.disabled{opacity:.45;pointer-events:none}
  .resp-selects{display:grid;grid-template-columns:1fr 1fr;gap:7px}
  .resp-selects select{width:100%;padding:8px 10px;border:1px solid var(--border-strong);border-radius:8px;font-size:13px;background:#fff;color:var(--text)}
  .resp-selects select:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
  @media(max-width:520px){.resp-mode,.resp-selects{grid-template-columns:1fr}}

  /* Anhang-Chips (Datei-Andeutung) */
  .composer-files{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
  .composer-files:empty{display:none}
  .rm-file-chip{display:inline-flex;align-items:center;gap:6px;padding:5px 8px;background:#f1f5f9;border:1px solid var(--border);border-radius:8px;font-size:12px;color:var(--text)}
  .rm-file-chip svg{width:13px;height:13px;color:var(--text-muted);flex-shrink:0}
  .rm-file-chip .fsize{color:var(--text-faint);font-size:11px}
  .rm-file-chip .x{cursor:pointer;display:flex;opacity:.5;margin-left:2px}
  .rm-file-chip .x:hover{opacity:1}
  .rm-file-chip .x svg{width:12px;height:12px}
  .composer-send{width:42px;height:42px;border-radius:10px;background:var(--brand);color:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .12s}
  .composer-send:hover{background:var(--brand-hover)}
  .composer-send svg{width:18px;height:18px}
  .composer-hint{font-size:11px;color:var(--text-faint);margin-top:7px}

  /* "Im Namen einer anderen Person" */
  .composer-behalf{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--text-muted);cursor:pointer;margin-bottom:9px}
  .composer-behalf input{width:16px;height:16px;accent-color:var(--brand);cursor:pointer;flex-shrink:0}
  .composer-behalf-name{margin-bottom:9px}
  .composer-behalf-name input{width:100%;padding:9px 12px;border:1px solid var(--brand);border-radius:9px;font-size:13.5px;box-shadow:0 0 0 3px var(--brand-soft)}
  .composer-behalf-name input:focus{outline:none}
  .rm-behalf-note{font-style:italic;color:var(--text-faint)}

  /* ===== VERLAUF (Timeline) ===== */
  .timeline{display:flex;flex-direction:column;gap:0;padding-left:6px}
  .tl-item{display:flex;gap:12px;padding-bottom:18px;position:relative}
  .tl-item:not(:last-child)::before{content:'';position:absolute;left:11px;top:24px;bottom:0;width:2px;background:var(--border)}
  .tl-dot{width:24px;height:24px;border-radius:50%;background:var(--brand-soft);color:var(--brand);display:flex;align-items:center;justify-content:center;flex-shrink:0;z-index:1}
  .tl-dot svg{width:13px;height:13px}
  .tl-body{padding-top:2px}
  .tl-action{font-size:13.5px;font-weight:600}
  .tl-detail{font-size:12.5px;color:var(--text-muted);margin-top:2px}
  .tl-stamp{font-size:11.5px;color:var(--text-faint);margin-top:3px}

  /* ===== GESCHÄFTSBUCH Ein/Aus-Badge ===== */
  .ea{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:6px;font-size:12px;font-weight:600}
  .ea.ein{background:#dcfce7;color:#166534}
  .ea.aus{background:#dbeafe;color:#1d4ed8}
  .ea svg{width:12px;height:12px}
  .gb-nr{font-weight:700;color:var(--text-muted);font-variant-numeric:tabular-nums}
  .gb-ref{font-size:11px;color:var(--brand);margin-top:3px;font-weight:600}
  #gbBody tr[onclick]:hover{background:var(--brand-soft)}
  .jr-item[onclick]:hover .jr-body{background:var(--brand-soft);border-radius:8px;margin:-4px -8px;padding:4px 8px}
  .jr-item[onclick]{border-radius:8px;transition:.12s}

  /* ===== EINSATZJOURNAL (große Timeline mit Stabsstellen-Farbe) ===== */
  .jr-tl{display:flex;flex-direction:column}
  .jr-item{display:flex;gap:14px;padding-bottom:20px;position:relative}
  .jr-item:not(:last-child)::before{content:'';position:absolute;left:15px;top:32px;bottom:0;width:2px;background:var(--border)}
  .jr-dot{width:32px;height:32px;border-radius:9px;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:#fff;z-index:1}
  .jr-dot svg{width:16px;height:16px}
  .jr-body{flex:1;padding-top:3px}
  .jr-top{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
  .jr-action{font-size:14px;font-weight:600}
  .jr-time{font-size:12px;color:var(--text-faint);font-variant-numeric:tabular-nums}
  .jr-detail{font-size:13px;color:var(--text-muted);margin-top:2px}
  .jr-meta{display:flex;align-items:center;gap:7px;margin-top:5px;font-size:12px;color:var(--text-muted)}
  .jr-ss-chip{display:inline-flex;align-items:center;gap:5px;padding:2px 8px;border-radius:12px;font-size:11.5px;font-weight:600;color:#fff}
  .drawer-foot .btn{flex:1;justify-content:center}
  .dropdown-wrap{position:relative;flex:1}
  .dropdown-wrap .btn{width:100%}

  /* ============================================================ MODALS */
  .modal-overlay{position:fixed;inset:0;background:rgba(15,23,42,.5);display:flex;align-items:flex-start;justify-content:center;padding:48px 20px;opacity:0;pointer-events:none;transition:opacity .18s;z-index:60;overflow-y:auto}
  .modal-overlay.show{opacity:1;pointer-events:auto}
  .modal{background:var(--bg-surface);border-radius:14px;box-shadow:var(--shadow-lg);width:100%;max-width:720px;transform:translateY(-12px) scale(.99);transition:transform .2s;margin:auto 0}
  .modal-overlay.show .modal{transform:translateY(0) scale(1)}
  .modal.modal-sm{max-width:560px}
  .modal-head{display:flex;align-items:flex-start;gap:12px;padding:22px 24px 16px;border-bottom:1px solid var(--border)}
  .modal-head .m-ico{width:42px;height:42px;border-radius:10px;background:var(--brand-soft);color:var(--brand);display:flex;align-items:center;justify-content:center;flex-shrink:0}
  .modal-head .m-ico svg{width:21px;height:21px}
  .modal-head h2{font-size:19px;font-weight:700}
  .modal-head p{font-size:13.5px;color:var(--text-muted);margin-top:2px}
  .modal-head .close{margin-left:auto;width:34px;height:34px;border-radius:7px;display:flex;align-items:center;justify-content:center;color:var(--text-muted)}
  .modal-head .close:hover{background:#f1f5f9;color:var(--text)}
  .modal-head .close svg{width:19px;height:19px}

  .modal-body{padding:22px 24px;max-height:calc(100vh - 280px);overflow-y:auto}
  .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
  .form-field{display:flex;flex-direction:column;gap:6px}
  .form-field.full{grid-column:1/-1}
  .form-field label{font-size:13px;font-weight:600;color:var(--text)}
  .form-field label .req{color:#ef4444}
  .form-field .hint{font-size:12px;color:var(--text-faint);font-weight:400}
  .form-field input:not([type=checkbox]):not([type=radio]),.form-field select,.form-field textarea{
    padding:10px 12px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);
    font-size:14px;color:var(--text);background:#fff;width:100%;
  }
  .form-field textarea{resize:vertical;min-height:78px}
  .form-field input:not([type=checkbox]):not([type=radio]):focus,.form-field select:focus,.form-field textarea:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}

  /* Priorität-Auswahl als Segmented Control */
  .prio-seg{display:flex;gap:8px}
  .prio-opt{flex:1;border:1px solid var(--border-strong);border-radius:var(--radius-sm);padding:10px;display:flex;align-items:center;justify-content:center;gap:7px;font-size:13.5px;font-weight:600;color:var(--text-muted);transition:.12s}
  .prio-opt svg{width:15px;height:15px}
  .prio-opt:hover{border-color:#94a3b8}
  .prio-opt.sel.p-hoch{border-color:var(--pr-hoch-bd);background:var(--pr-hoch-bg);color:var(--pr-hoch-fg)}
  .prio-opt.sel.p-mittel{border-color:var(--pr-mittel-bd);background:var(--pr-mittel-bg);color:var(--pr-mittel-fg)}
  .prio-opt.sel.p-niedrig{border-color:var(--pr-niedrig-bd);background:var(--pr-niedrig-bg);color:var(--pr-niedrig-fg)}

  /* Forward typ toggle */
  .seg{display:flex;border:1px solid var(--border-strong);border-radius:var(--radius-sm);overflow:hidden}
  .seg button{flex:1;padding:9px;font-size:13.5px;font-weight:600;color:var(--text-muted);background:#fff}
  .seg button.sel{background:var(--brand);color:#fff}

  .modal-foot{display:flex;align-items:center;gap:10px;padding:16px 24px;border-top:1px solid var(--border)}
  .modal-foot .spacer{flex:1}

  /* ============================================================
     NEUER-AUFTRAG-MODAL (Redesign: dunkler Header, zweispaltig)
     ============================================================ */
  .modal-xl{max-width:1080px;display:flex;flex-direction:column;max-height:calc(100vh - 96px)}
  /* Dunkler Header */
  .na-head{display:flex;align-items:center;gap:14px;padding:18px 24px;background:var(--bg-sidebar);color:#fff;border-radius:14px 14px 0 0;flex-shrink:0}
  .na-head .na-ico{width:46px;height:46px;border-radius:11px;background:rgba(255,255,255,.12);display:flex;align-items:center;justify-content:center;flex-shrink:0}
  .na-head .na-ico svg{width:23px;height:23px}
  .na-head .na-titles{flex:1;min-width:0}
  .na-head h2{font-size:21px;font-weight:700;line-height:1.15}
  .na-head .na-sub{font-size:13px;color:var(--text-on-dark-muted);margin-top:2px}
  .na-head .na-meta{display:flex;align-items:center;gap:12px;flex-shrink:0}
  .na-protokoll{padding:7px 13px;background:rgba(255,255,255,.1);border-radius:8px;font-size:13px;font-weight:600;white-space:nowrap}
  .na-time{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--text-on-dark-muted);white-space:nowrap}
  .na-time svg{width:15px;height:15px}
  .na-head .close{margin-left:0;width:38px;height:38px;border-radius:9px;background:rgba(255,255,255,.1);color:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0}
  .na-head .close:hover{background:rgba(255,255,255,.2)}
  .na-head .close svg{width:19px;height:19px}

  /* Body zweispaltig */
  .na-body{display:grid;grid-template-columns:1fr 1fr;gap:0;flex:1;min-height:0;overflow-y:auto}
  .na-col{padding:22px 24px;min-width:0}
  .na-col.left{border-right:1px solid var(--border)}
  .na-section-lbl{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em;margin-bottom:12px}
  .na-section-lbl svg{width:16px;height:16px;color:var(--brand)}
  .na-section-lbl:not(:first-child){margin-top:24px}
  /* Abstand über Gruppen-Wrappern (Labels sind dort erstes Kind) */
  .na-melder-group,.na-betreff-group{margin-top:24px}
  .na-betreff-group .na-section-lbl:not(:first-child){margin-top:24px}

  /* Priorität als große Flag-Buttons */
  .na-prio{display:flex;gap:10px}
  .na-prio-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:13px 10px;border:1.5px solid var(--border-strong);border-radius:10px;font-size:13.5px;font-weight:600;color:var(--text-muted);background:#fff;transition:.12s}
  .na-prio-btn svg{width:17px;height:17px}
  .na-prio-btn:hover{border-color:#94a3b8}
  .na-prio-btn.sel.p-hoch{border-color:var(--pr-hoch-fg);background:var(--pr-hoch-bg);color:var(--pr-hoch-fg)}
  .na-prio-btn.sel.p-mittel{border-color:var(--pr-mittel-fg);background:var(--pr-mittel-bg);color:var(--pr-mittel-fg)}
  .na-prio-btn.sel.p-niedrig{border-color:#16a34a;background:#f0fdf4;color:#15803d}

  /* Stabsstellen-Grid (Karten mit Kürzel-Badge + Name) */
  .ss-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .ss-card{display:flex;align-items:center;gap:10px;padding:8px 11px;border:1.5px solid var(--border-strong);border-radius:9px;background:#fff;cursor:pointer;transition:.12s;text-align:left;position:relative}
  .ss-card:hover{border-color:#94a3b8}
  .ss-card .ss-badge{width:34px;height:26px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:12.5px;font-weight:700;flex-shrink:0}
  .ss-card .ss-name{font-size:13px;font-weight:600;color:var(--text)}
  .ss-card.sel{border-color:var(--brand);background:var(--brand-soft);box-shadow:0 0 0 1px var(--brand)}
  .ss-card .ss-check{position:absolute;top:-7px;right:-7px;width:20px;height:20px;border-radius:50%;background:var(--brand);color:#fff;display:none;align-items:center;justify-content:center}
  .ss-card.sel .ss-check{display:flex}
  .ss-card .ss-check svg{width:12px;height:12px}
  /* farbige Kürzel-Badges je Stabsstelle */
  .ssb-S1{background:#dbeafe;color:#1d4ed8}.ssb-S2{background:#cffafe;color:#0e7490}
  .ssb-S3{background:#fee2e2;color:#b91c1c}.ssb-S4{background:#fef9c3;color:#a16207}
  .ssb-S5{background:#f3e8ff;color:#7c3aed}.ssb-S6{background:#e2e8f0;color:#475569}
  .ssb-S7{background:#fce7f3;color:#be185d}.ssb-L{background:#ffedd5;color:#c2410c}
  .ssb-EL{background:#ede9fe;color:#6d28d9}
  /* kleines Szenario: Paar-Badge "S2/S3" – neutrales Indigo, auto-breit */
  .ss-badge-pair{background:#e0e7ff;color:#4338ca}
  .ss-card .ss-badge.ss-badge-pair{width:auto!important;min-width:34px;padding:0 8px}
  /* Zuteilung beim Einsatz-Anlegen (Stäbe ↔ Personen) */
  .zt-stab{position:relative}
  .zt-count{position:absolute;top:6px;right:6px;min-width:19px;height:19px;padding:0 5px;border-radius:10px;background:var(--brand);color:#fff;font-size:11px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;line-height:1}
  .zt-sum{margin-top:8px;font-size:12px;color:var(--text-muted);font-weight:600}
  .zt-phead{display:flex;align-items:center;gap:12px;margin-bottom:10px}
  .zt-back{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:600;color:var(--brand-hover);background:var(--brand-soft);border:1px solid #bfdbfe;border-radius:8px;padding:5px 10px;cursor:pointer}
  .zt-back:hover{background:#dbeafe}
  .zt-ptitle{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--text)}
  .zt-ptitle .ss-badge{height:24px;min-width:32px;padding:0 8px;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:700}
  .zt-people{display:flex;flex-direction:column;gap:6px;max-height:260px;overflow-y:auto}
  .zt-person{display:flex;align-items:center;gap:8px}
  .zt-person-main{flex:1;display:flex;align-items:center;gap:10px;padding:7px 10px;border:1.5px solid var(--border-strong);border-radius:9px;background:#fff;cursor:pointer;text-align:left;transition:.12s;min-width:0}
  .zt-person-main:hover{border-color:#94a3b8}
  .zt-person.is-sel .zt-person-main{border-color:var(--brand);background:var(--brand-soft);box-shadow:0 0 0 1px var(--brand)}
  .zt-ava{width:30px;height:30px;border-radius:50%;background:#e2e8f0;color:#475569;font-size:11.5px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0}
  .zt-meta{display:flex;flex-direction:column;min-width:0}
  .zt-name{font-size:13px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .zt-org{font-size:11.5px;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .zt-tick{margin-left:auto;width:20px;height:20px;border-radius:50%;background:var(--brand);color:#fff;display:none;align-items:center;justify-content:center;flex-shrink:0}
  .zt-tick svg{width:12px;height:12px}
  .zt-person.is-sel .zt-tick{display:flex}
  .zt-role{flex-shrink:0;padding:6px 8px;border:1.5px solid var(--border-strong);border-radius:8px;font-size:12.5px;font-weight:600;background:#fff;color:var(--text)}
  .zt-empty{font-size:12.5px;color:var(--text-muted);padding:10px 2px}

  /* Tablet-Zwischengröße: Stabsstellen-Karten kompakt (nur Kürzel, ohne Name) */
  @media(min-width:721px) and (max-width:960px){
    .ss-grid{grid-template-columns:repeat(4,1fr);gap:8px;min-width:0}
    .ss-card{flex-direction:column;gap:5px;padding:11px 6px;justify-content:center;text-align:center;min-width:0}
    .ss-card .ss-name{display:none}
    .ss-card .ss-badge{width:42px;height:32px}
    .na-checks{gap:14px}
    .na-section-lbl{font-size:11px}
  }

  /* ESIS/ETB Checkbox-Reihe */
  .na-checks{display:flex;gap:24px;flex-wrap:wrap}
  .na-check{display:flex;align-items:center;gap:9px;cursor:pointer;font-size:13.5px;font-weight:500}
  .na-check input{width:19px;height:19px;accent-color:var(--brand);cursor:pointer}
  .na-check .info-i{width:15px;height:15px;color:var(--text-faint)}
  .na-etb-nr{margin-top:10px}

  /* Beteiligte Chips-Box mit Dropdown */
  .na-mit-box{border:1px solid var(--border-strong);border-radius:10px;padding:8px;display:flex;flex-wrap:wrap;gap:6px;align-items:center;min-height:46px}
  .na-mit-box:focus-within{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
  .na-mit-chip{display:inline-flex;align-items:center;gap:7px;padding:5px 9px;border-radius:8px;font-size:12.5px;font-weight:600;border:1px solid currentColor;background:#fff}
  .na-mit-chip .x{cursor:pointer;display:flex;opacity:.6}
  .na-mit-chip .x:hover{opacity:1}
  .na-mit-chip .x svg{width:13px;height:13px}
  .na-mit-box select{border:none;flex:1;min-width:130px;padding:5px;font-size:13.5px;background:transparent}
  .na-mit-box select:focus{outline:none}

  /* "Aufgenommen durch" mit rundem Avatar */
  .na-recorder{display:flex;align-items:center;gap:12px;padding:9px 13px;border:1px solid var(--border-strong);border-radius:10px;background:#fff}

  /* Pflichtfeld-Fehlerzustand */
  .field-err{display:none;font-size:12px;color:#dc2626;margin-top:5px;align-items:center;gap:5px}
  .field-err::before{content:'';display:inline-block;width:13px;height:13px;flex-shrink:0;background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23dc2626' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 8v4M12 16h.01'/%3E%3C/svg%3E")}
  .field-err.show{display:flex}
  .req-field.invalid,textarea.req-field.invalid{border-color:#dc2626 !important;box-shadow:0 0 0 3px rgba(220,38,38,.12) !important}
  .ss-grid.invalid{outline:1.5px solid #dc2626;outline-offset:3px;border-radius:10px}
  .na-recorder .rec-ava{width:36px;height:36px;border-radius:50%;background:#475569;color:#fff;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600;flex-shrink:0;overflow:hidden}
  .na-recorder .rec-info{flex:1;min-width:0}
  .na-recorder .rec-name{font-size:14px;font-weight:600;color:var(--text);line-height:1.2}
  .na-recorder .rec-role{font-size:12px;color:var(--text-muted);line-height:1.2}
  .na-recorder .rec-chev{color:var(--text-faint);flex-shrink:0}
  .na-recorder .rec-chev svg{width:16px;height:16px}

  /* Zeitverlauf-Footer */
  .na-timeline{display:flex;align-items:center;gap:0;padding:16px 24px;border-top:1px solid var(--border);background:#fafbfc;flex-shrink:0}
  .na-tl-icon{display:flex;align-items:center;gap:10px;flex-shrink:0}
  .na-tl-dot{width:38px;height:38px;border-radius:10px;background:#fff;border:1.5px solid var(--border);display:flex;align-items:center;justify-content:center;color:var(--text-faint);flex-shrink:0}
  .na-tl-dot.active{background:var(--brand-soft);border-color:var(--brand);color:var(--brand)}
  .na-tl-dot svg{width:17px;height:17px}
  .na-tl-txt .tl-step{font-size:12.5px;font-weight:600}
  .na-tl-txt .tl-when{font-size:11.5px;color:var(--text-muted);margin-top:1px}
  .na-tl-line{flex:1;height:0;border-top:2px dashed var(--border);margin:0 10px;min-width:14px}
  .na-tl-title{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:700;color:var(--brand);margin-bottom:0;margin-right:18px;white-space:nowrap}
  .na-tl-title svg{width:14px;height:14px}

  /* Footer-Buttons */
  .na-foot{display:flex;align-items:center;gap:10px;padding:15px 24px;border-top:1px solid var(--border);flex-wrap:wrap;flex-shrink:0}
  .na-foot .spacer{flex:1}

  /* Status-Auswahl-Liste (Status ändern Modal) */
  .status-list{display:flex;flex-direction:column;gap:8px}
  .status-opt{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);transition:.12s}
  .status-opt:hover{border-color:var(--brand);background:var(--brand-soft)}
  .status-opt.sel{border-color:var(--brand);background:var(--brand-soft);box-shadow:0 0 0 1px var(--brand)}
  .status-opt .check{margin-left:auto;color:var(--brand);opacity:0}
  .status-opt.sel .check{opacity:1}
  .status-opt .check svg{width:18px;height:18px}

  /* Export-Optionen */
  .export-opt{display:flex;align-items:center;gap:14px;padding:14px 16px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);width:100%;text-align:left;transition:.12s;margin-bottom:10px}
  .export-opt:hover{border-color:var(--brand);background:var(--brand-soft)}
  .export-opt .ex-ico{width:40px;height:40px;border-radius:9px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-weight:700;font-size:12px;color:#fff}
  .export-opt .ex-ico.pdf{background:#dc2626}
  .export-opt .ex-ico.xlsx{background:#16a34a}
  .export-opt .ex-ico.csv{background:#64748b}
  .export-opt .ex-name{font-weight:600;font-size:14px}
  .export-opt .ex-desc{font-size:12.5px;color:var(--text-muted);margin-top:1px}
  .export-opt .ex-arrow{margin-left:auto;color:var(--text-faint)}
  .export-opt .ex-arrow svg{width:18px;height:18px}
  .export-opt .ex-count{margin-left:auto;font-size:12px;font-weight:700;color:var(--text-muted);background:var(--bg-app);border:1px solid var(--border);border-radius:20px;padding:3px 11px;flex-shrink:0}
  .export-opt .ex-count + .ex-arrow{margin-left:8px}
  .export-opt.ex-primary{border-color:#bfdbfe;background:linear-gradient(180deg,var(--brand-soft),#fff)}
  .export-opt.ex-primary:hover{border-color:var(--brand)}
  .ex-sep{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--text-faint);margin:16px 4px 9px}
  .ex-statusdot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;vertical-align:1px}
  .es-export svg{width:15px;height:15px}

  /* ============================================================
     MITARBEITER-MODAL + IMPORT-MODAL
     ============================================================ */
  /* heller Icon-Button (Seitenkopf, neben „Mitarbeiter hinzufügen") */
  .btn-icon-light{width:40px;height:40px;border-radius:var(--radius);display:flex;align-items:center;justify-content:center;
    background:var(--bg-surface);color:var(--text-muted);border:1px solid var(--border-strong);transition:.12s;flex-shrink:0}
  .btn-icon-light:hover{background:#f8fafc;border-color:var(--brand);color:var(--brand)}
  .btn-icon-light svg{width:18px;height:18px}

  /* Foto-Upload */
  .ava-up{display:flex;align-items:center;gap:16px}
  .ava-up-prev{width:84px;height:84px;border-radius:50%;flex-shrink:0;position:relative;overflow:hidden;
    display:flex;align-items:center;justify-content:center;color:#fff;font-size:26px;font-weight:700;
    border:3px solid #fff;box-shadow:0 0 0 1px var(--border-strong),0 4px 12px rgba(15,23,42,.12);background:#94a3b8}
  .ava-up-prev img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
  .ava-up-actions{display:flex;flex-direction:column;gap:7px;min-width:0}
  .ava-up-row{display:flex;gap:8px;flex-wrap:wrap}
  .ava-up-btn{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border:1px solid var(--border-strong);
    border-radius:var(--radius-sm);font-size:13px;font-weight:600;color:var(--text);background:#fff;cursor:pointer;transition:.12s}
  .ava-up-btn:hover{border-color:var(--brand);color:var(--brand);background:var(--brand-soft)}
  .ava-up-btn svg{width:14px;height:14px}
  .ava-up-btn.del{color:var(--text-muted)}
  .ava-up-btn.del:hover{border-color:#dc2626;color:#dc2626;background:#fef2f2}
  .ava-up-hint{font-size:12px;color:var(--text-faint)}

  /* Status-Segmented (Mitarbeiter) */
  .stat-seg{display:flex;gap:8px}
  .stat-opt{flex:1;border:1px solid var(--border-strong);border-radius:var(--radius-sm);padding:9px;display:flex;align-items:center;justify-content:center;gap:7px;font-size:13px;font-weight:600;color:var(--text-muted);cursor:pointer;transition:.12s}
  .stat-opt .d{width:8px;height:8px;border-radius:50%;background:currentColor;opacity:.5}
  .stat-opt:hover{border-color:#94a3b8}
  .stat-opt.sel.s-auto{border-color:#bbf7d0;background:#f0fdf4;color:#166534}
  .stat-opt.sel.s-bereit{border-color:#bfdbfe;background:var(--brand-soft);color:#1d4ed8}
  .stat-opt.sel.s-abwesend{border-color:var(--border-strong);background:#f1f5f9;color:#475569}
  .stat-opt.sel .d{opacity:1}

  /* Live-Telefon-Vorschau */
  .phone-prev{display:flex;align-items:center;gap:8px;margin-top:7px;font-size:12.5px;padding:7px 10px;border-radius:var(--radius-sm);background:#f8fafc;border:1px solid var(--border)}
  .phone-prev svg{width:14px;height:14px;flex-shrink:0}
  .phone-prev .pp-num{font-weight:700;font-variant-numeric:tabular-nums}
  .phone-prev.ok{background:#f0fdf4;border-color:#bbf7d0;color:#166534}
  .phone-prev.warn{background:#fffbeb;border-color:#fde68a;color:#92400e}
  .phone-prev.empty{color:var(--text-faint)}

  /* Leitung-Checkbox-Karte */
  .lead-check{display:flex;align-items:center;gap:11px;padding:11px 13px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);cursor:pointer;transition:.12s}
  .lead-check:hover{border-color:#94a3b8}
  .lead-check.on{border-color:#d8b4fe;background:#faf5ff}
  .lead-check input{width:17px;height:17px;accent-color:#9333ea;flex-shrink:0}
  .lead-check .lc-txt{font-size:13px;font-weight:600;color:var(--text)}
  .lead-check .lc-sub{font-size:11.5px;color:var(--text-muted);font-weight:400}

  /* Mitarbeiter-Modal: zweispaltig (Breite wie Neuer-Auftrag-Modal) */
  .modal-ma .modal-body{max-height:calc(100vh - 240px)}
  .ma-cols{display:grid;grid-template-columns:1fr 1fr;gap:8px 34px}
  .ma-col{display:flex;flex-direction:column;gap:16px;min-width:0}
  .ma-col + .ma-col{position:relative}
  .ma-col + .ma-col::before{content:'';position:absolute;left:-17px;top:4px;bottom:4px;width:1px;background:var(--border)}
  .ma-col-lbl{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em}
  .ma-col-lbl svg{width:16px;height:16px;color:var(--brand)}
  @media(max-width:760px){
    .ma-cols{grid-template-columns:1fr;gap:22px}
    .ma-col + .ma-col::before{display:none}
  }

  /* IMPORT-Modal */
  .imp-help{font-size:12.5px;color:var(--text-muted);line-height:1.5;background:#f8fafc;border:1px solid var(--border);border-radius:var(--radius-sm);padding:11px 13px;margin-bottom:14px}
  .imp-help code{background:#fff;border:1px solid var(--border);border-radius:4px;padding:1px 5px;font-size:11.5px;color:var(--text)}
  .imp-drop{border:1.5px dashed var(--border-strong);border-radius:10px;padding:16px;text-align:center;transition:.12s;cursor:pointer;margin-bottom:12px}
  .imp-drop:hover,.imp-drop.drag{border-color:var(--brand);background:var(--brand-soft)}
  .imp-drop svg{width:26px;height:26px;color:var(--text-faint);margin-bottom:6px}
  .imp-drop .d-main{font-size:13.5px;font-weight:600;color:var(--text)}
  .imp-drop .d-sub{font-size:12px;color:var(--text-muted);margin-top:2px}
  .imp-ta{width:100%;min-height:120px;resize:vertical;padding:11px 12px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);font-size:13px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--text);line-height:1.55}
  .imp-ta:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
  .imp-bar{display:flex;align-items:center;gap:10px;margin:12px 0}
  .imp-bar .imp-count{font-size:13px;color:var(--text-muted)}
  .imp-bar .imp-count b{color:var(--text)}
  .imp-bar .imp-ok{color:#166534;font-weight:700}
  .imp-bar .imp-bad{color:#b45309;font-weight:700}
  .imp-link{font-size:12.5px;font-weight:600;color:var(--brand);cursor:pointer}
  .imp-link:hover{text-decoration:underline}
  .imp-table-wrap{border:1px solid var(--border);border-radius:10px;overflow:auto;max-height:280px}
  table.imp-table{width:100%;border-collapse:collapse;font-size:12.5px}
  table.imp-table th{position:sticky;top:0;background:#fafbfc;text-align:left;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--text-muted);padding:9px 11px;border-bottom:1px solid var(--border);white-space:nowrap}
  table.imp-table td{padding:9px 11px;border-bottom:1px solid var(--border);vertical-align:middle}
  table.imp-table tr:last-child td{border-bottom:none}
  table.imp-table tr.bad{background:#fffbeb}
  .imp-ava{width:26px;height:26px;border-radius:7px;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:10px;flex-shrink:0}
  .imp-nm{display:flex;align-items:center;gap:8px}
  .imp-phone-raw{color:var(--text-faint);text-decoration:line-through;font-size:11px}
  .imp-phone-norm{font-weight:700;font-variant-numeric:tabular-nums}
  .imp-badge{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:20px;font-size:11px;font-weight:700;white-space:nowrap}
  .imp-badge svg{width:11px;height:11px}
  .imp-badge.ok{background:#dcfce7;color:#166534}
  .imp-badge.warn{background:#fef3c7;color:#92400e}
  .imp-empty{padding:26px;text-align:center;color:var(--text-faint);font-size:13px}
  @media(max-width:560px){
    .imp-hide-sm{display:none}
  }

  /* ============================================================
     BERICHTE & AUSWERTUNG
     ============================================================ */
  .rep-lage-select{height:40px;padding:0 34px 0 13px;border:1px solid var(--border-strong);border-radius:var(--radius);
    background:#fff;font-size:13px;font-weight:600;color:var(--text);cursor:pointer;appearance:none;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 11px center}

  .rep-section{display:grid;gap:14px;margin-bottom:14px}
  .rep-kpis{grid-template-columns:repeat(6,minmax(0,1fr))}
  .rep-row2{grid-template-columns:1.5fr 1.5fr 1fr 1fr}
  .rep-row3{grid-template-columns:repeat(5,minmax(0,1fr))}
  .rep-row4{grid-template-columns:2fr 1fr 1fr}

  .rep-card{background:var(--bg-surface);border:1px solid var(--border);border-radius:14px;padding:16px 18px;box-shadow:var(--shadow-sm);min-width:0}
  .rep-card-h{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:700;color:var(--text);margin-bottom:14px}
  .rep-card-h .sub{font-weight:500;color:var(--text-muted);font-size:12.5px}
  .rep-card-h .info{margin-left:auto;color:var(--text-faint);cursor:help;display:flex}
  .rep-card-h .info svg{width:15px;height:15px}

  /* KPI-Karten */
  .rep-kpi{background:var(--bg-surface);border:1px solid var(--border);border-radius:14px;padding:15px 16px;box-shadow:var(--shadow-sm);min-width:0;display:flex;flex-direction:column;gap:9px}
  .rep-kpi-top{display:flex;align-items:flex-start;gap:11px}
  .rep-kpi-ico{width:38px;height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center;flex-shrink:0;background:var(--brand-soft);color:var(--brand)}
  .rep-kpi-ico svg{width:19px;height:19px}
  .rep-kpi-ico.green{background:#dcfce7;color:#16a34a}
  .rep-kpi-ico.amber{background:#fef3c7;color:#b45309}
  .rep-kpi-ico.violet{background:#f3e8ff;color:#7c3aed}
  .rep-kpi-lbl{font-size:12.5px;color:var(--text-muted);line-height:1.3;padding-top:2px}
  .rep-kpi-val{font-size:26px;font-weight:800;color:var(--text);line-height:1.05;letter-spacing:-.5px;font-variant-numeric:tabular-nums}
  .rep-kpi-val.sm{font-size:18px;line-height:1.2}
  .rep-kpi-sub{font-size:12px;color:var(--text-muted);line-height:1.45;margin-top:auto}
  .rep-kpi-sub .hot{color:#dc2626;font-weight:600}

  /* horizontale Balken (Auslastung, Ø Dauer, Verteilungen) */
  .rep-hbar{display:flex;align-items:center;gap:10px;margin-bottom:11px;font-size:12.5px}
  .rep-hbar:last-child{margin-bottom:0}
  .rep-hbar-lbl{width:128px;flex-shrink:0;color:var(--text);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .rep-hbar-track{flex:1;height:18px;background:#f1f5f9;border-radius:5px;overflow:hidden;display:flex;min-width:0}
  .rep-hbar-fill{height:100%;display:flex;align-items:center;justify-content:flex-start;padding-left:7px;color:#fff;font-size:11px;font-weight:700;min-width:0;white-space:nowrap}
  .rep-hbar-fill.empty{background:transparent}
  .rep-hbar-val{flex-shrink:0;width:34px;text-align:right;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums}

  /* Verteilungs-Zeilen (Status / Prio) */
  .rep-dist{display:flex;align-items:center;gap:10px;margin-bottom:13px;font-size:13px}
  .rep-dist:last-child{margin-bottom:0}
  .rep-dist-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0}
  .rep-dist-lbl{width:108px;flex-shrink:0;color:var(--text);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .rep-dist-track{flex:1;height:8px;background:#f1f5f9;border-radius:4px;overflow:hidden;min-width:20px}
  .rep-dist-fill{height:100%;border-radius:4px}
  .rep-dist-val{flex-shrink:0;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums;white-space:nowrap}
  .rep-dist-val .pct{color:var(--text-muted);font-weight:500;font-size:12px}

  /* Geschäftsbuch Ein/Aus */
  .rep-ea{display:flex;gap:22px;margin-bottom:6px}
  .rep-ea-item .v{font-size:30px;font-weight:800;line-height:1;font-variant-numeric:tabular-nums}
  .rep-ea-item .v.ein{color:var(--brand)}
  .rep-ea-item .v.aus{color:var(--text-muted)}
  .rep-ea-item .l{font-size:12px;color:var(--text-muted);margin-top:3px}
  .rep-ea-ratio{font-size:12.5px;color:var(--text-muted);margin-top:8px}
  .rep-ea-ratio b{color:var(--text)}
  .rep-legend{display:flex;gap:14px;font-size:12px;color:var(--text-muted);margin-bottom:10px}
  .rep-legend span{display:inline-flex;align-items:center;gap:5px}
  .rep-legend i{width:9px;height:9px;border-radius:2px;display:inline-block}

  /* Ranking-Listen (Top-Melder, Dokumentation) */
  .rep-rank{display:flex;align-items:center;gap:10px;padding:6px 0;font-size:13px;border-bottom:1px solid var(--border)}
  .rep-rank:last-of-type{border-bottom:none}
  .rep-rank-n{width:18px;color:var(--text-faint);font-weight:700;font-variant-numeric:tabular-nums;flex-shrink:0}
  .rep-rank-ava{width:28px;height:28px;border-radius:8px;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:10.5px;flex-shrink:0;overflow:hidden}
  .rep-rank-nm{flex:1;color:var(--text);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
  .rep-rank-v{flex-shrink:0;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums}
  .rep-foot{font-size:11.5px;color:var(--text-faint);margin-top:11px}

  /* Personalverfügbarkeit */
  .rep-avail{display:flex;align-items:center;gap:10px;margin-bottom:12px;font-size:13px}
  .rep-avail:last-of-type{margin-bottom:0}
  .rep-avail-dot{width:11px;height:11px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center}
  .rep-avail-dot svg{width:8px;height:8px;color:#fff;stroke-width:3.5}
  .rep-avail-lbl{flex:1;color:var(--text);font-weight:500}
  .rep-avail-v{font-weight:800;color:var(--text);font-variant-numeric:tabular-nums;font-size:15px}

  /* Engpässe-Tabelle */
  table.rep-table{width:100%;border-collapse:collapse;font-size:13px}
  table.rep-table th{text-align:left;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--text-muted);padding:7px 10px;border-bottom:1px solid var(--border)}
  table.rep-table th.num,table.rep-table td.num{text-align:right;font-variant-numeric:tabular-nums}
  table.rep-table td{padding:9px 10px;border-bottom:1px solid var(--border);color:var(--text)}
  table.rep-table tr:last-child td{border-bottom:none}
  table.rep-table .ss-cell{display:flex;align-items:center;gap:8px;font-weight:600}
  table.rep-table .ss-pip{width:9px;height:9px;border-radius:3px;flex-shrink:0}
  .rep-warn{color:#b45309;font-weight:600}
  .rep-crit{color:#dc2626;font-weight:700}

  /* Highlight-Karten (längster offen / schnellste) */
  .rep-hl-h{display:flex;align-items:center;gap:9px;font-size:13.5px;font-weight:700;color:var(--text);margin-bottom:14px}
  .rep-hl-ico{width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
  .rep-hl-ico svg{width:17px;height:17px}
  .rep-hl-ico.red{background:#fef2f2;color:#dc2626}
  .rep-hl-ico.green{background:#dcfce7;color:#16a34a}
  .rep-hl-id{font-size:12.5px;color:var(--text-muted);font-weight:600;font-variant-numeric:tabular-nums}
  .rep-hl-bt{font-size:16px;font-weight:700;color:var(--text);margin:3px 0 9px}
  .rep-hl-time{font-size:13px;color:var(--text);margin-bottom:11px}
  .rep-hl-time b.crit{color:#dc2626}
  .rep-hl-time b.good{color:#16a34a}
  .rep-hl-meta{font-size:12px;color:var(--text-muted);display:flex;gap:7px;flex-wrap:wrap}
  .rep-hl-meta b{color:var(--text)}

  /* SVG-Charts */
  .rep-chart{width:100%;height:auto;display:block;overflow:visible}
  .rep-chart .bar{transition:opacity .2s}
  .rep-chart text{font-family:var(--font)}

  @media(max-width:1450px){ .rep-kpis{grid-template-columns:repeat(3,minmax(0,1fr))} }
  @media(max-width:1300px){ .rep-row3{grid-template-columns:repeat(3,minmax(0,1fr))} }
  @media(max-width:1120px){
    .rep-row2{grid-template-columns:1fr 1fr}
    .rep-row4{grid-template-columns:1fr}
  }
  @media(max-width:820px){
    .rep-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
    .rep-row3{grid-template-columns:repeat(2,minmax(0,1fr))}
  }
  @media(max-width:600px){
    .rep-row2{grid-template-columns:1fr}
    .rep-kpis,.rep-row3{grid-template-columns:1fr}
    .rep-hbar-lbl{width:96px}
  }

  /* ============================================================
     EINSÄTZE-NAV-SUBITEMS · TAGESROLLE-MODAL · EINSÄTZE-VIEW
     ============================================================ */
  .nav-sub{display:flex;flex-direction:column;gap:2px;margin:0 0 6px}
  .nav-caret{transition:transform .2s}
  .nav-caret.open{transform:rotate(90deg)}
  .nav-subitem{display:flex;align-items:center;gap:9px;padding:7px 14px 7px 42px;font-size:12.5px;color:rgba(255,255,255,.6);background:transparent;border:none;cursor:pointer;text-align:left;border-radius:8px;transition:.12s;width:100%}
  .nav-subitem:hover{background:rgba(255,255,255,.06);color:#fff}
  .nav-subitem.active{background:rgba(37,99,235,.28);color:#fff}
  .nav-subitem .es-dot{width:7px;height:7px;border-radius:50%;background:#22c55e;flex-shrink:0;box-shadow:0 0 0 0 rgba(34,197,94,.5);animation:ssPulse 1.8s infinite}
  .nav-subitem .es-nm{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  /* Dezenter Zähler am Untermenüpunkt (z. B. „Meine Aufträge"): bewusst OHNE
     roten Kreis — die rote Badge am Hauptpunkt signalisiert bereits, zwei
     rote Kreise übereinander wären visuelles Rauschen. Nur die Zahl,
     rechtsbündig, gedämpft; hellt bei Hover/aktiv leicht auf. */
  .nav-subitem .subcount{margin-left:auto;font-size:11px;font-weight:700;color:rgba(255,255,255,.4);font-variant-numeric:tabular-nums;transition:color .12s}
  .nav-subitem:hover .subcount{color:rgba(255,255,255,.7)}
  .nav-subitem.active .subcount{color:rgba(255,255,255,.9)}

  /* Tagesrolle-Modal */
  .rolle-acc{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--border);border-radius:10px;background:#f8fafc;flex-wrap:wrap}
  .rolle-acc .ava{width:42px;height:42px;border-radius:11px;background:var(--brand);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:15px;flex-shrink:0}
  .rolle-acc .ra-main{flex:1;min-width:120px}
  .rolle-acc .ra-nm{font-weight:700;font-size:14.5px;color:var(--text)}
  .rolle-acc .ra-sub{font-size:12px;color:var(--text-muted)}
  .rolle-acc select{height:36px;border:1px solid var(--border-strong);border-radius:8px;font-size:13px;padding:0 10px;background:#fff;color:var(--text)}
  .rolle-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:4px}
  .rolle-opt{position:relative;display:flex;align-items:center;gap:11px;padding:11px 12px;border:1.5px solid var(--border-strong);border-radius:11px;cursor:pointer;transition:.12s;text-align:left;background:#fff}
  .rolle-opt:hover{border-color:var(--brand);background:var(--brand-soft)}
  .rolle-opt.sel{border-color:var(--brand);background:var(--brand-soft);box-shadow:0 0 0 1px var(--brand)}
  .rolle-opt .ro-badge{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:12.5px;color:#fff;flex-shrink:0}
  .rolle-opt .ro-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
  .rolle-opt .ro-nm{font-weight:700;font-size:13.5px;color:var(--text)}
  .rolle-opt .ro-sub{font-size:11.5px;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
  .rolle-opt .ro-tag{position:absolute;top:-9px;right:12px;z-index:2;display:inline-flex;align-items:center;font-size:10px;font-weight:700;padding:2px 9px;border-radius:20px;text-transform:uppercase;letter-spacing:.03em;line-height:1.5;white-space:nowrap;max-width:calc(100% - 24px);overflow:hidden;text-overflow:ellipsis;background:#fff;color:var(--text);border:1px solid var(--border-strong);box-shadow:0 1px 2px rgba(15,23,42,.06)}
  .rolle-opt .ro-tag--du{background:#fff;color:var(--brand);border-color:var(--brand)}
  .rolle-opt .ro-tag--belegt{background:#fff;color:var(--text-muted);border-color:var(--border-strong)}
  .rolle-sec-lbl{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--text-muted);margin:16px 0 8px}
  .rolle-note{font-size:12px;color:var(--text-muted);background:#fffbeb;border:1px solid #fde68a;border-radius:9px;padding:10px 12px;margin-top:12px;display:flex;gap:9px;line-height:1.5}
  .rolle-note svg{width:16px;height:16px;flex-shrink:0;color:#b45309;margin-top:1px}
  @media(max-width:560px){ .rolle-grid{grid-template-columns:1fr} }

  /* Einsätze-View */
  .es-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:14px}
  .es-card{background:var(--bg-surface);border:1px solid var(--border);border-radius:14px;padding:16px 18px;box-shadow:var(--shadow-sm)}
  .es-card.active{border-color:#86efac;box-shadow:0 0 0 1px #86efac}
  .es-card-top{display:flex;align-items:flex-start;gap:11px;margin-bottom:13px}
  .es-ico{width:42px;height:42px;border-radius:11px;display:flex;align-items:center;justify-content:center;flex-shrink:0;background:#fef2f2;color:#dc2626}
  .es-ico svg{width:21px;height:21px}
  .es-card-main{flex:1;min-width:0}
  .es-card-nm{font-weight:700;font-size:15.5px;color:var(--text)}
  .es-card-art{font-size:12.5px;color:var(--text-muted)}
  .es-badge{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:20px;font-size:11.5px;font-weight:700;flex-shrink:0;white-space:nowrap}
  .es-badge .d{width:7px;height:7px;border-radius:50%}
  .es-badge.aktiv{background:#dcfce7;color:#166534}
  .es-badge.aktiv .d{background:#22c55e}
  .es-badge.pausiert{background:#fef3c7;color:#92400e}
  .es-badge.pausiert .d{background:#f59e0b}
  .es-badge.beendet{background:#f1f5f9;color:#64748b}
  .es-badge.beendet .d{background:#94a3b8}
  .es-meta{display:grid;grid-template-columns:1fr 1fr;gap:9px 14px;font-size:12.5px;margin-bottom:13px}
  .es-meta .k{color:var(--text-faint);font-size:11px}
  .es-meta .v{color:var(--text);font-weight:600}
  .es-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center;border-top:1px solid var(--border);padding-top:12px}
  .es-actions select{height:34px;border:1px solid var(--border-strong);border-radius:8px;font-size:12.5px;padding:0 8px;font-weight:600;background:#fff;color:var(--text)}
  .es-ro-note{font-size:11.5px;color:var(--text-faint)}

  .es-open{cursor:pointer;border-radius:10px;margin:-4px -4px 0;padding:4px;transition:background .12s}
  .es-open:hover{background:var(--brand-soft)}

  /* Einsatz-Detail / Chronologie */
  .ed-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:16px}
  .ed-titlewrap{display:flex;align-items:center;gap:12px;flex:1;min-width:0}
  .ed-ico{width:46px;height:46px;border-radius:12px;background:#fef2f2;color:#dc2626;display:flex;align-items:center;justify-content:center;flex-shrink:0}
  .ed-ico svg{width:23px;height:23px}
  .ed-title{font-size:20px;font-weight:800;color:var(--text);letter-spacing:-.3px}
  .ed-sub{font-size:13px;color:var(--text-muted)}
  .ed-actions{display:flex;gap:10px;flex-wrap:wrap}
  .ed-meta{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;background:var(--bg-surface);border:1px solid var(--border);border-radius:12px;padding:14px 18px;margin-bottom:16px}
  .ed-meta .k{font-size:11px;color:var(--text-faint)}
  .ed-meta .v{font-size:15px;font-weight:700;color:var(--text);margin-top:2px}
  .ed-panel{padding:18px 20px}
  .ed-chrono-h{font-size:14px;font-weight:700;color:var(--text);margin-bottom:6px}
  .ed-chrono-h .sub{font-weight:500;color:var(--text-muted);font-size:12.5px;margin-left:6px}

  .chrono{display:flex;flex-direction:column}
  .chrono-empty{padding:40px 20px;text-align:center;color:var(--text-muted);font-size:13.5px}
  .chrono-item{display:flex;gap:13px;padding:14px 0;border-bottom:1px solid var(--border)}
  .chrono-item:last-child{border-bottom:none}
  .chrono-when{width:54px;flex-shrink:0;text-align:right;padding-top:3px}
  .chrono-when .t{display:block;font-size:13px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums}
  .chrono-when .d{display:block;font-size:10.5px;color:var(--text-faint)}
  .chrono-rail{position:relative;width:14px;flex-shrink:0;display:flex;justify-content:center}
  .chrono-rail::before{content:'';position:absolute;top:-14px;bottom:-14px;width:2px;background:var(--border)}
  .chrono-item:first-child .chrono-rail::before{top:8px}
  .chrono-item:last-child .chrono-rail::before{bottom:auto;height:8px}
  .chrono-dot{position:relative;z-index:1;width:12px;height:12px;border-radius:50%;margin-top:5px;box-shadow:0 0 0 3px var(--bg-surface)}
  .chrono-card{flex:1;min-width:0;border:1px solid var(--border);border-radius:11px;padding:11px 13px;background:#fff}
  .chrono-card[onclick]{cursor:pointer;transition:.12s}
  .chrono-card[onclick]:hover{border-color:var(--brand-hover);box-shadow:var(--shadow-sm)}
  .chrono-top{display:flex;align-items:center;gap:8px;margin-bottom:5px}
  .chrono-tag{font-size:11px;font-weight:700;padding:2px 9px;border-radius:20px}
  .chrono-id{font-size:11.5px;color:var(--text-faint);font-weight:600;font-variant-numeric:tabular-nums}
  .chrono-pill{font-size:10.5px;font-weight:700;padding:2px 8px;border-radius:20px;white-space:nowrap}
  .chrono-title{font-size:14px;font-weight:700;color:var(--text);line-height:1.3}
  .chrono-text{font-size:12.5px;color:var(--text-muted);margin-top:3px;line-height:1.5}
  .chrono-metaline{font-size:11.5px;color:var(--text-faint);margin-top:6px}
  @media(max-width:640px){ .ed-meta{grid-template-columns:1fr 1fr} }

  .proto-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:54px 24px;color:var(--text-muted)}
  .proto-empty svg{width:42px;height:42px;color:var(--text-faint);margin-bottom:14px}
  .proto-empty .pe-title{font-size:15px;font-weight:700;color:var(--text);margin-bottom:6px}
  .proto-empty .pe-sub{font-size:13px;max-width:460px;line-height:1.55}

  .gb-kanal{display:inline-block;font-size:11px;font-weight:600;color:var(--text-muted);background:#f1f5f9;border:1px solid var(--border);border-radius:5px;padding:1px 7px}
  .gb-att{color:var(--brand);font-weight:600;text-decoration:none}
  .gb-att:hover{text-decoration:underline}
  .gb-filerow{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
  .mail-banner{display:flex;align-items:center;gap:10px;padding:10px 13px;margin-bottom:14px;background:var(--brand-soft);border:1px solid #bfdbfe;border-radius:9px;font-size:13px;color:#1e3a8a}
  .mail-banner svg{width:16px;height:16px;flex-shrink:0;color:var(--brand)}
  .mail-banner b{font-weight:600}
  .mail-attach{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text);cursor:pointer;padding-top:2px}
  .mail-attach input{width:15px;height:15px;accent-color:var(--brand);cursor:pointer}
  .mail-hint{display:flex;gap:8px;align-items:flex-start;margin-top:14px;padding:10px 12px;background:var(--bg-soft,#f8fafc);border:1px solid var(--border);border-radius:9px;font-size:12px;color:var(--text-muted);line-height:1.5}
  .mail-hint svg{color:var(--text-muted);margin-top:1px}
  .gb-out-mail{color:var(--brand);font-weight:600;text-decoration:none}
  .gb-out-mail:hover{text-decoration:underline}
  /* Weiterleiten: Kanal-Auswahl */
  .wl-chan{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
  .wl-chan-opt{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 8px;border:1.5px solid var(--border);border-radius:10px;background:#fff;cursor:pointer;font-size:12.5px;font-weight:600;color:var(--text-muted);transition:border-color .15s,background .15s,color .15s}
  .wl-chan-opt svg{width:20px;height:20px}
  .wl-chan-opt:hover{border-color:var(--brand);color:var(--text)}
  .wl-chan-opt.sel{border-color:var(--brand);background:var(--brand-soft);color:var(--brand)}
  /* Empfängerblöcke smooth ein-/ausblenden */
  .wl-recv{display:contents}
  .wl-recv.wl-anim > .form-field{animation:wlFade .22s ease}
  @keyframes wlFade{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
  .wl-suggest{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px}
  .wl-sg{font-size:12px;padding:4px 9px;border:1px solid var(--border);border-radius:999px;background:#fff;cursor:pointer;color:var(--text-muted);transition:border-color .15s,color .15s}
  .wl-sg:hover{border-color:var(--brand);color:var(--brand)}
  .wl-sg svg{width:11px;height:11px;vertical-align:-1px;margin-right:3px}
  /* Mitglieder & Zuteilung */
  .mb-list{display:flex;flex-direction:column;gap:6px;padding:14px 18px}
  .mb-item{display:flex;align-items:center;gap:10px;padding:7px 10px;border:1px solid var(--border);border-radius:8px;background:var(--bg-surface)}
  .mb-badge{display:inline-flex;align-items:center;justify-content:center;width:30px;height:24px;border-radius:6px;color:#fff;font-size:11px;font-weight:800;flex-shrink:0}
  .mb-nm{font-weight:600;font-size:13.5px;color:var(--text)}
  .mb-you{color:var(--text-faint);font-weight:500;font-size:12px}
  .mb-role{margin-left:auto;font-size:12.5px;color:var(--text-muted)}
  .mb-x{border:none;background:transparent;color:var(--text-faint);font-size:20px;line-height:1;cursor:pointer;padding:0 4px;border-radius:6px}
  .mb-x:hover{color:#dc2626;background:#fef2f2}
  .mb-empty{padding:14px 18px;color:var(--text-muted);font-size:13px}
  .mb-code{padding:0 18px 14px;font-size:12.5px;color:var(--text-muted)}
  .mb-code b{font-family:ui-monospace,monospace;color:var(--text);background:var(--bg-app);border:1px solid var(--border);border-radius:6px;padding:2px 8px}
  .mb-code-note{color:var(--text-faint)}

  .es-coderow{display:flex;gap:8px;align-items:stretch}
  .es-coderow input{flex:1}
  .es-coderow .btn{flex-shrink:0;white-space:nowrap}

  /* macOS-artige Benachrichtigungen */
  #notifStack{position:fixed;top:16px;right:16px;z-index:200;display:flex;flex-direction:column;gap:10px;width:368px;max-width:calc(100vw - 32px);pointer-events:none}
  .macnotif{position:relative;pointer-events:auto;display:flex;gap:12px;align-items:flex-start;background:rgba(255,255,255,.85);backdrop-filter:blur(22px) saturate(180%);-webkit-backdrop-filter:blur(22px) saturate(180%);border:1px solid rgba(15,23,42,.07);border-radius:16px;box-shadow:0 12px 34px rgba(15,23,42,.22);padding:12px 13px;transform:translateX(125%);opacity:0;transition:transform .4s cubic-bezier(.2,.9,.3,1),opacity .3s;cursor:pointer}
  .macnotif.show{transform:translateX(0);opacity:1}
  .macnotif:hover{background:rgba(255,255,255,.95)}
  .macnotif .mn-ico{width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0}
  .macnotif.kind-auftrag .mn-ico{background:linear-gradient(160deg,#3b82f6,#2563eb)}
  .macnotif.kind-info .mn-ico{background:linear-gradient(160deg,#06b6d4,#0891b2)}
  .macnotif .mn-ico svg{width:20px;height:20px}
  .macnotif .mn-body{flex:1;min-width:0}
  .macnotif .mn-top{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:#64748b;margin-bottom:2px}
  .macnotif .mn-app{font-weight:700}
  .macnotif .mn-title{font-weight:700;font-size:13.5px;color:#0f172a;line-height:1.25}
  .macnotif .mn-text{font-size:12.5px;color:#334155;margin-top:1px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
  .macnotif .mn-x{position:absolute;top:-8px;left:-8px;width:22px;height:22px;border-radius:50%;border:1.5px solid #fff;background:#8a8a8e;color:#fff;font-size:14px;line-height:1;display:none;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,.3);padding:0}
  .macnotif:hover .mn-x{display:flex}
  body.dark .macnotif{background:rgba(30,41,59,.82);border-color:rgba(255,255,255,.08)}
  body.dark .macnotif:hover{background:rgba(30,41,59,.95)}
  body.dark .macnotif .mn-title{color:#f1f5f9}
  body.dark .macnotif .mn-text{color:#cbd5e1}

  /* Toast */
  .toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);background:#0f172a;color:#fff;padding:13px 20px;border-radius:10px;box-shadow:var(--shadow-lg);display:flex;align-items:center;gap:11px;font-size:14px;font-weight:500;opacity:0;pointer-events:none;transition:.25s;z-index:80}
  .toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
  .toast svg{width:18px;height:18px;color:#22c55e}

  @media(min-width:721px) and (max-width:1200px){
    .sidebar{width:64px}
    .brand .b-title,.brand .b-sub,.nav-item span,.nav-item .badge,.sidebar-foot{display:none}
    .nav-item{justify-content:center}
    /* Einsatz-Untereinträge als kompakte, zentrierte Punkte */
    .nav-sub{margin:2px 0 6px}
    .nav-subitem{align-self:center;width:40px;height:30px;padding:0;gap:0;justify-content:center;border-radius:8px}
    .nav-subitem .es-nm{display:none}
    .nav-subitem .es-dot{width:9px;height:9px}
  }

  /* ============================================================
     RESPONSIVE TABELLE – durchgehende Staffelung
     Ab 1100px: fixed layout + Kürzel + Truncation greifen bereits,
     damit im Tablet-Bereich nichts mehr rechts abgeschnitten wird.
     ============================================================ */
  @media(max-width:1100px){
    /* Tabelle bekommt festes Layout, damit Spalten sich teilen statt zu überlaufen */
    table{table-layout:fixed;width:100%}
    thead th:nth-child(1),tbody td:nth-child(1){width:12%}
    thead th:nth-child(2),tbody td:nth-child(2){width:25%}
    thead th:nth-child(3),tbody td:nth-child(3){width:20%}
    thead th:nth-child(4),tbody td:nth-child(4){width:12%}
    thead th:nth-child(5),tbody td:nth-child(5){width:18%}
    thead th:nth-child(6),tbody td:nth-child(6){width:13%}

    thead th,tbody td{padding:12px 10px}

    /* Betreff: Beschreibung weg, Titel einzeilig mit ... */
    .c-betreff{max-width:none}
    .c-betreff .desc{display:none}
    .c-betreff .bt{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}

    /* Melder + Nummer abschneidbar */
    .c-melder{max-width:0}
    .c-melder .m{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

    /* Zuständigkeit: nur Kürzel, einzeilig */
    .ss-chip .lbl-full{display:none}
    .ss-chip .lbl-short{display:inline}
    .ss-chips{max-width:none;flex-wrap:nowrap;gap:4px;overflow:hidden}
    .ss-chip{padding:3px 8px}

    /* Priorität: Badge etwas kompakter, Wort bleibt (kurz genug) */
    td:nth-child(4) .badge-pill{padding:4px 9px}

    /* Status: einzeilig mit ... */
    td:nth-child(6){max-width:0}
    td:nth-child(6) .badge-pill{max-width:100%;overflow:hidden}
    td:nth-child(6) .badge-pill .lbl-full{display:inline-block;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;vertical-align:bottom;max-width:88px}
  }

  /* ===== TABLET schmal: enger, Schrift leicht kleiner ===== */
  @media(max-width:900px){
    .content{padding:18px 16px}
    thead th,tbody td{padding:11px 8px;font-size:13px}
    thead th{font-size:10px}
    .c-betreff .bt{font-size:13px}
    .c-melder .m{font-size:13px}
    .ss-chip{font-size:11.5px;padding:2px 7px}
    td:nth-child(6) .badge-pill .lbl-full{max-width:70px}
  }

  /* ===== TABLET-ZWISCHENGRÖSSEN: Topbar progressiv verschlanken ===== */
  /* Verhindert Umbruch/Abschneiden im Bereich zwischen Desktop und Mobil. */
  @media(min-width:721px) and (max-width:1100px){
    .topbar{gap:10px;padding:0 14px}
    .tb-divider{display:none}                 /* Trenner sparen Platz */
    .lage{min-width:0;flex-shrink:1}
    .lage .lage-name{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:30vw}
    .lage .lage-time{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    .stabsstelle-pick{min-width:0;gap:8px;padding:6px 10px;flex-shrink:1}
    .stabsstelle-pick .ss-val{font-size:13px}
    .userchip{flex-shrink:0}
    .userchip .u-role{display:none}           /* Rolle ausblenden, Name bleibt */
    .userchip .u-name{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px}
    .userchip > svg{display:none}
  }
  /* Engeres Tablet (721–900px): Rolle-Label kürzen, Username ganz weg */
  @media(min-width:721px) and (max-width:900px){
    .topbar{gap:8px}
    .stabsstelle-pick .ss-lbl{display:none}    /* "Aktive Rolle"-Label sparen */
    .stabsstelle-pick{min-width:0}
    .lage .lage-name{max-width:24vw}
    .userchip{padding:4px}
    .userchip .u-name{display:none}            /* nur noch Avatar */
    /* "Neuer Auftrag"-Modal: zweispaltiges Grid wird hier zu schmal → stapeln.
       Header (.na-head) + Footer (.na-foot) bleiben fix, NUR .na-body scrollt.
       Wichtig: flex:1 + min-height:0 behalten, sonst wächst das Modal über den
       Schirm und der Header wird oben abgeschnitten. */
    .modal-xl{max-height:calc(100vh - 64px)}
    .na-body{display:block;flex:1 1 auto;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch}
    .na-col{padding:20px 24px;min-width:0}
    .na-col.left{border-right:none;border-bottom:1px solid var(--border)}
  }

  /* ============================================================
     SZENARIO-AUSWAHL (Einsatz eröffnen): Desktop-Toggle + Mobil-Karten
     ============================================================ */
  /* Desktop-Standard: Karten-Schritt aus, Formular sichtbar, der
     „Szenario ändern"-Zurück-Button (nur mobil sinnvoll) aus. */
  .sz-choose{display:none}
  .sz-form{display:block}
  .sz-back-mobil{display:none}

  /* Eleganter Pill-Toggle (das gleitende Element ist die Signature) */
  .sz-toggle-wrap{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:18px;padding-bottom:16px;border-bottom:1px solid var(--border)}
  .sz-toggle-lbl{font-size:13px;font-weight:600;color:var(--text)}
  .sz-toggle{position:relative;display:inline-flex;background:var(--bg-app);border:1px solid var(--border-strong);border-radius:10px;padding:3px;gap:0}
  .sz-toggle-opt{position:relative;z-index:2;border:none;background:transparent;cursor:pointer;font-family:var(--font);font-size:13px;font-weight:600;color:var(--text-muted);padding:7px 20px;border-radius:8px;transition:color .25s cubic-bezier(.4,0,.2,1)}
  .sz-toggle-opt.is-active{color:#fff}
  /* gleitende Pille hinter dem aktiven Label */
  .sz-toggle-pill{position:absolute;top:3px;left:3px;z-index:1;width:calc(50% - 3px);height:calc(100% - 6px);border-radius:8px;background:var(--brand);box-shadow:0 2px 6px rgba(37,99,235,.35);transition:transform .32s cubic-bezier(.34,1.4,.5,1),background .25s}
  .sz-toggle-pill.is-gross{transform:translateX(0)}
  .sz-toggle-pill.is-klein{transform:translateX(100%)}
  .sz-toggle-hint{font-size:12px;color:var(--text-muted);flex:1 1 100%;margin-top:2px;transition:opacity .2s}

  /* Karten (Basis – mobil sichtbar gemacht) */
  .sz-choose-lead{font-size:13.5px;color:var(--text-muted);padding:18px 20px 6px;line-height:1.5}
  .sz-card{display:flex;align-items:center;gap:13px;width:100%;text-align:left;background:#fff;border:1.5px solid var(--border-strong);border-radius:12px;padding:15px 16px;margin:8px 0 0;cursor:pointer;transition:border-color .15s,background .15s,transform .12s;font-family:var(--font)}
  .sz-card:first-of-type{margin-top:10px}
  .sz-card:hover,.sz-card:active{border-color:var(--brand);background:var(--brand-soft)}
  .sz-card:active{transform:scale(.99)}
  .sz-card-ic{flex:0 0 auto;width:44px;height:44px;border-radius:11px;display:flex;align-items:center;justify-content:center;color:#fff}
  .sz-card-ic svg{width:23px;height:23px}
  .sz-ic--gross{background:var(--brand)}
  .sz-ic--klein{background:#0891b2}
  .sz-card-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
  .sz-card-t{font-weight:700;font-size:15px;color:var(--text)}
  .sz-card-s{font-size:12.5px;color:var(--text-muted);line-height:1.45}
  .sz-card-arr{flex:0 0 auto;width:20px;height:20px;color:var(--text-muted)}

  /* ===== MOBIL: maximal kompakt ===== */
  @media(max-width:720px){
    /* ===== Sidebar als Off-Canvas (per Hamburger) ===== */
    .sidebar{position:fixed;left:0;top:0;height:100vh;z-index:70;width:240px;
      transform:translateX(-100%);transition:transform .25s cubic-bezier(.4,0,.2,1);box-shadow:var(--shadow-lg);
      visibility:hidden;pointer-events:none}
    .sidebar.open{transform:translateX(0);visibility:visible;pointer-events:auto}
    .brand .b-title,.brand .b-sub,.nav-item span,.nav-item .badge,.sidebar-foot{display:revert}
    .nav-item{justify-content:flex-start}
    .sidebar-backdrop{position:fixed;inset:0;background:rgba(15,23,42,.5);z-index:65;opacity:0;pointer-events:none;transition:opacity .2s}
    .sidebar-backdrop.show{display:block;opacity:1;pointer-events:auto}
    .hamburger{display:flex}

    /* ===== Topbar kompakt – EINE Zeile: Hamburger | Lage | Glocke | Profil =====
       Reihenfolge = DOM-Reihenfolge (kein order nötig). Alle Items order:0,
       damit nichts umsortiert wird; die Lage schrumpft, der Rest bleibt fix. */
    .topbar{display:flex;align-items:center;gap:8px;padding:8px 12px;height:auto;min-height:56px;flex-wrap:nowrap}
    .hamburger{flex:0 0 auto;order:0}
    /* Aktive Lage: nimmt den Restplatz, schrumpft, läuft rechts ins Transparente */
    .lage{
      order:0;flex:1 1 0;min-width:0;
      overflow-x:auto;overflow-y:hidden;
      -webkit-overflow-scrolling:touch;scrollbar-width:none;
      -webkit-mask-image:linear-gradient(to right,#000 calc(100% - 20px),transparent 100%);
              mask-image:linear-gradient(to right,#000 calc(100% - 20px),transparent 100%);
    }
    .lage::-webkit-scrollbar{display:none}
    .lage .lage-lbl{display:none}
    .lage .lage-name{font-size:14px;white-space:nowrap;overflow:visible;text-overflow:clip;padding-right:18px}
    .lage .lage-time{font-size:10px;white-space:nowrap;overflow:visible;text-overflow:clip;padding-right:18px}
    /* Spacer + leere Rolle-tb-wrap nehmen mobil keinen Platz ein */
    .topbar-spacer{display:none}
    /* Glocke + Profil (in .tb-wrap) fix rechts, schrumpfen nicht, keine Umsortierung */
    .topbar > .tb-wrap{flex:0 0 auto;order:0}
    .userchip{padding:3px}
    .userchip .u-name,.userchip .u-role,.userchip svg{display:none}
    /* Tagesrolle mobil über das Profil-Dropdown → Topbar-Button (in tb-wrap) leer */
    .stabsstelle-pick{display:none}
    /* Topbar-Rollenswitcher ist mobil ausgeblendet → dafür im Profil-Dropdown zeigen */
    .tb-item.tb-item--mobilrolle{display:flex}
    /* Mobil sichtbare Dropdown-Einträge (z. B. Rollenwahl) einblenden */
    .tb-item--mobile{display:flex}

    /* ===== Einsatz-Detail-Kopf: Zurück oben, Titel links startend ===== */
    .ed-head{flex-direction:column;align-items:stretch;gap:12px}
    /* Zurück-Button nur so breit wie sein Inhalt, nicht volle Zeile */
    .ed-head > .btn-ghost.btn-sm{align-self:flex-start;flex:0 0 auto;width:auto}
    .ed-titlewrap{flex-wrap:wrap;gap:10px}
    .ed-titlewrap > div:not(.ed-ico){flex:1 1 auto;min-width:0}
    .ed-title{font-size:19px}
    .ed-actions{width:100%}
    .ed-actions .btn{flex:1;justify-content:center}

    /* Aktive-Einsätze-Liste mobil: siehe Block am Dateiende (nach den globalen
       is-list-Regeln), sonst überschreibt die globale Regel die Mobil-Werte. */

    /* ===== Chronologie: Badges dürfen umbrechen statt über den Rand zu laufen ===== */
    .chrono-top{flex-wrap:wrap;gap:6px}
    .chrono-top > span[style*="flex:1"]{display:none}   /* Spacer raus, sonst Umbruch-Lücke */
    .chrono-pill{font-size:10px}

    .content{padding:14px 12px}
    .page-head{flex-direction:column;align-items:stretch;gap:12px}
    .page-title{font-size:20px}
    .head-actions{flex-wrap:wrap}
    .head-actions .btn{flex:1;justify-content:center;font-size:13px;white-space:nowrap}

    /* Filterbar + Resultbar als eigene weiße Karte (Panel ist jetzt transparent) */
    .filterbar{display:none;gap:8px;background:var(--bg-surface);border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow-sm);margin-bottom:14px;padding:14px}
    .filterbar.fb-open{display:flex}
    /* Kleiner Filter-Umschalter oben rechts im Seitenkopf */
    #view-auftraege .page-head{position:relative}
    #filterToggle{display:inline-flex;align-items:center;gap:6px;position:absolute;top:0;right:0;padding:7px 12px;font-size:13px;font-weight:600;color:var(--text);background:var(--bg-surface);border:1px solid var(--border-strong);border-radius:999px;box-shadow:var(--shadow-sm);cursor:pointer;z-index:5}
    #filterToggle svg{width:15px;height:15px}
    #filterToggle.active{background:var(--brand);border-color:var(--brand);color:#fff}
    .fld select,.fld .datebox{min-width:0;width:100%}
    .fld{flex:1 1 45%}
    .search{flex:1 1 100%}
    .resultbar{flex-direction:column;align-items:stretch;gap:8px;border:none;padding:0 2px 12px}
    .resultbar .sort{flex-wrap:wrap}
    .resultbar .sort select{flex:1}

    /* ===== TABELLE → KARTEN-LAYOUT (kompakt, horizontal) ===== */
    /* Panel-Container transparent: Karten liegen direkt auf App-Hintergrund */
    .panel{background:transparent;border:none;box-shadow:none;border-radius:0;overflow:visible}
    .table-wrap{overflow:visible}
    table,thead,tbody,tr,td{display:block;width:100%}
    /* Spaltenbreiten aus Tablet-Block aufheben */
    tbody td:nth-child(1),tbody td:nth-child(2),tbody td:nth-child(3),
    tbody td:nth-child(4),tbody td:nth-child(5),tbody td:nth-child(6){width:100% !important}
    thead{display:none}
    table{table-layout:auto}
    tbody tr{
      border:1px solid var(--border);border-radius:12px;margin-bottom:10px;
      padding:13px 15px;box-shadow:var(--shadow-sm);background:#fff;
    }
    tbody tr:last-child{margin-bottom:0}
    /* Standard-Zelle: Label links schmal, Wert rechts daneben (horizontal) */
    tbody td{
      display:flex;align-items:center;gap:10px;padding:5px 0;border:none;width:100%;max-width:none;
    }
    tbody td::before{
      content:attr(data-label);flex:0 0 76px;font-size:10.5px;font-weight:600;
      color:var(--text-faint);text-transform:uppercase;letter-spacing:.03em;
    }
    /* Karte als CSS-Grid: Datum+Status obere Zeile, Melder, dann Titel volle Breite */
    tbody tr{display:grid;grid-template-columns:1fr auto;column-gap:14px;row-gap:0}
    .c-datetime{grid-column:1;grid-row:1}
    td:nth-child(6){grid-column:2;grid-row:1;align-self:start;justify-content:flex-end}  /* Status oben rechts */
    .c-melder{grid-column:1 / -1;grid-row:2;min-width:0}
    .c-betreff{grid-column:1 / -1;grid-row:3}
    td:nth-child(4){grid-column:1 / -1}   /* Priorität */
    .c-stab{grid-column:1 / -1}           /* Zuständigkeit */

    /* Datum oben links: Label + Datum + Zeit kompakt */
    .c-datetime{display:flex;align-items:baseline;flex-wrap:wrap;gap:5px}
    .c-datetime::before{flex-basis:100%}
    .c-datetime .d{font-size:13px;font-weight:600}
    .c-datetime .t{font-size:13px;color:var(--text-muted);margin-top:0}
    .c-datetime .d::after{content:'';}
    /* Melder oben rechts: Label oben, Name (1 Zeile, ...) + Tel darunter */
    .c-melder{display:block;align-items:initial;max-width:none}
    .c-melder::before{display:block;margin-bottom:3px}
    .c-melder .m{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px;line-height:1.3}
    .c-melder .phone{font-size:12px;margin-top:2px;white-space:nowrap;overflow:hidden}
    .c-melder .phone .phone-masked{overflow:hidden;text-overflow:ellipsis}

    /* Betreff: Titel 1 Zeile mit ..., Beschreibung max 2 Zeilen mit ... */
    .c-betreff{display:block;max-width:none !important;order:0;padding:8px 0 8px;border-top:1px solid var(--border);border-bottom:1px solid var(--border);margin:4px 0;min-width:0}
    .c-betreff::before{display:none}
    .c-betreff .bt{font-size:15px;font-weight:700;line-height:1.3;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    .c-betreff .desc{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:12.5px;max-width:none;width:100%;margin-top:2px;line-height:1.35}
    /* Status oben rechts neben Datum: Label verstecken, nur Badge */
    td:nth-child(6){padding:5px 0}
    td:nth-child(6)::before{display:none}
    /* Priorität / Status / Zuständigkeit: Label links, Badge rechts */
    td:nth-child(4) .badge-pill .lbl-full{display:inline}
    td:nth-child(6){max-width:none !important;overflow:visible !important}
    td:nth-child(6) .badge-pill{max-width:none !important;overflow:visible !important}
    td:nth-child(6) .badge-pill .lbl-full{max-width:none !important;display:inline !important;overflow:visible !important}
    .badge-pill{padding:5px 11px;font-size:12.5px}
    .c-stab{align-items:flex-start}
    .c-stab::before{padding-top:5px}
    .ss-chip .lbl-full{display:inline}
    .ss-chip .lbl-short{display:none}
    .c-stab .ss-chips,.ss-chips{flex-wrap:wrap !important;max-width:none !important;overflow:visible !important}
    .ss-chip{padding:3px 9px;font-size:12px;overflow:visible}

    .pagination{flex-direction:column;gap:12px;align-items:stretch}
    .pages{justify-content:center;flex-wrap:wrap}

    /* Drawer mobil: volle Breite + dvh-Höhe. 100vh ist auf Mobile GRÖSSER als
       der sichtbare Bereich (Browser-Leisten zählen nicht mit) → der Footer
       ragt sonst unter den sichtbaren Rand. 100dvh = tatsächlich sichtbar. */
    .drawer{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh}
    .d-row{grid-template-columns:110px 1fr}

    /* Geschäftsbuch als Karten (gleiche kompakte Logik) */
    #gbBody tr{border:1px solid var(--border);border-radius:12px;margin-bottom:10px;padding:13px 15px;background:#fff;box-shadow:var(--shadow-sm)}
    #gbBody td{display:flex;align-items:center;gap:10px;padding:5px 0;border:none;flex-wrap:wrap;min-width:0}
    #gbBody td::before{content:attr(data-label);flex:0 0 76px;font-size:10.5px;font-weight:600;color:var(--text-faint);text-transform:uppercase}
    #gbBody td > *{min-width:0}
    #gbBody .badge-pill,#gbBody .ea{flex-shrink:1;max-width:100%}
    #gbBody .c-betreff{display:block;order:-1;padding-bottom:8px;border-bottom:1px solid var(--border);margin-bottom:4px;flex-wrap:nowrap}
    #gbBody .c-betreff::before{display:none}
    #gbBody .c-betreff .bt{font-size:14.5px;font-weight:700;white-space:normal}

    /* ===== SZENARIO-AUSWAHL MOBIL ===== */
    /* Karten als erster Schritt sichtbar, Desktop-Toggle aus */
    .sz-choose{display:block}
    .sz-toggle-wrap{display:none}
    /* Wenn noch in Auswahl: Formularbereich (inkl. Footer) ausblenden */
    .sz-form--mobilhidden{display:none}
    /* Footer mobil: „Szenario ändern" zeigen, Desktop-„Abbrechen" verstecken */
    .sz-back-mobil{display:flex}
    .sz-cancel-desktop{display:none}

    /* ===== ANLEGEN-MODALS MOBIL: Header + Footer fix, Mitte scrollt ===== */
    .modal-overlay{padding:0;align-items:stretch;overflow:hidden}
    .modal-xl{max-width:100%;border-radius:0;height:100vh;height:100dvh;max-height:100vh;max-height:100dvh;min-height:0;margin:0;display:flex;flex-direction:column}

    /* Einfache Modals (Neue Information, Mitglied zuteilen …): höhenbegrenzt,
       mittig mit Rand. Der innere <form>-Wrapper übernimmt das Flex-Layout. */
    .modal:not(.modal-xl){
      align-self:center;
      max-height:calc(100dvh - 24px);
      margin:12px;
      display:flex;
      flex-direction:column;
      min-height:0;
      overflow:hidden;
    }

    /* Beide Modal-Typen: das <form> (einziges Kind) ist der Flex-Container,
       der Header (.na-head) und Footer (.na-foot) fix hält und die Mitte scrollt. */
    .modal > form{
      display:flex;
      flex-direction:column;
      min-height:0;
      flex:1 1 auto;
      overflow:hidden;
    }
    /* Header + Footer bleiben stehen */
    .modal .na-head,
    .modal .na-foot{flex:0 0 auto}
    /* Mittelteil scrollt: greift sowohl für .na-body (Neuer Auftrag) als auch
       für den klassenlosen padding-Container (Neue Information) zwischen
       Header und Footer. */
    .modal .na-body,
    .modal > form > div:not(.na-head):not(.na-foot){
      flex:1 1 auto;
      min-height:0;
      overflow-y:auto;
      -webkit-overflow-scrolling:touch;
    }
    /* Header kompakt: Protokoll-Nr unter Titel */
    .na-head{flex-wrap:wrap;padding:14px 16px;border-radius:0;gap:11px}
    .na-head .na-ico{width:40px;height:40px}
    .na-head h2{font-size:18px}
    .na-head .na-sub{font-size:12px}
    .na-head .close{order:2}
    .na-head .na-meta{order:3;flex-basis:100%;flex-wrap:wrap;gap:8px}
    .na-protokoll{font-size:12px;padding:5px 10px}
    .na-time{font-size:12px}
    /* Body einspaltig, scrollbar. Reihenfolge wird per JS umgehängt (robust) */
    .na-body{display:block;flex:1;min-height:0;min-width:0;overflow-y:auto;-webkit-overflow-scrolling:touch}
    .na-col{display:block !important;padding:0;border-right:none !important}
    .na-prio-group{padding:18px 16px 4px;min-width:0}
    .na-betreff-group{padding:14px 16px 18px;min-width:0}
    .na-melder-group{padding:4px 16px 18px;min-width:0}
    .na-col.right{padding:18px 16px;border-top:1px solid var(--border);min-width:0}
    .na-col .form-grid{grid-template-columns:1fr}
    .na-section-lbl{font-size:11.5px}
    .na-melder-group .na-section-lbl,.na-betreff-group .na-section-lbl:not(:first-child){margin-top:20px}
    /* Priorität: bei sehr schmal untereinander */
    .na-prio{flex-direction:column}
    .na-prio-btn{justify-content:flex-start;padding:13px 14px;font-size:14px}
    /* Stabsstellen-Grid bleibt 2-spaltig, größere Touch-Targets */
    .ss-grid{gap:8px;min-width:0}
    .ss-card{padding:11px 10px;min-width:0;overflow:hidden}
    .ss-card .ss-name{font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
    .ss-card .ss-badge{width:34px;height:28px;font-size:12px}
    /* ESIS/ETB untereinander */
    .na-checks{flex-direction:column;gap:12px}
    /* Zeitverlauf horizontal & kompakt: Icon über Titel */
    .na-timeline{flex-direction:row;align-items:flex-start;gap:0;padding:10px 12px}
    .na-tl-title{display:none} /* Titel "Zeitverlauf" spart Platz */
    .na-tl-icon{flex-direction:column;align-items:center;text-align:center;gap:4px;padding:0;flex:0 0 auto}
    .na-tl-dot{width:30px;height:30px}
    .na-tl-dot svg{width:14px;height:14px}
    .na-tl-txt .tl-step{font-size:10.5px}
    .na-tl-txt .tl-when{font-size:9.5px}
    .na-tl-line{flex:1;height:0;min-width:8px;border-top:2px dashed var(--border);border-left:none;margin:15px 4px 0;align-self:flex-start}

    /* Footer kompakt. Standardmäßig sind die Buttons in .na-foot-more SICHTBAR
       (einfache Modale wie „Einsatz eröffnen", „Mit Code beitreten" haben ihre
       Buttons direkt darin und KEIN Toggle). Nur wenn der Footer wirklich das
       Ausklapp-Muster hat (ein .na-foot-toggle ist vorhanden), wird .na-foot-more
       versteckt und per .expanded eingeblendet. */
    .na-foot{flex-direction:column;align-items:stretch;gap:8px;padding:12px 16px}
    .na-foot .spacer{display:none}
    .na-foot .btn{width:100%;justify-content:center}
    .na-foot-primary-row{display:flex;gap:8px;align-items:stretch}
    .na-foot-primary-row .btn{flex:1}
    .na-foot-toggle{flex:0 0 46px;width:46px;display:flex;align-items:center;justify-content:center;border:1px solid var(--border-strong);border-radius:8px;background:#fff;color:var(--text-muted)}
    .na-foot-toggle svg{width:20px;height:20px;transition:transform .2s}
    .na-foot.expanded .na-foot-toggle svg{transform:rotate(180deg)}
    /* .na-foot-more standardmäßig als vertikale Button-Spalte sichtbar */
    .na-foot-more{display:flex;flex-direction:column;gap:8px}
    /* Nur im echten Toggle-Footer (hat einen .na-foot-toggle) ausklappbar: */
    .na-foot:has(.na-foot-toggle) .na-foot-more{display:none}
    .na-foot.expanded:has(.na-foot-toggle) .na-foot-more{display:flex}
  }
  /* Desktop (ab 721px): Toggle-Button versteckt, Wrapper aufgelöst */
  @media(min-width:721px){
    .na-foot-toggle{display:none}
    .na-foot-primary-row{display:contents}
    .na-foot-more{display:contents}
  }

  @media(max-width:480px){
    .head-actions .btn{font-size:12px;padding:9px 10px}
    tbody td::before,#gbBody td::before{flex-basis:68px}
  }

/* ============ Einsätze-Übersicht (Dashboard) ============ */
/* ===== Stabsdashboard · Einsätze (content only) ===== */
.sd-einsaetze{
  --sd-bg:#f5f6f8; --sd-card:#ffffff;
  --sd-border:#e7e9ee; --sd-border-soft:#eef0f4;
  --sd-text:#161c26; --sd-text-2:#5b6472; --sd-text-3:#8b94a2;
  --sd-blue:#2563eb; --sd-blue-bg:#e9eefe;
  --sd-green:#16a34a; --sd-green-bg:#e6f6ec;
  --sd-purple:#6d5bd8; --sd-orange:#f59e0b; --sd-red:#ef4444;
  --sd-radius:16px;
  --sd-shadow:0 1px 2px rgba(16,24,40,.04), 0 1px 3px rgba(16,24,40,.06);
  box-sizing:border-box; width:100%;
  padding:28px 32px 40px;
  background:var(--sd-bg);
  color:var(--sd-text);
  font-family:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:14px; line-height:1.45; -webkit-font-smoothing:antialiased;
}
.sd-einsaetze *{box-sizing:border-box;}
.sd-einsaetze h1,.sd-einsaetze h2,.sd-einsaetze h3,.sd-einsaetze p{margin:0;}
.sd-einsaetze a{text-decoration:none;color:inherit;}
.sd-einsaetze img{display:block;max-width:100%;}

/* header */
.sd-head{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin-bottom:24px;flex-wrap:wrap;}
.sd-head h1{font-size:26px;font-weight:700;letter-spacing:-.02em;color:#10151d;}
.sd-head p{margin-top:6px;color:var(--sd-text-2);font-size:14px;}
.sd-head-actions{display:flex;gap:12px;flex-shrink:0;}
.sd-btn{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 18px;border-radius:11px;font-size:14px;font-weight:600;cursor:pointer;border:1px solid transparent;white-space:nowrap;transition:background .15s,border-color .15s,box-shadow .15s;}
.sd-btn svg{width:17px;height:17px;}
.sd-btn--ghost{background:#fff;border-color:var(--sd-border);color:var(--sd-text);}
.sd-btn--ghost:hover{background:#f8f9fb;border-color:#d8dce3;}
.sd-btn--primary{background:var(--sd-blue);color:#fff;box-shadow:0 1px 2px rgba(37,99,235,.35);}
.sd-btn--primary:hover{background:#1d56d8;}

/* layout */
.sd-layout{display:grid;grid-template-columns:minmax(0,1fr) 326px;gap:22px;align-items:start;}
.sd-main{min-width:0;}
.sd-side{display:flex;flex-direction:column;gap:18px;}

/* stat cards */
.sd-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:26px;}
.sd-stat{position:relative;height:152px;border-radius:var(--sd-radius);overflow:hidden;color:#fff;box-shadow:var(--sd-shadow);isolation:isolate;}
.sd-stat img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;}
.sd-stat::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(8,12,20,.30) 0%,rgba(8,12,20,.55) 55%,rgba(8,12,20,.82) 100%);}
.sd-stat-ic{position:absolute;top:14px;left:14px;width:40px;height:40px;border-radius:11px;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px rgba(0,0,0,.28);}
.sd-stat-ic svg{width:21px;height:21px;color:#fff;}
.sd-stat-ic.red{background:#ef5840;}
.sd-stat-ic.green{background:#1fa85c;}
.sd-stat-ic.blue{background:#2f6bf0;}
.sd-stat-ic.purple{background:#7c5cf0;}
.sd-stat-body{position:absolute;left:16px;bottom:14px;right:16px;}
.sd-stat-label{font-size:13px;font-weight:500;color:rgba(255,255,255,.92);text-shadow:0 1px 3px rgba(0,0,0,.4);}
.sd-stat-num{font-size:34px;font-weight:700;line-height:1.05;margin-top:2px;letter-spacing:-.01em;text-shadow:0 1px 4px rgba(0,0,0,.45);}

/* section head */
.sd-section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;}
.sd-section-head .t{display:flex;align-items:center;gap:9px;font-size:16px;font-weight:700;color:#10151d;}
.sd-section-head .t svg{width:19px;height:19px;color:var(--sd-blue);}
.sd-link{display:inline-flex;align-items:center;gap:6px;color:var(--sd-blue);font-weight:600;font-size:13.5px;}
.sd-link svg{width:15px;height:15px;}
.sd-link:hover{text-decoration:underline;}

/* einsatz list */
.sd-list{display:flex;flex-direction:column;gap:14px;}
.sd-ez{display:grid;grid-template-columns:96px minmax(190px,1.4fr) 128px 150px 132px 44px;align-items:center;gap:18px;background:var(--sd-card);border:1px solid var(--sd-border);border-radius:var(--sd-radius);padding:14px 16px;box-shadow:var(--sd-shadow);transition:border-color .15s,box-shadow .15s;}
.sd-ez:hover{border-color:#d7dbe3;box-shadow:0 2px 6px rgba(16,24,40,.08);}
.sd-ez-thumb{position:relative;width:96px;height:64px;border-radius:11px;overflow:hidden;flex-shrink:0;background:#0c1018;}
.sd-ez-thumb img{width:100%;height:100%;object-fit:cover;}
.sd-ez-badge{position:absolute;top:6px;right:6px;width:22px;height:22px;border-radius:7px;background:rgba(10,14,22,.55);backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;}
.sd-ez-badge svg{width:13px;height:13px;color:#fff;}

.sd-ez-info{min-width:0;}
.sd-ez-titleline{display:flex;align-items:center;gap:11px;}
.sd-ez-title{font-size:16px;font-weight:700;color:#10151d;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:-.01em;}
.sd-ez-cat{margin-top:3px;font-size:13px;font-weight:600;}
.sd-ez-cat.purple{color:var(--sd-purple);}
.sd-ez-cat.green{color:var(--sd-green);}
.sd-ez-meta{display:flex;align-items:center;gap:18px;margin-top:9px;color:var(--sd-text-2);font-size:13px;}
.sd-ez-meta span{display:inline-flex;align-items:center;gap:6px;}
.sd-ez-meta svg{width:14px;height:14px;color:var(--sd-text-3);}

.sd-tag{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;flex-shrink:0;}
.sd-tag .dot{width:8px;height:8px;border-radius:50%;}
.sd-tag.aktiv{color:var(--sd-green);}
.sd-tag.aktiv .dot{background:var(--sd-green);box-shadow:0 0 0 3px rgba(22,163,74,.16);}
.sd-tag.beendet{color:#64748b;background:#eef1f5;padding:3px 9px;border-radius:6px;letter-spacing:.05em;}

/* column blocks */
.sd-col-label{font-size:12px;color:var(--sd-text-3);font-weight:500;margin-bottom:7px;}
.sd-col .val{font-size:13.5px;font-weight:600;color:var(--sd-text);}
.sd-progress{height:5px;border-radius:99px;background:#eef0f4;overflow:hidden;margin-top:8px;}
.sd-progress>span{display:block;height:100%;border-radius:99px;}
.sd-progress>span.blue{background:var(--sd-blue);}
.sd-progress>span.green{background:var(--sd-green);}
.sd-progress>span.orange{background:var(--sd-orange);}

.sd-role{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:600;color:var(--sd-text);}
.sd-role svg{width:15px;height:15px;color:var(--sd-text-3);}

.sd-pill{display:inline-flex;align-items:center;padding:5px 11px;border-radius:8px;font-size:12.5px;font-weight:600;white-space:nowrap;}
.sd-pill.green{background:var(--sd-green-bg);color:var(--sd-green);}
.sd-pill.blue{background:var(--sd-blue-bg);color:var(--sd-blue);}

.sd-go{width:42px;height:42px;border-radius:11px;border:1px solid var(--sd-border);background:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--sd-text-2);transition:background .15s,border-color .15s,color .15s;justify-self:end;}
.sd-go:hover{background:var(--sd-blue);border-color:var(--sd-blue);color:#fff;}
.sd-go svg{width:18px;height:18px;}

/* side cards */
.sd-card{background:var(--sd-card);border:1px solid var(--sd-border);border-radius:var(--sd-radius);padding:18px;box-shadow:var(--sd-shadow);}
.sd-card h2{font-size:15px;font-weight:700;color:#10151d;margin-bottom:14px;}

.sd-ov-row{display:flex;align-items:center;gap:11px;padding:7px 0;}
.sd-ov-row+.sd-ov-row{border-top:1px solid var(--sd-border-soft);}
.sd-ov-ic{width:28px;height:28px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.sd-ov-ic svg{width:15px;height:15px;}
.sd-ov-ic.green{background:var(--sd-green-bg);color:var(--sd-green);}
.sd-ov-ic.blue{background:var(--sd-blue-bg);color:var(--sd-blue);}
.sd-ov-ic.slate{background:#eef1f5;color:#64748b;}
.sd-ov-row .lbl{flex:1;font-size:13.5px;color:var(--sd-text-2);font-weight:500;}
.sd-ov-row .num{font-size:16px;font-weight:700;color:#10151d;}

/* activity */
.sd-act{position:relative;padding-left:26px;padding-bottom:16px;}
.sd-act:last-of-type{padding-bottom:4px;}
.sd-act::before{content:"";position:absolute;left:7px;top:18px;bottom:0;width:2px;background:var(--sd-border-soft);}
.sd-act:last-of-type::before{display:none;}
.sd-act-dot{position:absolute;left:0;top:2px;width:16px;height:16px;border-radius:50%;display:flex;align-items:center;justify-content:center;}
.sd-act-dot svg{width:10px;height:10px;color:#fff;}
.sd-act-dot.red{background:var(--sd-red);}
.sd-act-dot.green{background:var(--sd-green);}
.sd-act-dot.blue{background:var(--sd-blue);}
.sd-act-dot.slate{background:#475569;}
.sd-act .k{font-size:12px;color:var(--sd-text-3);font-weight:500;}
.sd-act .v{font-size:13.5px;font-weight:700;color:#10151d;margin-top:1px;}
.sd-act .ago{font-size:12px;color:var(--sd-text-3);margin-top:2px;}
.sd-card .sd-link{margin-top:6px;}

/* weather */
.sd-weather{display:flex;align-items:center;gap:22px;}
.sd-weather-now{display:flex;align-items:center;gap:12px;}
.sd-weather-now svg{width:34px;height:34px;color:var(--sd-blue);}
.sd-weather-temp{font-size:24px;font-weight:700;color:#10151d;line-height:1;}
.sd-weather-desc{font-size:12.5px;color:var(--sd-text-2);margin-top:3px;}
.sd-weather-loc{font-size:12px;color:var(--sd-text-3);margin-top:1px;}
.sd-warn{display:flex;align-items:flex-start;gap:9px;padding-left:20px;border-left:1px solid var(--sd-border-soft);}
.sd-warn svg{width:18px;height:18px;color:var(--sd-orange);flex-shrink:0;margin-top:1px;}
.sd-warn .wt{font-size:13px;font-weight:700;color:#10151d;}
.sd-warn .wm{font-size:12px;color:var(--sd-text-2);margin-top:2px;}

/* responsive */
@media(max-width:1180px){
  .sd-layout{grid-template-columns:1fr;}
  .sd-side{flex-direction:row;flex-wrap:wrap;}
  .sd-side>.sd-card{flex:1 1 280px;}
}
@media(max-width:920px){
  .sd-stats{grid-template-columns:repeat(2,1fr);}
  .sd-ez{grid-template-columns:80px 1fr;grid-auto-rows:auto;row-gap:14px;}
  .sd-ez-thumb{width:80px;}
  .sd-ez .sd-col,.sd-ez .sd-go{grid-column:2;}
  .sd-go{justify-self:start;}
}
@media(max-width:560px){
  .sd-einsaetze{padding:18px 16px 32px;}
  .sd-stats{grid-template-columns:1fr;}
  .sd-ez{grid-template-columns:1fr;}
  .sd-ez-thumb{width:100%;height:120px;}
  .sd-ez .sd-col,.sd-ez .sd-go{grid-column:1;}
}

/* ================= Einsätze-Übersicht v2 (exakt nach Screenshot) ================= */
.ein2{ --e2-bg:#f4f5f7; --e2-card:#fff; --e2-border:#e8eaee; --e2-soft:#eef0f3;
  --e2-text:#1a1f29; --e2-text2:#6b7280; --e2-text3:#9ca3af;
  --e2-blue:#2563eb; --e2-red:#ef4444; --e2-orange:#f59e0b; --e2-green:#16a34a; --e2-purple:#7c5cf0;
  --e2-radius:16px; --e2-shadow:0 1px 2px rgba(16,24,40,.04),0 1px 3px rgba(16,24,40,.05);
  box-sizing:border-box; width:100%; color:var(--e2-text);
  font-family:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; font-size:14px; line-height:1.45;
}
.ein2 *{box-sizing:border-box;}
.ein2 h1,.ein2 h2,.ein2 h3,.ein2 p{margin:0;}
.ein2 img{display:block;max-width:100%;}

/* statbar */
.ein2-statbar{display:flex;align-items:center;background:var(--e2-card);border:1px solid var(--e2-border);border-radius:var(--e2-radius);padding:14px 10px;margin-bottom:22px;box-shadow:var(--e2-shadow);gap:0;flex-wrap:wrap;}
.ein2-stat{display:flex;align-items:center;gap:13px;padding:4px 24px;position:relative;}
.ein2-stat+.ein2-stat::before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:1px;background:var(--e2-soft);}
.ein2-stat-ic{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.ein2-stat-ic svg{width:21px;height:21px;}
.ein2-stat-ic.red{background:#fde8e4;color:#ef4444;}
.ein2-stat-ic.orange{background:#fdf0db;color:#f59e0b;}
.ein2-stat-ic.purple{background:#ede9fb;color:#7c5cf0;}
.ein2-stat-ic.violet{background:#f0e9fb;color:#9333ea;}
.ein2-stat-num{font-size:22px;font-weight:700;line-height:1.05;letter-spacing:-.01em;}
.ein2-stat-lbl{font-size:13px;color:#374151;font-weight:500;margin-top:1px;}
.ein2-stat-sub{font-size:11px;color:var(--e2-text3);margin-top:2px;}
.ein2-statbar-actions{margin-left:auto;display:flex;gap:12px;padding-left:16px;flex-shrink:0;}
.ein2-btn{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 18px;border-radius:11px;font-size:14px;font-weight:600;cursor:pointer;border:1px solid transparent;white-space:nowrap;transition:.15s;}
.ein2-btn svg{width:17px;height:17px;}
.ein2-btn--ghost{background:#fff;border-color:var(--e2-border);color:var(--e2-text);}
.ein2-btn--ghost:hover{background:#f7f8fa;}
.ein2-btn--primary{background:var(--e2-blue);color:#fff;box-shadow:0 1px 2px rgba(37,99,235,.35);}
.ein2-btn--primary:hover{background:#1d56d8;}

/* layout */
.ein2-grid{display:grid;grid-template-columns:minmax(0,1fr) 344px;gap:22px;align-items:start;}
.ein2-main{min-width:0;}

/* section head */
.ein2-sechead{display:flex;align-items:center;gap:14px;margin-bottom:16px;}
.ein2-sechead h2{font-size:18px;font-weight:700;letter-spacing:-.01em;}
.ein2-filters{margin-left:auto;display:flex;gap:2px;background:var(--e2-soft);border-radius:10px;padding:3px;}
.ein2-fpill{padding:6px 15px;border-radius:8px;font-size:13px;font-weight:600;color:var(--e2-text2);cursor:pointer;border:none;background:transparent;transition:.15s;}
.ein2-fpill.active{background:#fff;color:var(--e2-text);box-shadow:0 1px 2px rgba(16,24,40,.08);}
.ein2-vtoggle{display:flex;gap:2px;background:var(--e2-soft);border-radius:10px;padding:3px;}
.ein2-vbtn{width:34px;height:30px;border:none;background:transparent;border-radius:7px;color:var(--e2-text2);cursor:pointer;display:flex;align-items:center;justify-content:center;}
.ein2-vbtn svg{width:17px;height:17px;}
.ein2-vbtn.active{background:#fff;color:var(--e2-text);box-shadow:0 1px 2px rgba(16,24,40,.08);}

/* einsatz card */
.ein2-list{display:flex;flex-direction:column;gap:16px;}
.ein2-card{display:grid;grid-template-columns:364px 1fr;background:var(--e2-card);border:1px solid var(--e2-border);border-radius:var(--e2-radius);overflow:hidden;box-shadow:var(--e2-shadow);transition:.15s;}
.ein2-card:hover{box-shadow:0 4px 14px rgba(16,24,40,.08);}
.ein2-photo{position:relative;background:#0c1018;min-height:188px;}
.ein2-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.ein2-sev{position:absolute;left:12px;bottom:18px;padding:5px 13px 5px 11px;border-radius:8px;font-size:11px;font-weight:700;letter-spacing:.05em;color:#fff;z-index:2;box-shadow:0 2px 8px rgba(0,0,0,.25);}
.ein2-sev.krit{background:#ef4444;}
.ein2-sev.hoch{background:#f59e0b;}
.ein2-sev.normal{background:#16a34a;}
.ein2-cbody{padding:17px 22px;display:flex;flex-direction:column;justify-content:center;}
.ein2-ctop{display:flex;align-items:flex-start;gap:12px;}
.ein2-ctitle{font-size:20px;font-weight:700;letter-spacing:-.01em;}
.ein2-cstatus{margin-left:auto;display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;flex-shrink:0;}
.ein2-cstatus .dot{width:8px;height:8px;border-radius:50%;}
.ein2-cstatus.aktiv{color:#dc2626;}
.ein2-cstatus.aktiv .dot{background:#ef4444;box-shadow:0 0 0 3px rgba(239,68,68,.16);}
.ein2-cstatus.beendet{color:#64748b;}
.ein2-cstatus.beendet .dot{background:#94a3b8;}
.ein2-csub{color:var(--e2-text2);margin-top:3px;font-size:14px;}
.ein2-cinfo{display:flex;gap:34px;margin-top:17px;flex-wrap:wrap;}
.ein2-cinfo-item{display:flex;align-items:center;gap:10px;}
.ein2-cinfo-ic{width:30px;height:30px;border-radius:8px;background:var(--e2-soft);display:flex;align-items:center;justify-content:center;color:var(--e2-text2);flex-shrink:0;}
.ein2-cinfo-ic svg{width:15px;height:15px;}
.ein2-cinfo-lbl{font-size:11px;color:var(--e2-text3);}
.ein2-cinfo-val{font-size:14px;font-weight:600;margin-top:1px;}
.ein2-prog-wrap{margin-top:18px;}
.ein2-prog-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:7px;}
.ein2-prog-head .l{font-size:12.5px;color:var(--e2-text2);font-weight:500;}
.ein2-prog-head .p{font-size:12.5px;font-weight:700;}
.ein2-prog{height:6px;border-radius:99px;background:var(--e2-soft);overflow:hidden;}
.ein2-prog>span{display:block;height:100%;border-radius:99px;}
.ein2-prog>span.red{background:#ef4444;}
.ein2-prog>span.orange{background:#f59e0b;}
.ein2-prog>span.green{background:#16a34a;}
.ein2-prog>span.blue{background:#2563eb;}
.ein2-cfoot{display:flex;align-items:center;gap:8px;margin-top:18px;flex-wrap:wrap;}
.ein2-chip{background:var(--e2-soft);color:#4b5563;padding:5px 11px;border-radius:7px;font-size:12px;font-weight:600;white-space:nowrap;}
.ein2-zum{margin-left:auto;display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 16px;border-radius:10px;border:1px solid var(--e2-border);background:#fff;color:var(--e2-text);font-size:13.5px;font-weight:600;cursor:pointer;text-decoration:none;}
.ein2-zum:hover{background:var(--e2-blue);border-color:var(--e2-blue);color:#fff;}
.ein2-zum svg{width:15px;height:15px;}

/* side cards */
.ein2-side{display:flex;flex-direction:column;gap:18px;}
.ein2-scard{background:var(--e2-card);border:1px solid var(--e2-border);border-radius:var(--e2-radius);padding:18px;box-shadow:var(--e2-shadow);}
.ein2-scard-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;}
.ein2-scard-h h3{font-size:15px;font-weight:700;}
.ein2-expand{width:30px;height:30px;border-radius:8px;border:1px solid var(--e2-border);background:#fff;color:var(--e2-text2);display:flex;align-items:center;justify-content:center;cursor:pointer;}
.ein2-expand svg{width:15px;height:15px;}

/* map */
.ein2-map{position:relative;height:188px;border-radius:12px;overflow:hidden;background:linear-gradient(160deg,#dbe7d6 0%,#cfe0e8 60%,#c4d7e6 100%);border:1px solid var(--e2-border);}
.ein2-map .road{position:absolute;background:#fff;opacity:.7;}
.ein2-map .water{position:absolute;background:#aaccdd;opacity:.55;border-radius:40%;}
.ein2-maplbl{position:absolute;font-size:10px;color:#5b6472;font-weight:600;text-shadow:0 1px 2px rgba(255,255,255,.7);}
.ein2-pin{position:absolute;transform:translate(-50%,-100%);}
.ein2-pin svg{width:26px;height:26px;filter:drop-shadow(0 2px 3px rgba(0,0,0,.3));}
.ein2-pin.red{color:#ef4444;}
.ein2-pin.orange{color:#f59e0b;}
.ein2-mapstats{display:flex;justify-content:space-between;margin-top:14px;text-align:center;}
.ein2-mapstat{display:flex;flex-direction:column;align-items:center;gap:3px;flex:1;}
.ein2-mapstat .ic{display:flex;align-items:center;gap:5px;font-size:16px;font-weight:700;}
.ein2-mapstat .ic svg{width:15px;height:15px;}
.ein2-mapstat .ic.red svg{color:#ef4444;} .ein2-mapstat .ic.orange svg{color:#f59e0b;} .ein2-mapstat .ic.purple svg{color:#7c5cf0;}
.ein2-mapstat .t{font-size:10.5px;color:var(--e2-text3);}

/* hinweise */
.ein2-hinweis{display:flex;gap:11px;padding:11px 0;}
.ein2-hinweis+.ein2-hinweis{border-top:1px solid var(--e2-soft);}
.ein2-hinweis-ic{width:30px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.ein2-hinweis-ic svg{width:16px;height:16px;}
.ein2-hinweis-ic.blue{background:#e3edff;color:#2563eb;}
.ein2-hinweis-ic.orange{background:#fdf0db;color:#f59e0b;}
.ein2-hinweis-ic.slate{background:#eef1f5;color:#64748b;}
.ein2-hinweis-main{flex:1;min-width:0;}
.ein2-hinweis-t{font-size:13.5px;font-weight:700;}
.ein2-hinweis-s{font-size:12px;color:var(--e2-text2);margin-top:1px;}
.ein2-hinweis-meta{text-align:right;flex-shrink:0;}
.ein2-hinweis-meta .k{font-size:10.5px;color:var(--e2-text3);}
.ein2-hinweis-meta .v{font-size:12px;font-weight:700;margin-top:1px;}

/* link */
.ein2-morelink{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;margin-top:12px;color:var(--e2-text2);font-size:13px;font-weight:600;background:none;border:none;cursor:pointer;text-decoration:none;}
.ein2-morelink svg{width:14px;height:14px;}
.ein2-morelink:hover{color:var(--e2-blue);}

/* activity */
.ein2-act{position:relative;padding-left:24px;padding-bottom:16px;}
.ein2-act:last-of-type{padding-bottom:0;}
.ein2-act::before{content:"";position:absolute;left:5px;top:14px;bottom:0;width:2px;background:var(--e2-soft);}
.ein2-act:last-of-type::before{display:none;}
.ein2-act-dot{position:absolute;left:0;top:3px;width:12px;height:12px;border-radius:50%;border:2px solid #fff;}
.ein2-act-dot.blue{background:#2563eb;} .ein2-act-dot.green{background:#16a34a;} .ein2-act-dot.orange{background:#f59e0b;} .ein2-act-dot.slate{background:#94a3b8;}
.ein2-act-time{font-size:11.5px;color:var(--e2-text3);font-weight:600;}
.ein2-act-t{font-size:13px;font-weight:600;margin-top:1px;}
.ein2-act-t b{font-weight:700;}
.ein2-act-s{font-size:12px;color:var(--e2-text2);margin-top:1px;}

@media(max-width:1180px){ .ein2-grid{grid-template-columns:1fr;} .ein2-side{flex-direction:row;flex-wrap:wrap;} .ein2-side>.ein2-scard{flex:1 1 300px;} }
/* ============================================================
   EINSÄTZE-VIEW · MOBIL (≤760px) — vollständig responsiv
   ============================================================ */
@media(max-width:760px){
  /* ---- Statbar: 2×2-Kacheln statt gequetschter Reihe ---- */
  .ein2-statbar{
    display:grid;grid-template-columns:1fr 1fr;gap:0;
    padding:6px 6px;margin-bottom:16px;
  }
  .ein2-stat{
    padding:13px 12px;gap:11px;
    border-radius:12px;
  }
  /* vertikale Trennlinien weg, stattdessen feines Raster */
  .ein2-stat+.ein2-stat::before{display:none;}
  .ein2-stat:nth-child(1),.ein2-stat:nth-child(2){border-bottom:1px solid var(--e2-soft);}
  .ein2-stat:nth-child(odd){border-right:1px solid var(--e2-soft);}
  .ein2-stat-ic{width:38px;height:38px;}
  .ein2-stat-ic svg{width:18px;height:18px;}
  .ein2-stat-num{font-size:19px;}
  .ein2-stat-lbl{font-size:12px;line-height:1.2;}
  .ein2-stat-sub{font-size:10.5px;}

  /* ---- Aktionen: volle Breite, gestapelt, gut tappbar ---- */
  .ein2-statbar-actions{
    grid-column:1 / -1;margin:8px 4px 4px;padding:0;
    display:flex;flex-direction:column;gap:8px;width:auto;
  }
  .ein2-statbar-actions .ein2-btn{width:100%;justify-content:center;height:46px;}

  /* ---- Grid einspaltig, Seiten-Cards untereinander ---- */
  .ein2-grid{grid-template-columns:1fr;gap:16px;}
  .ein2-side{flex-direction:column;gap:14px;}
  .ein2-side>.ein2-scard{flex:1 1 auto;}

  /* ---- Sektionskopf: Titel + Filter/View darunter, scrollbar ---- */
  .ein2-sechead{flex-wrap:wrap;gap:10px;margin-bottom:12px;}
  .ein2-sechead h2{flex:1 1 100%;font-size:18px;}
  .ein2-filters{
    margin-left:0;flex:1 1 auto;overflow-x:auto;-webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }
  .ein2-filters::-webkit-scrollbar{display:none;}
  .ein2-fpill{flex:0 0 auto;padding:8px 16px;font-size:13.5px;}
  .ein2-vtoggle{flex:0 0 auto;}
  .ein2-vbtn{width:40px;height:34px;}

  /* ---- Karte: Photo als Banner oben, Inhalt darunter ---- */
  .ein2-card{grid-template-columns:1fr;}
  .ein2-photo{min-height:150px;}
  .ein2-cbody{padding:16px 16px;}
  .ein2-ctop{flex-wrap:wrap;gap:8px;}
  .ein2-ctitle{font-size:18px;flex:1 1 70%;min-width:0;}
  .ein2-cstatus{margin-left:0;}
  .ein2-csub{font-size:13px;}

  /* Info-Items: Datum volle Breite (braucht Platz), Rest 2-spaltig */
  .ein2-cinfo{
    display:grid;grid-template-columns:1fr 1fr;gap:12px 14px;margin-top:14px;
  }
  .ein2-cinfo-item{min-width:0;}
  .ein2-cinfo-item:first-child{grid-column:1 / -1;}
  .ein2-cinfo-val{font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

  .ein2-prog-wrap{margin-top:14px;}

  /* Footer: Chips-Reihe oben, Aktionen darunter volle Breite */
  .ein2-cfoot{flex-direction:column;align-items:stretch;gap:10px;margin-top:16px;}
  .ein2-chips{flex:0 0 auto;}
  .ein2-cfoot-actions{
    margin-left:0;width:100%;display:flex;flex-wrap:wrap;gap:8px;
  }
  .ein2-cfoot-actions form{flex:1 1 auto;}
  .ein2-zum,.ein2-zum--ghost{flex:1 1 auto;justify-content:center;height:42px;}
  .ein2-aktivbadge{flex:1 1 auto;justify-content:center;height:42px;}

  /* ---- Listenansicht mobil = wie Kacheln (Photo-Split zu eng) ---- */
  .ein2-list.is-list .ein2-card{grid-template-columns:1fr;}
  .ein2-list.is-list .ein2-photo{min-height:150px;}
  .ein2-list.is-list .ein2-ctitle{font-size:18px;}
  /* View-Toggle bleibt nutzbar, ändert aber bei schmalen Screens wenig –
     Liste und Kacheln sehen mobil bewusst gleich aus (beste Lesbarkeit). */

  /* ---- Seiten-Cards: kompaktere Innenabstände ---- */
  .ein2-scard{padding:16px;}
  .ein2-scard-h h3{font-size:14.5px;}
}

/* Sehr schmal (≤360px): Statbar einspaltig, damit Zahlen atmen */
@media(max-width:360px){
  .ein2-statbar{grid-template-columns:1fr;}
  .ein2-stat:nth-child(odd){border-right:none;}
  .ein2-stat:nth-child(1),.ein2-stat:nth-child(2),.ein2-stat:nth-child(3){
    border-bottom:1px solid var(--e2-soft);
  }
  .ein2-cinfo{grid-template-columns:1fr;}
}

/* ---- Einsätze v2: Footer-Aktionen, Aktiv-Button, Listenansicht ---- */
.ein2-cfoot{display:flex;align-items:center;gap:8px;}
.ein2-chips{display:flex;gap:8px;flex-wrap:wrap;flex:1;min-width:0;}
.ein2-cfoot-actions{display:flex;gap:8px;align-items:center;flex-shrink:0;margin-left:auto;}
.ein2-zum{margin-left:0;}
.ein2-zum--ghost{background:#fff;color:var(--e2-text2);}
.ein2-zum--ghost:hover{background:var(--e2-green);border-color:var(--e2-green);color:#fff;}
/* Einsatz schließen: roter Akzent (Übersicht: ein2-zum, Detailseite: btn) */
.ein2-zum--danger{color:#b91c1c;}
.ein2-zum--danger:hover{background:#dc2626;border-color:#dc2626;color:#fff;}
.btn.es-close{color:#b91c1c;border-color:#fecaca;gap:0;overflow:hidden;}
.btn.es-close:hover{background:#fef2f2;border-color:#fca5a5;color:#991b1b;}
.es-close .es-close-lbl{display:inline-block;max-width:0;opacity:0;overflow:hidden;white-space:nowrap;transform:translateX(8px);transition:max-width .3s cubic-bezier(.4,0,.2,1),opacity .25s ease,transform .3s cubic-bezier(.4,0,.2,1),margin-left .3s cubic-bezier(.4,0,.2,1);}
.es-close:hover .es-close-lbl,.es-close:focus-visible .es-close-lbl{max-width:200px;opacity:1;transform:translateX(0);margin-left:8px;}
/* Mobil: Schließen-Icon oben rechts auf Höhe des Zurück-Buttons, gleiches Padding */
@media(max-width:720px){
  .ed-head{position:relative;}
  .ed-actions{gap:8px;}
  .ed-actions .btn{flex:1 1 0;min-width:0;justify-content:center;white-space:nowrap;font-size:13px;padding:9px 8px;gap:6px;}
  .ed-actions .btn svg{width:16px;height:16px;flex-shrink:0;}
  .ed-actions .es-close{position:absolute;top:0;right:0;flex:0 0 auto;width:auto;padding:8px 11px;z-index:2;}
  .es-close .es-close-lbl{display:none;}
}
.ein2-aktivbadge{display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 14px;border-radius:10px;background:#e6f6ec;color:#15803d;font-size:13px;font-weight:600;}
.ein2-aktivbadge svg{width:15px;height:15px;}

/* Listenansicht */
.ein2-list.is-list{gap:10px;}
.ein2-list.is-list .ein2-card{grid-template-columns:160px 1fr;}
.ein2-list.is-list .ein2-photo{min-height:138px;}
.ein2-list.is-list .ein2-cbody{padding:14px 18px;}
.ein2-list.is-list .ein2-ctitle{font-size:17px;}
.ein2-list.is-list .ein2-cinfo{gap:24px;margin-top:12px;}
.ein2-list.is-list .ein2-prog-wrap{margin-top:12px;}
.ein2-list.is-list .ein2-cfoot{margin-top:12px;}
.ein2-cfoot-actions form{margin:0;display:inline-flex;}

/* Aktive-Einsätze-Liste MOBIL: Foto schmaler → mehr Platz für Inhalt rechts.
   Steht bewusst NACH den globalen is-list-Regeln, sonst überschreiben diese
   die Mobil-Werte (gleiche Spezifität → spätere Regel gewinnt). */
@media(max-width:720px){
  .ein2-list.is-list .ein2-card{grid-template-columns:104px 1fr;align-items:stretch;}
  .ein2-list.is-list .ein2-photo{min-height:0;}
  .ein2-list.is-list .ein2-cbody{padding:11px 13px;}
  .ein2-list.is-list .ein2-ctitle{font-size:16px;}
  /* Die drei Infos UNTEREINANDER (sonst überlagert „Offene Aufträge" den Namen).
     display:flex muss explizit gesetzt sein, sonst gewinnt die grid-Regel weiter oben. */
  .ein2-list.is-list .ein2-cinfo{display:flex;flex-direction:column;gap:7px;margin-top:9px;}
  .ein2-list.is-list .ein2-cinfo > *{flex:0 0 auto;min-width:0;width:100%;}
  .ein2-list.is-list .ein2-cinfo-item:first-child{grid-column:auto;}
  /* Karte insgesamt etwas kompakter */
  .ein2-list.is-list{gap:9px;}
  .ein2-list.is-list .ein2-prog-wrap{margin-top:9px;}
  .ein2-list.is-list .ein2-cfoot{margin-top:9px;}
}
@media(max-width:360px){
  .ein2-list.is-list .ein2-card{grid-template-columns:84px 1fr;}
}

/* ---- Drawer: Flex-Layout (Body scrollbar, Kopf/Tabs/Footer sticky) ---- */
#drawerHost{display:flex;flex-direction:column;height:100%;min-height:0;}
#drawerHost .drawer-head,#drawerHost .tabs{flex:0 0 auto;}
#drawerHost .drawer-body{flex:1 1 auto;min-height:0;}
#drawerHost #drawerComposer,#drawerHost #drawerFoot,#drawerHost .foot-panel{flex:0 0 auto;}
.foot-panel{border-top:1px solid var(--border);padding:14px 22px;background:#fff;max-height:48dvh;overflow-y:auto;}
.foot-panel .form-field{margin-bottom:10px;}
.drawer-foot{background:#fff;}
/* Letzte-Rückmeldung-Karte */
.d-card .d-block .v{font-size:14px;line-height:1.5;}
.composer-files .cf-chip{display:inline-flex;align-items:center;background:var(--bg-app);border:1px solid var(--border);border-radius:7px;padding:4px 9px;font-size:12px;color:var(--text-muted)}

/* ---- Drawer: Formularelemente (Composer + Foot-Panels) ---- */
.composer select, .composer input[type=text],
.foot-panel select, .foot-panel input[type=text], .foot-panel textarea{
  width:100%; border:1px solid var(--border-strong); border-radius:9px;
  padding:9px 12px; font-size:13.5px; font-family:inherit; background:#fff; color:var(--text);
  -webkit-appearance:none; appearance:none;
}
.composer select, .foot-panel select{
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><path d='M6 9l6 6 6-6'/></svg>");
  background-repeat:no-repeat; background-position:right 11px center; padding-right:34px; cursor:pointer;
}
.composer select:focus, .composer input[type=text]:focus,
.foot-panel select:focus, .foot-panel input[type=text]:focus, .foot-panel textarea:focus{
  outline:none; border-color:var(--brand); box-shadow:0 0 0 3px var(--brand-soft);
}
.composer-resp select{margin-top:6px;}
.composer-status select{max-width:230px;}

/* ---- Navigation: inaktive Punkte ausgrauen + Administration-Gruppe ---- */
.nav-item.is-disabled{opacity:.4;cursor:default;}
.nav-item.is-disabled:hover{background:transparent;color:rgba(255,255,255,.6);}
.nav-group .nav-caret{width:15px;height:15px;margin-left:auto;transition:transform .18s;opacity:.7;}
.nav-group .nav-caret.rot{transform:rotate(180deg);}
.nav-subitem .es-dot--static{background:rgba(255,255,255,.45);box-shadow:none;animation:none;}

/* ---- Benachrichtigungen (Glocke) ---- */
.notif-menu{min-width:320px;max-width:360px;padding:6px}
.notif-menu .notif-list{max-height:340px;overflow-y:auto}
.notif-menu .notif-item{display:flex;gap:10px;align-items:flex-start;padding:10px;border-radius:8px;text-decoration:none;color:var(--text);transition:.12s}
.notif-menu .notif-item:hover{background:#f1f5f9}
.notif-menu .notif-dot{width:8px;height:8px;border-radius:50%;background:var(--brand);margin-top:5px;flex-shrink:0}
.notif-menu .notif-body{display:flex;flex-direction:column;gap:2px;min-width:0}
.notif-menu .notif-title{font-size:13px;font-weight:600;color:var(--text)}
.notif-menu .notif-detail{font-size:12px;color:var(--text-muted);line-height:1.35;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.notif-menu .notif-meta{font-size:11px;color:var(--text-faint);margin-top:1px}
a.ein2-hinweis{transition:opacity .12s;}
a.ein2-hinweis:hover{opacity:.7;}

/* ==================================================================
   §Aufgabe C — Mein Profil & E-Mail-Pflege (Bundle C, kumulativ)
   ================================================================== */

/* --- „✉ fehlt"-Kennzeichnung (Benutzerliste; analog .ssv-leiter-tag) --- */
.mfehlt-badge{font-size:10px;font-weight:700;letter-spacing:.03em;color:#92400e;background:#fef3c7;border:1px solid #fde68a;border-radius:10px;padding:1px 7px;white-space:nowrap;flex:none;cursor:help}

/* --- Topbar: dezenter Hinweispunkt am Benutzer-Chip + Menü-Unterzeile --- */
.userchip{position:relative}
.userchip .uc-dot{position:absolute;top:-3px;right:-3px;width:10px;height:10px;border-radius:50%;background:#f59e0b;border:2px solid #0f172a}
.tb-item-col{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.tb-item-sub{font-size:11px;font-weight:600;color:#b45309}

/* --- Profilseite (route profil.show) --- */
.profil-wrap{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start;max-width:980px}
.profil-panel{padding:20px 22px}
.profil-panel-konto{grid-column:1/-1}
.profil-sec-head{font-size:15px;font-weight:700;color:var(--text)}
.profil-sec-sub{font-size:12.5px;color:var(--text-muted);margin-top:2px;margin-bottom:16px}
.profil-konto{display:flex;align-items:center;gap:13px;margin-top:12px}
.profil-konto .ssv-mem-ava{width:44px;height:44px;font-size:15px}
.profil-konto-name{font-size:16px;font-weight:700;color:var(--text)}
.profil-konto-sub{font-size:12.5px;color:var(--text-muted);margin-top:1px}
.profil-rows{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px 24px;margin-top:16px}
.profil-row{display:flex;flex-direction:column;gap:2px;min-width:0}
.profil-row .k{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--text-faint)}
.profil-row .v{font-size:13.5px;font-weight:600;color:var(--text);overflow-wrap:anywhere}
.profil-note{font-size:12px;color:var(--text-faint);margin-top:14px}
.profil-warn{display:flex;gap:9px;align-items:flex-start;padding:10px 12px;margin-bottom:14px;background:#fffbeb;border:1px solid #fde68a;border-radius:9px;font-size:12.5px;color:#92400e;line-height:1.5}
.profil-warn svg{width:16px;height:16px;flex-shrink:0;margin-top:2px}
.profil-form{display:flex;flex-direction:column;gap:14px}
.profil-form .field-err{margin-top:0}
.profil-form-foot{display:flex;justify-content:flex-end;margin-top:2px}
@media (max-width: 860px){ .profil-wrap{grid-template-columns:1fr} }

/* ==================================================================
   §Aufgabe A — Externe Kontakte & Ressourcen-Netzwerk (kumulativ)
   ================================================================== */

/* --- Toolbar: Suche + Kategorie-Chips --- */
.kt-toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:16px}
.kt-search{flex:1;min-width:220px;max-width:360px}
.kt-search input{width:100%;font-family:var(--font);font-size:13.5px;padding:9px 12px;border:1px solid var(--border-strong);border-radius:9px;background:var(--bg-surface);color:var(--text)}
.kt-search input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
.kt-chips{display:flex;gap:6px;flex-wrap:wrap}
.kt-chip{font-size:12px;font-weight:600;font-family:var(--font);border:1px solid var(--border);background:var(--bg-surface);border-radius:20px;padding:5px 12px;cursor:pointer;color:var(--text-muted);transition:.12s}
.kt-chip:hover{color:var(--text)}
.kt-chip.sel{background:var(--brand-soft);border-color:var(--brand);color:var(--brand)}

/* --- Kontakt-Zeilen (Adressbuch) --- */
.kt-row{border-bottom:1px solid var(--border)}
.kt-row:last-child{border-bottom:none}
.kt-head{display:flex;align-items:center;gap:12px;padding:11px 12px;cursor:pointer;border-radius:10px;transition:background .12s}
.kt-head:hover{background:#fafbfc}
.kt-kat-tag{font-size:10px;font-weight:700;letter-spacing:.03em;border-radius:10px;padding:1px 7px;white-space:nowrap}
.kt-res-pill{font-size:11px;font-weight:600;color:var(--text-muted);background:var(--bg-app);border:1px solid var(--border);border-radius:20px;padding:3px 9px;flex:none;white-space:nowrap}
.kt-caret{width:15px;height:15px;color:var(--text-faint);transition:transform .2s;flex:none}
.kt-caret.open{transform:rotate(90deg)}

/* Aktionen erscheinen erst beim Überfahren (Touch-Geräte: immer sichtbar) */
.kt-actions{display:flex;gap:4px;align-items:center;opacity:0;transition:opacity .15s;flex:none}
.kt-head:hover .kt-actions,.kt-res-view:hover .kt-actions,.rn-view:hover .kt-actions{opacity:1}
@media (hover:none){.kt-actions{opacity:1}}

/* --- Aufgeklappter Detailbereich --- */
.kt-detail{padding:2px 12px 14px 58px}
.kt-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px 24px;margin-bottom:4px}
.kt-notiz{grid-column:1/-1}
.kt-notiz .v{white-space:pre-line;font-weight:500}
.kt-detail a{color:var(--brand);text-decoration:none;font-weight:600}
.kt-detail a:hover{text-decoration:underline}

/* --- Ressourcen im Kontakt --- */
.kt-res{margin-top:12px;background:var(--bg-app);border:1px solid var(--border);border-radius:10px;padding:10px 12px}
.kt-res-head{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--text-faint);margin-bottom:6px}
.kt-res-row{border-bottom:1px dashed var(--border);padding:5px 0}
.kt-res-row:last-of-type{border-bottom:none}
.kt-res-view{display:flex;align-items:center;gap:12px;flex-wrap:wrap;min-height:34px}
.kt-res-name{font-size:13px;font-weight:600;color:var(--text);flex:1;min-width:140px}
.kt-res-kap{font-size:14px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums;white-space:nowrap}
.kt-res-ges{color:var(--text-muted);font-weight:600}
.kt-res-einheit{font-size:12px;color:var(--text-muted);font-weight:500}
.kt-res-stand{font-size:11.5px;color:var(--text-faint);white-space:nowrap}
.kt-res-stand.alt{color:#b45309;font-weight:600}
.kt-res-leer{font-size:12.5px;color:var(--text-faint);padding:4px 0}
.kt-res-edit,.kt-res-add{display:flex;gap:8px;flex-wrap:wrap;align-items:center;padding:6px 0}
.kt-res-edit input,.kt-res-add input{font-family:var(--font);font-size:13px;padding:7px 10px;border:1px solid var(--border-strong);border-radius:8px;background:var(--bg-surface);color:var(--text)}
.kt-res-edit input:focus,.kt-res-add input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
.kt-res-addbtn{display:inline-flex;align-items:center;gap:6px;margin-top:7px;font-size:12.5px;font-weight:600;font-family:var(--font);color:var(--brand);background:transparent;border:1px dashed var(--brand);border-radius:8px;padding:6px 11px;cursor:pointer;transition:.12s}
.kt-res-addbtn:hover{background:var(--brand-soft)}

/* --- Ressourcen-Netzwerk --- */
.rn-row{border-bottom:1px solid var(--border);padding:8px 14px}
.rn-row:last-child{border-bottom:none}
.rn-view{display:flex;align-items:center;gap:14px;flex-wrap:wrap;min-height:36px}
.rn-name{font-size:13.5px;font-weight:700;color:var(--text);flex:1.2;min-width:160px}
.rn-kap{font-size:16px;font-weight:800;color:var(--text);font-variant-numeric:tabular-nums;white-space:nowrap;min-width:80px}
.rn-org{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;color:var(--text-muted);text-decoration:none;flex:1;min-width:170px}
.rn-org:hover{color:var(--brand)}
.rn-org-dot{width:8px;height:8px;border-radius:50%;flex:none}
.rn-org-tel{font-weight:500;color:var(--text-faint)}
.rn-edit{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:2px 0}
.rn-edit input{font-family:var(--font);font-size:13.5px;padding:7px 10px;border:1px solid var(--border-strong);border-radius:8px;background:var(--bg-surface);width:150px}
.rn-edit input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
.rn-hint{font-size:11.5px;color:var(--text-faint)}

@media (max-width: 760px){
  .kt-detail{padding-left:12px}
  .kt-res-stand{white-space:normal}
}

/* ==================================================================
   §Aufgabe B — Organisation als Dach, Einheiten-Dropdown, Anfordern
   ================================================================== */

/* --- Selects in Ressourcen-Formularen wie Inputs stylen --- */
.kt-res-edit select,.kt-res-add select{font-family:var(--font);font-size:13px;padding:7px 10px;border:1px solid var(--border-strong);border-radius:8px;background:var(--bg-surface);color:var(--text);cursor:pointer}
.kt-res-edit select:focus,.kt-res-add select:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}

/* --- Ansprechpersonen innerhalb einer Organisation --- */
.kt-personen{margin-top:2px}
.kt-person{margin:8px 0 8px 14px;padding:6px 12px;border-left:2px solid var(--border);border-radius:0 8px 8px 0}
.kt-person:hover{background:var(--bg-inset)}
.kt-person-head{display:flex;align-items:center;gap:10px;padding:4px 0}
.kt-person-head:hover .kt-actions,.kt-res-row-person:hover .kt-actions{opacity:1}
.kt-person-ava{width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:800;color:#fff;letter-spacing:.3px;flex-shrink:0}
.kt-person-name{font-size:13.5px;font-weight:700;color:var(--text)}
.kt-person-extra{font-size:12px;color:var(--text-muted);margin:2px 0 4px 36px}
.kt-person-extra a{color:var(--brand);text-decoration:none}
.kt-person-extra a:hover{text-decoration:underline}
.kt-res-row-person{margin-left:36px}
.kt-res-addbtn-person{margin-left:36px}
.kt-res-add.kt-res-row-person{border-bottom:none}

/* --- Ressourcen-Netzwerk: Träger + Anfordern --- */
.rn-org-tel a{color:var(--text-muted);text-decoration:none}
.rn-org-tel a:hover{color:var(--brand);text-decoration:underline}
.rn-anf{flex-shrink:0;gap:6px}
@media (hover:none){.rn-row .kt-actions,.kt-person .kt-actions{opacity:1}}

/* --- Anfordern-Modal: Kanalwahl --- */
.anf-hint{font-size:12.5px;color:var(--text-muted);line-height:1.5}
.anf-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.anf-btn{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:12px 14px;border:1px solid var(--border-strong);border-radius:10px;background:var(--bg-surface);text-decoration:none;cursor:pointer;transition:border-color .12s,box-shadow .12s}
.anf-btn:hover{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
.anf-titel{display:flex;align-items:center;gap:7px;font-family:var(--font);font-size:13.5px;font-weight:700;color:var(--text)}
.anf-sub{font-family:var(--font);font-size:11.5px;font-weight:500;color:var(--text-faint);line-height:1.4;word-break:break-word}
.anf-btn.disabled{opacity:.45;cursor:not-allowed}
.anf-btn.disabled:hover{border-color:var(--border-strong);box-shadow:none}
@media (max-width:560px){.anf-grid{grid-template-columns:1fr}}

/* ==================================================================
   §Aufgabe C — Mehrfach-Zuordnung, Personen-Ansicht, Netzwerk-Vollbearbeitung
   ================================================================== */

/* --- Personen-Pille dezent von den Kategorien absetzen --- */
.kt-chip-personen{margin-right:10px;position:relative}
.kt-chip-personen::after{content:'';position:absolute;right:-6px;top:20%;height:60%;width:1px;background:var(--border-strong)}

/* --- Personen-Ansicht: flache Liste als Sprungwerkzeug --- */
.kt-prow{display:flex;align-items:center;gap:12px;padding:10px 14px;border-bottom:1px solid var(--border);border-radius:10px;text-decoration:none}
.kt-prow:last-of-type{border-bottom:none}
.kt-prow:hover{background:var(--bg-inset)}
.kt-prow .kt-person-name{font-size:14px}
.kt-prow-tel{font-size:12.5px;font-weight:600;color:var(--text-muted);white-space:nowrap}
.kt-prow .kt-caret{flex:none;margin-left:2px}

/* --- "auch: …" — weitere Zuordnungen einer Person, bewusst leise --- */
.kt-person-auch{color:var(--text-faint)}

/* --- Zuordnen-Modal: durchsuchbare Personenliste --- */
.zu-liste{max-height:280px;overflow:auto;border:1px solid var(--border);border-radius:10px;margin-top:10px;padding:4px}
.zu-row{display:flex;align-items:center;gap:10px;width:100%;text-align:left;background:none;border:1px solid transparent;border-radius:8px;padding:7px 9px;cursor:pointer;font-family:var(--font)}
.zu-row:hover{background:var(--bg-inset)}
.zu-row.sel{border-color:var(--brand);background:var(--brand-soft)}
.zu-check{width:15px;height:15px;color:var(--brand);opacity:0;margin-left:auto;flex:none;transition:opacity .12s}
.zu-row.sel .zu-check{opacity:1}
.btn[disabled]{opacity:.5;cursor:not-allowed;pointer-events:none}

/* --- Ressourcen-Netzwerk: Träger mit dezenter Organisationsliste (F-C2) --- */
.rn-org-link{color:inherit;text-decoration:none}
.rn-org-link:hover{color:var(--brand);text-decoration:underline}
.rn-orgs{font-size:11.5px;font-weight:500;color:var(--text-faint)}
.rn-edit select{font-family:var(--font);font-size:13.5px;padding:7px 10px;border:1px solid var(--border-strong);border-radius:8px;background:var(--bg-surface);color:var(--text);cursor:pointer}
.rn-edit select:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}

/* ==================================================================
   §Aufgabe D — Organigramm-Canvas (frei navigierbare Netzansicht)
   ================================================================== */
.btn-icon-only{padding:9px 11px}
.og-canvas{position:relative;overflow:hidden;margin-top:14px;border:1px solid var(--border);border-radius:14px;background-color:var(--bg-surface);background-image:radial-gradient(circle, var(--border) 1px, transparent 1px);background-size:26px 26px;cursor:grab;touch-action:none;height:calc(100vh - 235px);min-height:460px}
.og-canvas.grabbing{cursor:grabbing}
.og-world{position:absolute;top:0;left:0;transform-origin:0 0}
.og-edges{position:absolute;top:0;left:0;pointer-events:none}
.og-edges path{fill:none;stroke-width:2;stroke-linecap:round;opacity:.38;transition:opacity .2s}
.og-canvas.searching .og-edges path{opacity:.1}
.og-node{position:absolute;transform:translate(-50%,-50%);display:flex;align-items:center;gap:10px;background:var(--bg-surface);border:1px solid var(--border-strong);border-radius:12px;box-shadow:0 2px 10px rgba(15,23,42,.06);padding:10px 14px;text-decoration:none;transition:box-shadow .15s,border-color .15s,opacity .2s;user-select:none;-webkit-user-drag:none}
.og-node:hover{box-shadow:0 8px 22px rgba(15,23,42,.16);border-color:var(--brand);z-index:5}
.og-node.dim{opacity:.13}
.og-node > span:last-child{display:flex;flex-direction:column;min-width:0}
.og-name{font-size:13.5px;font-weight:700;color:var(--text);white-space:nowrap}
.og-meta{font-size:11px;font-weight:500;color:var(--text-faint);white-space:nowrap;max-width:200px;overflow:hidden;text-overflow:ellipsis}
.og-org-ava{width:34px;height:34px;border-radius:9px;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:12px;letter-spacing:.3px;flex:none}
.og-person{padding:8px 13px;border-radius:999px}
.og-person .og-name{font-size:12.5px}
.og-search{position:absolute;top:14px;left:14px;z-index:10;width:250px}
.og-search input{width:100%;font-family:var(--font);font-size:13px;padding:9px 12px;border:1px solid var(--border-strong);border-radius:9px;background:var(--bg-surface);color:var(--text);box-shadow:0 2px 10px rgba(15,23,42,.07)}
.og-search input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
.og-controls{position:absolute;right:14px;bottom:14px;display:flex;flex-direction:column;gap:6px;z-index:10}
.og-ctrl{width:36px;height:36px;border-radius:9px;border:1px solid var(--border-strong);background:var(--bg-surface);cursor:pointer;font-family:var(--font);font-size:17px;font-weight:700;color:var(--text);display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(15,23,42,.07);transition:border-color .12s}
.og-ctrl:hover{border-color:var(--brand)}
.og-hint{position:absolute;left:14px;bottom:14px;z-index:10;font-size:11.5px;color:var(--text-faint);background:var(--bg-surface);border:1px solid var(--border);border-radius:8px;padding:6px 10px;box-shadow:0 2px 8px rgba(15,23,42,.05)}
@media (max-width:760px){.og-hint{display:none}.og-search{width:180px}}

/* ============================================================
   NAV-COLLAPSE — minimierbare Sidebar über die Grenzlinie
   (nur Desktop > 1200px; darunter greifen Auto-Rail bzw. Off-Canvas)
   ------------------------------------------------------------
   Zusammenspiel mit layouts/app.blade.php:
     · Pre-Paint-Script im <head>  → wendet gespeicherten Zustand
       VOR dem ersten Paint an (kein Aufblitzen)
     · Logik-Script am Ende <body> → erzeugt den Griff (#navHandle)
   Zustands-Klassen auf <html>:
     .nav-js    Script initialisiert (Griff vorhanden)
     .nav-min   Sidebar minimiert (Icon-Rail, 66px)
     .nav-drag  Kante wird gerade gezogen (Breite folgt der Maus)
     .nav-anim  Übergänge aktiv (erst nach dem ersten Frame)
   Prinzip: Der Inhalt behält seine volle Breite und wird von der
   schrumpfenden Sidebar GECLIPPT statt gestaucht — dadurch bleiben
   die Icons pixelgenau stehen, nur die Texte faden aus.
   ============================================================ */
:root{
  --nav-w:240px;        /* volle Breite (= .sidebar width) */
  --nav-w-rail:66px;    /* Rail: 12px Nav-Pad + 12px Item-Pad + 18px Icon + 12 + 12 */
  --navw:var(--nav-w);  /* aktuelle Breite — wird vom Script gesetzt */
}
#navHandle{display:none}

@media(min-width:1201px){
  /* ---- Breite hängt an --navw, sobald das Script läuft ---- */
  html.nav-js .app .sidebar{width:var(--navw);overflow:hidden}
  html.nav-js.nav-anim .app .sidebar{transition:width .32s cubic-bezier(.33,1,.36,1)}

  /* Brand & Fuß behalten volle Breite → werden geclippt */
  html.nav-js .sidebar .brand,
  html.nav-js .sidebar .sidebar-foot{min-width:var(--nav-w);white-space:nowrap}
  html.nav-js .sidebar .nav{overflow-x:hidden}

  /* Nav-Einträge folgen der Breite: aufgeklappt 216px (wie width:100%),
     im Rail eine 42px-Icon-Pille — Icon bleibt dabei exakt zentriert. */
  html.nav-js .sidebar .nav .nav-item{
    position:relative;overflow:hidden;white-space:nowrap;
    width:calc(var(--navw) - 24px);
  }
  html.nav-js.nav-anim .sidebar .nav .nav-item{
    transition:background .12s,color .12s,width .32s cubic-bezier(.33,1,.36,1);
  }

  /* ---- Texte & Carets faden weich; Icons bleiben stehen ---- */
  html.nav-js .sidebar .brand>:not(.logo),
  html.nav-js .sidebar .nav-item>span,
  html.nav-js .sidebar .nav-caret,
  html.nav-js .sidebar .sidebar-foot{transition:opacity .22s ease}

  html.nav-min .sidebar .brand>:not(.logo),
  html.nav-min .sidebar .nav-item>span:not(.badge),
  html.nav-min .sidebar .nav-caret,
  html.nav-min .sidebar .sidebar-foot{opacity:0;pointer-events:none}

  /* Logo rückt in die Rail-Mitte (Logo 40px → (66-40)/2 = 13px) */
  html.nav-js.nav-anim .sidebar .brand{transition:opacity .22s ease,padding-left .32s cubic-bezier(.33,1,.36,1)}
  html.nav-min .sidebar .brand{padding-left:13px}

  /* Untermenüs (Einsätze, Tagebuch, Admin) klappen im Rail sanft zu */
  html.nav-js .sidebar .nav-sub{transition:max-height .32s cubic-bezier(.33,1,.36,1),opacity .2s ease;max-height:640px}
  html.nav-min .sidebar .nav-sub{max-height:0;opacity:0;overflow:hidden;pointer-events:none;margin-bottom:0}

  /* Zähler-Badge (z. B. Auftragsprotokoll) wandert klein aufs Icon-Eck */
  html.nav-min .sidebar .nav-item>.badge{
    position:absolute;right:1px;top:2px;margin-left:0;
    transform:scale(.78);transform-origin:top right;opacity:1;
  }

  /* ---- während des Ziehens: Deckkraft folgt der Breite live ---- */
  html.nav-drag .sidebar .brand>:not(.logo),
  html.nav-drag .sidebar .nav-item>span:not(.badge),
  html.nav-drag .sidebar .nav-caret,
  html.nav-drag .sidebar .sidebar-foot{opacity:var(--navfade,1);transition:none}
  html.nav-drag,html.nav-drag *{cursor:col-resize!important}
  html.nav-drag{user-select:none;-webkit-user-select:none}

  /* ---- der Griff auf der Grenzlinie (volle Höhe, 14px breit) ---- */
  #navHandle{
    display:block;position:fixed;z-index:60;top:0;bottom:0;
    left:calc(var(--navw) - 7px);width:14px;
    margin:0;padding:0;border:0;background:transparent;
    cursor:col-resize;touch-action:none;appearance:none;-webkit-appearance:none;
  }
  html.nav-anim #navHandle{transition:left .32s cubic-bezier(.33,1,.36,1)}
  #navHandle:focus{outline:none}

  /* Akzentlinie entlang der Kante */
  #navHandle .nh-line{
    position:absolute;top:0;bottom:0;left:50%;width:3px;transform:translateX(-50%);
    border-radius:2px;pointer-events:none;
    background:linear-gradient(180deg,transparent,var(--brand) 10%,var(--brand) 90%,transparent);
    opacity:0;transition:opacity .18s ease;
  }
  #navHandle:hover .nh-line,
  #navHandle:focus-visible .nh-line,
  html.nav-drag #navHandle .nh-line{opacity:.9}

  /* Chevron-Pill — folgt dem Cursor vertikal (top setzt das Script) */
  #navHandle .nh-grip{
    position:absolute;left:50%;top:50%;width:24px;height:46px;
    display:flex;align-items:center;justify-content:center;pointer-events:none;
    background:var(--bg-surface);border:1px solid var(--border-strong);border-radius:12px;
    box-shadow:0 2px 10px rgba(15,23,42,.20);
    opacity:0;transform:translate(-50%,-50%) scale(.7);
    transition:opacity .18s ease,transform .18s ease;
  }
  #navHandle:hover .nh-grip,
  #navHandle:focus-visible .nh-grip,
  html.nav-drag #navHandle .nh-grip{opacity:1;transform:translate(-50%,-50%) scale(1)}
  #navHandle .nh-grip svg{
    width:14px;height:14px;fill:none;stroke:var(--text);
    stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;
    transition:transform .32s cubic-bezier(.33,1,.36,1);
  }
  html.nav-min #navHandle .nh-grip svg{transform:rotate(180deg)}

  @media(prefers-reduced-motion:reduce){
    html.nav-js .app .sidebar,
    html.nav-js .sidebar .nav .nav-item,
    html.nav-js .sidebar .brand,
    html.nav-js .sidebar .nav-sub,
    #navHandle,#navHandle .nh-grip,#navHandle .nh-grip svg{transition:none!important}
  }
}

/* =====================================================================
   Auftrags-Chat (§Chat-Umbau, Etappe 1+2) — eigenständiger Block am
   Dateiende, bewusst AUSSERHALB jeder Media-Query.
   ===================================================================== */
[x-cloak]{display:none!important}

/* --- Kopfzone über dem Stream (scrollt nicht mit; Stream = .chat-body) --- */
#drawerHost .chat-top{flex:0 0 auto;background:var(--bg-surface)}
#drawerHost .chat-body{flex:1 1 auto;min-height:0;margin:10px 14px 12px;border:1px solid var(--border);border-radius:14px;background:var(--chat-bg,#f8fafc)}
#drawerHost #drawerComposer{flex:0 0 auto;display:block}
.chat-body{display:flex;flex-direction:column;gap:12px;padding:14px 14px 16px}

/* --- Festgeschrieben (Etappe 4 — Badge/Banner stehen bereits bereit) --- */
.fest-badge{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;color:#6d28d9;background:#f5f3ff;border:1px solid #ddd6fe;border-radius:99px;padding:3px 9px;white-space:nowrap}
.fest-badge svg{width:11px;height:11px}
.fest-banner{align-self:center;display:flex;align-items:center;gap:8px;font-size:12px;color:#6d28d9;background:#f5f3ff;border:1px solid #ddd6fe;border-radius:10px;padding:8px 14px;text-align:center}

/* --- Grundinformationen: kompakter, aufklappbarer Kopf --- */
.chat-kopf{padding:10px 22px;border-bottom:1px solid var(--border)}
.ck-zeile{display:flex;align-items:center;gap:10px;cursor:pointer}
.ck-main{flex:1;min-width:0}
.ck-betreff{font-weight:600;font-size:14.5px;line-height:1.35}
.ck-chips{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:5px}
.ck-schwebt{display:inline-flex;align-items:center;gap:4px;font-size:11px;color:#b45309;background:#fffbeb;border:1px dashed #fde68a;border-radius:99px;padding:2px 8px;cursor:help}
.ck-chevron{width:16px;height:16px;color:var(--text-muted);flex-shrink:0;transition:transform .18s}
.ck-detail .d-card{max-height:46vh;overflow-y:auto}

/* --- Angepinnte Weisung: flache Karte mit Akzentkante, konsistent zum
       App-Design (weiße Fläche, dezente Border, kleine Versal-Überschrift) --- */
.chat-weisung{position:relative;display:flex;align-items:flex-start;gap:10px;margin:10px 22px;padding:10px 12px 11px;background:var(--bg-surface);border:1px solid var(--border);border-radius:10px;box-shadow:var(--shadow-sm);overflow:hidden}
.chat-weisung::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:#7c3aed;border-radius:3px 0 0 3px}
.chat-weisung .cw-pin{width:26px;height:26px;border-radius:8px;background:#f5f3ff;color:#7c3aed;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px}
.chat-weisung .cw-pin svg{width:14px;height:14px}
.cw-body{flex:1;min-width:0;font-size:13px;line-height:1.5;color:var(--text)}
.cw-kopf{display:flex;align-items:baseline;gap:6px;font-size:10.5px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:#7c3aed;margin-bottom:3px}
.cw-kopf .cw-von{color:var(--text-faint);font-weight:600;letter-spacing:.03em}
.cw-text.clamp{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cw-mehr{border:none;background:none;color:#7c3aed;font-size:11.5px;font-weight:600;cursor:pointer;padding:0;margin-top:2px}
.cw-mehr:hover{text-decoration:underline}
.cw-empty{color:var(--text-faint);font-size:12.5px}
.cw-edit{flex-shrink:0;width:28px;height:28px;border-radius:7px;border:none;background:transparent;display:flex;align-items:center;justify-content:center;color:var(--text-faint);cursor:pointer;transition:.12s}
.cw-edit:hover{background:#f5f3ff;color:#7c3aed}
.cw-edit svg{width:14px;height:14px}
.chat-weisung .ro-badge{flex-shrink:0}

/* --- Aufgaben-Leiste (Kopfzeile + aufklappbare Checkliste) --- */
.aufg-leiste{border-bottom:1px solid var(--border)}
.al-zeile{display:flex;align-items:center;gap:10px;padding:9px 22px;cursor:pointer;user-select:none}
.al-zeile:hover{background:var(--bg-app)}
.al-zeile > svg:first-child{width:15px;height:15px;color:var(--text-muted);flex-shrink:0}
.al-lbl{font-size:12.5px;font-weight:600;white-space:nowrap}
.al-fertig{color:#059669;font-weight:800}
.al-bar{flex:1;height:5px;border-radius:99px;background:var(--bg-app);overflow:hidden;border:1px solid var(--border)}
.al-fill{height:100%;border-radius:99px;background:#059669;transition:width .3s}
.al-liste{padding:8px 22px 12px;max-height:38vh;overflow-y:auto;border-top:1px dashed var(--border)}
.al-item{display:flex;align-items:flex-start;gap:9px;padding:8px 10px;border:1px solid var(--border);border-radius:9px;margin-bottom:7px;background:var(--bg-surface)}
.al-item.erl{opacity:.55}
.al-item.ueberf{border-color:#dc262666}
.al-check{width:19px;height:19px;border-radius:6px;border:1.5px solid var(--border-strong);background:#fff;color:#059669;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;flex-shrink:0;margin-top:1px}
.al-check.on{border-color:#059669;background:#05966915}
.al-mitte{flex:1;min-width:0}
.al-titel{font-weight:600;font-size:13px}
.al-item.erl .al-titel{text-decoration:line-through;color:var(--text-muted)}
.al-beschr{font-size:12px;color:var(--text-muted);margin-top:2px}
.al-metazeile{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px;align-items:center}
.al-jump{width:24px;height:24px;border-radius:6px;border:1px solid var(--border);background:#fff;color:var(--text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.al-jump:hover{color:var(--brand);border-color:var(--brand)}

/* --- Filter-Chips (ersetzen die Tabs) --- */
.chat-filter{display:flex;gap:6px;padding:9px 22px;overflow-x:auto}
.flt-chip{display:inline-flex;align-items:center;gap:5px;padding:5px 12px;border:1px solid var(--border-strong);border-radius:99px;background:var(--bg-surface);font-size:12px;font-weight:600;color:var(--text-muted);cursor:pointer;white-space:nowrap;transition:.12s}
.flt-chip:hover{border-color:var(--brand);color:var(--brand)}
.flt-chip.active{background:var(--text);border-color:var(--text);color:#fff}
.flt-n{font-size:10.5px;font-weight:700;background:rgba(15,23,42,.08);border-radius:99px;padding:1px 6px}
.flt-chip.active .flt-n{background:rgba(255,255,255,.22)}

/* --- Stream: Nachricht-Bubbles (Farbe = Stabsstelle, inline gesetzt) --- */
.cn{position:relative;display:flex;flex-direction:column;max-width:86%}
.cn.own{align-self:flex-end;align-items:flex-end}
.cn.other{align-self:flex-start;align-items:flex-start}
.cn-head{display:flex;align-items:center;gap:8px;margin-bottom:4px;font-size:12px}
.cn-avatar{width:26px;height:26px;border-radius:7px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#fff;flex-shrink:0}
.cn-meta{line-height:1.2}
.cn-meta .who{font-weight:600;color:var(--text);font-size:12.5px}
.cn-meta .ss-tag{color:var(--text-muted);font-size:11.5px}
.cn-bubble{padding:10px 13px;border-radius:12px;font-size:13.5px;line-height:1.5;border:1px solid rgba(15,23,42,.07);background:var(--bg-surface)}
.cn-time{color:var(--text-faint);font-size:11px;margin-top:3px}
.cn.flash .cn-bubble{animation:cnFlash 1.6s ease}
.sys-pill.flash{animation:cnFlash 1.6s ease}
@keyframes cnFlash{0%{box-shadow:0 0 0 3px var(--brand)}100%{box-shadow:0 0 0 0 transparent}}

/* --- Nachricht-Aktionen: „⋯"-Menü (Kennzeichnen, Reagieren) --- */
.msg-dots{width:22px;height:22px;border-radius:6px;border:none;background:transparent;color:var(--text-faint);cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;transition:.12s;flex-shrink:0}
.cn:hover .msg-dots,.msg-dots:focus-visible{opacity:1}
@media (hover:none){.msg-dots{opacity:.55}}
.msg-dots:hover{background:rgba(15,23,42,.06);color:var(--text)}
.msg-dots svg{width:14px;height:14px}
.msg-menu{position:absolute;top:30px;z-index:20;background:var(--bg-surface);border:1px solid var(--border);border-radius:10px;box-shadow:var(--shadow-lg);padding:7px;min-width:215px}
.cn.other .msg-menu{left:34px}
.cn.own .msg-menu{right:0}
.mm-rx{display:flex;gap:5px;margin-bottom:2px}
.mm-rx button{flex:1;font-size:15px;padding:5px 0;border:1px solid var(--border);border-radius:8px;background:var(--bg-app);cursor:pointer;transition:.12s;line-height:1}
.mm-rx button:hover{border-color:var(--brand);background:var(--brand-soft)}
.mm-sep{height:1px;background:var(--border);margin:6px 0}
.mm-opt{display:flex;align-items:center;gap:7px;width:100%;text-align:left;border:none;background:transparent;border-radius:7px;padding:7px 8px;font-size:12.5px;color:var(--text);cursor:pointer;font-family:var(--font)}
.mm-opt:hover{background:var(--bg-app)}
.mm-opt svg{width:13px;height:13px;color:var(--text-muted);flex-shrink:0}

/* --- Kennzeichnungs-Chip in der Bubble --- */
.kz-chip{display:inline-flex;align-items:center;gap:5px;margin:2px 0 0 8px;vertical-align:middle;padding:3px 10px;border-radius:99px;background:var(--bg-surface);border:1px solid var(--border);box-shadow:0 1px 2px rgba(15,23,42,.08);font-size:11px;font-weight:700;color:var(--text-muted)}
.kz-chip.kz-rueck{color:#6d28d9;border-color:#ddd6fe}
.kz-chip.kz-auf{color:var(--brand);border-color:#bfdbfe}
.kz-chip svg{width:12px;height:12px}
.kz-chip.kz-erl{color:#16a34a;border-color:#bbf7d0}

/* --- Reaktionen (Toggle per Klick; „mine" = eigene Reaktion) --- */
.rx-row{display:flex;gap:4px;margin-top:4px}
.rx-chip{display:inline-flex;align-items:center;gap:3px;font-size:11px;padding:2px 8px;border-radius:99px;border:1px solid var(--border);background:var(--bg-surface);color:var(--text-muted)}
.rx-chip.klick{cursor:pointer;transition:.12s}
.rx-chip.klick:hover{border-color:var(--brand)}
.rx-chip.mine{border-color:var(--brand);background:var(--brand-soft);color:var(--brand)}

/* --- System-Pill (zentriert) + Datumstrenner --- */
.sys-pill{align-self:center;display:flex;align-items:center;gap:9px;max-width:96%;font-size:12.5px;color:var(--text-muted);background:#eef2f7;border-radius:9px;padding:8px 14px}
.sys-pill svg{width:13px;height:13px;flex-shrink:0}
.sys-pill .sys-txt{font-weight:600;color:var(--text);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.sys-pill.sys-erl .sys-txt,.sys-pill.sys-warn .sys-txt,.sys-pill.sys-fest .sys-txt{color:inherit}
.sys-pill .sys-meta{white-space:nowrap;color:var(--text-faint);font-size:11px;font-weight:400}
.sys-pill.klickbar{cursor:pointer;transition:background .12s,border-color .12s}
.sys-pill.klickbar:hover{background:#e4eaf1}
.sys-pill.sys-fest.klickbar:hover{background:#ede9fe}
.sys-pill .sys-go{width:12px;height:12px;flex-shrink:0;color:var(--text-faint)}
.sys-pill.klickbar:hover .sys-go{color:var(--text-muted)}
.flash-leiste{animation:cnFlash 1.6s ease}
/* Geschäftsbuch: angesprungene Zeile (?hl=lfd_nr) kurz aufleuchten lassen */
@keyframes gbHl{0%,55%{background:#fef9c3}100%{background:transparent}}
tr.gb-hl>td{animation:gbHl 2.4s ease}
.sys-pill.sys-erl{background:var(--st-erl-bg);color:var(--st-erl-fg)}
.chat-date{align-self:center;font-size:11px;font-weight:600;color:var(--text-muted);background:var(--chat-bg,#f8fafc);border:1px solid var(--border);border-radius:99px;padding:4px 14px;margin:2px 0}

/* --- Composer: „Senden als"-Umschalter --- */
.sendals{display:inline-flex;border:1px solid var(--border-strong);border-radius:8px;overflow:hidden;margin-right:2px}
.sa-opt{padding:6px 10px;font-size:12px;font-weight:600;color:var(--text-muted);background:var(--bg-surface);border:none;cursor:pointer;transition:.12s;font-family:var(--font)}
.sa-opt + .sa-opt{border-left:1px solid var(--border-strong)}
.sa-opt.sel{background:var(--brand);color:#fff}

/* --- Mini-Toast für Fetch-Aktionen im Chat --- */
.chat-toast{position:fixed;bottom:24px;right:24px;z-index:120;background:#0f172a;color:#fff;font-size:12.5px;padding:9px 14px;border-radius:9px;box-shadow:var(--shadow-lg);opacity:0;transform:translateY(6px);transition:.2s;pointer-events:none}
.chat-toast.show{opacity:1;transform:none}

/* --- Mobil --- */
@media(max-width:720px){
  .chat-kopf,.al-zeile,.chat-filter{padding-left:14px;padding-right:14px}
  .chat-weisung{margin-left:14px;margin-right:14px}
  .al-liste{padding-left:14px;padding-right:14px}
  #drawerHost .chat-body{margin:8px 10px 10px}
  .chat-body{padding:10px 10px 12px}
  .cn{max-width:94%}
  .ck-detail .d-card{max-height:52vh}
}

/* --- Etappe 4/5: Erledigt-/Freigabe-Flow, Senden ohne Reload --- */
.composer-cta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:0 22px}
.composer-cta > *{margin-top:10px}
.btn-gruen{background:#059669;border:1px solid #059669;color:#fff}
.btn-gruen:hover{background:#047857;border-color:#047857;color:#fff}
.btn-gruen:disabled{opacity:.6;cursor:default}
.cta-hinweis{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:#92400e;background:#fffbeb;border:1px solid #fde68a;border-radius:99px;padding:5px 12px;cursor:help}
.pp-kopf{display:flex;align-items:center;gap:7px;font-size:13px;font-weight:700;margin-bottom:6px}
.pp-kopf svg{color:var(--brand)}
.pp-text{font-size:12.5px;line-height:1.55;color:var(--text-muted)}
.pp-text b{color:var(--text)}
.pp-warn{display:flex;align-items:flex-start;gap:7px;margin-top:8px;padding:8px 11px;border:1px dashed #f59e0b;background:#fffbeb;border-radius:8px;font-size:12px;color:#92400e}
.pp-warn svg{flex-shrink:0;margin-top:1px;color:#b45309}
.sys-pill.sys-warn{background:var(--st-wait-bg);color:var(--st-wait-fg)}
.sys-pill.sys-fest{background:#f5f3ff;color:#6d28d9;border:1px solid #ddd6fe}
.kz-chip.kz-alt{color:var(--text-faint);border-style:dashed;text-decoration:line-through;text-decoration-color:rgba(15,23,42,.3)}
.fest-banner .fest-pdf{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:700;color:#6d28d9;border:1px solid #ddd6fe;background:#fff;border-radius:99px;padding:3px 10px;text-decoration:none;white-space:nowrap}
.fest-banner .fest-pdf:hover{background:#f5f3ff}
.esis-zeile{display:flex;align-items:center;gap:9px;margin:0 22px 14px;padding:10px 14px;border:1px solid var(--border);border-radius:10px;background:var(--bg-surface);font-size:12.5px;flex-wrap:wrap}
.esis-zeile > svg{color:var(--text-muted);flex-shrink:0}
.esis-zeile .hint{font-weight:400;color:var(--text-faint);font-size:11.5px}
@media(max-width:720px){.composer-cta{padding:0 14px}.esis-zeile{margin-left:14px;margin-right:14px}}

/* --- Feinschliff-Paket: Neue-Nachrichten-Chip, 1-Min-Editor, Vermerke --- */
.neu-chip{position:sticky;bottom:4px;align-self:center;border:none;background:var(--brand);color:#fff;font-size:12px;font-weight:700;padding:7px 15px;border-radius:99px;box-shadow:var(--shadow-lg);cursor:pointer;z-index:6;font-family:var(--font)}
.neu-chip:hover{filter:brightness(1.08)}
.cn-editor textarea{width:100%;min-height:42px;max-height:140px;resize:none;border:1px solid var(--brand);border-radius:9px;padding:8px 10px;font:inherit;font-size:13.5px;background:#fff}
.cn-editor .ce-row{display:flex;gap:6px;justify-content:flex-end;margin-top:6px}
.cn-time .bearb{cursor:help;text-decoration:underline dotted rgba(15,23,42,.35);text-underline-offset:2px}
.mm-hint{margin-left:auto;font-size:10px;font-weight:700;color:var(--text-faint);border:1px solid var(--border);border-radius:99px;padding:1px 6px}
.ce-hint{margin-right:auto;font-size:10.5px;color:var(--text-faint);align-self:center}
/* Frische-Hinweis der Listen-Seiten */
.frische-chip{position:fixed;bottom:22px;left:50%;transform:translate(-50%,8px);z-index:90;display:inline-flex;align-items:center;gap:6px;border:none;background:var(--brand);color:#fff;font:700 12.5px/1 var(--font);padding:10px 17px;border-radius:99px;box-shadow:var(--shadow-lg);cursor:pointer;opacity:0;transition:.25s}
.frische-chip.show{opacity:1;transform:translate(-50%,0)}
.frische-chip:hover{filter:brightness(1.08)}
/* Abgeleiteter Status-Zusatz: Prüfung ausstehend / festgeschrieben */
.st-zusatz{display:inline-flex;align-items:center;gap:4px;font-size:10.5px;font-weight:700;border-radius:99px;padding:2px 8px;vertical-align:middle;white-space:nowrap;cursor:help}
.st-zusatz svg{width:11px;height:11px}
.st-pruef{color:#92400e;background:#fffbeb;border:1px solid #fde68a}
.st-festmini{color:#6d28d9;background:#f5f3ff;border:1px solid #ddd6fe;padding:2px 6px}
/* Status-Picker am Kopf-Badge (ersetzt Foot-Chip + stPanel) */
.stwahl{position:relative;display:inline-flex}
.stwahl-btn{display:inline-flex;align-items:center;gap:3px;border:none;background:transparent;padding:0;cursor:pointer;border-radius:99px}
.stwahl-btn .stw-pfeil{width:13px;height:13px;color:var(--text-faint);opacity:.5;transition:.12s}
.stwahl-btn:hover .stw-pfeil{opacity:1;color:var(--text-muted)}
.stwahl-btn:hover{filter:brightness(.97)}
.stwahl-menu{position:absolute;top:calc(100% + 6px);left:0;z-index:40;background:var(--bg-surface);border:1px solid var(--border);border-radius:10px;box-shadow:var(--shadow-lg);padding:7px;min-width:250px}
.stw-kopf{font-size:10.5px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--text-faint);padding:3px 8px 7px}
.stw-kopf .hint{font-weight:500;letter-spacing:0;text-transform:none}
.stwahl-opt{display:flex;align-items:center;gap:8px;width:100%;text-align:left;border:none;background:transparent;border-radius:7px;padding:8px 9px;font-size:12.5px;font-weight:600;color:var(--text);cursor:pointer;font-family:var(--font)}
.stwahl-opt:hover{background:var(--bg-app)}
.stwahl-opt.sel{background:var(--brand-soft);color:var(--brand)}
.stw-dot{width:9px;height:9px;border-radius:99px;flex-shrink:0}
.stw-dot.stw-neu{background:var(--st-neu-fg,#2563eb)}
.stw-dot.stw-bear{background:var(--st-bear-fg,#7c3aed)}
.stw-dot.stw-wait{background:var(--st-wait-fg,#b45309)}
.stw-dot.stw-erl{background:var(--st-erl-fg,#059669)}

/* Chips-Zeile der Einsatzkarte (Abnahme 05.08.2026)
   .ein2-cfoot wird in Z. 2287 neu deklariert und verliert dabei das
   flex-wrap aus Z. 2125. Dadurch konkurriert die Chips-Spalte in einer
   nicht umbrechenden Zeile mit den Aktions-Buttons; da .ein2-chip auf
   white-space:nowrap steht, rutschte jeder Chip in eine eigene Zeile.
   Mit Umbruch am Elternelement plus Mindestbreite wandert stattdessen
   die ganze Chip-Reihe in eine eigene Zeile und bleibt nebeneinander.
   Nur ab 761px: darunter ist .ein2-cfoot bewusst eine Spalte, dort
   wuerde eine flex-basis als HOEHE wirken. */
@media(min-width:761px){
  .ein2-cfoot{flex-wrap:wrap;row-gap:10px;align-items:center;}
  .ein2-chips{flex:1 1 300px;}
  .ein2-cfoot-actions{flex-wrap:wrap;}
}

/* Deaktivierte Benutzerkonten (Administration → Benutzer) */
.ssv-member.ist-deaktiviert{opacity:.55}
.ssv-member.ist-deaktiviert .ssv-mem-ava{filter:grayscale(1)}
.deakt-badge{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:99px;font-size:11px;font-weight:600;background:var(--pr-hoch-bg);color:var(--pr-hoch-fg);border:1px solid var(--pr-hoch-bd);vertical-align:middle}

/* Sektion "Deaktivierte Benutzer" (Administration → Benutzer) */
.deakt-head{display:flex;align-items:center;gap:9px;width:100%;padding:10px 12px;background:transparent;border:0;border-radius:10px;cursor:pointer;text-align:left;font:inherit;color:var(--text)}
.deakt-head:hover{background:var(--bg-app)}
.deakt-caret{width:15px;height:15px;flex:0 0 auto;color:var(--text-faint);transition:transform .2s}
.deakt-caret.auf{transform:rotate(90deg)}
.deakt-titel{font-weight:600;font-size:14px}
.deakt-anz{padding:1px 8px;border-radius:99px;font-size:12px;font-weight:600;background:var(--bg-app);color:var(--text-muted);border:1px solid var(--border)}
.deakt-hint{margin-left:auto;font-size:12px;color:var(--text-faint)}
@media(max-width:700px){.deakt-hint{display:none}}

/* Standorte im Kontaktbuch: Bearbeiten-Stift pro Zeile */
.kb-so-zeile{position:relative}
.kb-so-edit{margin-left:auto;padding:4px;background:transparent;border:0;border-radius:6px;color:var(--text-faint);cursor:pointer;opacity:0;transition:opacity .15s ease,color .15s ease,background .15s ease}
.kb-so-zeile:hover .kb-so-edit,.kb-so-zeile:focus-within .kb-so-edit{opacity:1}
.kb-so-edit:hover{color:var(--brand);background:var(--brand-soft)}
.kb-so-edit:focus-visible{opacity:1;outline:2px solid var(--brand);outline-offset:1px}
/* Ohne Hover (Touch) dauerhaft sichtbar */
@media(hover:none){.kb-so-edit{opacity:.7}}

/* Standort bearbeiten: Formular in zwei Zeilen, Felder wie im Rest der App */
.kb-so-form{display:none;grid-template-columns:1.4fr 1fr 1.6fr;gap:12px;padding:14px 0;border-bottom:1px dashed var(--border)}
.kb-so-form[style*="display: grid"],.kb-so-form:not([style*="display: none"]){display:grid}
.kb-so-form .form-field{display:flex;flex-direction:column;gap:5px}
.kb-so-form-akt{grid-column:1/-1;display:flex;justify-content:flex-end;gap:8px;margin-top:2px}
@media(max-width:760px){.kb-so-form{grid-template-columns:1fr}}

/* Unterorganisationen-Schalter: gesperrt, solange keine Organisation gewählt.
   Der Zusatztext erscheint ausschliesslich im gesperrten Zustand. */
.rn-schalter-inaktiv{opacity:.5;cursor:not-allowed}
.rn-schalter-inaktiv .rn-track{cursor:not-allowed}
.rn-schalter-note{display:none}
.rn-schalter-inaktiv .rn-schalter-note{display:inline;font-size:11px;font-weight:400;font-style:italic;color:var(--text-faint);opacity:.65;margin-left:7px}

/* ===== Modal-Höhenkorrektur (06.08.2026) =====
   .modal trug margin:auto 0. In einem Flex-Container zentriert margin:auto
   auch bei align-items:flex-start — ist der Dialog höher als das Fenster,
   rutscht sein oberer Rand ins Negative und ist nicht mehr erreichbar
   (Browser scrollen nicht über den Anfang hinaus). Auf hohen Bildschirmen
   fällt das nicht auf, auf niedrigen bleibt nur die abgedunkelte Fläche.
   Die bestehende Korrektur greift erst bei schmalen, nicht bei niedrigen Fenstern. */
.modal-overlay{align-items:flex-start;padding:24px 20px}
.modal{margin:0 auto;max-height:calc(100dvh - 48px);display:flex;flex-direction:column;min-height:0}
/* Der innere <form>-Wrapper muss das Flex-Layout weiterreichen, sonst
   scrollt der Inhalt nicht. */
.modal>form{display:flex;flex-direction:column;min-height:0;overflow:hidden}
.modal>form>div:not(.na-head):not(.na-foot):not(.modal-head):not(.modal-foot){overflow-y:auto;min-height:0}
.modal-head,.na-head,.modal-foot,.na-foot{flex:0 0 auto}
.modal-body{max-height:none;flex:1 1 auto;min-height:0}
/* Sehr niedrige Fenster (Laptop im Querformat, geteilter Bildschirm) */
@media (max-height:700px){
  .modal-overlay{padding:12px}
  .modal{max-height:calc(100dvh - 24px)}
}

/* Archivieren-Formular ist nur Träger der DELETE-Route; der Knopf steht
   per form-Attribut in der Modal-Fußzeile. */
.rn-archivform{display:none}
.rn-archiv-btn{color:var(--text-muted)}
.rn-archiv-btn:hover{color:#b91c1c;background:var(--pr-hoch-bg)}

/* Hinweis auf der Einsatz-Detailseite: Lage einsehbar, aber nicht zugeteilt */
.ed-nichtzugeteilt{display:flex;gap:12px;align-items:flex-start;margin:14px 0 16px;padding:13px 16px;background:var(--pr-mittel-bg);border:1px solid var(--pr-mittel-bd);border-radius:12px;color:var(--pr-mittel-fg)}
.ed-nichtzugeteilt svg{width:19px;height:19px;flex:0 0 auto;margin-top:1px}
.ed-nichtzugeteilt b{display:block;font-size:14px;font-weight:700}
.ed-nichtzugeteilt span{display:block;margin-top:3px;font-size:13px;line-height:1.5;font-weight:400}

/* Kontaktbuch: Ressource verlinkt ins Ressourcennetzwerk */
.kb-reslink{color:var(--text);text-decoration:none;font-weight:600}
.kb-reslink:hover{color:var(--brand);text-decoration:underline}
/* Kategorie-Badge einzeilig: lief bisher ueber zwei Zeilen und sprengte
   die Zeilenhoehe. Voller Text bleibt ueber title erreichbar. */
.kb-kat{display:inline-block;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:bottom}
.rn-kat{display:inline-block;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:bottom}
/* Sprungziel kurz hervorheben */
.rn-hervor{outline:2px solid var(--brand);outline-offset:2px;border-radius:12px;transition:outline-color .4s ease}

/* ===== Ressourcen-Tabelle im Kontaktbuch (06.08.2026) =====
   Sie steht in der geteilten Ansicht und bekommt oberhalb 900px nur die halbe
   Fensterbreite. Sechs Spalten schnitten dort rechts ab, der vorhandene
   Umbruch bei 900px kam viel zu spaet. Karten ab 1600px Fensterbreite. */
@media (max-width:1600px){
  .kb-restab thead{display:none}
  .kb-restab,.kb-restab tbody,.kb-restab tr,.kb-restab td{display:block;width:100%;box-sizing:border-box}
  .kb-restab-wrap{overflow:visible}
  .kb-restab tbody{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:10px;padding:10px 0}
  .kb-restab tr{border:1px solid var(--border);border-radius:12px;background:#fff;box-shadow:var(--shadow-sm);padding:12px 14px}
  .kb-restab td{border:none;padding:3px 0;min-width:0}
  .kb-restab td:first-child{font-size:14.5px;font-weight:700;overflow-wrap:anywhere;padding-bottom:7px}
  .kb-restab td[data-label]{display:flex;gap:9px;align-items:baseline;font-size:13px}
  .kb-restab td[data-label]::before{content:attr(data-label);flex:0 0 96px;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--text-faint)}
  /* Leermeldung soll keine Karte werden */
  .kb-restab td[colspan]{display:block;border:1px solid var(--border);border-radius:12px;background:#fff}
  .kb-restab tr:has(td[colspan]){border:none;background:transparent;box-shadow:none;padding:0;grid-column:1/-1}
}
@media (max-width:620px){
  .kb-restab tbody{grid-template-columns:1fr}
  .kb-restab td[data-label]{display:grid;gap:1px}
  .kb-restab td[data-label]::before{flex:none}
}

/* Ressource steht bei einer anderen Organisation als der verantwortlichen */
.kb-fremdort{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:99px;font-size:11px;font-weight:600;background:var(--pr-niedrig-bg);color:var(--pr-niedrig-fg);border:1px solid var(--pr-niedrig-bd);max-width:170px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:bottom}
.kb-gastbestand .kb-h{color:var(--text-muted)}

/* Abnahme 11.08.2026: farbige Kürzel-Badges in ss-chips (opt-in via :farbig),
   Optik wie im Stäbe-Zuteilen-Modal — Hintergrund = stabsstellen.farbe */
.ss-kbadge{display:inline-flex;align-items:center;justify-content:center;font-size:10px;
  font-weight:800;letter-spacing:.02em;color:#fff;border-radius:5px;padding:2.5px 6px;
  line-height:1.1;flex-shrink:0;margin-right:3px}
.ss-kbadge+.ss-kbadge{margin-left:-1px}
.ss-chip .ss-kbadge:last-child{margin-right:0}
/* Abnahme 11.08.2026: Aufgabenliste — Zieh-Griff (kompakt) + Vollbild ohne Deckel */
.al-resize{display:flex;align-items:center;justify-content:center;height:14px;cursor:ns-resize;color:var(--text-faint);user-select:none;touch-action:none;border-bottom:1px dashed var(--border)}
.al-resize .grip{width:36px;height:4px;border-radius:999px;background:currentColor;opacity:.45}
.al-resize:hover .grip,.al-resize.dragging .grip{opacity:.9}
#drawer.sd-voll .al-liste{max-height:none!important;height:auto!important}
#drawer.sd-voll .al-resize{display:none!important}
/* Abnahme 11.08.2026: Drawer-Kopf leicht in Prioritätsfarbe statt Prio-Badge */
.drawer-head.dh-hoch{background:var(--pr-hoch-bg);border-bottom-color:var(--pr-hoch-bd);box-shadow:inset 0 3px 0 var(--pr-hoch-fg)}
.drawer-head.dh-mittel{background:var(--pr-mittel-bg);border-bottom-color:var(--pr-mittel-bd);box-shadow:inset 0 3px 0 var(--pr-mittel-fg)}
.drawer-head.dh-niedrig{background:var(--pr-niedrig-bg);border-bottom-color:var(--pr-niedrig-bd);box-shadow:inset 0 3px 0 var(--pr-niedrig-fg)}
/* Abnahme 11.08.2026: Grundinfo-Fußzeile — Zuständigkeit links, ESIS/ETB rechts */
.gi-fussrow{display:flex;align-items:flex-start;justify-content:space-between;gap:14px 28px;flex-wrap:wrap;padding-bottom:12px}
.gi-fussrow .gi-zust{flex:1 1 auto;min-width:240px}
.gi-fussrow .gi-ee{flex:0 0 auto;padding-top:22px}
@media(max-width:720px){.gi-fussrow .gi-ee{padding-top:0}}
.ck-detail .d-grid2{column-gap:28px}
/* Abnahme 11.08.2026: Antwort-/Zitat-Funktion im Auftrags-Chat */
.cn-zitat{display:block;width:100%;text-align:left;border:none;cursor:pointer;background:rgba(255,255,255,.6);border-left:3px solid rgba(15,23,42,.28);border-radius:6px;padding:5px 9px;margin-bottom:6px;font:inherit}
.cn-zitat:hover{background:rgba(255,255,255,.85)}
.cn-zitat .cz-wer{display:block;font-size:11px;font-weight:700;color:var(--text-muted)}
.cn-zitat .cz-txt{display:block;font-size:12px;color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.composer-reply{display:flex;align-items:center;gap:8px;margin-bottom:6px;padding:6px 10px;background:var(--bg-app);border:1px solid var(--border);border-left:3px solid var(--brand);border-radius:8px;font-size:12.5px;color:var(--text-muted)}
.composer-reply .cr-txt{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.composer-reply .cr-x{border:none;background:none;cursor:pointer;color:var(--text-faint);font-size:13px;line-height:1}
.composer-reply .cr-x:hover{color:var(--text)}


/* Abnahme 11.08.2026: Mini-Toggle Lesebestätigung — feste Maße (30x17), verzieht nichts */
.lb-toggle{display:inline-flex;align-items:center;gap:8px;cursor:pointer;user-select:none;font-size:12px;font-weight:600;color:var(--text-muted);white-space:nowrap;position:relative}
.lb-toggle input{position:absolute;opacity:0;width:0;height:0}
.lb-track{flex:none;width:30px;height:17px;border-radius:999px;background:var(--border);position:relative;transition:background .15s ease}
.lb-track::after{content:"";position:absolute;top:2px;left:2px;width:13px;height:13px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(15,23,42,.3);transition:left .15s ease}
.lb-toggle input:checked + .lb-track{background:var(--brand,#2563eb)}
.lb-toggle input:checked + .lb-track::after{left:15px}
.lb-toggle input:focus-visible + .lb-track{box-shadow:0 0 0 3px var(--brand-soft,rgba(37,99,235,.25))}

/* Abnahme 11.08.2026: Badge "Intern" — dezent (gestrichelt, slate), kein Farbalarm */
.badge-intern{display:inline-flex;align-items:center;margin-left:7px;padding:1px 7px;border-radius:6px;border:1px dashed var(--border-strong,#94a3b8);color:var(--text-muted,#64748b);background:transparent;font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;vertical-align:middle;line-height:1.6}


/* Abnahme 11.08.2026 (§Aufgabe 5): Art-Wahl im Neu-Modal als Segmented-Buttons */
.na-art{display:flex;gap:7px;flex-wrap:wrap}
.na-art-btn{flex:1;min-width:90px;border:1px solid var(--border);border-radius:9px;background:var(--bg-surface,#fff);padding:8px 10px;font-family:var(--font);font-size:12.5px;font-weight:700;color:var(--text-muted);cursor:pointer;transition:border-color .12s ease,color .12s ease,background .12s ease}
.na-art-btn:hover{border-color:var(--border-strong,#cbd5e1);color:var(--text)}
.na-art-btn.sel{border-color:var(--brand,#2563eb);color:var(--brand,#2563eb);background:var(--brand-soft,rgba(37,99,235,.08))}