/* myERP (Paket 1 von Clemens, 2026-10-11) — der Emergency Response Plan.
   Diese Datei steht für sich: myERP läuft als Bereich im Logbook UND als eigene kleine Seite /erp (public/erp.html),
   die ohne Netz aus dem Speicher des Geräts öffnet. Deshalb eigene Klassen (erp…) und für jede Farbe des Logbooks
   ein Wert, falls dessen Variablen fehlen. Die Ampelfarben und das Navy sind die der Vorgabe:
   Rot #EF4444, Amber #F59E0B, Grün #22C55E, Grau #F3F4F6, Navy #1C3557.
   Im Notfall gilt: groß, deutlich, mit Handschuhen zu treffen — Knöpfe mindestens 56 px hoch. */
/* :not(.suiteItem): der Knopf „myERP“ in der Leiste oben trägt dieselbe Klasse — er soll aussehen wie die anderen (Martin, 2026-10-12). */
.erp:not(.suiteItem) { --e-rot: #EF4444; --e-amber: #F59E0B; --e-gruen: #22C55E; --e-grau: #F3F4F6; --e-navy: #1C3557;
  --e-bg: var(--bg, #14181c); --e-panel: var(--panel-solid, #1b2126); --e-panel2: var(--panel-2, #212a31); --e-ink: var(--ink, #e7eaec); --e-dim: var(--ink-dim, #8b959c); --e-line: var(--line, #2b333a);
  color: var(--e-ink); font-size: 15px; line-height: 1.4; }
.erp:has(.erpDock) { padding-bottom: 150px; }
.erp .spacer { flex: 1 1 auto; }
.erp .dim { color: var(--e-dim); font-weight: 400; font-size: 13px; }
.erp .dim.alt { color: var(--e-amber); }
.erp .nv { color: var(--e-dim); font-style: italic; }
.erp a { color: inherit; }

/* Die eigene Seite /erp: ein schmaler Kopf und die vier Reiter quer. */
.erp.solo { max-width: 1100px; margin: 0 auto; padding-left: 12px; padding-right: 12px; }
.erpSoloKopf { display: flex; align-items: baseline; gap: 10px; padding: 12px 0 8px; }
.erpSoloKopf b { font-size: 22px; letter-spacing: .5px; }
.erpSoloKopf b span { color: #45bcd6; }
.erpSoloKopf .erpSub { color: var(--e-dim); font-size: 13px; }
.erpSoloKopf a { font-size: 13px; color: var(--e-dim); }
.erpNav { display: flex; flex-wrap: wrap; gap: 6px; border-bottom: 1px solid var(--e-line); padding-bottom: 8px; margin-bottom: 14px; }
.erpNav button { appearance: none; border: 1px solid var(--e-line); background: var(--e-panel); color: var(--e-ink); border-radius: 8px; padding: 10px 14px; font: inherit; font-weight: 600; cursor: pointer; }
.erpNav button.on { border-color: #45bcd6; color: #45bcd6; }
/* „Aktiver Vorfall“: der rote Punkt blinkt (bei einer Übung blau). */
.erp .erpPunkt { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: var(--e-rot); margin-right: 7px; animation: erpBlink 1s steps(2, start) infinite; }
.erp .erpNavAktiv.ueb .erpPunkt { background: #3b82f6; }
.erp button.erpNavAktiv { color: var(--e-rot); font-weight: 700; }
.erp button.erpNavAktiv.ueb { color: #60a5fa; }
@keyframes erpBlink { to { visibility: hidden; } }

/* Der Balken oben und der Hinweis „Offline“. */
.erpBalken { position: sticky; top: var(--suite-h, 0px); z-index: 60; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 10px 14px; margin: 0 0 10px; border-radius: 8px; color: #fff; font-weight: 800; letter-spacing: .3px; }
.erpBalken.echt { background: var(--e-rot); }
.erpBalken.ueb { background: var(--e-navy); border: 2px solid #3b82f6; }
.erpBalken button { appearance: none; background: none; border: 0; color: inherit; font: inherit; font-size: 16px; text-align: left; cursor: pointer; padding: 0; flex: 1 1 auto; }
.erpBalken .erpSeit { font-variant-numeric: tabular-nums; font-size: 16px; }
.erpBalken select { font: inherit; font-weight: 600; border-radius: 6px; padding: 4px 6px; max-width: 46vw; }
.erpNetz { background: var(--e-amber); color: #1f1400; font-weight: 700; padding: 8px 14px; border-radius: 8px; margin: 0 0 10px; }
.erpNetz.sync { background: var(--e-panel2); color: var(--e-dim); font-weight: 500; }
.erpSag { position: fixed; left: 50%; transform: translateX(-50%); bottom: 160px; z-index: 210; max-width: min(92vw, 560px); padding: 10px 16px; border-radius: 8px; background: #7f1d1d; color: #fff; font-weight: 600; display: none; box-shadow: 0 6px 24px rgba(0, 0, 0, .4); }
.erpSag.da { display: block; }
.erpSag.ok { background: #14532d; }

/* Knöpfe. */
.erpBtn { appearance: none; display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px; padding: 8px 14px; border-radius: 8px; border: 1px solid var(--e-line); background: var(--e-panel2); color: var(--e-ink);
  font: inherit; font-weight: 600; text-decoration: none; cursor: pointer; }
.erpBtn:disabled { opacity: .4; cursor: default; }
.erpBtn.klein { min-height: 34px; padding: 4px 10px; font-size: 13px; }
.erpBtn.gross { min-height: 56px; padding: 12px 22px; font-size: 18px; }
.erpBtn.riesig { min-height: 96px; padding: 20px 28px; font-size: 26px; letter-spacing: 1px; width: 100%; box-shadow: 0 4px 0 #991b1b; }
.erpBtn.rot { background: var(--e-rot); border-color: var(--e-rot); color: #fff; }
.erpBtn.navy { background: var(--e-navy); border-color: #33558a; color: #fff; }
.erpBtn.gruen { background: #166534; border-color: var(--e-gruen); color: #fff; }
.erpBtn.gruen.on { background: var(--e-gruen); color: #052e16; }
.erpBtn.amber { background: #78350f; border-color: var(--e-amber); color: #fff; }
.erpBtn.amber.on { background: var(--e-amber); color: #1f1400; }
.erpBtn.grau { background: transparent; color: var(--e-dim); }
.erpBtn.dunkel { background: #111; color: #fff; }
.erpBtn.tel { background: #0f3d63; border-color: #2a6aa3; color: #fff; }
.erpBtn.on { outline: 2px solid currentColor; }

.erpPanel { background: var(--e-panel); border: 1px solid var(--e-line); border-radius: 10px; padding: 14px 16px; margin: 0 0 14px; }
.erpPanel h3 { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 10px; font-size: 15px; text-transform: uppercase; letter-spacing: .6px; }
.erpPanel h3.zwei { margin-top: 18px; padding-top: 12px; border-top: 1px solid var(--e-line); }
.erpPanel h3 .dim { text-transform: none; letter-spacing: 0; }
.erpHint { color: var(--e-dim); font-size: 13px; margin: 6px 0; }
.erpHint.err, .erpMsg.err { color: #fca5a5; }
.erpMsg { min-height: 1em; margin: 6px 0; font-weight: 600; }
.erpMsg.ok { color: #86efac; }
.erpWarnBox { border: 2px solid var(--e-amber); background: rgba(245, 158, 11, .12); border-radius: 10px; padding: 12px 16px; margin: 0 0 14px; font-weight: 600; }
.erpWarnBox.rot { border-color: var(--e-rot); background: rgba(239, 68, 68, .14); line-height: 1.8; }
.erpOk { color: var(--e-gruen); font-weight: 700; margin-left: 10px; }

/* Dashboard. */
.erpStart { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 1fr); gap: 14px; align-items: stretch; margin: 0 0 16px; }
.erpStart .erpBtn.navy { font-size: 15px; }
@media (max-width: 640px) { .erpStart { grid-template-columns: 1fr; } }
.erpZeile { appearance: none; display: flex; flex-wrap: wrap; gap: 4px 14px; align-items: baseline; width: 100%; text-align: left; padding: 10px 12px; margin: 0 0 6px; border-radius: 8px; border: 1px solid var(--e-line); background: var(--e-panel2); color: var(--e-ink); font: inherit; cursor: pointer; }
.erpZeile.echt { border-left: 6px solid var(--e-rot); }
.erpZeile.ueb { border-left: 6px solid #3b82f6; }
.erpZeile.warn { border-left: 6px solid var(--e-amber); justify-content: space-between; }
.erpKat { border-top: 1px solid var(--e-line); padding: 8px 0; }
.erpKat > summary { cursor: pointer; font-weight: 700; padding: 6px 0; }
.erpKat.person > summary { font-size: 17px; }
.erpKontakt { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; justify-content: space-between; padding: 8px 0; border-top: 1px dashed var(--e-line); }
.erpKontakt > div { display: flex; flex-direction: column; min-width: 0; flex: 1 1 220px; }
.erpKontakt.nok { border-top: 2px solid var(--e-amber); margin-top: 8px; }

/* Fenster: Rückfragen, die Auswahl des Vorfallstyps, die Kurzerfassung. */
.erpUeber { position: fixed; inset: 0; z-index: 200; background: rgba(0, 0, 0, .72); display: flex; align-items: flex-start; justify-content: center; overflow: auto; padding: 4vh 12px; }
.erpUeber.voll { background: var(--e-bg, #14181c); padding: 0; }
.erpBlatt { background: var(--e-panel); border: 1px solid var(--e-line); border-radius: 12px; padding: 18px; width: min(680px, 100%); }
.erpUeber.voll .erpBlatt { width: min(1000px, 100%); border: 0; border-radius: 0; background: transparent; min-height: 100vh; padding: 16px; box-sizing: border-box; }
.erpWahlKopf { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 14px; }
.erpWahlKopf h2 { margin: 0; font-size: 22px; }
.erpWahl.ueb .erpWahlKopf { border-left: 8px solid #3b82f6; padding-left: 12px; }
.erpTypen { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.erpTyp { appearance: none; display: grid; grid-template-columns: auto 1fr; gap: 2px 12px; align-items: center; text-align: left; min-height: 96px; padding: 14px 16px; border-radius: 12px; border: 0; font: inherit; cursor: pointer; color: #fff; }
.erpTyp .ic { grid-row: 1 / span 2; font-size: 34px; line-height: 1; }
.erpTyp .nm { font-size: 20px; font-weight: 800; letter-spacing: .4px; }
.erpTyp .zl { font-size: 13px; opacity: .92; }
.erpTyp.f-rot, .erpTypMarke.f-rot { background: var(--e-rot); color: #fff; }
.erpTyp.f-amber, .erpTypMarke.f-amber { background: var(--e-amber); color: #1f1400; }
.erpTyp.f-grau, .erpTypMarke.f-grau { background: var(--e-grau); color: #111827; }
.erpTyp.unter { display: block; min-height: 72px; font-size: 20px; font-weight: 700; }
.erpUnter { display: grid; gap: 12px; }
.erpTypMarke { display: inline-block; padding: 3px 10px; border-radius: 6px; font-weight: 800; }
@media (max-width: 420px) { .erpTyp { min-height: 88px; padding: 10px; } .erpTyp .nm { font-size: 18px; } .erpTyp .ic { font-size: 26px; } }
.erpFrage h2 { font-size: 26px; margin: 8vh 0 18px; }
.erpBlatt .erpFrage h2, .erpKarteF h2 { margin-top: 0; }
.erpUeber.voll .erpFrage { max-width: 640px; margin: 0 auto; border: 3px solid var(--e-line); border-radius: 14px; padding: 22px; margin-top: 8vh; background: var(--e-panel); }
.erpUeber.voll .erpFrage h2 { margin-top: 0; }
.erpFrageText { font-size: 17px; }
.erpFrageKn { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between; margin-top: 20px; }
.erpFrageKn.links { justify-content: flex-start; }
.erpUebHinweis { color: #93c5fd; font-weight: 600; }
.erpBest { border-collapse: collapse; font-size: 16px; }
.erpBest.breit { width: 100%; font-size: 15px; }
.erpBest th { text-align: left; vertical-align: top; padding: 5px 14px 5px 0; color: var(--e-dim); font-weight: 600; white-space: nowrap; }
.erpBest td { padding: 5px 0; }
.erpBest.breit th { width: 32%; white-space: normal; }
.erpBest.breit tr + tr th, .erpBest.breit tr + tr td { border-top: 1px solid var(--e-line); }

/* Formulare. */
.erpForm h3 { margin-top: 0; }
.erpFeld { display: flex; flex-direction: column; gap: 5px; margin: 0 0 12px; font-weight: 600; flex: 1 1 220px; min-width: 0; }
.erpFeld.schmal { flex: 0 1 190px; }
.erpFeld.breit { flex: 2 1 320px; }
.erpFeld > span { font-size: 16px; }
.erpFeld small { font-weight: 400; color: var(--e-dim); }
.erp input:not([type="checkbox"]):not([type="radio"]), .erp select, .erp textarea { font: inherit; color: var(--e-ink); background: var(--e-bg); border: 1px solid var(--e-line); border-radius: 8px; padding: 10px 12px; min-height: 44px; box-sizing: border-box; width: 100%; }
.erp textarea { min-height: 70px; resize: vertical; }
/* Eine Auswahl so hoch wie das Eingabefeld (Prüfung 2026-10-18): ohne Systemaussehen gilt der Innenabstand, der Pfeil kommt als Bild. */
.erp select:not([multiple]) { -webkit-appearance: none; appearance: none; padding-right: 34px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23aaa'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; }
.erp input[type="checkbox"], .erp input[type="radio"] { width: 20px; height: 20px; accent-color: #45bcd6; }
.erpReihe { display: flex; gap: 8px; align-items: stretch; }
/* „wrap“ heißt auch der Seitenrahmen des Logbooks (.wrap in index.html) — sein Rand und seine Breite gelten hier nicht. */
.erpReihe.wrap { flex-wrap: wrap; align-items: flex-end; gap: 8px 12px; max-width: none; margin: 0; padding: 0; }
.erpReihe.wrap > .erpBtn { margin-bottom: 12px; }
.erpReihe.ed { border-top: 1px dashed var(--e-line); padding-top: 10px; }
.erpReihe > input, .erpReihe > select { flex: 1 1 200px; }
.erpReihe.zahl > input { text-align: center; font-size: 20px; font-weight: 700; }
.erpReihe.zahl > .erpBtn { min-width: 56px; font-size: 24px; color: var(--e-ink); }
.erpFeld > .erpReihe { margin-bottom: 6px; flex-wrap: wrap; }
.erpChips { display: flex; flex-wrap: wrap; gap: 8px 14px; }
.erpChip { appearance: none; min-height: 56px; padding: 10px 18px; border-radius: 10px; border: 2px solid var(--e-line); background: var(--e-panel2); color: var(--e-ink); font: inherit; font-size: 17px; font-weight: 700; cursor: pointer; flex: 1 1 120px; }
.erpChip.on { background: var(--e-navy); border-color: #60a5fa; color: #fff; }
.erpKreuz { display: inline-flex; align-items: center; gap: 8px; font-weight: 500; margin: 4px 0; }
.erpEd { border: 1px solid var(--e-line); border-radius: 10px; padding: 12px; margin: 0 0 12px; }
.erpEd.f-rot { border-left: 6px solid var(--e-rot); }
.erpEd.f-amber { border-left: 6px solid var(--e-amber); }
.erpEd.f-grau { border-left: 6px solid #9ca3af; }
.erpPunktEd { display: flex; gap: 6px; align-items: center; margin: 0 0 6px; }
.erpPunktEd .nr { width: 22px; text-align: right; color: var(--e-dim); }
.erpWahlListe { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 4px 12px; margin: 8px 0 12px; }
.erpWahlListe label { display: flex; align-items: center; gap: 8px; }

/* Der aktive Vorfall. */
.erpKopf { display: flex; flex-wrap: wrap; gap: 10px 16px; justify-content: space-between; align-items: flex-start; padding: 12px 16px; margin: 0 0 12px; border-radius: 10px; background: var(--e-panel); border: 1px solid var(--e-line); border-left: 8px solid var(--e-rot); }
.erpKopf.ueb { border-left-color: #3b82f6; }
.erpKopf.archiv { border-left-color: var(--e-dim); }
.erpKopf .nr { font-size: 22px; font-weight: 800; }
.erpKopf .ty { font-size: 17px; font-weight: 600; }
.erpKopfR { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
.erpUebMarke { background: #3b82f6; color: #fff; font-size: 12px; padding: 2px 8px; border-radius: 5px; vertical-align: middle; }
.erpSubs { display: flex; gap: 6px; overflow-x: auto; padding: 2px 0 10px; margin: 0 0 6px; -webkit-overflow-scrolling: touch; }
.erpSubs.cfg { flex-wrap: wrap; overflow: visible; }
.erpSubs button { appearance: none; flex: 0 0 auto; min-height: 44px; padding: 8px 14px; border-radius: 22px; border: 1px solid var(--e-line); background: var(--e-panel); color: var(--e-ink); font: inherit; font-weight: 600; cursor: pointer; white-space: nowrap; }
.erpSubs button.on { background: var(--e-ink); color: var(--e-bg); }
.erpZahl { display: inline-block; min-width: 20px; padding: 0 5px; border-radius: 10px; background: var(--e-rot); color: #fff; font-style: normal; font-size: 12px; text-align: center; }

/* Alarmierung: je Person eine Kachel — grau (noch nicht kontaktiert), grün (erreicht), amber (nicht erreicht). */
.erpKacheln { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; }
.erpKachelPaar { display: flex; flex-direction: column; gap: 6px; }
.erpKachel { border-radius: 12px; padding: 12px; border: 2px solid transparent; }
.erpKachel.f-grau { background: var(--e-grau); color: #111827; border-color: #d1d5db; }
.erpKachel.f-gruen { background: #dcfce7; color: #052e16; border-color: var(--e-gruen); }
.erpKachel.f-amber { background: #fef3c7; color: #451a03; border-color: var(--e-amber); }
.erpKachel .kWarn { font-weight: 700; margin-bottom: 6px; }
.erpKachel .kRolle b { font-size: 20px; }
.erpKachel .kRolle span { font-size: 13px; opacity: .8; }
.erpKachel .kName { font-size: 19px; font-weight: 700; margin: 2px 0 8px; }
.erpKachel .kAkt { display: flex; flex-wrap: wrap; gap: 6px; }
.erpKachel .kAkt .erpBtn { min-height: 56px; flex: 1 1 auto; }
.erpKachel .kAkt .erpBtn.tel { flex: 1 1 100%; font-size: 19px; }
.erpKachel .kAkt .dim, .erpKachel .dim { color: #4b5563; }
.erpKachel .kLog { font-size: 12.5px; margin-top: 8px; opacity: .85; }
.erpKachel .kEsk { display: flex; flex-wrap: wrap; gap: 6px; align-items: flex-end; margin-top: 8px; }
.erpKachel .kEsk label { flex: 1 1 180px; font-weight: 700; }
.erpKachel input:not([type="checkbox"]) { background: #fff; color: #111; border-color: #9ca3af; }
.erpKachel .erpBtn.klein { background: #fff; color: #111; }

/* Checkliste. */
.erpPhasen { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0 0 12px; }
.erpPhasen button { appearance: none; text-align: left; padding: 10px 12px; border-radius: 10px; border: 2px solid var(--e-line); background: var(--e-panel2); color: var(--e-ink); font: inherit; cursor: pointer; }
.erpPhasen button small { display: block; color: var(--e-dim); font-size: 12px; }
.erpPhasen button.jetzt { border-color: var(--e-rot); }
.erpPhasen button.on { background: var(--e-navy); color: #fff; }
.erpPhasen button.on small { color: #cbd5e1; }
.erpPhasen button.spaeter { opacity: .7; }
@media (max-width: 560px) { .erpPhasen { grid-template-columns: 1fr; } }
.erpListe { display: flex; flex-direction: column; gap: 8px; margin: 0 0 14px; }
.erpPunkt2 { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 12px; align-items: start; padding: 10px; border-radius: 10px; border: 1px solid var(--e-line); background: var(--e-panel2); }
.erpPunkt2 .hk { appearance: none; width: 56px; height: 56px; border-radius: 10px; border: 3px solid var(--e-dim); background: transparent; color: #fff; font-size: 30px; font-weight: 800; line-height: 1; cursor: pointer; }
.erpPunkt2.s-erledigt { border-color: var(--e-gruen); }
.erpPunkt2.s-erledigt .hk { background: var(--e-gruen); border-color: var(--e-gruen); color: #052e16; }
.erpPunkt2.s-uebersprungen .hk { background: var(--e-amber); border-color: var(--e-amber); color: #1f1400; }
.erpPunkt2.s-uebersprungen { border-color: var(--e-amber); }
.erpPunkt2 .tx { font-size: 16.5px; font-weight: 600; }
.erpPunkt2 .meta { font-size: 12.5px; font-weight: 400; color: var(--e-dim); margin-top: 3px; }
.erpPunkt2.s-erledigt .meta { color: #86efac; }
.erpPunkt2.s-uebersprungen .meta { color: #fcd34d; }
.erpPunkt2 .meta.km { color: var(--e-ink); }
.erpPunkt2 .kn { display: flex; flex-direction: column; gap: 4px; align-items: stretch; }
.erpInline { display: flex; gap: 6px; margin-top: 8px; }
.erpInline[hidden] { display: none; }
@media (max-width: 560px) { .erpPunkt2 { grid-template-columns: auto minmax(0, 1fr); } .erpPunkt2 .kn { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; } }

/* Der untere Rand: Meldefristen und das Feld für den Ereignislog — immer sichtbar. */
.erpDock { position: fixed; left: 0; right: 0; bottom: 0; z-index: 70; background: var(--e-bg); border-top: 2px solid var(--e-line); padding: 8px 12px calc(8px + env(safe-area-inset-bottom)); box-shadow: 0 -6px 20px rgba(0, 0, 0, .35); }
.erpFristen { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 8px; }
.erpFrist { appearance: none; flex: 0 0 auto; display: flex; flex-direction: column; align-items: flex-start; min-width: 150px; padding: 6px 12px; border-radius: 8px; border: 2px solid var(--e-line); background: var(--e-panel2); color: var(--e-ink); font: inherit; cursor: pointer; }
.erpFrist .fn { font-size: 11.5px; color: var(--e-dim); max-width: 220px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.erpFrist b { font-size: 18px; font-variant-numeric: tabular-nums; }
.erpFrist.f-rot { background: var(--e-rot); border-color: var(--e-rot); color: #fff; }
.erpFrist.f-rot .fn { color: #fff; }
.erpFrist.f-amber { background: var(--e-amber); border-color: var(--e-amber); color: #1f1400; }
.erpFrist.f-amber .fn { color: #1f1400; }
.erpFrist.f-gruen { border-color: var(--e-gruen); color: var(--e-gruen); }
.erpFristText.f-rot { color: var(--e-rot); } .erpFristText.f-amber { color: var(--e-amber); } .erpFristText.f-gruen { color: var(--e-gruen); }
.erpEintrag { display: flex; gap: 8px; }
.erpEintrag input { flex: 1 1 auto; }

/* Ereignislog: automatische Einträge grau und kursiv, manuelle hell. */
.erpLog { display: flex; flex-direction: column; gap: 3px; }
.erpLogZ { display: grid; grid-template-columns: 96px 150px minmax(0, 1fr); gap: 10px; padding: 7px 10px; border-radius: 6px; background: #fff; color: #111827; }
.erpLogZ.auto { background: #e5e7eb; color: #374151; font-style: italic; }
.erpLogZ .zt { font-variant-numeric: tabular-nums; font-style: normal; font-weight: 600; }
.erpLogZ .wr { font-style: normal; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.erpLogZ .sp { font-size: 11.5px; color: #92400e; margin-left: 6px; }
@media (max-width: 560px) { .erpLogZ { grid-template-columns: 96px minmax(0, 1fr); } .erpLogZ .tx { grid-column: 1 / -1; } }

/* Karte. */
.erpKarteBox { position: relative; border-radius: 10px; overflow: hidden; border: 1px solid var(--e-line); margin: 0 0 10px; }
#erpKarte { display: block; width: 100%; height: min(60vh, 440px); touch-action: none; cursor: grab; background: #dfe3e6; }
.erpKarteKn { position: absolute; top: 10px; right: 10px; display: flex; flex-direction: column; gap: 6px; }
.erpKarteKn .erpBtn { min-width: 48px; font-size: 22px; background: #fff; color: #111; border-color: #9ca3af; }
.erpWetter, .erpStatement { white-space: pre-wrap; font: inherit; margin: 0; }
.erpWetter { font-family: ui-monospace, Menlo, monospace; font-size: 13.5px; }
.erpStatement { background: #fff; color: #111827; padding: 14px 16px; border-radius: 8px; font-size: 16px; line-height: 1.55; }

/* Tabellen (Archiv, Matrix, Besatzung). */
.erpScroll { overflow-x: auto; }
.erpTab { width: 100%; border-collapse: collapse; font-size: 14px; }
.erpTab th { text-align: left; font-size: 12px; text-transform: uppercase; letter-spacing: .5px; color: var(--e-dim); padding: 6px 10px; border-bottom: 1px solid var(--e-line); white-space: nowrap; }
.erpTab td { padding: 8px 10px; border-bottom: 1px solid var(--e-line); vertical-align: top; }
.erpTab tbody tr[data-auf], .erpTab tbody tr[data-person] { cursor: pointer; }
.erpTab tbody tr[data-auf]:hover, .erpTab tbody tr[data-person]:hover, .erpTab tr.on { background: var(--e-panel2); }
.erpTab.matrix th, .erpTab.matrix td { text-align: center; }
.erpTab.matrix th:first-child, .erpTab.matrix td:first-child { text-align: left; }
.erpTab.ca td { min-width: 110px; }
.erpTab.ca td:first-child { min-width: 240px; }
.erpTab .st-erreicht { color: var(--e-gruen); font-weight: 700; }
.erpTab .st-nicht { color: var(--e-amber); font-weight: 700; }

/* --- Zwei Stufen (Clemens, 2026-10-11): der Voralarm ist orange, bis die Leitstelle ihn bestätigt ------------------- */
.erpBalken.vor { background: var(--e-amber); color: #1f1400; }
.erp button.erpNavAktiv.vor { color: var(--e-amber); }
.erp .erpNavAktiv.vor .erpPunkt { background: var(--e-amber); }
.erpKopf.vor { border-left-color: var(--e-amber); }
.erpStart.allein { grid-template-columns: 1fr; }
.erpStartNeben { display: flex; flex-direction: column; gap: 10px; }
.erpStartNeben .erpBtn { flex: 1 1 auto; min-height: 43px; font-size: 14px; }
.erpStartHinweis { margin: -6px 0 16px; }
.erpVor h3 { font-size: 18px; text-transform: none; letter-spacing: 0; }
.erpVorSpaet { background: var(--e-amber); color: #1f1400; font-weight: 700; padding: 10px 14px; border-radius: 8px; margin: 0 0 12px; animation: erpPuls 1.6s ease-in-out infinite; }
@keyframes erpPuls { 50% { opacity: .55; } }
.erpKacheln.eine { grid-template-columns: minmax(0, 520px); margin-bottom: 10px; }
.erpVorKn { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 12px; margin-top: 14px; }
.erpVorKn .erpBtn.riesig { min-height: 80px; font-size: 22px; }
@media (max-width: 560px) { .erpVorKn { grid-template-columns: 1fr; } }
.erpFehlMarke { background: #6b7280; color: #fff; font-size: 12px; padding: 2px 8px; border-radius: 5px; vertical-align: middle; font-weight: 600; }
.erpKreuz.gross { font-size: 17px; font-weight: 600; margin-top: 10px; }

/* --- Kontext A: die Vorfallsauswahl — große farbige Knöpfe nach der Ampel, klare Schrift, kein Symbol ---------------- */
.erpTyp { grid-template-columns: 1fr; }
.erpTyp .nm { font-size: 22px; }
.erpTyp .zl { font-size: 14px; }

/* --- Kontext B: der Sofortleitfaden für Nutzer außerhalb des ERT ---------------------------------------------------
   Eine eigene, ruhige Sprache — und nie mit Kontext A vermischt: weißer Grund, viel Luft, nummerierte Schritte.
   Farbe gibt es nur zweimal: die Überschrift navy, „NICHTS VERÄNDERN“ rot. Die Anrufknöpfe navy, über die ganze
   Breite, mindestens 56 px hoch. Kein Symbol, nichts blinkt: der Leitfaden soll beruhigen, nicht alarmieren. */
.erpUeber.voll.guide { background: #fff; }
.erpUeber.voll.guide .erpBlatt { background: #fff; color: #1f2937; width: min(640px, 100%); padding: 28px 22px 40px; }
.erpGuide h2 { color: #1C3557; font-size: 29px; font-weight: 800; letter-spacing: .5px; margin: 6px 0 6px; }
.erpGuideLage { color: #6b7280; font-size: 15px; margin: 0 0 22px; }
.erpGuide ol { list-style: none; counter-reset: schritt; margin: 0; padding: 0; }
.erpGuide li { counter-increment: schritt; position: relative; padding: 0 0 26px 44px; font-size: 24px; line-height: 1.5; color: #1f2937; }
.erpGuide li::before { content: counter(schritt) "."; position: absolute; left: 0; top: 0; font-weight: 700; color: #1f2937; }
.erpGuide li p { font-size: 18px; margin: 6px 0 10px; color: #4b5563; }
.erpGuideRufe { display: flex; flex-direction: column; gap: 10px; margin-top: 12px; }
.erpGuideRuf { appearance: none; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; min-height: 56px; padding: 10px 16px; box-sizing: border-box; border: 0; border-radius: 8px;
  background: #1C3557; color: #fff; font: inherit; font-size: 24px; text-decoration: none; cursor: pointer; }
/* (.erp a erbt sonst die Schriftfarbe des Schritts: dunkel auf navy.) */
.erp a.erpGuideRuf, .erp button.erpGuideRuf { color: #fff; }
.erpGuideRuf b { font-weight: 700; }
.erpGuideRuf span { font-size: 14px; color: #cbd5e1; font-weight: 400; }
.erpGuideFehlt { color: #4b5563; font-size: 17px; border: 1px solid #d1d5db; border-radius: 8px; padding: 12px 14px; }
.erpGuideRot { color: #EF4444; }
.erpGuideWeiter { appearance: none; display: block; margin: 18px auto 0; background: none; border: 0; color: #9ca3af; font: inherit; font-size: 15px; text-decoration: underline; cursor: pointer; }
/* Verfügbarkeit und Eskalationskette (Clemens, Runde 3): Urlaub laut Rufbereitschaft gelb, von Hand abwesend grau —
   verständigt wird trotzdem; der Hinweis steht oben in der Kachel. */
.erpKachel .kAbw { font-weight: 700; font-size: 13px; margin: -12px -12px 8px; padding: 6px 12px; border-radius: 10px 10px 0 0; }
.erpKachel.abw-urlaub .kAbw { background: #fde68a; color: #451a03; }
.erpKachel.abw-manuell .kAbw { background: #9ca3af; color: #111827; }
.erpKachel.abw-urlaub.abwOffen { background: #fef3c7; color: #451a03; border-color: var(--e-amber); }
.erpKachel.abw-manuell.abwOffen { background: #e5e7eb; color: #111827; border-color: #6b7280; }
/* Der Dienst des ERT laut Dienstplan (Runde 7): sechs kleine Karten unter den Alarmknöpfen, ein Zeichen in der Alarmierung. */
.erpErt { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 10px; margin: 0 0 16px; }
@media (max-width: 640px) { .erpErt { grid-template-columns: 1fr; } }
.erpErtKarte { display: flex; align-items: center; gap: 8px; min-width: 0; padding: 7px 12px; background: var(--e-panel); border: 1px solid var(--e-line); border-left: 4px solid var(--e-dim); border-radius: 10px; font-size: 14px; line-height: 1.3; }
.erpErtKarte .pt { flex: none; width: 11px; height: 11px; border-radius: 50%; background: var(--e-dim); }
.erpErtKarte b { flex: none; min-width: 2.6em; }
.erpErtKarte .tr { flex: none; color: var(--e-dim); }
.erpErtKarte .nm { font-weight: 600; letter-spacing: .02em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.erpErtKarte .st { color: var(--e-dim); white-space: nowrap; }
.erpErtKarte.s-dienst { border-left-color: var(--e-gruen); } .erpErtKarte.s-dienst .pt { background: var(--e-gruen); }
.erpErtKarte.s-frei { border-left-color: var(--e-amber); } .erpErtKarte.s-frei .pt { background: var(--e-amber); }
.erpErtKarte.s-urlaub { border-left-color: var(--e-rot); } .erpErtKarte.s-urlaub .pt { background: var(--e-rot); }
.erpKachel .kRolle .kDienst { opacity: 1; display: inline-block; margin-left: 6px; padding: 1px 8px; border-radius: 999px; background: #16a34a; color: #fff; font-size: 12px; font-weight: 700; white-space: nowrap; vertical-align: 3px; }
.erpKoord { margin: 0 0 10px; padding: 8px 12px; border-radius: 10px; background: rgba(255, 255, 255, .06); }
.erpKoord.warn { background: #fef3c7; color: #451a03; }
.erpAbw, .erpReihe.wrap.erpAbw { align-items: center; margin: 2px 0 10px; }
.erpVerf { font-size: 13px; padding: 2px 9px; border-radius: 9px; background: #dcfce7; color: #052e16; }
.erpVerf.urlaub { background: #fde68a; color: #451a03; } .erpVerf.manuell { background: #d1d5db; color: #111827; }
.erpGlied { align-items: flex-end; } .erpGlied .nr { font-size: 18px; min-width: 1.6em; padding-bottom: 8px; }
.erpKetten { margin: 10px 0; font-size: 13.5px; } .erpKetten summary { cursor: pointer; font-weight: 600; } .erpKetten p { margin: 6px 0 0; }
/* Runde 4 (Clemens): der gemeinsame Feed — Korrekturen als Folge-Eintrag, das Original bleibt. */
.erpLogZ .kr { font-size: 12px; color: #fbbf24; margin-left: 6px; }
.erpLogZ.korr .tx { border-left: 3px solid #fbbf24; padding-left: 8px; }
.erpLogZ.korrigiert .tx { text-decoration: line-through; text-decoration-color: rgba(251, 191, 36, .7); }
.erpLogZ.korrigiert .tx .kr { text-decoration: none; display: inline-block; }
.erpKorrKn { margin-left: auto; flex: none; background: none; border: 1px solid rgba(255, 255, 255, .25); color: inherit; opacity: .7; border-radius: 7px; font: inherit; font-size: 12px; padding: 2px 8px; cursor: pointer; }
.erpKorrKn:hover { opacity: 1; }
.erpKorrInfo { padding: 6px 10px; margin-bottom: 6px; border-radius: 8px; background: #fef3c7; color: #451a03; font-size: 13.5px; }
.erpKorrInfo .erpKorrKn { border-color: #92400e; margin-left: 8px; }
.erpKettenWarn { margin: 4px 0; }
/* Clemens, „offene Punkte“ (2026-10-11) */
/* P1-A: der Titel im Overlay war oben abgeschnitten — die Leiste der Bereiche lag darüber (der Bereich hatte die
   niedrigere Ebene). Mit offenem Overlay liegt der Bereich oben; und das Overlay hält oben mindestens 16 px Abstand. */
.atoArea:has(.erpUeber) { z-index: 1500; }
.erpUeber { z-index: 1500; padding: max(16px, 4vh, env(safe-area-inset-top)) 12px 4vh; overflow: auto; }
.erpUeber.voll { padding: max(16px, env(safe-area-inset-top)) 0 0; }
.erpUeber .erpBlatt, .erpUeber .erpWahlKopf, .erpUeber .erpFrage { overflow: visible; }
.erpWahlKopf h2, .erpFrage h2 { line-height: 1.25; padding-top: 2px; }
/* P1-D: die Farben der Vorfallstypen — rot #EF4444 (1, 3, 4), amber #F59E0B (2, 5, 6, 7), grün #22C55E (8). */
.erpTyp.f-gruen, .erpTypMarke.f-gruen { background: var(--e-gruen); color: #052e16; }
.erpEd.f-gruen { border-left: 6px solid var(--e-gruen); }
/* P2-D: die Knöpfe des Übungsalarms — weiß, farbiger Rahmen (3 px), Schrift in der Rahmenfarbe; kein Vollton wie beim Echtalarm. */
.erpWahl.ueb .erpTyp { background: #fff; border: 3px solid currentColor; position: relative; }
/* Runde 8: dazu das Zeichen „ÜBUNG“ oben rechts — Navy, klein, fett; auch ohne Farbe eindeutig. */
.erpUebMarke { position: absolute; top: 7px; right: 9px; padding: 2px 8px; border-radius: 6px; background: rgba(28, 53, 87, .12); color: #1C3557; font-size: 11px; font-weight: 800; letter-spacing: .08em; line-height: 1.4; text-transform: uppercase; pointer-events: none; }
.erpWahl.ueb .erpTyp .nm { padding-right: 64px; }
.erpWahl.ueb .erpTyp.unter { padding-right: 76px; }
.erpWahl.ueb .erpTyp.f-rot { color: var(--e-rot); border-color: var(--e-rot); }
.erpWahl.ueb .erpTyp.f-amber { color: var(--e-amber); border-color: var(--e-amber); }
.erpWahl.ueb .erpTyp.f-gruen { color: var(--e-gruen); border-color: var(--e-gruen); }
.erpWahl.ueb .erpTyp.f-grau { color: #374151; border-color: #9ca3af; }
.erp #erpUebung.erpBtn { background: #fff; border: 3px solid var(--e-navy); color: var(--e-navy); }
.erpWahl.ueb #erpWeiter.erpBtn, .erpFrage .erpBtn.navy.gross { background: #fff; border: 3px solid var(--e-navy); color: var(--e-navy); }
/* P2-C: das Eingabefeld des Ereignislogs, besser zu erkennen. */
.erp .erpEintrag input, .erp #erpEintragText { background: #F0FDF4; border: 1px solid #86EFAC; color: #052e16; }
.erp .erpEintrag input::placeholder { color: #3f6b50; }
/* P1-B: die Uhr „Zeit seit Alarmierung“ — neutral, sie zählt hinauf. */
.erpFrist.uhr { cursor: default; border-color: var(--e-line); }
/* P2-E: „SMS-Nummer identisch mit Telefon“ */
.erpSmsGl { align-self: flex-end; padding-bottom: 8px; font-size: 13px; white-space: nowrap; }
.erp input.grau:disabled { opacity: .6; }

/* --- Runden 5 und 6 (Clemens, 2026-10-12): Statusscreen, Leitstelle, Rollenstufen, Ereignislog ---------------------------- */
/* Der Statusscreen eines normalen Nutzers: der Stand groß, die Uhr, sonst nichts, was ablenkt. */
.erpStatus { border-radius: 14px; padding: 22px 20px; margin: 0 0 14px; border: 3px solid var(--e-amber); background: var(--e-panel); text-align: center; }
.erpStatus.voll { border-color: var(--e-rot); }
.erpStatus.ueb { border-color: #3b82f6; }
.erpStatusBadge { display: inline-block; padding: 10px 18px; border-radius: 999px; font-weight: 800; font-size: 19px; letter-spacing: .02em; background: var(--e-amber); color: #1f1300; }
.erpStatus.voll .erpStatusBadge { background: var(--e-rot); color: #fff; }
.erpStatus.ueb .erpStatusBadge { background: #3b82f6; color: #fff; }
.erpStatusUhr { margin: 16px 0 6px; display: flex; flex-direction: column; align-items: center; gap: 2px; }
.erpStatusUhr span { font-size: 13px; color: var(--e-dim); text-transform: uppercase; letter-spacing: .06em; }
.erpStatusUhr b { font-size: 44px; font-variant-numeric: tabular-nums; line-height: 1.1; }
.erpStatusText { max-width: 640px; margin: 8px auto 12px; line-height: 1.5; }
.erpErst th { white-space: nowrap; }
.erpWeiterHinweis { border-left: 4px solid var(--e-amber); padding: 6px 10px; margin: 4px 0 10px; }
/* Die Nachricht „als Fehlalarm eingestuft“ auf der Übersicht dessen, der ausgelöst hat. */
.erpFehlNachricht { display: flex; gap: 12px; align-items: center; justify-content: space-between; flex-wrap: wrap; margin: 0 0 12px; padding: 12px 14px; border-radius: 10px; border: 2px solid var(--e-amber); background: var(--e-panel); }
.erpFehlNachricht > div { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
/* Der Ereignislog: nachträglich, bearbeitet. */
.erpLogZ .nt { font-style: normal; font-weight: 700; color: var(--e-amber); }
.erpLogZ .be { font-size: 11.5px; color: var(--e-dim); }
.erpLogAlt { display: block; margin-top: 2px; font-size: 12px; color: var(--e-dim); opacity: .85; }
.erpEintragZeit { display: flex; flex-direction: column; gap: 2px; font-size: 11.5px; color: var(--e-dim); white-space: nowrap; appearance: none; border: 1px solid var(--e-line); background: var(--e-panel); border-radius: 8px; padding: 5px 8px; font-family: inherit; text-align: left; cursor: pointer; }
.erpEintragZeit input { font-size: 13px; padding: 5px 6px; border-radius: 8px; border: 1px solid var(--e-line); background: var(--e-panel); color: var(--e-ink); }
.erpEintragZeit[hidden] { display: none; }
.erpPunkt2 .meta.hw { color: var(--e-dim); font-style: italic; }
/* Monitoring der Leitstelle, Rollenstufen in den Einstellungen, Behörden. */
.erpTab td.st-erreicht { color: var(--e-gruen); font-weight: 700; }
.erpTab td.st-nicht { color: var(--e-amber); font-weight: 700; }
.erpStufe { display: inline-block; padding: 2px 9px; border-radius: 999px; font-size: 12px; font-weight: 700; border: 1px solid var(--e-line); }
.erpStufe.s-smcmm { border-color: var(--e-rot); }
.erpStufe.s-ert { border-color: var(--e-amber); }
.erpStufe.s-spoc { border-color: #3b82f6; }
.erpStufen select { min-width: 220px; }
.erpWarn { border-left: 4px solid var(--e-amber); padding: 6px 10px; margin: 6px 0 10px; font-weight: 600; }
.erpBehUeb { margin: 0 0 10px; padding: 8px 10px; border: 1px solid var(--e-line); border-radius: 10px; }
.erpPosition { align-items: flex-end; margin-top: 8px; }

/* --- Krankenhausmatrix v2: die Liste in den Einstellungen, das Haus, der Import, „Nächste Krankenhäuser“ im Vorfall --- */
/* Die Zeichen: was sicher ist und was nicht — amtlich / OSM, nicht amtlich / manuell / fehlt; Landeplatz ja / unbekannt / nein. */
.erpKhZ { display: inline-block; padding: 1px 7px; border-radius: 999px; border: 1px solid var(--e-line); font-size: 11.5px; font-weight: 700; line-height: 1.5; white-space: nowrap; color: var(--e-ink); background: rgba(127, 127, 127, .14); }
.erpKhZ.k-amtlich, .erpKhZ.l-ja { border-color: #16a34a; background: rgba(34, 197, 94, .18); }
.erpKhZ.k-osm, .erpKhZ.e { border-color: var(--e-amber); background: rgba(245, 158, 11, .16); }
.erpKhZ.k-fehlt, .erpKhZ.l-nein { border-color: var(--e-rot); background: rgba(239, 68, 68, .2); }
.erpKhIcao { display: inline-block; margin-left: 4px; padding: 1px 7px; border-radius: 6px; background: var(--e-navy); color: #fff; font: 700 12px ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .04em; }
.erpKhIcao.osm { background: #7C3AED; } .erpKhIcao.schwach { outline: 2px dashed var(--e-amber); outline-offset: 1px; }
.erpKhLand { display: inline-block; padding: 0 6px; border-radius: 5px; background: #7C3AED; color: #fff; font-size: 11.5px; font-weight: 800; letter-spacing: .04em; vertical-align: 1px; }
.erpKhStand { margin: 0 0 10px; padding: 8px 12px; border-radius: 10px; background: rgba(255, 255, 255, .06); line-height: 1.7; }
.erpKhLeiste { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 0 0 10px; }
.erpKhLeiste input[type="search"] { flex: 2 1 220px; min-width: 0; } .erpKhLeiste select { flex: 0 1 190px; min-width: 0; } .erpKhLeiste .spacer { flex: 1 1 0; }
.erpKhScroll { max-height: 62vh; overflow: auto; border: 1px solid var(--e-line); border-radius: 10px; }
.erpKhTab { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.erpKhTab th { position: sticky; top: 0; z-index: 1; background: var(--e-panel2); text-align: left; padding: 7px 10px; font-size: 11px; letter-spacing: .05em; text-transform: uppercase; color: var(--e-dim); }
.erpKhTab td { padding: 7px 10px; border-top: 1px solid var(--e-line); vertical-align: top; }
.erpKhTab td .dim { display: block; font-size: 12px; } .erpKhTab td .mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 11.5px; }
.erpKhTab tbody tr { cursor: pointer; } .erpKhTab tbody tr:hover, .erpKhTab tbody tr:focus { background: rgba(255, 255, 255, .06); outline: none; }
.erpKhFelder { display: flex; flex-wrap: wrap; gap: 0 12px; align-items: flex-end; }
.erpUeber.voll .erpFrage.erpKhEd, .erpUeber.voll .erpFrage.erpKhImp { max-width: 860px; margin-top: 3vh; }
.erpKhEd textarea { width: 100%; box-sizing: border-box; }
.erpKhHer { margin: 0 0 10px; font-size: 13px; }
.erpKhSich { margin: 6px 0 0; } .erpKhSich summary { cursor: pointer; color: var(--e-dim); }
.erpKhSichZeile { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: space-between; padding: 6px 0; border-top: 1px dashed var(--e-line); font-size: 13px; }
.erpKhZahlen { display: grid; grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); gap: 8px; margin: 0 0 12px; }
.erpKhZahlen > div { padding: 8px 10px; border: 1px solid var(--e-line); border-radius: 10px; text-align: center; }
.erpKhZahlen b { display: block; font-size: 24px; line-height: 1.1; } .erpKhZahlen span { font-size: 12px; color: var(--e-dim); }
.erpKhZahlen .rot { border-color: var(--e-rot); background: rgba(239, 68, 68, .14); } .erpKhZahlen .amber { border-color: var(--e-amber); background: rgba(245, 158, 11, .12); }
.erpKhBer { margin: 0 0 8px; border: 1px solid var(--e-line); border-radius: 10px; padding: 6px 12px; }
.erpKhBer.rot { border-color: var(--e-rot); } .erpKhBer.amber { border-color: var(--e-amber); }
.erpKhBer summary { cursor: pointer; font-weight: 700; } .erpKhBer > div { max-height: 34vh; overflow: auto; font-size: 13px; } .erpKhBer p { margin: 6px 0; }
.erpKhKonflikt { display: flex; gap: 10px; align-items: flex-start; padding: 8px 0; border-top: 1px dashed var(--e-line); font-size: 13px; cursor: pointer; }
.erpKhKonflikt input { width: 22px; height: 22px; flex: none; margin-top: 2px; }
.erpKhFilter { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; margin: 0 0 12px; font-size: 14px; }
.erpKhFilter label { display: flex; align-items: center; gap: 6px; font-weight: 600; margin: 0; } .erpKhFilter select { min-width: 0; max-width: 46vw; }
.erpKhGrenze { margin: 0 0 10px; }
.erpKhKlein { display: block; font-weight: 400; font-size: 13px; margin-top: 2px; }
.erpKhGewaehlt { margin: 0 0 12px; padding: 8px 12px; border-radius: 10px; border: 2px solid #16a34a; background: rgba(34, 197, 94, .12); line-height: 1.6; } .erpKhGewaehlt span { display: block; }
.erpKhZeile { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto auto; gap: 6px 12px; align-items: center; padding: 10px 0; border-top: 1px dashed var(--e-line); }
.erpKhZeile.gew { border-left: 5px solid #16a34a; padding-left: 8px; }
.erpKhZeile .rg { width: 30px; height: 30px; border-radius: 50%; background: var(--e-navy); color: #fff; font-weight: 800; display: flex; align-items: center; justify-content: center; }
.erpKhZeile.ausland .rg { border-radius: 6px; background: #7C3AED; }
.erpKhZeile .nm { min-width: 0; } .erpKhZeile .nm .dim { display: block; font-size: 12.5px; } .erpKhZeile .nm .zz { display: block; margin-top: 3px; line-height: 1.9; } .erpKhZeile .nm .hw { margin-top: 2px; }
.erpKhZeile .en { text-align: right; white-space: nowrap; line-height: 1.25; } .erpKhZeile .en b { display: block; font-size: 18px; } .erpKhZeile .en span { display: block; font-size: 12.5px; color: var(--e-dim); }
.erpKhZeile .kn { display: flex; flex-direction: column; gap: 6px; align-items: stretch; min-width: 132px; } .erpKhZeile .kn .erpBtn { text-align: center; }
.erpKhZeile .erpBtn.tel.zentrale { background: transparent; color: var(--e-ink); border: 1px solid var(--e-line); }
.erpKhTitel { margin: 16px 0 2px; font-size: 14px; letter-spacing: .03em; }
.erpKhAus { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: space-between; padding: 6px 0; border-top: 1px dashed var(--e-line); font-size: 13.5px; }
@media (max-width: 640px) { .erpKhZeile { grid-template-columns: 34px minmax(0, 1fr) auto; } .erpKhZeile .kn { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; } .erpKhZeile .kn .erpBtn { flex: 1 1 120px; } }
.erpKhHw { font-size: 11.5px; font-weight: 700; color: var(--e-amber); white-space: nowrap; cursor: help; }
/* Notfallkontakt (Runde 10): die Aktion ist ein Knopf im Infinitiv, der Status danach ein Zeichen — kein Knopf.
   Darunter, unauffällig, der Weg zurück für ein Versehen. */
.erpOk.fest { display: inline-flex; align-items: center; padding: 6px 12px; border-radius: 999px; font-weight: 700; cursor: default; }
.erpLink { border: 0; background: transparent; padding: 0 2px; font: inherit; font-size: 12px; color: inherit; opacity: .65; text-decoration: underline; cursor: pointer; }
.erpLink:hover { opacity: 1; }
.erpKoordZeile { align-items: center; gap: 10px; flex-wrap: wrap; } .erpKoordZeile .erpHint { flex: 1 1 260px; margin: 0; } .erpKoordZeile [hidden] { display: none; }
/* Die Lagekarte oben im aktiven Einsatz (Runde 10): immer da, solange der Einsatz läuft und ein Einsatzort eingetragen ist. */
.erpLageOben { position: relative; margin: 10px 0 12px; border-radius: 10px; overflow: hidden; border: 1px solid var(--e-line); background: #dfe3e6; }
.erpLageOben canvas { display: block; width: 100%; height: 230px; touch-action: none; cursor: grab; }
.erpLageObenKn { position: absolute; top: 8px; right: 8px; display: flex; flex-direction: column; gap: 5px; } .erpLageObenKn .erpBtn { min-width: 38px; background: #fff; color: #111; border-color: #9ca3af; }
.erpLageObenFuss { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; padding: 7px 12px; background: #fff; color: #111827; font-size: 13.5px; }
.erpLageObenFuss label { display: inline-flex; align-items: center; gap: 6px; } .erpLageObenFuss select { padding: 3px 6px; border-radius: 6px; border: 1px solid #9ca3af; background: #fff; color: #111; font: inherit; }
.erpLageObenFuss .dim { color: #4b5563; } .erpLageObenFuss #erpObenLage { margin-left: auto; }
/* Das Kartenbild an einem Log-Eintrag, der den Einsatzort nennt. */
.erpLogKarte { display: block; width: 260px; max-width: 100%; height: 150px; margin-top: 6px; border-radius: 8px; border: 1px solid #9ca3af; }
/* Am Handy: der Dienst neben dem Namen darf kürzen statt hinauszuragen (Durchgang 2026-10-14). */
@media (max-width: 600px) { .erpErtKarte .st { min-width: 0; overflow: hidden; text-overflow: ellipsis; } .erpErtKarte .nm { min-width: 0; } }
/* Paket 7 (KV-4): der Geprüft-Knopf mit Ampel — grau nie, grün 0–9 Monate, amber 9–12, rot über 12 */
.erpBtn.erpPruef.p-grau { background: #F3F4F6; color: #374151; border-color: #D1D5DB; }
.erpBtn.erpPruef.p-gruen { background: #22C55E; color: #fff; border-color: #22C55E; }
.erpBtn.erpPruef.p-amber { background: #F59E0B; color: #1f1300; border-color: #F59E0B; }
.erpBtn.erpPruef.p-rot { background: #EF4444; color: #fff; border-color: #EF4444; }
/* Paket 7 (ERT-1): Personen aus der Personaldatenbank suchen */
.erpPersFeld { position: relative; }
.erpAuto { position: absolute; z-index: 40; top: 100%; left: 0; right: 0; min-width: 260px; margin-top: 2px; display: flex; flex-direction: column; background: #fff; color: #111; border: 1px solid #cbd5e1; border-radius: 8px; box-shadow: 0 8px 24px rgba(0, 0, 0, .18); overflow: hidden; }
.erpAuto button { text-align: left; padding: 7px 10px; border: 0; background: transparent; font: inherit; font-size: 13px; cursor: pointer; }
.erpAuto button:hover, .erpAuto button:focus { background: #eef2ff; }
.erpVerkn { font-size: 11px; color: #15803d; font-weight: 700; margin-top: 2px; }

/* Paket 8 (Clemens, 16. Runde, 2026-10-21) ------------------------------------------------------------------------- */
/* 1-A: die Ortssuche der Ersterfassung (PLZ · Ort · Bezirk · Bundesland), wie im Drohnen-Modul */
.erpOrtFeld { position: relative; display: block; }
.erpOrtFeld input { width: 100%; box-sizing: border-box; }
.erpOrtTreffer { position: absolute; left: 0; right: 0; top: calc(100% + 2px); z-index: 40; display: none; background: var(--e-panel); border: 1px solid var(--e-line); border-radius: 10px; box-shadow: 0 8px 24px rgba(0, 0, 0, .35); max-height: 320px; overflow: auto; }
.erpOrtTreffer.auf { display: block; }
.erpOrtTreffer button { display: grid; grid-template-columns: 52px minmax(0, 1fr) auto auto; gap: 10px; align-items: baseline; width: 100%; text-align: left; padding: 10px 12px; border: 0; border-bottom: 1px solid var(--e-line); background: none; color: var(--e-ink); font: inherit; cursor: pointer; }
.erpOrtTreffer button:last-child { border-bottom: 0; }
.erpOrtTreffer button.an, .erpOrtTreffer button:hover { background: var(--e-panel2); }
.erpOrtTreffer .plz { font-weight: 700; font-variant-numeric: tabular-nums; } .erpOrtTreffer .ort { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.erpOrtTreffer .bez, .erpOrtTreffer .land { color: var(--e-dim); font-size: 13px; white-space: nowrap; }
@media (max-width: 560px) { .erpOrtTreffer button { grid-template-columns: 48px minmax(0, 1fr); } .erpOrtTreffer .bez, .erpOrtTreffer .land { grid-column: 2; } }
/* 1-B: „Unbekannt“ neben dem Zähler — schließt ihn aus */
.erpBtn.erpUnbekannt.on { background: var(--e-navy); border-color: #60a5fa; color: #fff; }
.erp input[data-kurz-anzahl]:disabled { opacity: .45; }
/* 2-A: die Bestätigungsansicht eines normalen Nutzers — nur die Bestätigung, der Nachtrag, die eigenen Einträge */
.erpBestaetigung { border: 2px solid var(--e-gruen); border-radius: 14px; padding: 18px 20px; background: var(--e-panel); display: flex; flex-direction: column; gap: 10px; margin-bottom: 14px; }
.erpBestaetigung.vor { border-color: var(--e-amber); } .erpBestaetigung.ueb { border-color: #3b82f6; }
.erpBestTitel { margin: 0; font-size: 15px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--e-dim, #94a3b8); }
.erpBestKopf { font-size: 22px; font-weight: 800; color: var(--e-gruen); } .erpBestaetigung.vor .erpBestKopf { color: var(--e-amber); } .erpBestaetigung.ueb .erpBestKopf { color: #60a5fa; }
.erpBestZeile { font-size: 16px; font-weight: 600; } .erpBestText { margin: 0; color: var(--e-ink); }
.erpNachtrag { display: flex; flex-direction: column; gap: 6px; } .erpNachtrag label { font-weight: 700; }
.erpNachtrag .erpReihe { display: flex; gap: 8px; } .erpNachtrag input { flex: 1 1 auto; min-width: 0; min-height: 48px; padding: 8px 12px; border-radius: 10px; border: 1px solid var(--e-line); background: var(--e-panel2); color: var(--e-ink); font: inherit; }
.erpBestEintraege ul { margin: 6px 0 0; padding-left: 18px; } .erpBestEintraege li { margin: 3px 0; } .erpBestEintraege .zt { font-variant-numeric: tabular-nums; font-weight: 600; }
.erpBestGuide { margin: 0 0 14px; }
/* 3-A: das Overlay für den SPOC — auf jeder Seite von mylog, vollflächig rot, blinkend, bis „ZUM NOTFALL“ */
.erpSpocAlarm { position: fixed; inset: 0; z-index: 2147483600; display: flex; align-items: center; justify-content: center; padding: 16px; background: rgba(239, 68, 68, .94); animation: erpSpocBlink 1s steps(2, start) infinite; }
@keyframes erpSpocBlink { 50% { background: rgba(127, 18, 18, .96); } }
.erpSpocBox { max-width: 640px; width: 100%; background: #fff; color: #111; border-radius: 18px; padding: 24px 24px 20px; box-shadow: 0 20px 60px rgba(0, 0, 0, .5); display: flex; flex-direction: column; gap: 8px; font-family: system-ui, sans-serif; }
.erpSpocTitel { font-size: 30px; font-weight: 900; color: #b91c1c; letter-spacing: .02em; } .erpSpocTitel small { font-size: 15px; color: #444; font-weight: 700; }
.erpSpocZeile { font-size: 17px; line-height: 1.35; }
.erpSpocZu { margin-top: 12px; min-height: 64px; border: 0; border-radius: 14px; background: #b91c1c; color: #fff; font: inherit; font-size: 22px; font-weight: 900; cursor: pointer; letter-spacing: .03em; }
.erpSpocStumm { min-height: 48px; border: 2px solid #b91c1c; border-radius: 12px; background: #fff; color: #b91c1c; font: inherit; font-size: 16px; font-weight: 700; cursor: pointer; }
.erpSpocHint { margin: 4px 0 0; font-size: 13.5px; color: #555; }

/* Paket 8, 3-B: die Entscheidung der Leitstelle — ganz oben, beim Scrollen oben stehend (unter der Leiste). */
.erpEntscheid { position: sticky; top: var(--suite-h, 0px); z-index: 50; padding: 12px 14px; margin: 0 0 12px; border-radius: 10px; background: var(--e-panel); border: 2px solid var(--e-rot); box-shadow: 0 8px 18px -10px rgba(0,0,0,.6); }
.erpEntscheid .erpVorKn { margin-top: 0; }
.erpEntscheid .erpVorKn .erpBtn.riesig { min-height: 64px; }
.erpEntscheidUhr { margin-top: 8px; font-size: 15px; color: var(--e-dim); }
.erpEntscheidUhr b { font-size: 20px; color: var(--e-ink, inherit); font-variant-numeric: tabular-nums; margin-left: 4px; }
@media (max-width: 560px) { .erpEntscheid .erpVorKn .erpBtn.riesig { min-height: 52px; font-size: 19px; } .erpEntscheid .erpVorKn .erpBtn.gross { min-height: 44px; } }

/* Paket 8, 4-A: die Karte oben im Einsatz kleiner; die Vollbildkarte für den zweiten Bildschirm (mylog.at/erp?karte=…). */
.erpLageOben canvas { height: 160px; }
@media (max-width: 560px) { .erpLageOben canvas { height: 140px; } }
.erpVollKarte { display: flex; flex-direction: column; gap: 8px; }
.erpVollKopf { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; padding: 8px 12px; border-radius: 8px; background: var(--e-panel); border: 1px solid var(--e-line); }
.erpVollKopf b { font-size: 17px; } .erpVollKopf .spacer { flex: 1; }
.erpKarteBox.voll #erpKarteVoll { display: block; width: 100%; height: calc(100vh - 150px); min-height: 320px; touch-action: none; cursor: grab; background: #dfe3e6; }

/* Paket 8, 4-C/4-D/4-F: SMS-Hinweis, Stellvertreter schon erreicht, „Einsatzspezifisch“, Reiter der ERT-Konfiguration. */
.erpSmsHinweis { margin-top: 8px; }
.erpSmsText { padding: 8px 10px; border-radius: 8px; background: var(--e-panel2); border: 1px solid var(--e-line); white-space: pre-wrap; }
.erpStvSchon { padding: 10px 12px; border-radius: 8px; border: 1px dashed var(--e-line); color: var(--e-dim); font-size: 14px; }
.erpKachel .kExtra { display: inline-block; margin-bottom: 4px; padding: 1px 8px; border-radius: 999px; background: #1e3a8a; color: #fff; font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.erpErtReiter { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 12px; }
.erpErtReiter button { appearance: none; border: 1px solid var(--e-line); background: var(--e-panel); color: var(--e-ink); border-radius: 8px; padding: 8px 14px; font: inherit; font-weight: 600; cursor: pointer; }
.erpErtReiter button.on { background: var(--e-ink); color: var(--e-bg); border-color: var(--e-ink); }
.erpTypPersKopf { display: flex; align-items: center; gap: 10px; justify-content: space-between; margin-bottom: 6px; }

/* Paket 8, 5-B: Einsatz mit Phasenstatus und Führungsverantwortung; die Checkliste hat ihren eigenen Reiter. */
.erpPhasenStand { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0 0 10px; }
.erpPhasenStand > div { padding: 9px 11px; border-radius: 8px; border: 1px solid var(--e-line); background: var(--e-panel2); display: flex; flex-direction: column; gap: 2px; }
.erpPhasenStand > div.jetzt { border-color: var(--e-rot); box-shadow: inset 4px 0 0 var(--e-rot); }
.erpPhasenStand > div.fertig { opacity: .75; } .erpPhasenStand > div.spaeter { opacity: .55; }
.erpPhasenStand small { color: var(--e-dim); }
@media (max-width: 560px) { .erpPhasenStand { grid-template-columns: 1fr; } }
.erpFuehrung { font-size: 16px; margin: 0 0 6px; }
.erpUebergaben { display: flex; flex-direction: column; gap: 3px; margin: 0 0 8px; font-size: 14px; }
.erpZahl.grau { background: var(--e-dim); }

/* Paket 8, 6-A: Fotos im Ereignisprotokoll — Vorschaubilder am Eintrag, groß im Fenster. */
.erpFotos { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0 2px; }
.erpFotoKl { appearance: none; padding: 0; border: 1px solid var(--e-line); border-radius: 6px; overflow: hidden; background: var(--e-panel2); cursor: zoom-in; width: 84px; height: 64px; display: inline-flex; }
.erpFotoKl img { width: 100%; height: 100%; object-fit: cover; display: block; }
.erpFotos.gross .erpFotoKl { width: 110px; height: 84px; cursor: default; }
.erpFotoVoll { display: flex; flex-direction: column; gap: 10px; }
.erpFotoBild { display: flex; justify-content: center; align-items: center; min-height: 200px; background: #0b0d0f; border-radius: 8px; }
.erpFotoBild img { max-width: 100%; max-height: 72vh; display: block; }
.erpFotoVoll .erpFrageKn { align-items: center; } .erpFotoVoll .spacer { flex: 1; }

/* Paket 8, 7-A: Gefahrgut — je Stoff der Block mit den Notfallmaßnahmen (rot/orange, mindestens 16 px fett), Liste, Dokumente. */
.erpNotfallBlock { margin: 0 0 12px; border-radius: 10px; overflow: hidden; border: 2px solid #c2410c; background: #fff7ed; color: #431407; }
.erpNotfallBlock .kopf { padding: 10px 14px; background: linear-gradient(90deg, #b91c1c, #ea580c); color: #fff; font-size: 18px; font-weight: 800; letter-spacing: .02em; }
.erpNotfallBlock .text { padding: 10px 14px; font-size: 16px; font-weight: 700; line-height: 1.45; white-space: pre-wrap; }
.erpNotfallBlock.klein .kopf { font-size: 16px; } .erpNotfallBlock.klein .text { font-size: 15px; }
.erpStoffTab td { vertical-align: top; } .erpStoffTab tr.klickbar { cursor: pointer; }
.erpStoffTab tr.klickbar:hover td { background: var(--e-panel2); }
.erpStoffDazu { align-items: flex-end; }
.erpStoffFelder { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 12px; }
.erpStoffFelder .breit { grid-column: 1 / -1; }
@media (max-width: 560px) { .erpStoffFelder { grid-template-columns: 1fr; } }
.erpAnlagen { display: grid; grid-template-columns: auto 1fr; gap: 6px 10px; align-items: center; margin: 0 0 10px; }
.erpAnlagen .erpBtn { justify-self: start; }
.erpBestZw { text-align: left; padding-top: 10px !important; font-size: 12px; letter-spacing: .05em; text-transform: uppercase; color: var(--e-dim); }

/* Paket 8, 9-A: die Zuordnung aus dem Einsatzort. */
.erpZustaendig { display: flex; flex-direction: column; gap: 2px; padding: 8px 12px; margin: 0 0 8px; border-radius: 8px; background: var(--e-panel2); border-left: 4px solid #2563eb; }

/* Paket 8, 9-B: im Lage-Reiter die Karte kleiner, rechts neben Koordinaten und Apple/Google/BEV. */
.erpLageGrid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 360px); gap: 12px; align-items: start; }
.erpLageGrid.ohne { grid-template-columns: minmax(0, 1fr); }
.erpLageKarte { margin: 0; }
.erpLageKarte #erpKarte { height: 280px; }
.erpLageKarte .erpKarteKn .erpBtn { min-width: 38px; font-size: 18px; padding: 4px 8px; }
@media (max-width: 640px) { .erpLageGrid { grid-template-columns: minmax(0, 1fr); } .erpLageKarte #erpKarte { height: 240px; } }
@media (max-width: 560px) { .erpNachtrag .erpReihe { flex-wrap: wrap; } .erpNachtrag .erpReihe input { flex: 1 1 100%; } }
/* Paket 8: am Handy das Eingabefeld des Docks über die ganze Breite (daneben stehen jetzt Zeitpunkt, Eintrag, Foto);
   der Knopf zur Vollbildkarte auf dem weißen Kartenfuß hell. */
@media (max-width: 560px) { .erpEintrag { flex-wrap: wrap; } .erpEintrag > input { flex: 1 1 100%; } }
.erpLageObenFuss a.erpBtn, .erpLageGrid a.erpBtn.klein[target] { text-decoration: none; }
.erpLageObenFuss a.erpBtn { background: #fff; color: #111; border-color: #9ca3af; }

/* Grenznähe (Paket 8, 17. Runde, 10-B): der Hinweis über den Kontakten und das Konsulat hervorgehoben. */
.erpGrenze { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: baseline; padding: 10px 14px; margin-bottom: 12px; border-radius: 10px; border: 2px solid var(--e-amber); background: rgba(245, 158, 11, .12); }
.erpGrenze b { color: var(--e-amber); }
.erpKontakt.erpKonsulat { border: 2px solid var(--e-amber); border-radius: 10px; background: rgba(245, 158, 11, .10); padding: 8px 10px; }
.erpKonsulatHinweis { display: block; font-size: 12px; font-weight: 700; color: var(--e-amber); }

/* Gefahrgut (17. Runde): aktiviert durch die Qualifikation des Flugs; die Packlisten zur Wahl. */
.erpQualiHinweis { margin: 0 0 12px; padding: 8px 12px; border-radius: 10px; border: 1px solid var(--e-amber); background: rgba(245, 158, 11, .10); font-weight: 700; }
.erpPackWahl { display: flex; flex-direction: column; gap: 6px; margin-top: 10px; }
.erpEtikett { display: inline-block; padding: 1px 8px; border-radius: 999px; background: var(--e-amber); color: #111; font-size: 11px; font-weight: 800; }
.erpUnInfo { display: block; margin-top: 3px; }
.erpPackZeile { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: flex-end; padding: 8px 0; border-bottom: 1px solid var(--e-line, rgba(148, 163, 184, .25)); }
.erpQuali { margin-bottom: 12px; }

/* ERP-Übersicht (17. Runde, Abschnitt 12). */
.erpUebTab td, .erpUebTab th { vertical-align: middle; }
.erpUebArt { display: inline-block; padding: 1px 8px; border-radius: 999px; font-size: 12px; font-weight: 800; border: 1px solid var(--e-line); }
.erpUebArt.a-alarm { background: rgba(239, 68, 68, .18); border-color: var(--e-rot); }
.erpUebArt.a-fehlalarm { background: rgba(245, 158, 11, .16); border-color: var(--e-amber); }
.erpUebArt.a-uebung { background: rgba(59, 130, 246, .16); border-color: #3b82f6; }
.erpUebArt.a-notfallmeldung { background: rgba(245, 158, 11, .30); border-color: var(--e-amber); }
.erpUebAktiv { color: var(--e-gruen); font-weight: 800; }
.erpUebTab td.mono, .erpUebTab td.nowrap { white-space: nowrap; }
@media (max-width: 560px) {
  .erpPackZeile { display: grid; grid-template-columns: 1fr 1fr; align-items: end; }
  .erpPackZeile .erpFeld { min-width: 0; width: auto; }
  .erpPackZeile .erpFeld:not(.schmal) { grid-column: 1 / -1; }
  .erpPackZeile [data-pweg] { grid-column: 1 / -1; justify-self: end; }
}
/* Eine Zeile mit der Personensuche (Hinweis darunter): die Beschriftungen oben auf einer Höhe (17. Runde). */
.erpReihe.oben { align-items: flex-start; }
@media (max-width: 560px) {
  .erpUebFilter { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 10px; }
  .erpUebFilter .erpFeld { min-width: 0; width: auto; }
  .erpUebFilter .spacer { display: none; }
  .erpUebFilter #erpUebPdf { grid-column: 1 / -1; }
}

/* ===== 19. Runde (Clemens, 2026-10-22) ===================================================================================== */
/* 0-C: der Statusbalken über „NOTFALL MELDEN“ — grün nur nach Bestätigung durch den Server; rot blinkend (1 Hz), solange ein
   weiterer Notfall auf die Entscheidung wartet. Kein Schließen. */
.erpStatusBalken { width: 100%; box-sizing: border-box; margin: 0 0 12px; padding: 14px 16px; border-radius: 10px; text-align: center; color: #fff; font-weight: 800; font-size: 17px; letter-spacing: .01em; }
.erpStatusBalken[hidden] { display: none; }
.erpStatusBalken[data-zustand="ruhe"] { background: #22C55E; }
/* Teil B: läuft ein Einsatz/eine Übung, liest der normale User den neutralen Hinweis (grau, ruhig) */
.erpStatusBalken[data-zustand="laufend"] { background: #475569; }
.erpStatusBalken[data-zustand="weiter"] { background: #EF4444; animation: erpStatusBlink 1s steps(2, start) infinite; }
@keyframes erpStatusBlink { 50% { background: #991B1B; } }
/* 0-D: Übernehmen — je Zeile der laufenden Ereignisse, im Kopf des Ereignisses */
.erpZeileMit { display: flex; gap: 8px; align-items: stretch; margin: 0 0 6px; }
.erpZeileMit .erpZeile { margin: 0; flex: 1 1 auto; min-width: 0; }
.erpZeileKn { display: flex; flex-direction: column; gap: 4px; justify-content: center; align-items: flex-end; flex: none; max-width: 42%; }
.erpUebNimm { font-size: 12.5px; color: var(--e-dim); text-align: right; } .erpUebNimm.ich { color: var(--e-gruen); font-weight: 700; }
.erpUebernommen { margin: 0 0 10px; padding: 9px 12px; border-radius: 8px; border: 1px solid var(--e-amber); background: rgba(245, 158, 11, .12); font-size: 14px; }
@media (max-width: 560px) { .erpZeileMit { flex-direction: column; } .erpZeileKn { max-width: none; flex-direction: row; align-items: center; justify-content: flex-end; } }
/* 3-A-2: die Entscheidungskarte mit Mini-Karte rechts; die geografische Einordnung unter dem Ort */
.erpEntscheidKarte { display: grid; grid-template-columns: minmax(0, 1fr) 200px; gap: 14px; align-items: start; }
.erpEntscheidKarte.ohne { grid-template-columns: minmax(0, 1fr); }
.erpMiniKarte { width: 200px; height: 200px; border-radius: 8px; border: 1px solid var(--e-line); display: block; touch-action: auto; }
.erpGeo { margin-top: 3px; font-size: 13px; color: var(--e-dim); }
.erpErstHw { margin-top: 3px; font-size: 12.5px; color: var(--e-dim); }
.erpSitWahl { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin: 8px 0 0; font-size: 13px; color: var(--e-dim); }
.erpSitWahl select { font: inherit; font-size: 15px; padding: 6px 8px; border-radius: 8px; border: 1px solid var(--e-line); background: var(--e-panel2); color: var(--e-ink); }
@media (max-width: 560px) { .erpEntscheidKarte { grid-template-columns: minmax(0, 1fr); } .erpMiniKarte { width: 100%; max-width: 320px; height: 180px; } }
.erpLageKoord { margin: 0 0 8px; } .erpLageVier { margin: 0 0 10px; gap: 6px; }
/* 6-B-2: Einsatzleiter */
.erpLeiterZeile { display: flex; gap: 10px; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.erpLeiterZeile .erpFuehrung { margin: 0; }
/* 0-E: Kommunikation — Digitalfunk */
.erpFunkListe { display: flex; flex-direction: column; gap: 6px; margin: 0 0 10px; }
.erpFunkKanal { display: flex; gap: 10px; align-items: center; justify-content: space-between; padding: 8px 10px; border-radius: 8px; border: 1px solid var(--e-line); background: var(--e-panel2); }
.erpFunkId { font-family: ui-monospace, Menlo, monospace; font-weight: 700; margin-left: 6px; }
.erpFunkTyp { display: inline-block; margin-left: 6px; padding: 1px 7px; border-radius: 999px; border: 1px solid var(--e-navy); background: rgba(28, 53, 87, .35); font-size: 12px; }
.erpFunkNeu { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1.4fr) auto auto auto; gap: 6px; margin: 0 0 8px; }
.erpFunkNeu[hidden] { display: none; }
.erpFunkNeu input, .erpFunkNeu select { font: inherit; font-size: 15px; padding: 8px 10px; border-radius: 8px; border: 1px solid var(--e-line); background: var(--e-panel2); color: var(--e-ink); min-width: 0; }
@media (max-width: 700px) { .erpFunkNeu { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
/* 5-G: eine weitere Person zur Alarmierung — Navy, volle Breite; die Karte „Manuell hinzugefügt“ */
.erp .erpBtn.erpPersonPlus { display: block; width: 100%; margin: 10px 0 4px; background: #1C3557; border-color: #1C3557; color: #fff; }
.kManuell { margin: 2px 0 4px; font-size: 12px; color: var(--e-dim); }
.kWeg { appearance: none; border: 1px solid var(--e-line); background: transparent; color: var(--e-dim); border-radius: 6px; padding: 1px 6px; font: inherit; font-size: 12px; cursor: pointer; margin-left: 4px; }
.erpPersonWahl input#erpPersonQ { width: 100%; box-sizing: border-box; font: inherit; font-size: 16px; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--e-line, #2b333a); background: var(--e-panel2, #212a31); color: var(--e-ink, #e7eaec); }
.erpPersonTreffer { max-height: 52vh; overflow: auto; margin: 8px 0; }
.erpPersonTreffer h4 { margin: 10px 0 4px; font-size: 12px; text-transform: uppercase; letter-spacing: .08em; color: var(--e-dim, #8b959c); }
.erpPersonZeile { appearance: none; display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) auto; gap: 8px; width: 100%; text-align: left; padding: 9px 10px; margin: 0 0 4px; border-radius: 8px; border: 1px solid var(--e-line, #2b333a); background: var(--e-panel, #1b2126); color: var(--e-ink, #e7eaec); font: inherit; cursor: pointer; }
.erpPersonZeile span { color: var(--e-dim, #8b959c); font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 560px) { .erpPersonZeile { grid-template-columns: minmax(0, 1fr); gap: 2px; } }
/* 1-D: Betriebsbereich als Umschalter — Navy = gewählt, grau = nicht */
.erpToggle { display: inline-flex; border-radius: 10px; overflow: hidden; border: 1px solid #1C3557; align-self: flex-start; }
.erpToggle button { appearance: none; border: 0; min-height: 44px; min-width: 120px; padding: 8px 18px; font: inherit; font-weight: 700; background: #E5E7EB; color: #4B5563; cursor: pointer; }
.erpToggle button.on { background: #1C3557; color: #fff; }
/* 1-A-2: der Ereigniszeitpunkt als Blatt von unten — fest am unteren Rand, über allem (auch über dem Dock des iPhone) */
.erpEintragZeit.gesetzt { border-color: var(--e-amber); color: var(--e-amber); }
.erpZeitBlatt { position: fixed; inset: 0; z-index: 2147483000; background: rgba(0, 0, 0, .5); display: flex; align-items: flex-end; justify-content: center; }
.erpZeitBox { width: 100%; max-width: 560px; box-sizing: border-box; max-height: 100dvh; overflow: auto; background: var(--panel-solid, #1b2126); color: var(--ink, #e7eaec); border-radius: 18px 18px 0 0; padding: 8px 16px calc(16px + env(safe-area-inset-bottom, 0px)); box-shadow: 0 -10px 30px rgba(0, 0, 0, .45); transition: transform .15s; }
.erpZeitGriff { width: 44px; height: 5px; border-radius: 3px; background: rgba(127, 127, 127, .6); margin: 2px auto 8px; }
.erpZeitBox h3 { margin: 0 0 4px; font-size: 18px; } .erpZeitBox .erpHint { font-size: 13px; color: var(--ink-dim, #8b959c); margin: 0 0 10px; }
.erpZeitFelder { display: grid; grid-template-columns: 1.3fr 1fr; gap: 10px; }
.erpZeitFelder label { display: flex; flex-direction: column; gap: 4px; font-size: 12.5px; color: var(--ink-dim, #8b959c); min-width: 0; }
.erpZeitFelder input { font: inherit; font-size: 20px; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--line, #2b333a); background: var(--panel-2, #212a31); color: inherit; min-width: 0; width: 100%; box-sizing: border-box; font-variant-numeric: tabular-nums; }
.erpZeitSchnell { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 0; }
.erpZeitKn { display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; margin-top: 12px; }
.erpZeitKn .erpBtn.gross { min-width: 140px; }
.erpZeitBox .erpMsg { margin: 6px 0 0; min-height: 0; color: #f87171; font-size: 13px; }
/* 3-A-3: „Notfall ●N“ (SPOC, SM, CMM) und die Schnellübersicht dahinter */
.erpQueuePlatz[hidden] { display: none; }
.erpQueuePlatz.nav { margin-left: auto; display: inline-flex; align-items: center; }
.erpQueue { appearance: none; border: 0; border-radius: 999px; height: 28px; padding: 0 12px; font: inherit; font-size: 12.5px; font-weight: 800; color: #fff; cursor: pointer; white-space: nowrap; }
.erpQueue i { font-style: normal; margin-left: 3px; }
.erpQueue.rot { background: #EF4444; box-shadow: 0 1px 6px rgba(239, 68, 68, .5); } .erpQueue.amber { background: #F59E0B; color: #1b1206; } .erpQueue.ueb { background: #1C3557; border: 1px solid #3b82f6; }
.erpNav .erpQueue { height: 36px; }
.erpQueueListe { position: fixed; z-index: 2147483100; width: min(460px, calc(100vw - 16px)); max-height: 70vh; overflow: auto; background: var(--panel-solid, #1b2126); color: var(--ink, #e7eaec); border: 1px solid var(--line, #2b333a); border-radius: 12px; box-shadow: 0 16px 40px rgba(0, 0, 0, .5); padding: 8px; font-size: 14px; }
.erpQueueKopf { font-size: 11.5px; text-transform: uppercase; letter-spacing: .1em; color: var(--ink-dim, #8b959c); padding: 2px 4px 6px; }
.erpQueueZeile { display: flex; gap: 8px; align-items: center; justify-content: space-between; padding: 8px; border-radius: 8px; border-left: 5px solid #EF4444; background: var(--panel-2, #212a31); margin: 0 0 6px; }
.erpQueueZeile.vor { border-left-color: #F59E0B; } .erpQueueZeile.ueb { border-left-color: #3b82f6; }
.erpQueueZeile .erpBtn { flex: none; }
/* 3-A-3, Stufe 1: das Banner oben, wenn der SPOC schon in einem Einsatz ist — rot, blinkend, über allem */
.erpSpocAlarm.banner { inset: 0 0 auto 0; padding: 0; background: transparent; animation: none; display: block; }
.erpSpocBanner { margin: 0; padding: 10px 14px calc(10px); background: #EF4444; color: #fff; display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; justify-content: space-between; box-shadow: 0 8px 24px rgba(0, 0, 0, .45); animation: erpBannerBlink 1s steps(2, start) infinite; font-family: system-ui, sans-serif; }
@keyframes erpBannerBlink { 50% { background: #991B1B; } }
.erpSpocBannerText { display: flex; flex-direction: column; gap: 2px; font-size: 16px; } .erpSpocBannerText b { font-size: 17px; } .erpSpocBannerText small { font-weight: 700; }
.erpSpocBannerText span { font-size: 14px; opacity: .95; }
.erpSpocBannerKn { display: flex; gap: 8px; flex-wrap: wrap; }
.erpSpocBanner .erpSpocZu { margin: 0; min-height: 44px; padding: 0 16px; font-size: 16px; background: #fff; color: #b91c1c; border-radius: 10px; }
.erpSpocBanner .erpSpocStumm { min-height: 44px; padding: 0 12px; font-size: 14px; background: transparent; color: #fff; border-color: #fff; border-radius: 10px; }
.erpSpocBanner .erpSpocHint { flex-basis: 100%; color: #fff; opacity: .9; margin: 0; }
.erp .erpZeitFelder input { font-size: 20px; padding: 10px 12px; }
/* 21. Runde, 0-F: eine weitere Notfallmeldung wartet — rotes Banner oben auf der Seite, Amber-Punkt am Reiter */
.erpWartet { display: flex; gap: 10px; align-items: center; justify-content: space-between; flex-wrap: wrap; margin: 0 0 10px; padding: 10px 14px; border-radius: 8px; background: #EF4444; color: #fff; font-weight: 700; animation: erpStatusBlink 1s steps(2, start) infinite; }
.erpWartet .erpBtn { background: #fff; color: #b91c1c; border-color: #fff; }
.erp .erpNavWartet { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: #F59E0B; margin-left: 6px; vertical-align: middle; box-shadow: 0 0 0 2px rgba(245, 158, 11, .35); }
/* 21. Runde, 7-B: Fotos — Vorschau höchstens 120 × 90, Fortschritt im Knopf, Anhänge am Eintrag */
.erpFotos .erpFotoKl { width: 120px; height: 90px; }
.erpSpinner { display: inline-block; width: 12px; height: 12px; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; vertical-align: -2px; animation: erpDreh .8s linear infinite; }
@keyframes erpDreh { to { transform: rotate(360deg); } }
.erpBtn.laedt { opacity: .85; cursor: progress; }
.erpLogKn { display: inline-flex; gap: 4px; flex-wrap: wrap; }
.erpLinkKn { appearance: none; border: 0; background: none; color: inherit; text-decoration: underline; font: inherit; padding: 0; cursor: pointer; }
.erpAnlageKn { margin-top: 4px; }
/* 21. Runde, 7-C: die untere Leiste in EINER Zeile (≤ 48 px) — Uhr und Fristen kurz, Feld, 🕐, +, 📷 */
.erp:has(.erpDock.kompakt) { padding-bottom: 76px; }
.erpDock.kompakt { padding: 6px 10px calc(6px + env(safe-area-inset-bottom)); }
.erpDockZeile { display: flex; gap: 8px; align-items: center; min-height: 36px; max-height: 40px; }
.erpDock.kompakt .erpFristen { flex: 0 1 auto; max-width: 46%; padding-bottom: 0; gap: 4px; overflow-x: auto; scrollbar-width: none; }
.erpDock.kompakt .erpFristen::-webkit-scrollbar { display: none; }
.erpDock.kompakt .erpDockZeile:not(:has(form)) .erpFristen { max-width: 100%; }
.erpFrist.k { min-width: 0; flex-direction: row; align-items: center; padding: 4px 8px; border-width: 1px; border-radius: 7px; height: 32px; box-sizing: border-box; }
.erpFrist.k b { font-size: 13px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.erpDock.kompakt .erpEintrag { flex: 1 1 auto; min-width: 0; display: flex; gap: 4px; align-items: center; }
.erpDock.kompakt .erpEintrag input { flex: 1 1 auto; min-width: 60px; height: 36px; box-sizing: border-box; padding: 6px 10px; font-size: 16px; border-radius: 8px; }
.erpIkon { appearance: none; flex: none; height: 36px; min-width: 36px; padding: 0 8px; border-radius: 8px; border: 1px solid var(--e-line); background: var(--e-panel2); color: var(--e-ink); font: inherit; font-size: 17px; font-weight: 800; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 4px; }
.erpIkon.navy { background: #1C3557; border-color: #1C3557; color: #fff; font-size: 22px; }
.erpIkon b { font-size: 12px; font-weight: 700; white-space: nowrap; }
.erpIkon.erpEintragZeit.gesetzt { border-color: var(--e-amber); color: var(--e-amber); }
.erpIkon[hidden] { display: none; }
@media (max-width: 560px) { .erpDock.kompakt .erpEintrag { flex-wrap: nowrap; } .erpDock.kompakt .erpFristen { max-width: 40%; } .erpIkon { min-width: 34px; padding: 0 6px; } }
.erpDock.kompakt { padding-top: 5px; padding-bottom: calc(5px + env(safe-area-inset-bottom)); border-top-width: 1px; }
.erpDockZeile { min-height: 34px; max-height: 36px; }
.erpFrist.k { height: 30px; }
.erpDock.kompakt .erpEintrag input, .erpIkon { height: 34px; }
@media (max-width: 560px) { .erpIkon.erpEintragZeit b { display: none; } }
@media (max-width: 560px) { .erpDock.kompakt .erpFristen { max-width: 33%; } .erpDock.kompakt .erpEintrag input { padding: 6px 8px; } }
/* 21. Runde, 7-D: Ereignisprotokoll nach Ergebnis — Randstreifen 3 px, Hintergrund 8 % */
.erpLogZ.f-gruen { box-shadow: inset 3px 0 0 #22C55E; background: rgba(34, 197, 94, .08); }
.erpLogZ.f-rot { box-shadow: inset 3px 0 0 #EF4444; background: rgba(239, 68, 68, .08); }
/* 21. Runde, 7-A: Aufträge — offene schweben über dem Protokoll (blau-grau, Navy-Balken), überfällig rot */
.erpAuftraege { display: flex; flex-direction: column; gap: 6px; margin: 0 0 10px; position: sticky; top: var(--suite-h, 0px); z-index: 5; }
.erpAuftrag { display: flex; gap: 10px; align-items: center; justify-content: space-between; padding: 8px 12px; border-radius: 8px; background: rgba(100, 125, 160, .16); box-shadow: inset 4px 0 0 #1C3557; }
.erpAuftrag.oben { background: #263447; }
.erpAuftrag.faellig { background: rgba(239, 68, 68, .18); box-shadow: inset 4px 0 0 #EF4444; }
.erpAuftrag.erledigt { background: rgba(34, 197, 94, .08); box-shadow: inset 4px 0 0 #22C55E; }
.erpAuftragTx { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.erpAuftragTx span { font-size: 12.5px; color: var(--e-dim); }
.erpAuftragOk { color: var(--e-gruen) !important; font-weight: 700; }
.erpAuftragHk { flex: none; display: inline-flex; gap: 6px; align-items: center; font-weight: 700; font-size: 13px; cursor: pointer; white-space: nowrap; }
.erpAuftragHk input { width: 20px; height: 20px; }
.erpLogZ .erpAuftrag { margin-top: 6px; }
.erpAuftragNeu { margin: 0 0 10px; }
.erpAuftragNeu summary { cursor: pointer; font-weight: 700; color: #93c5fd; }
.erpAuftragForm { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1.4fr) minmax(0, 1fr) auto; gap: 6px; margin-top: 6px; }
.erpAuftragForm input { font: inherit; font-size: 15px; padding: 8px 10px; border-radius: 8px; border: 1px solid var(--e-line); background: var(--e-panel2); color: var(--e-ink); min-width: 0; }
@media (max-width: 700px) { .erpAuftragForm { grid-template-columns: minmax(0, 1fr); } }
/* 21. Runde, 8-B: Besatzung vorausgefüllt */
.erpCrewQuelle { font-size: 12px; color: var(--e-dim); font-weight: 400; margin-left: 6px; }
.erpCrewVermutlich { margin-top: 8px; }
/* 21. Runde, 10-F: der Lage-Bildschirm — Status-Punkt, Info-Zeile, Karte über die ganze Fläche */
.erpVollStatus { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 8px 14px; border-radius: 8px; color: #fff; }
.erpVollStatus.vor { background: #B45309; } .erpVollStatus.alarm { background: #B91C1C; } .erpVollStatus.aus { background: #374151; }
.erpVollStatus.ueb { box-shadow: inset 0 0 0 2px #3b82f6; }
.erpVollPunkt { width: 14px; height: 14px; border-radius: 50%; background: #9CA3AF; flex: none; }
.erpVollStatus.vor .erpVollPunkt { background: #F59E0B; animation: erpBlink 1s steps(2, start) infinite; box-shadow: 0 0 0 2px #fff; }
.erpVollStatus.alarm .erpVollPunkt { background: #EF4444; animation: erpBlink 1s steps(2, start) infinite; box-shadow: 0 0 0 2px #fff; }
.erpVollInfo { font-weight: 600; } .erpVollStatus .spacer { flex: 1; }
.erpVollUhr { font-variant-numeric: tabular-nums; font-size: 18px; }
.erp.solo:has(.erpVollKarte) { max-width: none; }
.erpKarteBox.voll #erpKarteVoll { height: calc(100dvh - 80px); }
/* 21. Runde, 10-E: Lage & Karte — schmaler Datenkopf, die Karte als Hauptsache, vier Knöpfe in einer Zeile */
.erpLageKopf { padding: 8px 12px; margin-bottom: 8px; }
.erpLageZ1 { font-size: 13px; letter-spacing: .04em; } .erpLageZ1 b { color: #93c5fd; }
.erpLageZ2 { font-size: 14px; margin-top: 2px; }
.erpLageGross canvas { height: max(320px, calc(100dvh - 365px)) !important; }
.erpLageVier { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin: 8px 0 4px; }
.erpLageVier .erpBtn { justify-content: center; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 560px) { .erpLageVier { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.erpLageWerkzeuge { padding: 8px 12px; }
.erpRadiusEigen { display: inline-flex; gap: 6px; align-items: center; }
.erpRadiusEigen input { width: 90px; font: inherit; font-size: 16px; padding: 6px 8px; border-radius: 8px; border: 1px solid var(--e-line); background: var(--e-panel2); color: var(--e-ink); }
.erpBildKl { width: 160px !important; height: 100px !important; margin-top: 4px; }
.erpCiso { margin: 8px 0 0; padding: 8px 10px; border-radius: 8px; background: rgba(59, 130, 246, .12); box-shadow: inset 3px 0 0 #3b82f6; }
.erpChip.pd.on { background: #1C3557; border-color: #1C3557; color: #fff; }
/* 21. Runde, 15-A: die Erstmitteilung als bearbeitbares Feld */
textarea.erpStatement { display: block; width: 100%; box-sizing: border-box; min-height: 150px; border: 1px solid #cbd5e1; resize: vertical; }
/* (10-F: Kopf und Reiter des Lage-Bildschirms wirklich weg — ihr display: flex übersteuerte sonst „hidden“) */
.erpSoloKopf[hidden], .erpNav[hidden] { display: none !important; }

/* Teil B: die Rückmeldung an den Melder und seine Eingabeleiste (ohne Uhrzeit) */
.erpMelder { border: 2px solid var(--e-amber); border-radius: 14px; padding: 16px 18px; background: var(--e-panel); display: flex; flex-direction: column; gap: 10px; margin-bottom: 14px; }
.erpMelder.voll { border-color: var(--e-gruen); } .erpMelder.ueb { border-color: #3b82f6; }
.erpMelderStand { margin: 0; font-size: 18px; font-weight: 800; color: var(--e-amber); } .erpMelder.voll .erpMelderStand { color: var(--e-gruen); } .erpMelder.ueb .erpMelderStand { color: #60a5fa; }
.erpMelder .erpBestGuide { margin: 0; }
/* Teil B: Einstellungen › Rollen */
.erpRollen { border-collapse: collapse; width: 100%; font-size: 14px; } .erpRollen th, .erpRollen td { padding: 6px 8px; border-bottom: 1px solid var(--e-line); text-align: left; vertical-align: middle; }
.erpRollen td input[type="checkbox"] { width: 20px; height: 20px; } .erpRollen tr.anders td { background: rgba(245, 158, 11, .14); }
.erpRolleAdmin { font-size: 11px; font-weight: 700; padding: 1px 6px; border-radius: 6px; background: var(--e-navy); color: #fff; }
/* Teil C: die Notfall-Umschaltung — der rote Balken auf jedem Reiter (orange: übernommen), nicht wegzuklicken */
.erpUmBalken { position: fixed; top: 0; left: 0; right: 0; z-index: 2147483000; display: flex; align-items: center; gap: 14px; flex-wrap: wrap; padding: 10px 16px; background: #dc2626; color: #fff; font: 600 15px/1.35 system-ui, -apple-system, "Segoe UI", sans-serif; box-shadow: 0 4px 18px rgba(0,0,0,.35); animation: erpUmPuls 1.1s ease-in-out infinite; }
.erpUmBalken.uebernommen { background: #ea580c; animation: none; }
@keyframes erpUmPuls { 50% { background: #7f1d1d; } }
.erpUmText { display: flex; flex-direction: column; gap: 2px; flex: 1 1 280px; min-width: 0; } .erpUmText b { font-size: 16px; letter-spacing: .02em; }
.erpUmMehr { font-weight: 500; opacity: .95; } .erpUmZahl { display: inline-block; min-width: 22px; padding: 0 6px; margin-left: 6px; border-radius: 11px; background: #fff; color: #b91c1c; text-align: center; font-weight: 800; }
.erpUmKnopf { appearance: none; border: 2px solid #fff; background: #fff; color: #b91c1c; font: 800 15px/1 system-ui, sans-serif; padding: 10px 16px; border-radius: 10px; cursor: pointer; }
.erpUmBalken.uebernommen .erpUmKnopf { color: #c2410c; }
body.erpUmAn { padding-top: var(--erp-um-h, 64px); }
.erpUmHinweis { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%); z-index: 2147483001; background: #1e293b; color: #fff; padding: 10px 16px; border-radius: 10px; font: 500 14px/1.4 system-ui, sans-serif; box-shadow: 0 6px 20px rgba(0,0,0,.35); max-width: calc(100vw - 32px); }
/* die Schnellzugriff-Kachel (fest oben rechts, verschiebbar) rückt unter den Balken */
body.erpUmAn .schnellKachel { transform: translateY(var(--erp-um-h, 64px)); }

/* Laufende Ereignisse als fester Bereich über NOTFALL MELDEN (Clemens, 2026-10-24, B-3) — nur, solange etwas läuft. */
.erpPanel.erpLaufend { border-left: 5px solid var(--e-rot, #dc2626); }
.erpPanel.erpLaufend h3 { color: var(--e-rot, #dc2626); }
/* Die Leitstelle liest nur (A.1): der Haken der Checkliste ohne Knopf, in derselben Größe. */
.erpPunkt2 .hk.lesend { display: inline-flex; align-items: center; justify-content: center; cursor: default; opacity: .85; }
/* Datenverwaltung (Clemens, 2026-10-24, Teil C): Import-Karten, der Bericht des Probelaufs, die Landeplatz-Tabelle. */
.erpDaten summary .dim { font-weight: 400; }
.erpDatenBericht { border: 1px solid var(--e-line); border-radius: 10px; padding: 10px 14px; margin: 8px 0 12px; }
.erpDatenBericht.fertig { border-color: var(--e-gruen); }
.erpDatenBericht h4 { margin: 0 0 6px; }
.erpDatenBericht .rot { color: var(--e-rot); }
.erpDatenHinweise { margin: 4px 0 8px 18px; }
.erpLpFilter .erpFeld.schmal input, .erpLpFilter .erpFeld.schmal select { min-width: 120px; }
.erpLpTab td, .erpLpTab th { white-space: nowrap; }
.erpLpTab td:nth-child(2) { white-space: normal; min-width: 200px; }
.erpHintergrund .erpKontakt.pruefen { border-left: 3px solid var(--e-amber); padding-left: 8px; }

/* „Nächste Übung fällig“ (Clemens, Runde 4 2-5): Kachel für SM/CMM, Ampel wie die Fristen */
.erpUebFaellig h3 { display: flex; align-items: center; gap: 8px; }
.erpAmpel { display: inline-block; width: 12px; height: 12px; border-radius: 50%; flex: 0 0 auto; }
.erpUebFaellig.a-rot { border-left: 4px solid #EF4444; }
.erpUebFaellig.a-gelb { border-left: 4px solid #F59E0B; }
.erpUebFaellig.a-gruen { border-left: 4px solid #22C55E; }
.erpUebFDatum { margin: 4px 0; font-size: 15px; }
/* myERP › Datenverwaltung (Clemens, Runde 5 A5): ein Bereich „Datenimport“, die Vorlagen als eine Auswahlliste, „Erkannt: …“ */
.erpVorlageWahl { min-height: 44px; padding: 6px 30px 6px 12px; border-radius: 8px; border: 1px solid var(--e-line); background: var(--e-panel2); color: var(--e-ink); font: inherit; }
.erpDvErkannt { margin-top: 12px; padding: 12px 14px; border-radius: 10px; border: 1px solid var(--e-line); background: var(--e-panel2); }
.erpDvErkannt p { margin: 0 0 8px; }
.erpDvErkannt .erpReihe { align-items: flex-end; }
.erpDvErkannt .erpFeld { margin: 0; flex: 0 1 240px; }
.erpDvErkannt .erpFeld select { min-height: 40px; }
.erpDvStand td { vertical-align: top; }
.erpDvSich { display: inline-block; margin-left: 6px; font-size: 13px; }
.erpDvSich summary { cursor: pointer; }
.erpDvSpalten { margin: 8px 0 12px; }
.erpDvSpalten h4 { margin: 6px 0 2px; }