/* Gesamtbild (Omar 15.10.2026): ruhige Farben im ganzen Programm, Navy als Hauptfarbe, Grün = erledigt, Orange = noch offen,
   Rot nur für Alarme und Dringendes. Wird als letzte Datei geladen. Gilt für Verwaltung, Partner-Zugang und Betreiber
   (nicht für die Mitarbeiter-App, die hat body.mobile). Aufbau der Seiten bleibt wie gewohnt. */
body:not(.mobile) {
  --bg: #f3f5f8; --surface: #ffffff; --surface-2: #f7f9fb; --border: #e2e7ee; --text: #1b2b3f; --muted: #67778b;
  --primary: #173f6e; --primary-2: #1f5c9e; --primary-soft: #eaf0f7; --accent: #9db352;
  --ok: #2f8a57; --ok-bg: #e4f3ea; --warn: #b4620a; --warn-bg: #fdf1df; --bad: #c23b3b; --bad-bg: #fbe9e9; --info-bg: #edf2f8;
  --done: #3a9a62; --open: #ee9330; --ring-bg: #e7ecf2;
  --shadow: 0 1px 2px rgba(16, 32, 56, .05);
  --c-blue: #173f6e; --c-blue-bg: #edf2f8; --c-violet: #173f6e; --c-violet-bg: #edf2f8; --c-teal: #173f6e; --c-teal-bg: #edf2f8;
  --c-amber: #173f6e; --c-amber-bg: #edf2f8; --c-green: #173f6e; --c-green-bg: #edf2f8; --c-rose: #173f6e; --c-rose-bg: #edf2f8;
}
body:not(.mobile) h1 { color: #14263d; font-size: 22px; }
body:not(.mobile) .card { box-shadow: var(--shadow); }
body:not(.mobile) th { background: #f4f6f9; color: #5b6b7f; }
body:not(.mobile) tr.clickable:hover td { background: #f1f5fa; }
body:not(.mobile) button, body:not(.mobile) .btn { border-color: #d9e1ea; background: #fff; color: #1d3f66; }
body:not(.mobile) button:hover, body:not(.mobile) .btn:hover { background: #f2f6fa; border-color: #c4d2e1; }
body:not(.mobile) button.primary, body:not(.mobile) .btn.primary { background: var(--primary); border-color: var(--primary); color: #fff; box-shadow: none; }
body:not(.mobile) button.primary:hover, body:not(.mobile) .btn.primary:hover { background: #10345d; }
body:not(.mobile) button.ok { background: var(--ok); border-color: var(--ok); color: #fff; }
body:not(.mobile) button.danger { background: #fff; }
body:not(.mobile) .pill { background: #eef2f6; color: #42566e; }
body:not(.mobile) .pill.ok { background: var(--ok-bg); color: var(--ok); } body:not(.mobile) .pill.warn { background: var(--warn-bg); color: var(--warn); }
body:not(.mobile) .pill.bad { background: var(--bad-bg); color: var(--bad); } body:not(.mobile) .pill.info { background: var(--info-bg); color: var(--primary); }
.btn.disabled { opacity: .45; pointer-events: none; }
button.linkish { border: 0; background: none !important; color: var(--primary-2) !important; padding: 0; font-size: 13px; font-weight: 500; }
button.linkish:hover { text-decoration: underline; }

/* Seitenleiste: ruhig, geöffneter Menüpunkt mit hellem Balken statt bunter Fläche */
body:not(.mobile) .sidebar:not(.branded) { background: #163b66; }
body:not(.mobile) .sidebar nav a > span:first-child { background: transparent; width: 26px; height: 26px; }
body:not(.mobile) .sidebar nav a { padding: 8px 10px; }
body:not(.mobile) .sidebar nav a.active { background: rgba(255, 255, 255, .13); box-shadow: inset 3px 0 0 var(--accent); }
body:not(.mobile) .sidebar:not(.branded) nav a.active > span:first-child { background: transparent; color: #fff; }
body:not(.mobile) .badge-count { background: var(--open); color: #fff; }

/* Reiter: Unterstrich statt Fläche */
body:not(.mobile) .tabs button { border-radius: 0; padding: 9px 4px; margin-right: 14px; color: #5f7186; background: none; border: 0; border-bottom: 2px solid transparent; }
body:not(.mobile) .tabs button:hover { background: none; color: var(--primary); }
body:not(.mobile) .tabs button.active { background: none; color: var(--primary); border-bottom-color: var(--primary); }

/* Brotkrumen über Seitentiteln (Akte, Besetzen) */
.crumbs { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--muted); margin-bottom: 8px; flex-wrap: wrap; }
.crumbs a { color: var(--muted); } .crumbs a:hover { color: var(--primary); }
.crumbs i { font-size: 12px; opacity: .6; }

/* ===================== Cockpit ===================== */
.dash-head { margin-bottom: 16px; }
.alarm-card { border-left: 4px solid var(--bad); }
.cp-stand { display: grid; grid-template-columns: minmax(250px, 320px) minmax(0, 1fr); gap: 22px; align-items: center; padding: 20px 22px; margin-bottom: 16px; }
.cp-big { display: flex; align-items: center; gap: 18px; }
.cp-big h2 { margin: 0 0 6px; font-size: 17px; }
.cp-split { display: flex; flex-direction: column; gap: 2px; font-weight: 600; font-size: 14px; }
.cp-legend { display: flex; gap: 14px; margin-top: 10px; font-size: 12px; color: var(--muted); }
.cp-legend .lg { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 5px; vertical-align: 0; }
.cp-legend .lg.done { background: var(--done); } .cp-legend .lg.open { background: var(--open); }
.cp-ok { color: var(--ok); } .cp-open { color: #c36a0b; }
.cp-rw { position: relative; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.cp-rw > b { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; color: var(--text); font-variant-numeric: tabular-nums; line-height: 1; font-weight: 700; }
.cp-rw > b .v { white-space: nowrap; font-size: 19px; display: inline-flex; align-items: baseline; }
.cp-rw > b .v small { font-size: 11px; font-weight: 600; margin-left: 1px; }
.cp-rw > b .lbl { font-size: 11px; font-weight: 600; color: var(--muted); margin-top: 5px; letter-spacing: .02em; }
.cp-rw.big > b .v { font-size: 30px; }
.cp-rw.big > b .v small { font-size: 15px; }
.ring circle { fill: none; } .ring .ring-bg { stroke: var(--ring-bg); } .ring .ring-done { stroke: var(--done); stroke-linecap: round; } .ring .ring-open { stroke: var(--open); stroke-linecap: round; }
.cp-rings { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.cp-ring { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--border); background: var(--surface-2); color: var(--text); text-align: left; font: inherit; cursor: default; }
a.cp-ring, button.cp-ring { cursor: pointer; } a.cp-ring:hover, button.cp-ring:hover { border-color: #c4d2e1; background: #fff; }
body:not(.mobile) button.cp-ring { background: var(--surface-2); border-color: var(--border); color: var(--text); padding: 10px 12px; }
.cp-rt { display: flex; flex-direction: column; gap: 2px; min-width: 0; font-size: 12px; color: var(--muted); }
.cp-rt strong { font-size: 13.5px; color: var(--text); }
.cp-rt .cp-open, .cp-rt .cp-ok { font-weight: 600; }
.cp-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr) minmax(0, 1fr); gap: 16px; margin-bottom: 22px; align-items: start; }
.cp-tile { padding: 16px 18px; scroll-margin-top: 16px; min-width: 0; }
.cp-tile > header { flex-wrap: wrap; }
.cp-tile > header { display: flex; align-items: baseline; gap: 10px; margin-bottom: 12px; }
.cp-tile > header h2 { margin: 0; font-size: 12px; text-transform: uppercase; letter-spacing: .07em; color: #4f6075; }
.cp-lv { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 10px; }
body:not(.mobile) .cp-lv button { gap: 7px; padding: 5px 10px; border-radius: 999px; font-size: 12.5px; background: var(--surface-2); color: var(--text); }
.cp-lv button b { font-variant-numeric: tabular-nums; }
.cp-lv button.zero { opacity: .55; }
.cp-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #b8c3cf; flex-shrink: 0; }
.lv-red .cp-dot { background: var(--bad); } .lv-orange .cp-dot { background: var(--open); } .lv-yellow .cp-dot { background: #c9cfd6; }
.cp-olist { display: flex; flex-direction: column; }
.cp-orow { display: flex; align-items: center; gap: 10px; padding: 9px 0; border-top: 1px solid var(--border); }
.cp-orow .grow { min-width: 0; } .cp-orow strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cp-miss { font-size: 12px; font-weight: 600; color: #c36a0b; white-space: nowrap; } .cp-orow.lv-red .cp-miss { color: var(--bad); }
.cp-until { font-size: 12px; color: var(--muted); white-space: nowrap; min-width: 66px; text-align: right; }
.cp-more { margin-top: 8px; }
.cp-allgood { display: flex; align-items: center; gap: 8px; color: var(--ok); font-weight: 600; padding: 8px 0; } .cp-allgood i { font-size: 20px; }
.cp-bill { display: flex; flex-direction: column; gap: 8px; }
.cp-bill a { display: flex; flex-direction: column; gap: 6px; padding: 10px 12px; border-radius: 10px; background: var(--surface-2); color: var(--text); border: 1px solid transparent; }
.cp-bill a:hover { border-color: var(--border); background: #fff; }
.cp-bill .m { font-weight: 600; } .cp-bill .m small { display: block; font-weight: 400; color: var(--muted); font-size: 12px; margin-top: 1px; }
.cp-bill .ps { display: flex; flex-wrap: wrap; gap: 6px; }
.cp-kv { display: grid; grid-template-columns: 1fr auto; gap: 6px 10px; font-size: 13px; color: var(--muted); padding: 6px 2px 0; }
.cp-kv b { color: var(--text); text-align: right; font-variant-numeric: tabular-nums; }
.cp-todo { display: flex; flex-direction: column; gap: 2px; }
.cp-todo a { display: flex; align-items: center; gap: 12px; padding: 9px 10px; border-radius: 9px; color: var(--text); }
.cp-todo a:hover { background: var(--surface-2); }
.cp-todo a > i:first-child { color: #5d6f85; font-size: 17px; }
.cp-todo .done { color: var(--ok); }
.cp-count { min-width: 22px; height: 22px; border-radius: 11px; background: var(--primary); color: #fff; font-size: 12px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; padding: 0 6px; }
/* Bereiche darunter: ohne bunte Flächen */
body:not(.mobile) .dash-sec { background: var(--surface-2); border-top: 1px solid var(--border); border-radius: 14px; }
body:not(.mobile) .dash-sec-ic { background: var(--primary-soft); color: var(--primary); box-shadow: none; width: 36px; height: 36px; font-size: 18px; }
body:not(.mobile) .dash-stat .v { color: var(--text); }
body:not(.mobile) .dash-stat.attn { background: #fff; border-color: var(--border); } body:not(.mobile) .dash-stat.attn .v { color: #c36a0b; }
body:not(.mobile) .dash-type { border-left: 1px solid var(--border); }
body:not(.mobile) .dash-type-ic { background: var(--primary-soft); color: var(--primary); }
body:not(.mobile) .dash-card-head > i { color: var(--primary); }
body:not(.mobile) .hub-icon, body:not(.mobile) .grid3 > .hub-tile .hub-icon { background: var(--primary-soft); color: var(--primary); }
@media (max-width: 1200px) { .cp-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .cp-bes { grid-column: 1 / -1; } }
@media (max-width: 900px) { .cp-stand { grid-template-columns: 1fr; } }
@media (max-width: 700px) { .cp-grid { grid-template-columns: minmax(0, 1fr); } .cp-rings { grid-template-columns: 1fr 1fr; } .cp-ring { flex-direction: column; text-align: center; align-items: center; } .cp-rt { align-items: center; } .cp-until { display: none; } }

/* ===================== Besetzen (Entwurf 5) ===================== */
.sb-bz { white-space: nowrap; }
.bz-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 16px; align-items: center; margin-bottom: 14px; }
.bz-head .crumbs { grid-column: 1 / -1; margin-bottom: 0; }
.bz-title { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.bz-title h1 { margin: 0; }
.bz-sub { grid-column: 1; font-size: 13px; }
.bz-tools { grid-column: 2; grid-row: 2 / span 2; display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.seg { display: inline-flex; border: 1px solid #d9e1ea; border-radius: 9px; padding: 2px; background: #fff; }
body:not(.mobile) .seg button { border: 0; padding: 6px 12px; border-radius: 7px; background: none; color: var(--muted); }
body:not(.mobile) .seg button.on { background: var(--primary-soft); color: var(--primary); font-weight: 600; }
.bz-cnt { font-size: 12px; font-weight: 700; padding: 2px 8px; border-radius: 999px; background: #eef2f6; color: #42566e; white-space: nowrap; font-variant-numeric: tabular-nums; }
.bz-cnt.ok { background: var(--ok-bg); color: var(--ok); } .bz-cnt.open { background: var(--warn-bg); color: #b4620a; }
.bz-cnt.big { font-size: 13px; padding: 3px 10px; }
.bz { display: grid; grid-template-columns: minmax(0, 1fr) 290px; gap: 14px; align-items: start; }
.bz-cols { display: flex; gap: 12px; overflow-x: auto; padding-bottom: 6px; align-items: flex-start; min-width: 0; }
.bz-col { flex: 0 0 236px; background: var(--surface-2); border: 1px solid var(--border); border-radius: 12px; padding: 10px; }
.bz-col > header { display: flex; align-items: center; gap: 8px; padding: 2px 4px 10px; }
.bz-col > header strong { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bz-colt { font-size: 12px; color: var(--muted); margin: -6px 4px 8px; }
.bz-list { display: flex; flex-direction: column; gap: 8px; }
.bz-card { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 10px; background: #fff; border: 1px solid var(--border); min-height: 52px; text-align: left; width: 100%; font: inherit; color: var(--text); }
.bz-card.asg[draggable="true"] { cursor: grab; }
.bz-card.ci { border-color: #bfe0cc; }
.bz-card.late { border-color: #f1c58f; }
.bz-av { width: 30px; height: 30px; border-radius: 50%; background: var(--primary-soft); color: var(--primary); font-size: 11px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.bz-nm { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.bz-nm strong { font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bz-nm small { font-size: 12px; color: var(--muted); overflow-wrap: anywhere; }
.bz-q { margin-top: 3px; }
.bz-conf { font-size: 15px; color: #9aa8b8; } .bz-conf.ok { color: var(--done); } .bz-conf.bad { color: var(--bad); }
body:not(.mobile) .bz-more { border: 0; background: none; padding: 2px 6px; color: #8796a8; font-size: 16px; line-height: 1; }
body:not(.mobile) .bz-more:hover { background: var(--surface-2); color: var(--text); }
body:not(.mobile) .bz-card.empty { border: 1.5px dashed #c7d2de; background: transparent; color: #7a8a9c; justify-content: flex-start; flex-wrap: wrap; cursor: pointer; padding: 9px 12px; }
body:not(.mobile) .bz-card.empty:hover { border-color: var(--primary-2); color: var(--primary); background: #fff; }
.bz-card.empty small { width: 100%; font-weight: 600; }
.bz-card.sub, .bz-card.locked { color: var(--muted); background: #f1f4f7; }
.bz-card.apply { border-style: dashed; border-color: #9fb9d6; flex-wrap: wrap; }
.bz-acts { display: flex; gap: 6px; width: 100%; padding-left: 40px; }
.bz-card.drag-over, .bz-card.empty.drag-over { border-color: var(--primary-2) !important; background: #eef4fb !important; box-shadow: 0 0 0 3px rgba(31, 92, 158, .15); }
body.is-dragging .bz-card.empty { border-color: #9fb9d6; }
body.bz-arming .bz-card.empty { border-color: var(--open); color: #b4620a; background: #fffaf2; }
.bz-col.side { flex-basis: 220px; }
.bz.past .bz-card.empty { cursor: pointer; }
.bz-av-panel { background: var(--surface); border: 1px solid var(--border); border-radius: 12px; padding: 12px; position: sticky; top: 12px; max-height: calc(100vh - 24px); display: flex; flex-direction: column; gap: 10px; }
.bz-av-panel header { display: flex; flex-direction: column; gap: 1px; }
.bz-avlist { overflow-y: auto; display: flex; flex-direction: column; gap: 6px; min-height: 60px; }
.bz-avsec { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); font-weight: 700; margin: 6px 2px 0; display: flex; gap: 6px; align-items: center; }
.bz-avsec span { font-weight: 600; }
body:not(.mobile) button.bz-avsec { border: 0; background: none; padding: 4px 2px; width: 100%; }
.bz-avsec em { font-style: normal; text-transform: none; letter-spacing: 0; margin-left: auto; color: var(--primary-2); font-weight: 500; }
.bz-ai { display: flex; align-items: flex-start; gap: 10px; padding: 8px 9px; border-radius: 10px; border: 1px solid var(--border); background: #fff; cursor: grab; }
.bz-ai:hover { border-color: #c4d2e1; }
.bz-ai.armed { border-color: var(--open); box-shadow: 0 0 0 3px rgba(238, 147, 48, .2); }
.bz-ai.hard { opacity: .6; }
.bz-hint { color: #b4620a !important; } .bz-hint.bad { color: var(--bad) !important; }
.bz-note { font-size: 12px; color: var(--muted); }
.pop-menu { position: absolute; z-index: 300; min-width: 220px; background: #fff; border: 1px solid var(--border); border-radius: 10px; box-shadow: 0 10px 28px rgba(16, 32, 56, .16); padding: 5px; display: flex; flex-direction: column; }
.pop-menu button, .pop-menu a { display: flex; align-items: center; gap: 10px; width: 100%; border: 0 !important; background: none !important; padding: 8px 10px !important; border-radius: 7px; color: var(--text) !important; font-size: 13px; text-align: left; justify-content: flex-start; }
.pop-menu button:hover, .pop-menu a:hover, .pop-menu button:focus { background: var(--surface-2) !important; outline: none; }
.pop-menu .danger { color: var(--bad) !important; }
.pop-menu i { color: #6c7d91; }
@media (max-width: 1100px) { .bz { grid-template-columns: 1fr; } .bz-av-panel { position: static; max-height: 420px; } }
@media (max-width: 760px) { .bz-head { grid-template-columns: 1fr; } .bz-tools { grid-column: 1; grid-row: auto; justify-content: flex-start; } .bz-col { flex-basis: 78vw; } }

/* ===================== Einstellungen (Entwurf 5) ===================== */
.set-top { display: flex; align-items: center; gap: 16px; margin-bottom: 14px; flex-wrap: wrap; }
.set-top h1 { margin: 0; flex: 1; }
.set-search { position: relative; width: min(320px, 100%); }
.set-search i { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); color: var(--muted); }
.set-search input { padding-left: 32px; background: #fff; }
.set-layout { display: grid; grid-template-columns: 240px minmax(0, 1fr); background: var(--surface); border: 1px solid var(--border); border-radius: 14px; min-height: calc(100vh - 140px); box-shadow: var(--shadow); }
.set-nav { border-right: 1px solid var(--border); padding: 12px 8px; display: flex; flex-direction: column; gap: 10px; }
.set-gl { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: #8090a3; padding: 4px 10px; }
.set-nav a { display: flex; align-items: center; gap: 10px; padding: 7px 10px; border-radius: 8px; color: #33465c; font-size: 13.5px; }
.set-nav a i { color: #7a8a9d; font-size: 15px; }
.set-nav a:hover { background: var(--surface-2); }
.set-nav a.active { background: var(--primary-soft); color: var(--primary); font-weight: 600; box-shadow: inset 3px 0 0 var(--primary); }
.set-nav a.active i { color: var(--primary); }
.set-none { padding: 6px 10px; }
@media (min-width: 861px) {
  .set-layout.slim { grid-template-columns: 60px minmax(0, 1fr); }
  .set-layout.slim .set-gl, .set-layout.slim .set-nav a > span, .set-layout.slim .set-none { display: none; }
  .set-layout.slim .set-nav { padding: 10px 6px; gap: 6px; }
  .set-layout.slim .set-grp + .set-grp { border-top: 1px solid var(--border); padding-top: 6px; }
  .set-layout.slim .set-nav a { justify-content: center; padding: 9px 0; }
  .set-layout.slim .set-nav a i { font-size: 17px; }
}
.card.tight.table-wrap { overflow-x: auto; }
.set-body { padding: 20px 24px; min-width: 0; }
.set-body > h1, .set-body > .row:first-child h1, .set-body h1 { font-size: 19px; }
.set-body .row:has(> a[href="#/system"]:only-child) { display: none; }
.set-body > .card, .set-body .card:not(.hub-tile):not(.kpi) { box-shadow: none; }
/* Abschnitte im Einstellungs-Inhalt ohne zweiten Rahmen: nur Trennlinien wie in Entwurf 5 */
.set-body > .card, .set-body > section.card { border: 0; border-top: 1px solid var(--border); border-radius: 0; background: transparent; padding: 18px 0; margin: 0; }
.set-body > h1 + .card, .set-body > h1 + section.card, .set-body > .muted + .card, .set-body > .muted + section.card { border-top: 0; padding-top: 8px; }
/* Ein/Aus-Haken in den Einstellungen als Schalter */
.set-body input[type=checkbox]:not(table *):not(.mc *) { -webkit-appearance: none; appearance: none; width: 36px; height: 20px; min-width: 36px; padding: 0; margin: 0 2px; border: 0; border-radius: 999px; background: #cdd6e1; position: relative; cursor: pointer; vertical-align: middle; transition: background .15s; outline-offset: 2px; }
.set-body input[type=checkbox]:not(table *):not(.mc *)::after { content: ''; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(15, 35, 60, .3); transition: transform .15s; }
.set-body input[type=checkbox]:not(table *):not(.mc *):checked { background: var(--primary); }
.set-body input[type=checkbox]:not(table *):not(.mc *):checked::after { transform: translateX(16px); }
.set-body input[type=checkbox]:not(table *):not(.mc *):disabled { opacity: .45; cursor: default; }
.set-body input[type=checkbox]:not(table *):not(.mc *):focus { outline: 3px solid #cfe0f7; }
input[type=color] { padding: 3px; height: 36px; min-width: 56px; cursor: pointer; }
@media (max-width: 860px) {
  .set-layout { grid-template-columns: 1fr; min-height: 0; }
  .set-nav { border-right: 0; border-bottom: 1px solid var(--border); flex-direction: row; overflow-x: auto; gap: 4px; padding: 8px; }
  .set-grp { display: contents; } .set-gl { display: none; }
  .set-nav a { white-space: nowrap; flex-shrink: 0; }
  .set-body { padding: 16px; }
}

/* ===================== Mitarbeiter-Akte (Entwurf 1) ===================== */
.ak-head { margin-bottom: 6px; }
.ak-id { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.ak-av { width: 54px; height: 54px; border-radius: 50%; background: var(--primary-soft); color: var(--primary); font-weight: 700; font-size: 18px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.ak-id h1 { margin: 0 0 4px; font-size: 24px; }
.ak-id .grow { min-width: 220px; }
.ak-meta { display: flex; flex-wrap: wrap; gap: 4px 18px; color: var(--muted); font-size: 13.5px; }
.ak-miss { color: #b4620a; font-weight: 600; }
.ak-actions { display: flex; gap: 8px; flex-wrap: wrap; }
body:not(.mobile) .ak-actions #akMore { padding: 8px 12px; font-size: 16px; line-height: 1; }
.ak-tabs { margin-top: 14px; flex-wrap: nowrap; overflow-x: auto; }
.ak-tabs button { white-space: nowrap; }
.ak-view { min-width: 0; }
.ak-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; align-items: start; }
.ak-card { background: var(--surface); border: 1px solid var(--border); border-radius: 12px; box-shadow: var(--shadow); min-width: 0; }
.ak-card.wide { grid-column: 1 / -1; }
.ak-card > header { display: flex; align-items: center; gap: 10px; padding: 13px 16px; border-bottom: 1px solid var(--border); }
.ak-card > header h3 { margin: 0; flex: 1; font-size: 14.5px; }
.ak-dl { display: grid; grid-template-columns: minmax(110px, 42%) minmax(0, 1fr); gap: 9px 12px; margin: 0; padding: 14px 16px; font-size: 13.5px; }
.ak-dl dt { color: var(--muted); } .ak-dl dd { margin: 0; overflow-wrap: anywhere; }
.ak-empty { padding: 14px 16px; }
.ak-proofs, .ak-shifts { list-style: none; margin: 0; padding: 4px 0; }
.ak-proofs li, .ak-shifts li { display: flex; align-items: center; gap: 10px; padding: 9px 16px; border-bottom: 1px solid var(--border); font-size: 13.5px; }
.ak-proofs li:last-child, .ak-shifts li:last-child { border-bottom: 0; }
.ak-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--done); flex-shrink: 0; }
.ak-dot.warn { background: var(--open); } .ak-dot.bad { background: var(--bad); }
.ak-st { font-size: 12.5px; color: var(--muted); white-space: nowrap; } .ak-st.warn { color: #b4620a; } .ak-st.bad { color: var(--bad); }
.ak-d { color: var(--muted); min-width: 74px; } .ak-t { color: var(--muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
.ak-all { margin: 4px 16px 12px; }
.ak-editbar { display: flex; align-items: center; gap: 8px; padding-bottom: 12px; margin-bottom: 12px; border-bottom: 1px solid var(--border); position: sticky; top: 0; background: var(--surface); z-index: 3; }
@media (max-width: 700px) { .ak-grid { grid-template-columns: 1fr; } .ak-actions { width: 100%; } }
#tabBody h3 { scroll-margin-top: 64px; }