/* Kummer Toni · Intern – Oberfläche (PC, Android, iPhone)

   Inhalt
   1. Tokens (:root) und Dunkelmodus – neue Farben immer hier und im Dunkel-Block anlegen
   2. Grundlagen: Tippflächen, Silbentrennung, Kopfzeile, Elemente, Anmeldung
   3. Ansichten: Anwesenheit, Dialog, Verwaltung, Standorte, Besprechung,
      Standortkalender, Anwesenheit-Monatsübersicht, Stundenaufzeichnungen
   4. Einheitliche Rahmen, Abschlussprüfung iPhone/iPad, mobile-ui Etappe 3 und 4
   5. Anpassungen je Bildschirmbreite (@media, von breit nach schmal)
   6. Druck (alle Druckregeln gesammelt, am Ende)
*/
:root {
  color-scheme: light dark;
  /* Flächen und Text */
  --bg: #f4f6f3; /* Seitenhintergrund */
  --surface: #ffffff; /* Karten, Felder, Knöpfe */
  --surface-2: #eef1ef; /* abgesetzte Flächen: Wochenende, gesperrt */
  --surface-3: #f7f9f7; /* ganz leicht getönt: Hover, Fußleisten */
  --head: #e7eee9;      /* Tabellenköpfe */
  --text: #1c2320; /* 15.9:1 auf surface */
  --text-muted: #5d6a63; /*  5.7:1 auf surface, 5.2:1 auf bg */
  --border: #6f7d75; /*  4.3:1 auf surface – Feldrahmen, Knöpfe */
  --divider: #d9e0dc; /* nur dekorative Linien */
  --linie: #b9c4bd; /* Tabellenlinien */
  --linie-stark: #8fa198; /* kräftige Tabellenrahmen */
  --hover: rgba(0,0,0,.06);
  /* Hausfarbe */
  --brand: #1f5f3f; /* Kopfzeile */
  --on-brand: #ffffff; /*  7.6:1 */
  --primary: #1f5f3f; /* Hauptknopf, Links, Auswahl – 7.6:1 auf surface */
  --primary-hover: #164530;
  --on-primary: #ffffff;
  --primary-soft: #e4f0e8; /* ausgewählt/angehakt */
  --primary-mid: #cfe5d7;
  --primary-line: #9cc9ad;
  --focus: #1f5f3f;
  /* Status */
  --danger: #b3261e; /*  6.5:1 */
  --danger-hover: #8f1d17;
  --on-danger: #ffffff;
  --danger-soft: #fbe9e7;
  --danger-soft-2: #fdeceb; /* inaktive Zeilen */
  --danger-soft-hover: #fbdedb;
  --danger-line: #e6b8b3;
  --warning: #8a5a00; /*  6.8:1 */
  --warning-text: #4d3500;
  --warning-soft: #fff4dc;
  --warning-soft-hover: #ffecc4;
  --warning-line: #a87118;
  --info: #1d4f91;
  --info-accent: #1d6fb8;
  --info-soft: #e8f0fb;
  --info-line: #7aa2d6;
  --orange: #d97706;
  --orange-soft: #fff1e0;
  --orange-line: #f3c48a;
  --hilite: #fff7d6; /* Zeile ohne Angabe */
  --hilite-line: #e0a800;
  --ins-bg: #c9efd6; --ins-text: #0c4a26;
  --del-bg: #fbd5d1; --del-text: #7a1a13;
  --toast-bg: #23302a; --toast-text: #ffffff;
  --backdrop: rgba(15,25,20,.45);
  --shadow: 0 1px 3px rgba(0,0,0,.08), 0 4px 14px rgba(0,0,0,.05);
  /* alte Namen – verweisen auf die Tokens */
  --green: var(--primary); --green-dark: var(--primary-hover); --green-light: var(--primary-soft); --green-mid: var(--primary-mid);
  --red: var(--danger); --red-light: var(--danger-soft); --amber: var(--warning); --amber-light: var(--warning-soft);
  --blue-light: var(--info-soft); --orange-light: var(--orange-soft);
  --ink: var(--text); --muted: var(--text-muted); --line: var(--divider); --card: var(--surface);
  --radius: 10px;
  --tap: 44px;
}
/* Dunkelmodus: folgt der Systemeinstellung, mit <html data-theme="dark|light"> erzwingbar.
   Nur am Bildschirm – gedruckt wird immer hell. */
@media screen and (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --sk-frei: #3a2326; --sk-frei-kopf: #4a2a2e;
    --bg: #121714; --surface: #1a201c; --surface-2: #252c28; --surface-3: #1f2622; --head: #232b26;
    --text: #e6ebe8; /* 13.7:1 auf surface */
    --text-muted: #a9b5ae; /*  7.8:1 */
    --border: #7c8a82; /*  4.6:1 auf surface, >= 3.6:1 überall */
    --divider: #313a35; --linie: #3b4640; --linie-stark: #56645c;
    --hover: rgba(255,255,255,.08);
    --brand: #1a4a33; --on-brand: #ffffff;
    --primary: #7fc79c; /*  8.3:1 auf surface */
    --primary-hover: #99d4b0; --on-primary: #0b2616;
    --primary-soft: #1d3528; --primary-mid: #2a4a3a; --primary-line: #4f8a68;
    --focus: #7fc79c;
    --danger: #f2a19b; --danger-hover: #f6bcb7; --on-danger: #1a0a09;
    --danger-soft: #3a1f1d; --danger-soft-2: #2e1c1b; --danger-soft-hover: #43241f; --danger-line: #9a5a55;
    --warning: #f2b45a; --warning-text: #f2d49a; --warning-soft: #33290f; --warning-soft-hover: #3d3113; --warning-line: #a07a2c;
    --info: #9cc0f0; --info-accent: #8ab4f8; --info-soft: #1a2a40; --info-line: #5b7fb0;
    --orange: #f0a860; --orange-soft: #3a2a14; --orange-line: #9a6a2a;
    --hilite: #3a3413; --hilite-line: #c9a227;
    --ins-bg: #1f4a2e; --ins-text: #c9efd6; --del-bg: #4a211d; --del-text: #fbd5d1;
    --toast-bg: #e6ebe8; --toast-text: #121714;
    --backdrop: rgba(0,0,0,.6);
    --shadow: none;
  }
}
@media screen {
  :root[data-theme="dark"] {
    --sk-frei: #3a2326; --sk-frei-kopf: #4a2a2e;
    --bg: #121714; --surface: #1a201c; --surface-2: #252c28; --surface-3: #1f2622; --head: #232b26;
    --text: #e6ebe8; /* 13.7:1 auf surface */
    --text-muted: #a9b5ae; /*  7.8:1 */
    --border: #7c8a82; /*  4.6:1 auf surface, >= 3.6:1 überall */
    --divider: #313a35; --linie: #3b4640; --linie-stark: #56645c;
    --hover: rgba(255,255,255,.08);
    --brand: #1a4a33; --on-brand: #ffffff;
    --primary: #7fc79c; /*  8.3:1 auf surface */
    --primary-hover: #99d4b0; --on-primary: #0b2616;
    --primary-soft: #1d3528; --primary-mid: #2a4a3a; --primary-line: #4f8a68;
    --focus: #7fc79c;
    --danger: #f2a19b; --danger-hover: #f6bcb7; --on-danger: #1a0a09;
    --danger-soft: #3a1f1d; --danger-soft-2: #2e1c1b; --danger-soft-hover: #43241f; --danger-line: #9a5a55;
    --warning: #f2b45a; --warning-text: #f2d49a; --warning-soft: #33290f; --warning-soft-hover: #3d3113; --warning-line: #a07a2c;
    --info: #9cc0f0; --info-accent: #8ab4f8; --info-soft: #1a2a40; --info-line: #5b7fb0;
    --orange: #f0a860; --orange-soft: #3a2a14; --orange-line: #9a6a2a;
    --hilite: #3a3413; --hilite-line: #c9a227;
    --ins-bg: #1f4a2e; --ins-text: #c9efd6; --del-bg: #4a211d; --del-text: #fbd5d1;
    --toast-bg: #e6ebe8; --toast-text: #121714;
    --backdrop: rgba(0,0,0,.6);
    --shadow: none;
  }
}
:root[data-theme="light"] { color-scheme: light; }

/* Finger-Bedienung: Tippflächen mindestens 48 x 48 px */

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--bg); color: var(--ink);
  overflow-wrap: break-word;
  font: 1rem/1.55 system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
[hidden] { display: none !important; }
button, input, select, textarea { font: inherit; color: inherit; }
input, select, textarea { font-size: 1rem; } /* verhindert Auto-Zoom auf dem iPhone */
a { color: var(--green); }
h1, h2, h3 { line-height: 1.25; margin: 0 0 .6em; text-wrap: balance; }
/* Silbentrennung nur für lange Wörter; Knöpfe und Reiter nie trennen */
h1, h2, h3, h4, p, li, dd, td, .prose, .msg, .hint, .empty, .hinweis-box, .banner, .counter,
.besp-eintrag-text, .besp-antwort-text, .besp-verlauf-text {
  -webkit-hyphens: auto; hyphens: auto; hyphenate-limit-chars: 10 4 4;
}
button, .btn, .subtab, .badge { -webkit-hyphens: none; hyphens: none; }
table.data { line-height: 1.4; }
h1 { font-size: 1.45rem; }
h2 { font-size: 1.2rem; }
h3 { font-size: 1.05rem; }
.noscript { padding: 2rem; text-align: center; }
.muted { color: var(--muted); }
.small { font-size: .88rem; }
.nowrap { white-space: nowrap; }

/* ---------- Kopfzeile ---------- */
.topbar {
  position: sticky; top: 0; z-index: 30; background: var(--brand); color: var(--on-brand);
  padding-top: env(safe-area-inset-top, 0px); box-shadow: 0 2px 6px rgba(0,0,0,.15);
}
.topbar-inner { display: flex; align-items: center; gap: 12px; padding: 6px 16px; min-height: 56px; }
.brand { display: flex; align-items: center; gap: 8px; font-weight: 700; white-space: nowrap; }
.brand img { border-radius: 7px; background: #fff2; }

.userbox { display: flex; align-items: center; gap: 8px; white-space: nowrap; }
.user-name { font-size: .9rem; opacity: .9; }
.topbar .btn-ghost { color: var(--on-brand); border-color: rgba(255,255,255,.75); }
.topbar .btn-ghost:hover { background: rgba(255,255,255,.12); }

.banner { padding: 10px 16px; font-size: .92rem; border-bottom: 1px solid var(--line); }
.banner-info { background: var(--blue-light); }
.banner-warn { background: var(--amber-light); color: var(--warning-text); }
.banner-warn ul { margin: 0; padding-left: 1.2em; }
/* Admin: „📣 … brauchen Hilfe“ – auffällig auf jeder Seite (Nutzer 14.10.2026) */
.banner-hilfe { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; background: var(--danger-soft); color: var(--danger);
  border-left: 6px solid var(--danger); border-bottom: 1px solid var(--danger-line); font-size: 1rem; }
.banner-hilfe[hidden] { display: none; }
.hilfe-titel { flex: 0 1 auto; }
.hilfe-namen { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; flex: 1 1 16rem; min-width: 0; }
.banner-hilfe .btn.hilfe-name { background: var(--surface); border-color: var(--danger-line); color: var(--text); white-space: normal; text-align: left; }
.hilfe-mehr { font-size: .875rem; font-weight: 600; }
.banner-hilfe .btn.hilfe-ansehen { background: var(--danger); border-color: var(--danger); color: var(--on-danger); }
.banner-hilfe .btn.hilfe-ansehen:hover { filter: brightness(1.1); }
.tab-blase.hilfe-blase { background: var(--danger); }
.hilfe-kurz, .hilfe-zeile { display: none; }
/* Standortkalender: Gesamtauflistung (Planung) – Maske wie die Gesamtauflistung der Stunden (Nutzer 14.10.2026) */
.sk-plan-ort { display: block; font-size: .75rem; color: var(--muted); line-height: 1.2; overflow-wrap: anywhere; }
table.std-ges-tab.sk-plan-tab td.sk-plan-frei { background: var(--amp-bg); color: var(--amp-text); white-space: nowrap; }
table.std-ges-tab.sk-plan-tab .sk-plan-ampel-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
table.std-ges-tab.sk-plan-tab th.sk-ueb-person { min-width: 8.5rem; }
/* passt am PC (1366 px mit Seitenleiste) ohne seitliches Scrollen – „Noch frei“ muss immer im Blick sein; Handy: Karten wie gehabt */
@media screen and (min-width: 701px) {
  table.std-ges-tab.sk-plan-tab th, table.std-ges-tab.sk-plan-tab td { padding: 6px 6px; }
  table.std-ges-tab.sk-plan-tab .std-ges-tag { min-width: 4.2rem; }
  table.std-ges-tab.sk-plan-tab input.std-ges-limit { width: 4.5rem; }
  table.std-ges-tab.sk-plan-tab thead th { white-space: normal; }
  table.std-ges-tab.sk-plan-tab .sk-plan-kopf-tag { display: block; }
  table.std-ges-tab.sk-plan-tab .std-ges-zeit { white-space: normal; }
}
table.std-ges-tab.sk-plan-tab tbody th.sk-ueb-person { box-shadow: inset 5px 0 0 var(--amp-kante); padding-left: 12px; }
@media screen and (max-width: 700px) {
  .banner-hilfe { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 8px; padding: 6px 10px; }
  .banner-hilfe[hidden] { display: none; }
  .hilfe-lang, .hilfe-namen { display: none !important; }
  .hilfe-kurz { display: inline; }
  .hilfe-titel { grid-column: 1; grid-row: 1; align-self: center; }
  .hilfe-zeile { display: block; grid-column: 1; grid-row: 2; font-size: .875rem; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .banner-hilfe .btn.hilfe-ansehen { grid-column: 2; grid-row: 1 / span 2; align-self: center; }
}
.nav-mehr { position: relative; }

.main { max-width: 1400px; margin: 0 auto; padding: 16px; padding-bottom: calc(40px + env(safe-area-inset-bottom, 0px)); outline: none; }

/* ---------- Elemente ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  min-height: var(--tap); padding: 0 16px; border-radius: 8px; border: 1px solid var(--border); line-height: 1.25;
  background: var(--surface); cursor: pointer; font-weight: 600; text-decoration: none; color: var(--ink);
  -webkit-tap-highlight-color: transparent;
}
.btn:hover { border-color: var(--ink); background: var(--surface-3); }
:focus-visible, .chk:focus-within { outline: 3px solid var(--focus); outline-offset: 2px; }
.topbar:focus-visible { outline-color: var(--on-brand); }
.main:focus-visible { outline: none; }
.btn-primary { background: var(--green); border-color: var(--green); color: var(--on-primary); }
.btn-primary:hover { background: var(--green-dark); border-color: var(--green-dark); }
.btn-danger { color: var(--red); border-color: var(--red); }
.btn-danger:hover { background: var(--red-light); }
.btn-ghost { background: transparent; }
.btn[disabled] { opacity: .5; cursor: not-allowed; }
.btn-icon { border: 0; background: transparent; font-size: 1.75rem; line-height: 1; width: var(--tap); height: var(--tap); cursor: pointer; border-radius: 8px; }
.btn-icon:hover { background: var(--surface-2); }

.field { display: flex; flex-direction: column; gap: 4px; margin-bottom: 12px; }
.field label { font-weight: 600; font-size: .9rem; }
.field input, .field select, .field textarea, .input {
  min-height: var(--tap); padding: 8px 12px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); width: 100%;
}
.field textarea { min-height: 88px; resize: vertical; }
.field .hint { font-size: .875rem; color: var(--muted); }
.grid-2 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 12px; }
.grid-plz { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 0 12px; }
.check-line { display: flex; align-items: center; gap: 10px; min-height: var(--tap); cursor: pointer; }
.check-line input { width: 22px; height: 22px; accent-color: var(--green); }

.card { background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow); padding: 16px; margin-bottom: 16px; }
.toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 12px; }
.toolbar .spacer { flex: 1; }
.toolbar .search { flex: 1 1 220px; max-width: 360px; }
.toolbar select.input { width: auto; flex: 0 0 auto; min-width: 140px; }
.badge { display: inline-block; padding: 2px 8px; border-radius: 99px; font-size: .875rem; font-weight: 700; background: var(--surface-2); color: var(--muted); white-space: nowrap; }
.badge-green { background: var(--green-light); color: var(--green); }
.badge-red { background: var(--red-light); color: var(--red); }
.badge-amber { background: var(--amber-light); color: var(--amber); }
.badge-blue { background: var(--blue-light); color: var(--info); }
.empty { text-align: center; padding: 32px 16px; color: var(--muted); }
.error-text { color: var(--red); font-weight: 600; }

/* ---------- Anmeldung ---------- */
.login-wrap { min-height: 100vh; min-height: 100dvh; display: grid; place-items: center; padding: 16px; }
.login-card { width: 100%; max-width: 420px; background: var(--surface); border-radius: 14px; box-shadow: var(--shadow); padding: 28px 24px; }
.login-card .logo { display: flex; align-items: center; gap: 10px; margin-bottom: 18px; }
.login-card .logo img { border-radius: 10px; }
.login-card .logo strong { font-size: 1.2rem; }
.login-card .btn { width: 100%; margin-top: 4px; }
.code-input { letter-spacing: .5em; text-align: center; font-size: 1.5rem !important; font-variant-numeric: tabular-nums; }
.login-links { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; margin-top: 16px; font-size: .9rem; }
.linkbtn { background: none; border: 0; padding: 8px 0; color: var(--green); text-decoration: underline; cursor: pointer; min-height: var(--tap); }
.msg { padding: 10px 12px; border-radius: 8px; margin-bottom: 12px; font-size: .92rem; }
.msg-info { background: var(--green-light); }
.msg-error { background: var(--red-light); color: var(--red); }
.msg-warn { background: var(--amber-light); color: var(--warning-text); }
.test-code { font-size: 1.6rem; font-weight: 800; letter-spacing: .2em; display: block; margin-top: 4px; }

/* ---------- Anwesenheit ---------- */
.datebar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.datebar .date-input { width: auto; min-width: 160px; }
.date-label { font-weight: 700; font-size: 1.1rem; margin-right: 6px; }
.counters { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 12px; }
.counter { background: var(--surface); border: 1px solid var(--line); border-radius: 99px; padding: 4px 12px; font-size: .88rem; white-space: nowrap; }
.counter b { font-variant-numeric: tabular-nums; }

.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; background: var(--surface); border-radius: var(--radius); box-shadow: var(--shadow); }
table.data { width: 100%; }
table.data th, table.data td { padding: 8px 10px; text-align: left; vertical-align: middle; }
table.data thead th { position: sticky; top: 0; font-size: .875rem; text-transform: none; z-index: 2; white-space: nowrap; }
table.data > tbody > tr:hover > td { background: var(--surface-3); }
table.data tr.clickable { cursor: pointer; }
table.data tr.inaktiv td { color: var(--muted); }

.anw th.grp { text-align: center; border-left: 1px solid var(--line); }
.anw th.c, .anw td.c { text-align: center; padding-left: 4px; padding-right: 4px; }
.anw td.sep, .anw th.sep { border-left: 1px solid var(--line); }
.anw td.name { font-weight: 600; white-space: nowrap; }
.anw td.name, .anw th.name { position: sticky; left: 0; background: var(--surface); z-index: 1; }
.anw thead th.name { background: var(--head); z-index: 3; }
.anw td.notiz { min-width: 220px; width: 30%; }
.anw .vn-m { display: none; }
/* Stammdaten-Leisten ab 901 px: 36 px hoch, Filter schmal in einer Zeile (Bau-Regel, 19.10.2026) */
@media screen and (min-width: 901px) {
  .stamm-leiste { gap: 6px; margin-bottom: 6px; }
  .stamm-leiste .btn, .stamm-leiste .input { min-height: 36px; height: 36px; padding-top: 0; padding-bottom: 0; }
  .stamm-leiste .btn { padding-left: 10px; padding-right: 10px; font-size: .9375rem; }
  .stamm-leiste .badge { white-space: nowrap; }
  .stamm-leiste h1 { font-size: 1.25rem; }
  .stamm-filter { flex-wrap: nowrap; }
  .stamm-filter .input { flex: 1 1 0; min-width: 0; max-width: 15rem; }
  .stamm-filter .search { max-width: 18rem; }
}
/* Stammdaten (19.10.2026): Vorname unter dem Namen, Anschrift/Kontakt zweizeilig – Tabelle passt ab Tablet quer ohne Wischen */
.stamm .vn-inline { display: block; font-weight: 400; color: var(--muted); font-size: .875rem; }
.stamm td.st-zwei span { display: block; }
.stamm td.st-zwei span + span { color: var(--muted); font-size: .875rem; }
.stamm td.st-kontakt { overflow-wrap: anywhere; max-width: 16rem; }
.stamm td.st-adr { max-width: 15rem; }
.stamm td.st-notiz { max-width: 14rem; }
.anw tfoot td { background: var(--green-light); font-weight: 700; border-top: 2px solid var(--green); position: sticky; bottom: 0; z-index: 2; white-space: nowrap; }
.anw tfoot td.name { z-index: 3; background: var(--green-light); }

.anw td.notiz input { width: 100%; min-height: 38px; padding: 6px 10px; border: 1px solid var(--border); border-radius: 8px; }
.anw tr.saving td.name::after { content: " …"; color: var(--muted); font-weight: 400; }
.anw tr.saved td.name::after { content: " ✓"; color: var(--green); }
.anw tr.err td.name::after { content: " ⚠"; color: var(--red); }
.anw .inaktiv-hinweis { font-weight: 400; }
.chk { display: inline-flex; align-items: center; justify-content: center; min-width: var(--tap); min-height: var(--tap); cursor: pointer; border-radius: 8px; }
.chk input { width: 24px; height: 24px; margin: 0; accent-color: var(--green); cursor: pointer; }
/* Häkchen nie zusammendrücken – lange Beschriftungen brechen stattdessen um */
.chk input { flex: 0 0 auto; }
.chk .lbl { min-width: 0; overflow-wrap: anywhere; -webkit-hyphens: none; hyphens: none; } /* nur umbrechen, wenn das Wort gar nicht passt */
.chk .lbl { display: none; }
.anw td.krank .chk input, .anw td.abw .chk input { accent-color: var(--red); }
.anw td.urlaub .chk input { accent-color: var(--info-accent); }

/* ---------- Dialog ---------- */
.dialog { border-radius: 14px; padding: 0; width: min(640px, calc(100vw - 24px)); max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); box-shadow: 0 20px 60px rgba(0,0,0,.3); color: var(--ink); }
.dialog.wide { width: min(1100px, calc(100vw - 24px)); }
.dialog::backdrop { background: var(--backdrop); }
.dialog-form { display: flex; flex-direction: column; max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); margin: 0; }
.dialog-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 12px 12px 8px 20px; border-bottom: 1px solid var(--line); }
.dialog-head h2 { margin: 0; font-size: 1.15rem; }
.dialog-body { padding: 16px 20px; overflow-y: auto; }
.dialog-foot { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; padding: 12px 20px calc(12px + env(safe-area-inset-bottom, 0px)); border-top: 1px solid var(--line); background: var(--surface-3); }
.dialog-foot .left { margin-right: auto; display: flex; gap: 8px; flex-wrap: wrap; }
.codes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; font: 700 1.05rem/1.4 ui-monospace, Consolas, monospace; }
.codes span { background: var(--head); padding: 8px; border-radius: 6px; text-align: center; }
.prose p { margin: 0 0 .7em; }

/* ---------- Toast ---------- */
.toast {
  position: fixed; left: 50%; bottom: calc(20px + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%);
  background: var(--toast-bg); color: var(--toast-text); padding: 12px 18px; border-radius: 10px; box-shadow: var(--shadow); z-index: 100;
  max-width: calc(100vw - 32px); font-weight: 600;
}
.toast.error { background: var(--red); }

/* ---------- Verwaltung ---------- */
.subtabs { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 14px; }
.subtab { border: 1px solid var(--border); background: var(--surface); border-radius: 99px; padding: 0 16px; min-height: 40px; cursor: pointer; font-weight: 600; }
.subtab[aria-current="page"] { background: var(--green); border-color: var(--green); color: var(--on-primary); }
.form-row { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; }
.form-row .field { min-width: 160px; }
.pager { display: flex; align-items: center; gap: 8px; justify-content: flex-end; margin-top: 10px; }
.import-summary { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 12px; }
.import-table select { min-height: 36px; padding: 4px 8px; border-radius: 6px; border: 1px solid var(--border); font-size: .875rem; }
.kv { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 4px 14px; margin: 0; }
.kv dt { font-weight: 600; }
.kv dd { margin: 0; }

/* ---------- Drucken ---------- */

.print-only { display: none; }

/* ---------- Verschiedenes ---------- */
.import-table select { max-width: 200px; }
.banner-warn { position: relative; padding-right: 48px; }
.banner-close { position: absolute; top: 4px; right: 6px; border: 0; background: transparent; font-size: 1.375rem; width: 40px; height: 40px; cursor: pointer; color: inherit; border-radius: 8px; }
.banner-close:hover { background: var(--hover); }
.responsive-cards td { overflow-wrap: anywhere; }
input[type=file] { max-width: 100%; }

/* ---------- Kompaktere Handy-Ansicht ---------- */

.brand-short { display: none; }

/* Häkchen-Farben: „nein“ = rot, Bus = orange */
.anw td.nein .chk input { accent-color: var(--red); }
.anw td.bus .chk input { accent-color: var(--orange); }

/* Import-Abgleich */
.btn-mini { min-height: 30px; padding: 0 8px; font-size: .875rem; font-weight: 600; }
.import-table > tbody > tr.open > td { background: var(--surface-3); }
.import-table tr.cmp-row > td { background: var(--surface-3); padding: 8px 10px 14px; }
.cmp { background: var(--surface); border: 1px solid var(--line); border-radius: 10px; padding: 12px; }
.cmp-table td { vertical-align: top; }
.cmp-table td .input { min-height: 38px; padding: 6px 10px; }
.cmp .cmp-table > tbody > tr.diff > td { background: var(--amber-light); }
.cmp-table th:last-child, .cmp-table td:last-child { width: 38%; }
.import-table select.aktion { max-width: 230px; }

.btn { white-space: nowrap; }

/* ---------- Standorte ---------- */
.btn-pill { border-radius: 999px; padding: 0 20px; }
.btn-danger-solid { background: var(--danger); border-color: var(--danger); color: var(--on-danger); }
.btn-danger-solid:hover { background: var(--danger-hover); border-color: var(--danger-hover); }
.st-head h2 { margin: 0; }
.st-head p { margin: 2px 0 0; }
.st-list { margin-top: 8px; }
.st-row { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; padding: 12px 0; border-top: 1px solid var(--line); } /* umbrechen statt über den Rand (200 % Schrift) */
.st-row .st-nr { flex: 0 0 28px; }
.st-row > .input { flex: 1 1 10rem; min-width: 0; }
.st-row > .st-felder { flex: 1 1 22rem; min-width: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.st-felder > .input { flex: 3 1 14rem; min-width: 0; }
.st-felder > .st-adr { flex: 3 1 14rem; }
.st-felder > .st-art { flex: 0 1 12rem; }
.st-row .st-info { flex: 0 1 7rem; }
.st-row .btn { flex: 0 0 auto; }
.st-row .st-nr { color: var(--muted); font-size: .88rem; text-align: center; }
.st-row.inaktiv .input { color: var(--muted); }
.st-row .st-info { text-align: right; }
.switch { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; min-height: var(--tap); }
.switch input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.switch .slider { width: 40px; height: 22px; border-radius: 999px; background: var(--border); position: relative; transition: background .15s; }
.switch .slider::after { content: ""; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: var(--surface); transition: transform .15s; }
.switch input:checked + .slider { background: var(--green); }
.switch input:checked + .slider::after { transform: translateX(18px); }
.switch input:focus-visible + .slider { outline: 3px solid var(--focus); outline-offset: 2px; }
.switch-lbl { color: var(--muted); font-size: .88rem; }

.anw td.standort { min-width: 190px; }
.anw td.standort select { width: 100%; min-height: 38px; padding: 4px 8px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); font-size: .875rem; }
.anw td.standort select.leer { color: var(--muted); }
@media screen {
 .anw td.standort select.gesperrt { background: var(--surface-2); color: var(--muted); border-color: var(--border); border-style: dashed; cursor: not-allowed; opacity: 1; } 
}
.counter-standort { border-color: var(--primary-line); background: var(--green-light); }
.counter.counter-null { border-color: var(--danger-line); background: var(--red-light); }
.standort-warn { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.standort-warn .btn { min-width: 90px; }
.standort-ok { margin: 0 0 10px; }

/* Standort-Zeile: immer genau eine Zeile, bei Platzmangel seitlich wischen (Android/iPhone/Tablet) */
.standort-leiste { display: flex; align-items: center; gap: 8px; margin: -4px 0 12px; position: relative; min-width: 0; }
.standort-leiste:empty { display: none; }
.standort-label { flex: 0 0 auto; font-size: .875rem; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: .03em; }
.standort-chips { display: flex; flex-wrap: nowrap; gap: 6px; overflow-x: auto; overflow-y: hidden; flex: 1 1 auto; min-width: 0;
  -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; scroll-snap-type: x proximity; scrollbar-width: thin; padding: 2px 0 6px; }
.standort-chips .counter { flex: 0 0 auto; white-space: nowrap; scroll-snap-align: start; }
.standort-chips::-webkit-scrollbar { height: 5px; }
.standort-chips::-webkit-scrollbar-thumb { background: var(--border); border-radius: 99px; }
.standort-leiste.mehr::after { content: "›"; position: absolute; right: 0; top: 0; bottom: 6px; width: 34px; display: flex; align-items: center; justify-content: flex-end;
  padding-right: 4px; font-size: 1.25rem; font-weight: 700; color: var(--green); pointer-events: none;
  background: linear-gradient(to right, transparent, var(--bg) 60%); }

/* Zählerleiste auf Android/iPhone/Tablet: nichts gequetscht */

/* ---------- Speichern ---------- */
.notiz-head-inner { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.notiz-head .btn-save { min-height: 34px; padding: 0 14px; font-size: .875rem; }
.notiz-head .save-info { font-weight: 400; font-size: .875rem; color: var(--muted); margin-top: 3px; white-space: normal; line-height: 1.25; }
.save-bar { display: none; }
.anw tr.ohne-status > td { background: var(--hilite) !important; }
.anw tr.ohne-status > td.name { box-shadow: inset 4px 0 0 var(--hilite-line); }
.status-liste { max-height: 45vh; max-height: 45dvh; overflow: auto; margin: 8px 0; padding: 8px 8px 8px 28px; background: var(--surface-3); border: 1px solid var(--line); border-radius: 8px; columns: 2; column-gap: 24px; }
.status-liste li { break-inside: avoid; padding: 2px 0; }
.seg { display: inline-flex; flex-wrap: wrap; gap: 6px; }
.seg-opt { position: relative; }
.seg-opt input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.seg-opt span { display: inline-flex; align-items: center; justify-content: center; min-width: 78px; min-height: var(--tap); padding: 0 16px; border: 1px solid var(--border); border-radius: 999px; background: var(--surface); font-weight: 700; cursor: pointer; }
.seg-opt input:checked + span { background: var(--green); border-color: var(--green); color: var(--on-primary); }
.seg-opt input:focus-visible + span { outline: 3px solid var(--focus); outline-offset: 2px; }

/* ---------- Reihenfolge von Hand: Ziehgriff (Maus und Finger) ---------- */
.zieh-griff { display: inline-flex; align-items: center; justify-content: center; width: 20px; min-height: 24px; margin-right: 2px;
  color: var(--muted); font-size: 1rem; line-height: 1; cursor: grab; touch-action: none; user-select: none; -webkit-user-select: none; flex: 0 0 auto; }
.zieh-griff:hover { color: var(--green); }
.zieh-griff:active { cursor: grabbing; }
tr.zieht, .besp-eintrag.zieht { opacity: .65; outline: 2px dashed var(--green); outline-offset: -2px; }
tr.zieht td { background: var(--green-light, var(--primary-soft)); }
body.zieht-gerade { user-select: none; -webkit-user-select: none; cursor: grabbing; touch-action: none; overscroll-behavior: contain; }

/* Kürzel-Spalte und Schalter „Nach Kürzel ordnen“ */
th.kz, td.kz { width: 62px; min-width: 56px; text-align: center; }
.kz-inp { width: 50px; padding: 4px 2px; text-align: center; text-transform: uppercase; font-weight: 700; letter-spacing: .5px;
  border: 1px solid var(--border); border-radius: 6px; background: var(--surface); color: var(--ink); font-size: .9rem; }
.kz-inp:focus { outline: 2px solid var(--green); outline-offset: 1px; }
.kz-inp[readonly] { border-color: transparent; background: transparent; }
.kz-schalter.an { background: var(--green); border-color: var(--green); color: var(--on-primary); }
.doppel-hinweis { display: inline-flex; align-items: center; margin-left: 6px; padding: 0 8px; min-height: 28px; vertical-align: middle;
  border: 1px solid var(--warning-line); border-radius: 999px; background: var(--warning-soft); color: var(--warning);
  font: inherit; font-size: .875rem; font-weight: 700; white-space: nowrap; cursor: pointer; }
.doppel-hinweis.dublette { border-color: var(--danger-line); background: var(--danger-soft); color: var(--danger); }

/* ---------- Stammdaten: Status Aktiv / Inaktiv je Zeile ---------- */
.stamm td.status-td { white-space: nowrap; }

/* Inaktive Personen in den Stammdaten hellrot hinterlegen */
table.stamm tr.inaktiv td { background: var(--danger-soft-2); }
table.stamm tr.inaktiv:hover td { background: var(--danger-soft-hover); }
.kuerzel-feld { max-width: 110px; text-transform: uppercase; font-weight: 700; letter-spacing: .5px; }

/* ---------- Besprechung (Textblatt je Tag + Dateien) ---------- */
.visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.besp-card { padding: 16px 18px; }
.besp-head { display: flex; justify-content: space-between; gap: 6px 14px; flex-wrap: wrap; margin-bottom: 10px; }
.besp-head h2 { margin: 0; }

.standort-leiste.besp-tage { margin: -2px 0 12px; } /* gilt auch am Handy (stärker als .standort-leiste) */
.besp-chip { flex: 0 0 auto; display: inline-flex; flex-direction: column; align-items: flex-start; gap: 1px; padding: 5px 11px; min-height: 42px;
  border: 1px solid var(--border); border-radius: 10px; background: var(--surface); color: var(--ink); cursor: pointer; font: inherit; text-align: left; scroll-snap-align: start; }
.besp-chip b { font-size: .88rem; white-space: nowrap; }
.besp-chip-info { font-size: .875rem; color: var(--muted); white-space: nowrap; }
.besp-chip:hover { border-color: var(--primary-line); background: var(--green-light); }
.besp-chip.aktiv { background: var(--green); border-color: var(--green); color: var(--on-primary); }
.besp-chip.aktiv .besp-chip-info { color: var(--on-primary); }

.besp-drop { border: 2px dashed var(--border); border-radius: 12px; padding: 16px; text-align: center; background: var(--surface-3); transition: background .15s, border-color .15s; }
.besp-drop.drag { border-color: var(--green); background: var(--green-light); }
.besp-drop-text { margin-bottom: 8px; }
.besp-drop-btns { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; margin-bottom: 8px; }
.besp-cam { display: none; }

.besp-uploads:empty { display: none; }
.besp-uploads { margin-top: 10px; display: grid; gap: 6px; }
.besp-up { display: grid; grid-template-columns: minmax(0, 1fr) 140px 48px; align-items: center; gap: 10px; font-size: .9rem; }
.besp-up-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.besp-up progress { width: 100%; height: 10px; accent-color: var(--green); }
.besp-up-pct { text-align: right; color: var(--muted); font-variant-numeric: tabular-nums; }

.besp-dateien { margin-top: 12px; display: grid; gap: 8px; }

.besp-datei { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 8px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.besp-datei.fehlt { background: var(--surface-3); }
.besp-thumb { display: block; width: 64px; height: 64px; border-radius: 8px; overflow: hidden; text-decoration: none; }
.besp-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; background: var(--surface-2); }
.besp-icon { display: flex; align-items: center; justify-content: center; width: 64px; height: 64px; border-radius: 8px; font-weight: 800; font-size: .875rem; letter-spacing: .03em; color: #fff; background: #6b7a72; }
.besp-icon.pdf { background: #c0392b; }
.besp-icon.word { background: #2b579a; }
.besp-icon.excel { background: #217346; }
.besp-icon.bild { background: #8e5bb5; }
.besp-icon.text { background: #6b7a72; }
.besp-info { min-width: 0; }
.besp-name { display: block; font-weight: 700; color: var(--ink); overflow-wrap: anywhere; text-decoration: none; }
a.besp-name:hover { text-decoration: underline; color: var(--green); }
.besp-aktionen { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.besp-aktionen .btn { text-decoration: none; }

.besp-alle { margin-top: 10px; max-height: 60vh; max-height: 60dvh; }
.besp-alle tr.aktiv td { background: var(--green-light); }

/* Handy: vier Reiter (Admin) in 2 × 2 statt seitlich abgeschnitten */

/* ---------- Besprechung: Einträge je Person ---------- */
.farbe-gruen   { --p: #1f7a4d; --p-bg: #e8f5ee; --p-line: #9fd0b5; }
.farbe-blau    { --p: #1d5fb8; --p-bg: #e9f0fc; --p-line: #a9c4ee; }
.farbe-orange  { --p: #c2570c; --p-bg: #fdf1e6; --p-line: #f2bf93; }
.farbe-lila    { --p: #7b3fb3; --p-bg: #f3ecfa; --p-line: #cdb0ea; }
.farbe-rot     { --p: #b3261e; --p-bg: #fcebea; --p-line: #eeb0ab; }
.farbe-tuerkis { --p: #0f7f86; --p-bg: #e4f5f6; --p-line: #99d3d7; }
.farbe-braun   { --p: #8a5a2b; --p-bg: #f6efe7; --p-line: #d7bb9c; }
.farbe-pink    { --p: #b8327a; --p-bg: #fbeaf3; --p-line: #eaaecd; }
.farbe-grau    { --p: #5d6a63; --p-bg: #f1f3f2; --p-line: var(--border); }
/* Personenfarben im Dunkelmodus: hellere Schrift, dunkle Tönung (Text >= 6:1) */
@media screen and (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .farbe-gruen { --p: #8fbca6; --p-bg: #1b3226; --p-line: #1d5639; --on-p: #121714; }
  :root:not([data-theme="light"]) .farbe-blau { --p: #8eafdc; --p-bg: #1b2d3b; --p-line: #1c467a; --on-p: #121714; }
  :root:not([data-theme="light"]) .farbe-orange { --p: #e0ab86; --p-bg: #3c2b19; --p-line: #7f4112; --on-p: #121714; }
  :root:not([data-theme="light"]) .farbe-lila { --p: #bd9fd9; --p-bg: #2d263a; --p-line: #543377; --on-p: #121714; }
  :root:not([data-theme="light"]) .farbe-rot { --p: #d9928e; --p-bg: #39211c; --p-line: #76241d; --on-p: #121714; }
  :root:not([data-theme="light"]) .farbe-tuerkis { --p: #87bfc2; --p-bg: #183331; --p-line: #13595c; --on-p: #121714; }
  :root:not([data-theme="light"]) .farbe-braun { --p: #c4ac95; --p-bg: #302c1f; --p-line: #5d4325; --on-p: #121714; }
  :root:not([data-theme="light"]) .farbe-pink { --p: #dc98bc; --p-bg: #3a242f; --p-line: #792b54; --on-p: #121714; }
  :root:not([data-theme="light"]) .farbe-grau { --p: #aeb4b1; --p-bg: #272f2a; --p-line: #424c47; --on-p: #121714; }
}
@media screen {
  :root[data-theme="dark"] .farbe-gruen { --p: #8fbca6; --p-bg: #1b3226; --p-line: #1d5639; --on-p: #121714; }
  :root[data-theme="dark"] .farbe-blau { --p: #8eafdc; --p-bg: #1b2d3b; --p-line: #1c467a; --on-p: #121714; }
  :root[data-theme="dark"] .farbe-orange { --p: #e0ab86; --p-bg: #3c2b19; --p-line: #7f4112; --on-p: #121714; }
  :root[data-theme="dark"] .farbe-lila { --p: #bd9fd9; --p-bg: #2d263a; --p-line: #543377; --on-p: #121714; }
  :root[data-theme="dark"] .farbe-rot { --p: #d9928e; --p-bg: #39211c; --p-line: #76241d; --on-p: #121714; }
  :root[data-theme="dark"] .farbe-tuerkis { --p: #87bfc2; --p-bg: #183331; --p-line: #13595c; --on-p: #121714; }
  :root[data-theme="dark"] .farbe-braun { --p: #c4ac95; --p-bg: #302c1f; --p-line: #5d4325; --on-p: #121714; }
  :root[data-theme="dark"] .farbe-pink { --p: #dc98bc; --p-bg: #3a242f; --p-line: #792b54; --on-p: #121714; }
  :root[data-theme="dark"] .farbe-grau { --p: #aeb4b1; --p-bg: #272f2a; --p-line: #424c47; --on-p: #121714; }
}

.besp-avatar { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%;
  background: var(--p); color: var(--on-p, #fff); font-weight: 800; font-size: .9rem; letter-spacing: .02em; }
.besp-avatar.klein { width: 30px; height: 30px; font-size: .875rem; }
.besp-punkt { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: var(--p, var(--text-muted)); flex: 0 0 auto; }
.besp-punkt.gross { width: 16px; height: 16px; }
.besp-person { display: inline-flex; align-items: center; gap: 5px; margin-right: 8px; white-space: nowrap; }
.besp-punkte { display: inline-flex; gap: 3px; margin-left: 6px; vertical-align: middle; }
.besp-chip .besp-punkt { width: 8px; height: 8px; box-shadow: 0 0 0 1.5px var(--surface); }

.besp-head { align-items: center; }
.besp-filter { display: flex; flex-wrap: wrap; gap: 6px; flex: 1 1 auto; justify-content: flex-end; }
.besp-fchip { display: inline-flex; align-items: center; gap: 6px; min-height: 34px; padding: 0 12px; border-radius: 99px; border: 1px solid var(--border);
  background: var(--surface); color: var(--ink); font: inherit; font-size: .88rem; font-weight: 600; cursor: pointer; }
.besp-fchip:hover { border-color: var(--p-line, var(--border)); background: var(--p-bg, var(--bg)); }
.besp-fchip.aktiv { background: var(--p, var(--green)); border-color: var(--p, var(--green)); color: var(--on-p, var(--on-primary)); }
.besp-fchip.aktiv .besp-punkt { background: var(--on-p, var(--on-primary)); }
.besp-fchip-n { font-size: .875rem; font-weight: 700; opacity: .75; }

.besp-eintraege { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; margin: 6px 0 14px; }
.besp-eintrag, .besp-verlauf-item { display: flex; gap: 12px; align-items: flex-start; padding: 12px 14px; border-radius: 12px;
  background: var(--p-bg); border: 1px solid var(--p-line); border-left: 5px solid var(--p); }
.besp-eintrag-body { flex: 1 1 auto; min-width: 0; }
.besp-eintrag-kopf { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 10px; margin-bottom: 4px; }
.besp-eintrag-kopf .spacer { flex: 1; }
.besp-autor { color: var(--p); }
.besp-eintrag-text { white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.5; font-size: 1rem; }
.besp-eintrag-aktionen { display: flex; gap: 6px; flex-wrap: wrap; }
.besp-keine { margin: 4px 0; }

.besp-neu { display: flex; gap: 12px; align-items: flex-start; padding: 12px; border-radius: 12px; border: 2px dashed var(--p-line, var(--border)); background: var(--surface); }
.besp-neu-body { flex: 1 1 auto; min-width: 0; }
.besp-neu-text { display: block; width: 100%; min-height: 84px; resize: vertical; padding: 10px 12px; border: 1px solid var(--border); border-radius: 10px;
  font: inherit; font-size: 1rem; line-height: 1.5; color: var(--ink); background: var(--surface); }
.besp-neu-text:focus { outline: 3px solid var(--p, var(--focus)); border-color: var(--p, var(--green)); }
.besp-neu-fuss { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
.besp-entwurf { margin-right: auto; color: var(--muted); }
.besp-entwurf.offen { color: var(--amber); font-weight: 700; }
.besp-edit { margin-top: 4px; }

.besp-verlauf { display: grid; gap: 8px; max-height: 65vh; max-height: 65dvh; overflow: auto; padding-right: 4px; }
.besp-verlauf-item { padding: 10px 12px; }
.besp-verlauf-text { white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.5; }
.besp-verlauf-text ins { background: var(--ins-bg); color: var(--ins-text); text-decoration: none; border-radius: 3px; padding: 0 1px; }
.besp-verlauf-text del { background: var(--del-bg); color: var(--del-text); border-radius: 3px; padding: 0 1px; }

.farb-wahl { display: flex; flex-wrap: wrap; gap: 6px; }
.farb-opt { display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; border: 1px solid var(--border); border-radius: 99px; cursor: pointer; font-size: .9rem; }
.farb-opt input { margin: 0; accent-color: var(--p, var(--green)); }
.farb-opt.gewaehlt { border-color: var(--p, var(--green)); background: var(--p-bg, var(--green-light)); font-weight: 700; }

/* ---------- Besprechung: Reihenfolge, Menü, Dateien am Eintrag ---------- */
.besp-eintrag { position: relative; }
.besp-filter-label { flex: 0 0 auto; align-self: center; }

/* Filterhinweis: die Knöpfe filtern nur die Anzeige */
.besp-filter-hinweis { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 10px;
  padding: 6px 10px; border: 1px solid var(--line); border-left: 4px solid var(--green); border-radius: 8px;
  background: var(--surface-3); font-size: .88rem; }
.besp-neu-kopf { margin-bottom: 4px; }
.besp-neu-kopf .besp-autor { color: var(--p, var(--ink)); }

/* Hinweiskasten in Dialogen (z. B. beim Anlegen einer schreibberechtigten Person) */
.hinweis-box { margin: 0 0 12px; padding: 8px 10px; border: 1px solid var(--warning-line); border-radius: 8px;
  background: var(--amber-light); color: var(--amber); font-size: .9rem; }

/* Antworten: stehen mit ↳ eingerückt unter dem Eintrag */
.besp-antworten { display: grid; gap: 8px; margin-top: 8px; }
.besp-antworten:empty { display: none; }
.besp-antwort { display: flex; gap: 8px; padding: 6px 10px; border-left: 3px solid var(--p, var(--line));
  background: var(--p-bg, var(--surface-3)); border-radius: 0 8px 8px 0; }
.besp-antwort-pfeil { flex: 0 0 auto; color: var(--p, var(--muted)); font-size: 1.05rem; line-height: 1.4; }
.besp-antwort-body { flex: 1 1 auto; min-width: 0; }
.besp-antwort-kopf { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.besp-antwort-kopf .besp-autor { color: var(--p, var(--ink)); font-size: .92rem; }
.besp-antwort-text { white-space: pre-wrap; overflow-wrap: anywhere; margin-top: 2px; }
.besp-antwort-neu { border-left-style: dashed; align-items: flex-start; }
.besp-antwort-neu textarea { width: 100%; }
.besp-antwort-neu .besp-antwort-kopf { margin-bottom: 4px; }
.besp-antwort-neu .besp-autor { color: var(--p, var(--ink)); }
/* Hinweis, von wem die Antwort erwartet wird */
.besp-erwartet { margin: 0 0 6px; padding: 4px 8px; border-radius: 6px; font-size: .875rem; font-weight: 700;
  color: var(--amber); background: var(--amber-light); border: 1px solid var(--warning-line); }
.besp-erwartet.eigen { color: var(--green); background: var(--green-light); border-color: var(--green); }

/* Rote Blase am Reiter „Besprechung“ */
.tab-blase { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 22px; margin-left: 6px;
  padding: 0 6px; border-radius: 999px; background: var(--danger); color: var(--on-danger); font-size: .875rem; font-weight: 800; line-height: 1; }

/* Liste „Für mich offen“ */
.offen-liste { display: grid; gap: 8px; }
.offen-zeile { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; width: 100%; text-align: left;
  border-left: 4px solid var(--p, var(--line)); padding: 8px 10px; }
.offen-datum { font-weight: 700; color: var(--p, var(--ink)); }
.offen-text { flex: 1 1 240px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Status je Eintrag: Erledigt, Antwort erwünscht, Zuweisung an, Antwort erledigt, siehe Anhang */
.besp-status-wahl { display: inline-flex; gap: 4px; flex-wrap: wrap; align-items: center; }
.besp-status-sel, .besp-status-pers { width: auto; max-width: 180px; padding: 3px 6px; font-size: .875rem; min-height: 30px; }
.besp-status-sel.status-erledigt, .besp-status-sel.status-antwort-erledigt { border-color: var(--green); color: var(--green); background: var(--green-light); font-weight: 700; }
.besp-status-sel.status-antwort { border-color: var(--warning-line); color: var(--amber); background: var(--amber-light); font-weight: 700; }
.besp-status-sel.status-zuweisung { border-color: var(--info-line); color: var(--info); background: var(--blue-light); font-weight: 700; }
.besp-status-sel.status-anhang { border-color: var(--line); color: var(--muted); background: var(--surface-2); font-weight: 700; }
.besp-status-chip { display: inline-flex; align-items: center; padding: 1px 9px; border-radius: 999px; border: 1px solid var(--line);
  font-size: .875rem; font-weight: 700; color: var(--muted); background: var(--surface-2); }
.besp-status-chip.status-erledigt, .besp-status-chip.status-antwort-erledigt { border-color: var(--green); color: var(--green); background: var(--green-light); }
.besp-status-chip.status-antwort { border-color: var(--warning-line); color: var(--amber); background: var(--amber-light); }
.besp-status-chip.status-zuweisung { border-color: var(--info-line); color: var(--info); background: var(--blue-light); }
.besp-eintrag.status-erledigt .besp-eintrag-text, .besp-eintrag.status-antwort-erledigt .besp-eintrag-text { opacity: .75; }
.besp-sfchip { font-weight: 700; }

.besp-status-chip.nur-druck { display: none; }
/* Vermerk „gesetzt von …“ – in der Farbe der Person, die den Status gesetzt hat */
.besp-status-von { color: var(--p, var(--muted)); white-space: nowrap; }
.besp-status-von::before { content: "•"; margin-right: 4px; opacity: .6; }

.besp-menue { display: grid; gap: 8px; margin-top: 4px; }
.besp-menue-btn { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; min-height: 52px; padding: 8px 14px; text-align: left; }
.besp-menue-titel { font-weight: 700; }
.besp-menue-hinweis { font-size: .875rem; color: var(--muted); font-weight: 400; }
.besp-menue-btn.btn-danger .besp-menue-hinweis { color: var(--danger); }

.besp-eintrag-dateien { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.besp-eintrag-dateien:empty { display: none; }
.besp-dchip-wrap { position: relative; display: inline-flex; }
.besp-dchip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 22px 4px 4px; border: 1px solid var(--p-line, var(--line));
  border-radius: 999px; background: var(--surface); color: var(--ink); text-decoration: none; font-size: .875rem; }
.besp-dchip:hover { border-color: var(--p, var(--green)); }
.besp-dchip.fehlt { opacity: .6; }
.besp-dchip img { width: 26px; height: 26px; border-radius: 50%; object-fit: cover; flex: 0 0 auto; }
.besp-chip-typ { display: inline-flex; align-items: center; justify-content: center; min-width: 26px; height: 26px; padding: 0 6px; border-radius: 999px; flex: 0 0 auto;
  font-size: .875rem; font-weight: 800; color: #fff; background: #6b7a72; }
.besp-chip-typ.pdf { background: #c0392b; } .besp-chip-typ.word { background: #2b579a; }
.besp-chip-typ.excel { background: #217346; } .besp-chip-typ.bild { background: #8e5bb5; }
.besp-chip-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.besp-dchip-x { position: absolute; right: 2px; top: 50%; transform: translateY(-50%); width: 20px; height: 20px; border: 0; border-radius: 50%;
  background: transparent; color: var(--muted); font-size: .9375rem; line-height: 1; cursor: pointer; }
.besp-dchip-x:hover { background: var(--red-light); color: var(--red); }

/* ---------- Standortkalender: Zeilen = Standorte, Spalten = Tage ---------- */
.kal-wrap { max-height: calc(100vh - 260px); max-height: calc(100dvh - 260px); overflow: auto; }
.jahr-input { width: calc(4ch + 3.75rem); flex: 0 0 auto; } /* 4 Ziffern + Rand/Pfeile, wächst mit der Schrift */
.monat-sel { width: auto; flex: 0 0 auto; }

table.kal { border-collapse: separate; border-spacing: 0; }
table.kal th, table.kal td { border-bottom: 1px solid var(--line); }
table.kal .kal-name { position: sticky; left: 0; z-index: 2; min-width: 150px; max-width: 220px; background: var(--surface);
  text-align: left; font-weight: 700; }
table.kal thead th { position: sticky; top: 0; z-index: 3; background: var(--head); }
table.kal thead .kal-name { z-index: 4; }
.kal-tag { min-width: 86px; padding: 4px 2px; text-align: center; font-weight: 700; line-height: 1.15; }
.kal-wt { display: block; font-size: .875rem; font-weight: 400; color: var(--muted); }
.kal-nr { display: block; font-size: .95rem; }
.kal-tag.we { background: var(--surface-2); }
.kal-tag.heute { background: var(--green-light); }
.kal-tag.heute .kal-nr { color: var(--green); }










/* Auswahlfenster */
.kal-liste { display: grid; gap: 4px; max-height: 55vh; max-height: 55dvh; overflow: auto; margin-top: 8px; }
.kal-opt { display: flex; align-items: center; gap: 8px; width: 100%; padding: 8px 10px; border: 1px solid var(--border);
  border-radius: 8px; background: var(--surface); text-align: left; font: inherit; cursor: pointer; }
.kal-opt:hover:not(:disabled) { border-color: var(--green); }
.kal-opt.an { background: var(--green-light); border-color: var(--green); font-weight: 700; }
.kal-opt.gesperrt { background: var(--surface-3); color: var(--muted); cursor: not-allowed; }
.kal-opt-haken { flex: 0 0 22px; text-align: center; }
.kal-opt-name { flex: 1 1 auto; }
.kal-opt-kz { flex: 0 0 auto; padding: 1px 6px; border-radius: 999px; background: var(--line); font-size: .875rem; font-weight: 700; }
.kal-opt-grund { flex: 0 0 auto; font-size: .875rem; color: var(--muted); }

/* ---- Standortkalender (seit 12.10.2026): Saison × Standorte, Agenda unten = Farbauswahl ---- */
:root { --sk-frei: #ffd9d9; --sk-frei-kopf: #f7c4c4; }
.sk-leiste { flex-wrap: wrap; gap: 8px 12px; }
.sk-jahrbar { display: inline-flex; gap: 6px; align-items: center; min-width: 0; }
.sk-jahrbar .btn { min-width: var(--tap); }
.sk-jahr { min-width: 11rem; font-weight: 700; }
.sk-zeitraum { font-variant-numeric: tabular-nums; }
.sk-ansicht .btn[aria-pressed="true"] { background: var(--primary); color: var(--on-primary); border-color: var(--primary); font-weight: 700; }
.sk-info { margin: 4px 0 8px; }
.sk-leer { display: flex; flex-direction: column; gap: 10px; align-items: flex-start; border-style: dashed; }
.sk-leer h2 { margin: 0; }
.sk-wrap { overflow: auto; max-height: calc(100vh - 330px); max-height: calc(100dvh - 330px); min-height: 260px; border: 1px solid var(--linie-stark); border-radius: var(--radius); background: var(--surface); overscroll-behavior: contain; }
table.sk-tab { border-collapse: separate; border-spacing: 0; font-variant-numeric: tabular-nums; }
.sk-tab th, .sk-tab td { border-right: 1px solid var(--linie); border-bottom: 1px solid var(--linie); padding: 0; }
.sk-tab thead th { position: sticky; top: 0; z-index: 3; background: var(--head); padding: 6px 4px; text-align: center; line-height: 1.2; }
.sk-tab thead th.frei { background: var(--sk-frei-kopf); }
.sk-tab thead th.heute { box-shadow: inset 0 -4px 0 var(--primary); }
.sk-wt { display: block; font-size: .875rem; font-weight: 400; color: var(--muted); }
.sk-nr { display: block; font-weight: 700; }
.sk-tab .sk-ort { position: sticky; left: 0; z-index: 2; background: var(--surface); text-align: left; width: 13rem; min-width: 13rem; max-width: 13rem; padding: 8px 10px; border-right: 2px solid var(--linie-stark); font-weight: 400; }
.sk-tab thead .sk-ort { z-index: 4; background: var(--head); font-weight: 700; }
.sk-ort b { display: block; }
.sk-adr { display: block; color: var(--muted); font-size: .875rem; }
.sk-badge { margin-top: 4px; }
.sk-tab.kompakt .sk-adr { display: none; }
.sk-tab tr.sonder .sk-ort { background: var(--surface-2); }
.sk-tab tr.trenner > * { border-top: 3px solid var(--linie-stark); }
td.sk-feld { position: relative; vertical-align: top; width: 7.5rem; min-width: 7.5rem; height: 4rem; cursor: pointer; }
.sk-tab.kompakt td.sk-feld, .sk-tab.kompakt thead th:not(.sk-ort), .sk-tab.kompakt td.sk-summe { width: 2.75rem; min-width: 2.75rem; height: 2.75rem; }
td.sk-feld.frei { background: var(--sk-frei); }
td.sk-feld:hover, td.sk-feld.sk-markiert { box-shadow: inset 0 0 0 3px var(--focus); }
td.sk-feld:focus-visible { outline: 3px solid var(--focus); outline-offset: -3px; }
.sk-txt { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; padding: 4px 6px; font-size: .875rem; line-height: 1.25; white-space: pre-line; }
.sk-leute { display: flex; flex-direction: column; gap: 2px; padding: 2px 4px 6px; }
.sk-person { background: var(--surface); color: var(--text); border: 1px solid var(--linie-stark); border-radius: 6px; padding: 1px 6px; font-size: .875rem; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sk-person i { font-style: normal; color: var(--muted); }
.sk-anzahl { display: none; position: absolute; right: 3px; bottom: 3px; font-size: .875rem; font-weight: 700; background: var(--surface); color: var(--text); border: 1px solid var(--linie-stark); border-radius: 999px; padding: 0 5px; line-height: 1.3; }
.sk-tab.kompakt .sk-txt, .sk-tab.kompakt .sk-leute, .sk-tab.kompakt .sk-vm, .sk-tab.kompakt .sk-nm { display: none; }
.sk-tab.kompakt .sk-anzahl { display: block; }
.sk-tab.kompakt td.sk-feld.hat-text::after { content: ""; position: absolute; top: 4px; right: 4px; width: 7px; height: 7px; border-radius: 50%; background: currentColor; opacity: .7; }
.sk-vm, .sk-nm { position: absolute; bottom: 2px; font-size: .875rem; font-weight: 700; opacity: .85; }
.sk-vm { left: 4px; } .sk-nm { right: 4px; }
td.sk-auto-feld { cursor: default; color: var(--muted); }
.sk-tab tfoot td, .sk-tab tfoot th { position: sticky; bottom: 0; z-index: 2; background: var(--head); font-weight: 700; text-align: center; height: 2.5rem; }
/* nur noch EINE Summenzeile („Standorte offen“ entfiel 16.10.2026) → sie klebt ganz unten; vorher bottom 2.5rem = schwebte über
   dem Rand und die Zeilen schienen darunter durch (Nutzer 17.10.2026: „Personal eingeteilt bleibt hängen, verdeckt andere Zeile“) */
.sk-tab tfoot tr:first-child > * { bottom: 0; border-top: 2px solid var(--linie-stark); }
.sk-tab tfoot .sk-ort { z-index: 4; text-align: left; background: var(--head); }
.sk-hilfe { margin: 8px 0 0; }
.sk-agenda { position: sticky; bottom: 0; z-index: 20; margin-top: 10px; padding: 8px 12px calc(8px + env(safe-area-inset-bottom, 0px)); background: var(--surface); border: 1px solid var(--linie-stark); border-radius: var(--radius); box-shadow: 0 -4px 14px rgba(0,0,0,.08); }
.sk-agenda-kopf { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; margin-bottom: 6px; }
.sk-agenda-kopf b { text-transform: uppercase; letter-spacing: .06em; font-size: .875rem; }
.sk-steine { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 4px; }
.sk-steine.wahl { flex-wrap: wrap; overflow: visible; }
.sk-stein { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 8px; min-height: var(--tap); padding: 0 14px 0 8px; border: 1px solid var(--border); border-radius: 999px; background: var(--surface); color: var(--text); cursor: pointer; white-space: nowrap; font: inherit; }
.sk-stein[aria-pressed="true"] { border: 3px solid var(--primary); padding-left: 6px; font-weight: 700; background: var(--primary-soft); }
.sk-stein.fix { cursor: default; color: var(--muted); }
.sk-stein.neu { border-style: dashed; }
.sk-farbe { width: 24px; height: 24px; flex: 0 0 auto; border-radius: 6px; border: 1px solid var(--linie-stark); display: grid; place-items: center; font-size: .875rem; }
.sk-radierer { background: var(--surface); border-style: dashed; }
.sk-frei { background: var(--sk-frei); }
.sk-person-wz { order: -1; }
.sk-person-wz .sk-farbe { background: var(--primary-soft); }
.sk-dlg h3 { margin: 16px 0 4px; font-size: 1rem; }
.sk-dlg h3:first-child { margin-top: 0; }
.sk-dlg > p { margin: 0 0 8px; }
.sk-personal { display: flex; flex-direction: column; gap: 8px; margin-bottom: 8px; }
/* Planstunden (13.10.2026): Personal im Feld-Fenster als Tabelle wie die Stundenaufzeichnung
   (Person | Beginn | Ende | Pause 1 | Pause 2 | Gesamtstunden), darunter je Person Tag · Woche · Monat · frei */
table.std.sk-std { min-width: 640px; }
table.std.sk-std th.std-tag { min-width: 9rem; white-space: normal; }
table.std.sk-std td.std-zeit { min-width: 104px; }
.sk-wer > span { margin-right: 6px; }
table.std.sk-std tr.sk-plan-zeile td { padding-top: 0; white-space: normal; }
table.std.sk-std tr.std-row > * { border-bottom: 0; }
.sk-plan { margin: 0 0 4px; color: var(--muted); }
.sk-plan-titel { font-weight: 600; }
.sk-plan.ueber { color: var(--danger); }
.sk-plan-hinweis { color: var(--warning-text); }
.sk-plan.ueber .sk-plan-hinweis { color: var(--danger); font-weight: 600; }
.sk-x { min-width: var(--tap); }
table.std.sk-std .sk-x { float: right; min-height: 40px; }

/* Stundenübersicht im Standortkalender (Etappe 2, 14.10.2026) – nur vorhandene Tokens (hell/dunkel) */
.sk-ueb { margin-top: 8px; }
.sk-ueb-knoepfe { display: flex; flex-wrap: wrap; gap: 8px; }
/* Verwaltung → Daten löschen → Daten leeren (14.10.2026) */
.daten-leeren-liste { display: grid; gap: 4px; margin: 8px 0; }
.daten-leeren-zeile { align-items: flex-start; min-width: 0; }
.daten-leeren-zeile > span { min-width: 0; overflow-wrap: anywhere; -webkit-hyphens: auto; hyphens: auto; }
.daten-leeren-info { display: block; }
.daten-leeren-knoepfe { display: flex; flex-wrap: wrap; gap: 8px; }
/* Löschschutz Stunden / Echtbetrieb (15.10.2026) */
.daten-leeren-schutz { display: block; color: var(--warning-text); font-weight: 600; }
.echtbetrieb-an { font-weight: 600; }
.echtbetrieb-pw > summary { cursor: pointer; padding: 10px 0; font-weight: 600; }
.ablage-schnell { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 12px; }
.sk-monate { margin: 4px 0 10px; }
.sk-ueb-leiste { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.sk-ueb-leiste .search { width: min(100%, 16rem); }
.sk-ueb-leiste .sk-jahrbar { flex: 0 1 auto; max-width: 100%; min-width: 0; }
.sk-ueb-leiste select.input.sk-ueb-kw { flex: 1 1 auto; min-width: 0; max-width: 100%; }
.sk-ueb-leiste select.input.sk-ueb-filter { flex: 0 1 auto; min-width: 0; max-width: 100%; }
.sk-ueb-legende { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 8px 0; }
.sk-ampel { display: inline-block; padding: 1px 8px; border: 1px solid; border-radius: 999px; font-size: .875rem; font-weight: 600; white-space: nowrap; }
.a-frei { --amp-bg: var(--primary-soft); --amp-line: var(--primary-line); --amp-text: var(--primary); --amp-kante: var(--primary); }
.a-voll { --amp-bg: var(--warning-soft); --amp-line: var(--warning-line); --amp-text: var(--warning-text); --amp-kante: var(--warning-line); }
.a-ueber { --amp-bg: var(--danger-soft); --amp-line: var(--danger-line); --amp-text: var(--danger); --amp-kante: var(--danger); }
.a-leer { --amp-bg: var(--surface-2); --amp-line: var(--linie); --amp-text: var(--text-muted); --amp-kante: var(--linie); }
.sk-ampel{ background: var(--amp-bg); border-color: var(--amp-line); color: var(--amp-text); }
/* feine Rasterlinien zwischen allen Zellen (Nutzer 14.10.2026) */
.sk-ueb-sort { min-width: var(--tap); min-height: var(--tap); padding: 2px 0; border: 0; background: none; color: inherit; font: inherit; font-weight: 700; cursor: pointer; text-align: inherit; }
.sk-ueb-sort:hover { text-decoration: underline; }
.sk-ueb-name { display: block; min-height: var(--tap); padding: 4px 0; border: 0; background: none; color: var(--primary); font: inherit; font-weight: 700; text-align: left; text-decoration: underline; cursor: pointer; }
.sk-ueb-hinweis { display: block; margin-top: 4px; font-size: .875rem; font-weight: 400; color: var(--warning-text); }
.sk-ueb-hinweis.ueber { color: var(--danger); font-weight: 600; }
.sk-auswahl { margin-top: 8px; }
.sk-frage { margin: 0 0 12px; }
.sk-frage p { margin: 6px 0 10px; }
.sk-frage-knoepfe { display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; }
.sk-palette { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; margin-bottom: 8px; }
.sk-palfarbe { min-height: var(--tap); border-radius: 8px; border: 1px solid var(--linie-stark); cursor: pointer; }
.sk-palfarbe[aria-pressed="true"] { outline: 3px solid var(--primary); outline-offset: 2px; }
.sk-optliste { display: flex; flex-direction: column; max-height: 30vh; max-height: 30dvh; overflow: auto; border: 1px solid var(--line); border-radius: 8px; padding: 2px 10px; }
.sk-einzug { padding-left: 28px; }
.ag-row .ag-farbe { flex: 0 0 auto; }
.ag-farbe { display: inline-flex; width: 64px; min-height: var(--tap); padding: 0; border: 1px solid var(--linie-stark); border-radius: 8px; overflow: hidden; cursor: pointer; background: none; }
.ag-farbe span { flex: 1 1 50%; }
.ag-farbe[aria-pressed="true"] { outline: 3px solid var(--primary); outline-offset: 2px; }
.ag-palette { grid-template-columns: repeat(auto-fill, minmax(64px, 1fr)); }
.ag-palette .ag-farbe { width: 100%; }
.st-row.ag-row { display: flex; flex-wrap: wrap; } /* auch am Handy: umbrechen statt Raster der Standorte */
.st-row.ag-row > .input { flex: 1 1 10rem; min-width: 0; grid-column: auto; }
.st-row.ag-row .st-info { flex: 0 1 11rem; text-align: left; grid-column: auto; }
.sk-leiste #skKrank[aria-pressed="false"] { color: var(--muted); text-decoration: line-through; }
/* Werkzeug „Person einteilen“: Tage der gewählten Person */
.sk-tab thead th.sk-p-ja { background: var(--primary-soft); }
.sk-tab thead th.sk-p-nein { opacity: .6; }
.sk-tab thead th.sk-p-sperre { background: var(--danger-soft); }
.sk-pm { display: block; font-weight: 700; font-size: .875rem; }
.sk-p-ja .sk-pm { color: var(--primary); }
td.sk-feld.sk-p-nein::before, td.sk-feld.sk-p-sperre::before { content: ""; position: absolute; inset: 0; pointer-events: none;
  background: repeating-linear-gradient(45deg, transparent 0 6px, var(--sk-schraffur) 6px 9px); }
td.sk-feld.sk-p-sperre::before { background: repeating-linear-gradient(45deg, transparent 0 6px, var(--sk-schraffur-rot) 6px 9px); }
td.sk-feld.sk-p-hier { box-shadow: inset 0 0 0 3px var(--primary); }
:root { --sk-schraffur: rgba(110,120,115,.28); --sk-schraffur-rot: rgba(179,38,30,.28); }
#skDruck { display: none; }
.sk-mehr { display: none !important; }
.sk-mehr-liste { display: flex; flex-direction: column; gap: 8px; }
.tk-zeitleiste { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center; margin: 0 0 8px; padding: 8px; border: 1px solid var(--primary-line); border-radius: 8px; background: var(--primary-soft); }
.tk-zl-titel { font-weight: 600; }
.tk-zl-zeit { display: flex; flex-wrap: nowrap; gap: 6px; align-items: center; }
.tk-zeitleiste input[type=time] { width: 7.5rem; min-height: var(--tap); }
@media (max-width: 600px) { .tk-zl-titel { flex-basis: 100%; } .tk-zeitleiste input[type=time] { width: 6.75rem; } }
.tk-zeit { display: block; font-size: .875rem; font-weight: 700; line-height: 1.1; color: var(--primary); white-space: nowrap; }
.anw-verf { margin-left: 4px; }
.anw-einsaetze { display: block; margin-top: 2px; color: var(--muted); white-space: normal; }
/* ---------- Standortkalender: Reiter Kalender | Dienstplan (18.10.2026) ---------- */
.sk-reiter { margin: 0 0 8px; gap: 4px; }
/* Reiter am PC in der Leiste (Nutzer 18.10.2026: Kalender groß) – sonst eigene Zeile darüber */
.sk-leiste > .sk-reiter-leiste { display: none; margin: 0; flex-wrap: nowrap; }
@media screen and (min-width: 901px) {
  #main > #skReiter { display: none; }
  .sk-leiste > .sk-reiter-leiste { display: flex; }
}
#skStdKnopf { display: none !important; } /* Gesamtauflistung ist ein Reiter */
.sk-ueb-erklaerung { margin: 4px 0 6px; }
@media screen and (min-width: 901px) {
  .sk-ueb-leiste { flex-wrap: nowrap; }
  .sk-ueb-leiste .search { width: 11rem; flex: 0 1 11rem; }
  .sk-ueb-leiste select.input.sk-ueb-filter { flex: 0 1 12rem; }
  .sk-ueb-leiste .sk-ueb-knoepfe { display: flex; gap: 6px; flex: 0 0 auto; }
}
.sk-ueb-erklaerung summary { cursor: pointer; min-height: 32px; display: inline-flex; align-items: center; font-weight: 600; color: var(--muted); }
.sk-ueb-erklaerung p { margin: 4px 0; }
.sk-reiter .subtab { min-height: 36px; padding: 0 14px; }
#main.sk-dp-an > :not(#skDp):not(h1) { display: none !important; } /* Reiter stehen im Dienstplan in dessen Leiste */
#main:not(.sk-dp-an) > #skDp { display: none; }
.dp-leiste { display: flex; flex-wrap: wrap; gap: 6px 8px; align-items: center; margin: 0 0 8px; }
.dp-leiste .btn { min-height: 36px; }
.dp-reiter .btn[aria-pressed="true"], .dp-ansicht .btn[aria-pressed="true"] { background: var(--primary); color: var(--on-primary); border-color: var(--primary); font-weight: 700; }
.dp-zeitraum { font-variant-numeric: tabular-nums; min-width: 0; }
@media (max-width: 700px) {
  .dp-leiste .seg { flex-wrap: nowrap; gap: 4px; }
  .dp-leiste .seg .btn { padding: 0 8px; font-size: .875rem; }
  .dp-leiste .dp-titel-lang { display: none; }
  .dp-leiste .dp-titel-kurz { display: inline; white-space: nowrap; }
  .dp-leiste .dp-ansicht { margin-left: auto; }
  .dp-umbruch { display: block; flex-basis: 100%; height: 0; }
  .dp-leiste .dp-zeitraum { flex: 1 1 0; text-align: center; }
  .dp-tab thead th.dp-wer { width: 8.5rem; }
  .dp-tab th.dp-wer { min-width: 0; }
}
.dp-knoepfe { display: flex; gap: 8px; flex-wrap: wrap; }
.dp-umbruch { display: none; }
.dp-titel-kurz { display: none; }
@media (max-width: 700px) { .dp-reiter-gesamt { display: none; } }
.dp-gesamt-kurz { display: none; }
@media (max-width: 1800px) { .dp-reiter-gesamt .dp-titel-lang { display: none; } .dp-reiter-gesamt .dp-gesamt-kurz { display: inline; } } /* Tablet quer + PC mit Seitenleiste (seit 21.10.2026 bis 1800 px): eine Zeile */
.dp-wrap { overflow: auto; border: 1px solid var(--linie-stark); border-radius: var(--radius); background: var(--surface); }
.dp-tab { border-collapse: separate; border-spacing: 0; width: 100%; table-layout: fixed; font-variant-numeric: tabular-nums; }
.dp-tab thead th.dp-wer { width: 11rem; }
.dp-tab thead th.dp-sum { width: 6.25rem; }
.dp-tab th, .dp-tab td { border-right: 1px solid var(--linie); border-bottom: 1px solid var(--linie); padding: 0; vertical-align: top; }
.dp-tab thead th { position: sticky; top: 0; z-index: 3; background: var(--head); font-size: .8125rem; padding: 6px 4px; text-align: center; white-space: nowrap; }
.dp-tab thead th.we { background: var(--surface-2); }
.dp-tab thead th.heute { box-shadow: inset 0 -3px 0 var(--primary); }
.dp-tab th.dp-wer { position: sticky; left: 0; z-index: 2; background: var(--surface); text-align: left; padding: 6px 8px; font-weight: 600; font-size: .875rem; overflow: hidden; text-overflow: ellipsis; }
.dp-tab thead th.dp-wer { z-index: 4; background: var(--head); }
.dp-wer small { display: block; font-weight: 400; color: var(--muted); }
.dp-feld { height: 52px; padding: 3px; cursor: pointer; overflow: hidden; }
.dp-wrap.monat .dp-feld { height: 44px; padding: 2px; }
.dp-feld.we { background: var(--surface-3); }
.dp-feld.heute { box-shadow: inset 0 0 0 2px var(--primary-line); }
.dp-feld:hover, .dp-feld:focus-visible { box-shadow: inset 0 0 0 2px var(--primary); outline: none; }
.dp-feld.aus { background: repeating-linear-gradient(45deg, transparent 0 6px, var(--sk-schraffur) 6px 9px); cursor: not-allowed; }
.dp-feld.sperre { background: var(--surface-2); cursor: not-allowed; }
.dp-grund { display: block; text-align: center; font-size: .75rem; color: var(--muted); padding-top: 10px; }
.dp-ein { display: block; border: 1px solid var(--p-line); background: var(--p-bg); color: var(--p); border-radius: 5px; padding: 1px 5px; font-size: .78rem;
  line-height: 1.3; margin-bottom: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dp-ein b { font-weight: 700; }
.dp-wrap.monat .dp-ein { text-align: center; padding: 2px 1px; font-weight: 700; font-size: .72rem; }
.dp-tab th .dp-ein, .dp-legende .dp-ein, .st-farbmuster { display: inline-block; min-width: 2.4em; text-align: center; font-weight: 700; margin: 0; vertical-align: middle; }
.dp-verf { display: block; font-size: .7rem; color: var(--muted); white-space: nowrap; }
.dp-tab .dp-sum { text-align: right; padding: 6px 8px; white-space: nowrap; font-size: .8125rem; min-width: 4.8rem; }
.dp-ohne { display: block; color: var(--muted); font-size: .7rem; white-space: normal; }
.dp-ampel { display: inline-block; border-radius: 99px; padding: 1px 8px; font-weight: 700; }
.dp-ampel.gruen { background: var(--primary-soft); color: var(--primary); }
.dp-ampel.gelb { background: var(--warning-soft); color: var(--warning-text); }
.dp-ampel.rot { background: var(--danger-soft); color: var(--danger); }
.dp-trenner th, .dp-trenner td { background: var(--head); font-size: .8125rem; padding: 5px 8px; font-weight: 700; }
.dp-tab .dp-trenner th.dp-wer { background: var(--head); }
.dp-bes th.dp-wer { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dp-bes td { text-align: center; font-size: .8125rem; padding: 6px 2px; }
.dp-bes td.null { background: var(--danger-soft); color: var(--danger); font-weight: 700; }
.dp-bes td.zu { color: var(--muted); }
.dp-leer { padding: 16px; color: var(--muted); }
.dp-legende { margin-top: 6px; }
.dp-legende summary { cursor: pointer; min-height: 32px; display: inline-flex; align-items: center; font-weight: 600; }
.dp-legende[open] { display: flex; flex-wrap: wrap; gap: 4px 14px; align-items: center; }
.dp-legende[open] summary { flex-basis: 100%; }
.dp-legende > span { display: inline-flex; align-items: center; gap: 4px; }
.dp-muster { display: inline-block; width: 22px; height: 14px; border: 1px solid var(--linie); border-radius: 3px; }
.dp-muster.aus { background: repeating-linear-gradient(45deg, transparent 0 4px, var(--sk-schraffur) 4px 6px); }
.dp-muster.null { background: var(--danger-soft); }
/* Dienstplan Etappe 4: Schnell einteilen + Tag als Zeitleiste (18.10.2026) */
@media (max-width: 1800px) { .dp-schnell-text { display: none; } } /* Tablet quer + PC bis 1800 px (21.10.2026): nur ⚡/⎙, damit die Leiste eine Zeile bleibt */
/* Tablet quer (701–1280 px): Leiste bleibt EINE Zeile – schmälere Knöpfe, Zeitraum kurz; PC mit Seitenleiste bis 1800 px (21.10.2026,
   Häkchen DV): nur schmälere Knöpfe, der Zeitraum bleibt lang */
@media (min-width: 701px) and (max-width: 1800px) {
  .dp-leiste { gap: 4px 6px; }
  .dp-leiste .btn { padding: 0 8px; }
}
@media (min-width: 701px) and (max-width: 1280px) {
  .dp-leiste .dp-titel-lang { display: none; }
  .dp-leiste .dp-titel-kurz { display: inline; white-space: nowrap; }
}
/* Personenfenster: Angaben für den Dienstvertrag (18.10.2026) */
.vt-liste { display: grid; gap: 8px; }
.vt-zeile { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center; justify-content: space-between; padding: 8px 10px; border: 1px solid var(--linie); border-radius: var(--radius); }
.vt-info { min-width: 0; }
.vt-wann { display: block; }
.vt-knoepfe { display: flex; flex-wrap: wrap; gap: 6px; }
.vt-person { display: grid; gap: 2px; margin: 0 0 10px; padding: 8px 10px; background: var(--surface-2); border-radius: var(--radius); }
.vt-orte { display: grid; grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr)); gap: 2px 12px; }
.vt-probe { margin-top: 28px; }
.vv-platzhalter { columns: 3 12rem; margin: 6px 0 10px; padding-left: 18px; }
.vt-zeile .vt-nachweis { flex-basis: 100%; display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; padding-top: 6px; border-top: 1px dashed var(--divider); }
.vt-datum { width: auto; min-height: 36px; }
.vt-st.ohne { color: var(--muted); }
.vt-st.offen { color: var(--warning-text); font-weight: 600; }
.vt-st.fertig { color: var(--primary); font-weight: 600; }
.uw-st { font-weight: 600; font-size: 0.875rem; }
.uw-st.ohne { color: var(--muted); font-weight: 400; }
.uw-st.offen { color: var(--warning-text); }
.uw-st.fertig { color: var(--primary); }
/* Vorlage UW / Fahrgenehmigung (19.10.2026): je Text Deutsch | Slowakisch | Englisch nebeneinander, am Handy untereinander */
.uw-zeilen { display: grid; gap: 8px; }
.uw-zeile { display: flex; gap: 8px; align-items: flex-start; padding-bottom: 8px; border-bottom: 1px solid var(--divider); }
.uw-zeile .uw-3 { flex: 1; min-width: 0; }
.uw-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.uw-3 textarea { min-height: 44px; resize: vertical; }
.uw-3-kopf { padding: 0 52px 4px 0; }
.uw-text { flex-direction: column; gap: 2px; }
.uw-text .uw-3 { width: 100%; }
.uw-schluessel { font-weight: 600; }
.uw-f { display: block; min-width: 0; }
.uw-f .input { width: 100%; }
.uw-sp { display: none; font-size: 0.75rem; font-weight: 700; color: var(--muted); }
.uw-logo { display: block; max-width: 100%; height: auto; max-height: 120px; border: 1px solid var(--linie); border-radius: var(--radius); }
@media (max-width: 700px) {
  .uw-3 { grid-template-columns: 1fr; }
  .uw-3-kopf { display: none; }
  .uw-sp { display: block; }
}
/* Seite UW (19.10.2026): Personen-Auswahl, Blatt-Fenster */
.uw-wahl { display: grid; gap: 2px; max-height: 320px; overflow-y: auto; padding: 4px 8px; border: 1px solid var(--linie); border-radius: var(--radius); }
.uw-wahl .check-line { min-height: 44px; align-items: center; }
.uw-wahl-p > span { display: flex; flex-direction: column; min-width: 0; }
.uw-personen { display: grid; gap: 4px; }
.uw-person-zeile { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center; padding: 4px 0; border-bottom: 1px solid var(--divider); }
.uw-person-zeile .check-line { flex: 1 1 200px; min-height: 44px; }
.uw-alle { margin-top: 8px; }
/* mehrere Dienstverhältnisse (19.10.2026): je DV ein Block mit Kopf, neueste Fassung, ältere aufklappbar */
.vt-dv { display: grid; gap: 6px; padding: 8px; border: 1px solid var(--linie); border-radius: var(--radius); background: var(--surface-3); }
.vt-dv-kopf .vt-neue-fassung { min-height: 44px; }
.vt-dv-kopf { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: center; min-height: 36px; }
.vt-dv-kopf .spacer { flex: 1; }
.vt-dv .vt-zeile { background: var(--surface); }
.vt-alt > summary { cursor: pointer; min-height: 44px; display: flex; align-items: center; color: var(--muted); }
.vt-alt[open] { display: grid; gap: 6px; }
.vd-dv-hinweis { margin: -4px 0 6px; }
.vt-tab td { vertical-align: middle; }
/* Handy: Verträge als Karten (Bau-Regel: Tabellen ohne seitliches Wischen) */
@media (max-width: 700px) {
  .vt-wrap { overflow: visible; border: 0; }
  .vt-tab thead { display: none; }
  .vt-tab, .vt-tab tbody, .vt-tab tr, .vt-tab td { display: block; width: 100%; }
  .vt-tab tr { border: 1px solid var(--linie); border-radius: var(--radius); margin: 0 0 8px; padding: 6px 10px; background: var(--surface); }
  .vt-tab td { border: 0; padding: 2px 0; white-space: normal; }
  .vt-tab td:not(.nm):not([data-label=""])::before { content: attr(data-label) ": "; color: var(--muted); font-size: .8125rem; }
  .vt-tab td .btn { min-height: var(--tap); margin-top: 4px; }
}
.vv-platzhalter li.fehlt { color: var(--muted); }
.vd-box { border: 1px solid var(--linie); border-radius: var(--radius); padding: 8px 12px 0; margin: 0 0 12px; }
.vd-box legend { font-weight: 700; padding: 0 6px; }
.dp-ausgabe { display: grid; gap: 10px; }
.dp-ausgabe .btn { min-height: var(--tap); justify-content: flex-start; }
.dp-schnell[aria-pressed="true"] { background: var(--primary); color: var(--on-primary); border-color: var(--primary); font-weight: 700; }
.dp-werkzeug { display: flex; flex-wrap: nowrap; gap: 6px; align-items: center; overflow-x: auto; margin: 0 0 8px; padding: 6px 8px; border: 1px solid var(--primary-line);
  border-radius: var(--radius); background: var(--primary-soft); }
.dp-werkzeug-text { flex: 0 0 auto; font-size: .8125rem; font-weight: 600; }
.dp-werkzeug .btn { flex: 0 0 auto; min-height: 36px; white-space: nowrap; }
.dp-stw[aria-pressed="true"] { outline: 3px solid var(--primary); outline-offset: 1px; font-weight: 700; }
.dp-stw .dp-ein { display: inline-block; min-width: 2.4em; text-align: center; font-weight: 700; margin: 0; }
.dp-werkzeug-an .dp-feld:not(.aus):not(.sperre), .dp-werkzeug-an .zl-spur:not(.aus):not(.sperre) { cursor: copy; }
.dp-zl { font-variant-numeric: tabular-nums; }
.zl-zeile { display: grid; grid-template-columns: 11rem minmax(0, 1fr) 6.25rem; border-bottom: 1px solid var(--linie); }
.zl-kopf { position: sticky; top: 0; z-index: 3; background: var(--head); font-size: .8125rem; font-weight: 700; }
.zl-wer { position: sticky; left: 0; z-index: 2; background: var(--surface); padding: 6px 8px; border-right: 1px solid var(--linie); font-weight: 600; font-size: .875rem;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.zl-kopf .zl-wer, .zl-trenner .zl-wer { background: var(--head); }
.zl-wer small { display: block; font-weight: 400; color: var(--muted); }
.zl-spur { position: relative; height: 52px; cursor: pointer; }
.zl-kopf .zl-spur { height: 30px; cursor: default; }
.zl-spur:hover, .zl-spur:focus-visible { box-shadow: inset 0 0 0 2px var(--primary); outline: none; }
.zl-kopf .zl-spur:hover, .zl-bes:hover, .zl-trenner .zl-spur:hover { box-shadow: none; }
.zl-std { position: absolute; top: 0; bottom: 0; border-left: 1px solid var(--divider); font-size: .75rem; padding: 6px 0 0 3px; color: var(--muted); pointer-events: none; }
.zl-kopf .zl-std { color: var(--text); }
.zl-spur.aus { background: repeating-linear-gradient(45deg, transparent 0 6px, var(--sk-schraffur) 6px 9px); cursor: not-allowed; }
.zl-spur.sperre { background: var(--surface-2); cursor: not-allowed; }
.zl-verf { position: absolute; top: 6px; bottom: 6px; border: 1px dashed var(--primary-line); background: var(--primary-soft); border-radius: 6px; pointer-events: none; }
.dp-ein.zl-balken { position: absolute; top: 12px; bottom: 12px; margin: 0; display: flex; align-items: center; gap: 4px; min-width: 4px; pointer-events: none; }
.dp-ein.zl-balken.ganz { background-image: repeating-linear-gradient(90deg, transparent 0 12px, var(--p-line) 12px 14px); }
.zl-pause { position: absolute; top: 12px; bottom: 12px; background: repeating-linear-gradient(45deg, var(--surface) 0 3px, transparent 3px 6px); border-left: 1px dashed var(--muted);
  border-right: 1px dashed var(--muted); pointer-events: none; }
.zl-jetzt { position: absolute; top: 0; bottom: 0; width: 2px; background: var(--danger); pointer-events: none; }
.zl-grund { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: var(--muted); font-size: .8125rem; pointer-events: none; }
.zl-sum { padding: 6px 8px; text-align: right; font-size: .8125rem; border-left: 1px solid var(--linie); white-space: nowrap; }
.zl-sum.null { background: var(--danger-soft); color: var(--danger); font-weight: 700; }
.zl-trenner { background: var(--head); font-size: .8125rem; font-weight: 700; }
.zl-trenner .zl-spur { height: auto; cursor: default; }
.zl-spur.zl-bes { height: 34px; cursor: default; }
.zl-zahl { position: absolute; top: 0; bottom: 0; border-left: 1px solid var(--divider); text-align: center; padding-top: 8px; font-size: .8125rem; }
.zl-zahl.leer { color: var(--muted); }
.dp-muster.verf { border-style: dashed; border-color: var(--primary-line); background: var(--primary-soft); }
.dp-muster.pause { background: repeating-linear-gradient(45deg, var(--surface) 0 3px, var(--linie) 3px 6px); }
.dp-muster.jetzt { width: 3px; border: 0; background: var(--danger); }
@media (max-width: 700px) {
  .zl-zeile { grid-template-columns: 8.5rem minmax(0, 1fr) 4.5rem; }
  .dp-schnell-text, .dp-stw-name { display: none; }
}
.st-felder > .st-farbzeile { display: inline-flex; gap: 6px; align-items: center; flex: 0 1 15rem; }
.st-farbzeile .st-farbe { flex: 1 1 auto; min-width: 0; }
@media (pointer: coarse) { .sk-reiter .subtab, .dp-leiste .btn { min-height: var(--tap); } .dp-feld { min-height: var(--tap); } }
@media print { #skReiter, #skDp { display: none !important; } }
/* Umreihen mit Uhrzeit (18.10.2026): Kästchen je Einsatz statt der Auswahl, Fenster „Einteilung“ */
.anw-ein-chips { display: flex; flex-direction: column; gap: 4px; }
.anw-chip { display: flex; flex-wrap: wrap; align-items: center; gap: 0 6px; width: 100%; min-height: 38px; padding: 4px 8px; border: 1px solid var(--primary-line);
  border-radius: 8px; background: var(--primary-soft); color: var(--text); font-size: .875rem; text-align: left; cursor: pointer; }
.anw-chip:hover:not(:disabled) { border-color: var(--primary); }
.anw-chip:disabled { cursor: default; }
.anw-chip-zeit, .umr-zeit { color: var(--primary); font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
@media (pointer: coarse) { .anw-chip { min-height: var(--tap); font-size: 1rem; } }
.umr { display: grid; gap: 12px; }
.umr .field { margin-bottom: 0; }
.umr-jetzt { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.umr-jetzt > .muted { flex-basis: 100%; }
.umr-chip { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 0 6px; min-height: 32px; padding: 2px 10px; border: 1px solid var(--primary-line); border-radius: 999px; background: var(--primary-soft); }
.umr-art { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.umr-art .btn { min-height: var(--tap); white-space: normal; line-height: 1.2; padding: 4px 6px; }
.umr-art .btn[aria-pressed="true"] { background: var(--primary); color: var(--on-primary); border-color: var(--primary); font-weight: 700; }
.umr-fenster { display: grid; gap: 6px; }
.umr-opt { display: flex; align-items: center; gap: 10px; min-height: var(--tap); padding: 0 12px; border: 1px solid var(--divider); border-radius: 8px; cursor: pointer; }
.umr-opt:has(input:checked) { border-color: var(--primary); background: var(--primary-soft); }
.umr-opt input { width: 20px; height: 20px; margin: 0; accent-color: var(--primary); flex: none; }
.umr-opt .umr-chip { border: 0; background: transparent; padding: 0; }
.umr-reihe { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr); gap: 10px; }
@media (max-width: 420px) { .umr-reihe { grid-template-columns: minmax(0, 1fr); } }
.umr-vorschau { display: grid; gap: 2px; padding: 8px 12px; border-radius: 8px; background: var(--surface-2); }
.umr-vorschau.fehler { background: var(--danger-soft); color: var(--danger); font-weight: 600; }
.sk-umr { min-width: var(--tap); }
table.std.sk-std .sk-umr { float: right; min-height: 40px; margin-right: 4px; }
.sk-personal .sk-pause-hinweis { margin: 8px 0 0; }
.sk-auswahl .kal-opt .dp-ein { display: inline-block; min-width: 2.4em; text-align: center; font-weight: 700; margin: 0; }
@media print { .anw-chip { border: 0; background: none; padding: 0; min-height: 0; } }

/* ---------- Anwesenheit – Monatsübersicht: Zeilen = Personen, Spalten = Tage (nur lesen) ---------- */
.datebar-extra { display: flex; gap: 8px; }
.mon-legende { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 4px 0 8px; font-size: .875rem; }
.mon-leg { display: inline-flex; align-items: center; gap: 6px; }
.mon-z { display: inline-flex; align-items: center; justify-content: center; min-width: 28px; height: 24px; padding: 0 4px;
  border-radius: 6px; font-weight: 700; border: 1px solid transparent; }
table.mon th.kal-tag, table.mon td.mon-zelle { min-width: 2.5rem; }
table.mon td.mon-zelle { padding: 2px; text-align: center; vertical-align: middle; }
.mon-btn { display: flex; align-items: center; justify-content: center; width: 100%; min-width: 2.25rem; min-height: 2.25rem;
  padding: 0; border: 1px solid transparent; border-radius: 6px; background: transparent; color: var(--ink);
  font: inherit; font-size: .9375rem; font-weight: 700; line-height: 1; cursor: pointer; -webkit-hyphens: none; hyphens: none; }
.mon-btn:hover { border-color: var(--linie-stark); }
.mon-anw { background: var(--primary-soft); color: var(--primary); border-color: var(--primary-line); }
.mon-abw { background: var(--danger-soft); color: var(--danger); border-color: var(--danger-line); }
.mon-ks { background: var(--warning-soft); color: var(--warning-text); border-color: var(--warning-line, var(--hilite-line)); }
.mon-url { background: var(--surface); color: var(--ink); border-color: var(--linie-stark); }
.mon-offen { background: var(--hilite); color: var(--warning-text); border-color: var(--hilite-line); }
.mon-leer { color: var(--muted); }
.mon-z.mon-leer { border: 1px dashed var(--linie); }
table.mon .mon-summe { min-width: 3rem; padding: 4px 6px; text-align: right; font-weight: 700; background: var(--surface-3); }
table.mon thead .mon-summe { text-align: center; }
table.mon tfoot th, table.mon tfoot td { background: var(--primary-soft); font-weight: 700; text-align: center; border-top: 2px solid var(--primary); }
table.mon tr.mon-inaktiv .kal-name { color: var(--muted); font-weight: 400; }
.mon-btn { position: relative; }
.mon-btn.hat-notiz { box-shadow: inset 0 0 0 1px var(--linie-stark); }
.mon-notiz { position: absolute; top: -3px; right: -3px; font-size: .875rem; line-height: 1; pointer-events: none; }
.mon-z.mon-leer-notiz { border: 1px solid var(--linie); }
.mon-dlg-status { display: flex; align-items: center; gap: 8px; font-weight: 600; }
.mon-notiz-feld { width: 100%; min-height: 5.5rem; resize: vertical; }
.mon-notizen h2 { font-size: 1rem; margin: 12px 0 4px; }
.mon-notizen ul { margin: 0; padding-left: 18px; }

/* ---------- Stundenaufzeichnungen ---------- */
.std-titel { font-size: 1.15rem; margin: 0 0 10px; }
.std-wrap { max-height: calc(100vh - 250px); max-height: calc(100dvh - 250px); overflow: auto; }
table.std { min-width: 720px; }
table.std th, table.std td { padding: 4px 8px; }
table.std thead th { text-align: left; }
table.std th.std-tag { min-width: 6rem; white-space: nowrap; }
table.std tbody th.std-tag { position: sticky; left: 0; background: var(--surface); z-index: 1; font-weight: 600; text-align: left; }
table.std thead th.std-tag { z-index: 3; background: var(--head); }
.std-wt { display: inline-block; width: 2em; color: var(--muted); font-weight: 400; font-size: .875rem; }
.std-nr { display: inline-block; min-width: 1.625rem; font-variant-numeric: tabular-nums; }
.std-grund { margin-left: 4px; background: var(--blue-light); color: var(--info); font-size: .875rem; }
.std-fehlt-badge { margin-left: 4px; background: var(--amber-light); color: var(--amber); font-size: .875rem; }
.std-row.we > th.std-tag, .std-row.we > td { background: var(--surface-2); }
.std-row.heute > th.std-tag, .std-row.heute > td { background: var(--green-light); }
.std-row.heute .std-nr { color: var(--green); font-weight: 700; }
.std-row.zukunft > th.std-tag { color: var(--muted); }
.std-row.zukunft .input:disabled { background: var(--surface-2); color: var(--muted); cursor: not-allowed; }
/* Mitarbeiter: Tag nach 04:00 Uhr am Folgetag gesperrt (Nutzer 14.10.2026) – Antippen öffnet den Hinweis */
.std-row.abgelaufen { cursor: pointer; }
.std-row.abgelaufen > th.std-tag { color: var(--muted); }
.std-row.abgelaufen .input:disabled, .std-row.abgelaufen .zeit-jetzt { background: var(--surface-2); color: var(--muted); pointer-events: none; }
.std-row.abgelaufen > th.std-tag .std-nr::after { content: ' 🔒'; font-size: .75rem; }
.std-nachtrag { display: inline-flex; align-items: center; gap: 4px; min-height: var(--tap); margin-top: 2px; font-size: .75rem; font-weight: 600; line-height: 1.15; color: var(--warning-text); cursor: pointer; }
.std-nachtrag input { width: 20px; height: 20px; margin: 0; flex: 0 0 auto; }
.std-nachtrag.an { color: var(--primary); }
.std-anfrage-badge { display: block; margin-top: 2px; white-space: nowrap; }
.std-anfragen { margin: 0 0 14px; padding: 10px; border: 1px solid var(--warning-line); border-radius: 8px; background: var(--warning-soft); }
.std-anfragen h3 { margin: 0 0 8px; font-size: 1rem; }
.std-anfrage { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 0; border-top: 1px solid var(--warning-line); }
.std-anfrage-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1 1 14rem; }
.std-anfrage-knoepfe { display: flex; flex-wrap: wrap; gap: 6px; }
.std-nachtrag-felder { display: grid; gap: 0 10px; grid-template-columns: repeat(auto-fit, minmax(min(8rem, 100%), 1fr)); }
.std-row.fehlt > th.std-tag, .std-row.fehlt > td { background: var(--amber-light); }
.std-row.fehlt > th.std-tag { box-shadow: inset 4px 0 0 var(--amber); }
.std-row.zu-lang .std-gesamt b { color: var(--red); }
table.std td.std-gesamt { font-variant-numeric: tabular-nums; white-space: nowrap; }

/* Uhrzeit-Zelle: Eingabefeld plus großer „Jetzt“-Knopf */
td.std-zeit { min-width: 132px; }
.zeit-zelle { display: flex; align-items: center; gap: 4px; }
.zeit-inp { width: 100%; min-width: 86px; min-height: 40px; padding: 4px 6px; text-align: center; font-variant-numeric: tabular-nums; }
.zeit-jetzt { flex: 0 0 auto; min-width: 46px; min-height: 40px; padding: 0 7px; font-size: .875rem; font-weight: 700; }
.std-aktionen { display: flex; flex-wrap: wrap; gap: 8px; }
/* Stundenaufzeichnung: Handy-Knopf „⋯“, kurze Kopfzeilen, Notiz-Zeichen (nur am Handy sichtbar, 14.10.2026) */
.std-mehr, .kopf-kurz { display: none; }
.std-notiz-zeichen { display: none; margin-left: 2px; }
/* Monatsübersicht (Dashboard) */
table.std-db { width: 100%; border-collapse: separate; border-spacing: 0; }
table.std-db th, table.std-db td { padding: 6px 8px; }
table.std-db .r { text-align: right; font-variant-numeric: tabular-nums; }
table.std-db th.std-db-name { position: sticky; left: 0; z-index: 1; text-align: left; min-width: 10rem; background: var(--surface); }
table.std-db thead th.std-db-name { background: var(--head); z-index: 3; }
table.std-db tfoot th.std-db-name { background: var(--green-light); }
table.std-db td.std-db-std { font-weight: 700; }
table.std-db td.std-db-fehlt { color: var(--warning-text); font-weight: 700; background: var(--amber-light); }
.std-db-ohne { margin-top: 8px; }
/* Gesamtauflistung (Woche, alle Mitarbeiter, nur Admin) – Nutzer 14.10.2026 */
.std-ges-leiste { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 6px; }
.std-ges-kw { font-variant-numeric: tabular-nums; }
.std-ges-info { margin: 0 0 8px; }
table.std-ges-tab { width: 100%; border-collapse: separate; border-spacing: 0; }
table.std-ges-tab th, table.std-ges-tab td { padding: 6px 8px; vertical-align: top; border-right: 1px solid var(--linie); }
table.std-ges-tab tr > :last-child { border-right: 0; }
table.std-ges-tab .r { text-align: right; font-variant-numeric: tabular-nums; }
table.std-ges-tab th.std-ges-name { position: sticky; left: 0; z-index: 1; min-width: 10rem; text-align: left; background: var(--surface); }
table.std-ges-tab thead th.std-ges-name { background: var(--head); z-index: 3; }
table.std-ges-tab tfoot th.std-ges-name { background: var(--green-light); }
table.std-ges-tab .std-ges-tag { text-align: center; min-width: 5.5rem; }
table.std-ges-tab tbody .we { background: var(--surface-2); }
table.std-ges-tab .std-ges-sum { font-weight: 700; border-left: 2px solid var(--linie-stark); }
.std-ges-std { display: block; font-weight: 700; font-variant-numeric: tabular-nums; }
.std-ges-zeit { display: block; font-size: .875rem; color: var(--muted); white-space: nowrap; font-variant-numeric: tabular-nums; }
table.std-ges-tab input.std-ges-limit { width: 5.5rem; text-align: right; }
table.std-ges-tab td.std-ges-frei { font-weight: 700; }
table.std-ges-tab td.std-ges-frei.knapp { color: var(--warning-text); background: var(--warning-soft); }
table.std-ges-tab td.std-ges-frei.ueber { color: var(--danger); background: var(--danger-soft); }
/* Stammdaten → Gesamtliste (14.10.2026) */
.gl-leiste .search { flex: 1 1 220px; }
.toolbar.gl-leiste select.input { min-width: 0; max-width: 100%; flex: 1 1 10rem; }
table.gl a[href^="tel:"], table.gl a[href^="mailto:"] { display: inline-flex; align-items: center; min-height: var(--tap); overflow-wrap: anywhere; }
table.gl { width: 100%; border-collapse: separate; border-spacing: 0; }
table.gl th, table.gl td { padding: 6px 8px; vertical-align: top; }
table.gl .r { text-align: right; font-variant-numeric: tabular-nums; }
table.gl th.gl-name { position: sticky; left: 0; z-index: 1; text-align: left; min-width: 11rem; background: var(--surface); }
table.gl thead th.gl-name { background: var(--head); z-index: 3; } /* über den anderen Kopfzellen beim seitlichen Scrollen */
table.gl td.gl-tage { font-weight: 700; }
table.gl td.gl-notiz-td { min-width: 14rem; }
table.gl td[data-label="E-Mail"] { min-width: 13rem; overflow-wrap: anywhere; }
table.gl td[data-label="Straße + Nr."] { min-width: 9rem; }
table.gl td.gl-kontakt { min-width: 7rem; white-space: nowrap; position: relative; }
.gl-haken { position: relative; }
.gl-haken-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.gl-notiz { width: 100%; min-height: var(--tap); resize: vertical; }
.gl-kontakt-info { display: block; color: var(--muted); }
table.gl tr.gl-ja > td, table.gl tr.gl-ja > th { background: var(--primary-soft); }
table.gl tr.inaktiv > td, table.gl tr.inaktiv > th.gl-name { color: var(--muted); }
td.std-pause { min-width: 104px; }
td.std-notiz { min-width: 200px; width: 26%; }
td.std-notiz input { width: 100%; min-height: 40px; padding: 6px 10px; border: 1px solid var(--border); border-radius: 8px; }

/* Wochen- und Monatssumme */
table.std tr.std-woche td { background: var(--surface-3); font-weight: 600; color: var(--muted); }
table.std tr.std-woche td.c { color: var(--ink); font-variant-numeric: tabular-nums; }
table.std tfoot td { background: var(--green-light); font-weight: 700; border-top: 2px solid var(--green);
  position: sticky; bottom: 0; z-index: 2; font-variant-numeric: tabular-nums; }

/* Knopf „Fehlende Stunden“, wenn etwas offen ist */
.btn-warn { background: var(--amber-light); border-color: var(--warning-line); color: var(--amber); font-weight: 700; }
.btn-warn:hover { background: var(--warning-soft-hover); }

/* Hinweisfenster „Stundenaufzeichnungen fehlen“ */
.std-fehlend { display: grid; gap: 8px; max-height: 50vh; max-height: 50dvh; overflow: auto; margin: 8px 0; }
.std-fehlend-tag { padding: 8px 10px; border: 1px solid var(--warning-line); border-radius: 8px; background: var(--amber-light); }
.std-fehlend-namen { margin-top: 2px; font-size: .9rem; }

/* Unterschriftszeilen beim Drucken */
.std-fuss { margin-top: 18px; }
.std-sign { display: flex; gap: 40px; margin-top: 26px; }
.std-sign > div { flex: 1 1 0; text-align: center; }
.std-line { display: block; border-top: 1px solid var(--text); margin-bottom: 4px; }

/* Hinweise im Stundenblatt: abgeschlossener Monat, eigene Lücken */
#stdHinweis { display: grid; gap: 8px; margin: 0 0 10px; }
#stdHinweis .hinweis-box { margin: 0; }
.std-gesperrt { background: var(--surface-2); border-color: var(--line); color: var(--ink); }
.std-meine-luecken { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.std-meine-luecken .btn-mini { background: var(--surface); }
/* Hinweise einzeilig + schließbar (Nutzer 14.10.2026) */
.std-meine-luecken { display: block; }
.std-hinweis-zeile { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; }
.std-hinweis-zeile > :first-child { flex: 1 1 6rem; min-width: 0; }
.std-hinweis-x { min-width: var(--tap); min-height: var(--tap); font-size: 1.25rem; line-height: 1; background: var(--surface); }
.std-luecken-tage { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 6px; }
table.std tr.std-ziel > th, table.std tr.std-ziel > td { box-shadow: inset 0 3px 0 var(--warning-line), inset 0 -3px 0 var(--warning-line); }
.std-aktionen .btn-warn { border-color: var(--warning-line); }

/* =====================================================================
   Einheitliche, kräftigere Rahmen (Nutzer-Wunsch 21.09.)
   Gilt für Anwesenheit, Besprechung, Stundenaufzeichnungen,
   Standortkalender, Stammdaten und Verwaltung – am Bildschirm und im Druck.
   ===================================================================== */

.table-scroll { border: 2px solid var(--linie-stark); }
table.data { border-collapse: separate; border-spacing: 0; }
table.data th, table.data td { border-bottom: 1px solid var(--linie); }
table.data thead th { background: var(--head); color: var(--text); font-weight: 700;
  border-bottom: 2px solid var(--linie-stark); box-shadow: inset 0 -2px 0 var(--linie-stark); }
table.data > tbody > tr:last-child > td, table.data > tbody > tr:last-child > th { border-bottom: 0; }
table.data tfoot td, table.data tfoot th { border-top: 2px solid var(--green); }
.anw tfoot td { box-shadow: inset 0 2px 0 var(--green); }

/* Karten und Kästen ebenfalls deutlicher abgrenzen */
.card { border: 1px solid var(--linie); }
.besp-eintrag { border: 1px solid var(--linie); }
.dialog { border: 2px solid var(--linie-stark); }

/* Stundenblatt: Wochen- und Summenzeilen klar abgesetzt */
table.std tr.std-woche td { border-top: 1px solid var(--linie-stark); border-bottom: 1px solid var(--linie-stark); }
table.std tbody th.std-tag { border-right: 1px solid var(--linie); }
table.std thead th { border-right: 1px solid var(--linie); }
table.std thead th:last-child { border-right: 0; }

/* Standortkalender: Gitter zwischen den Tagen */
table.kal th.kal-tag { border-left: 1px solid var(--linie); }
table.kal .kal-name { border-right: 2px solid var(--linie-stark); }

/* Anwesenheit: Namensspalte und Gruppen abgrenzen */
.anw td.name, .anw th.name { border-right: 2px solid var(--linie-stark); }
.anw td.sep, .anw th.sep, .anw th.grp { border-left: 1px solid var(--linie); }

/* Feiertage sehen aus wie Samstag und Sonntag */
.feiertag-badge { margin-left: 4px; background: var(--surface-2); color: var(--text); font-weight: 600; font-size: .875rem;
  max-width: 150px; overflow: hidden; text-overflow: ellipsis; vertical-align: middle; }

.kal-tag.feiertag .kal-wt { color: var(--amber); }
.badge.frei-tag { background: var(--head); color: var(--text); border: 1px solid var(--linie); margin-right: 4px; }

/* Erledigt-Hackerl in der Besprechung */
.besp-fertig { display: inline-flex; align-items: center; gap: 4px; min-height: 30px; padding: 0 6px;
  border: 1px solid var(--border); border-radius: 8px; background: var(--surface); cursor: pointer; font-size: .875rem; color: var(--muted); }
.besp-fertig:hover { border-color: var(--green); color: var(--green); }
.besp-fertig input { width: 18px; height: 18px; margin: 0; accent-color: var(--green); cursor: pointer; }
.besp-eintrag.status-erledigt .besp-fertig { border-color: var(--green); color: var(--green); font-weight: 700; }
.besp-status-von.ist-erledigt { color: var(--green); font-weight: 700; }
/* Erledigter Eintrag wird grau */
.besp-eintrag.status-erledigt { background: var(--surface-2); border-color: var(--linie); }
.besp-eintrag.status-erledigt .besp-autor, .besp-eintrag.status-erledigt .besp-eintrag-text { color: var(--muted); }
.besp-eintrag.status-erledigt .besp-punkt { filter: grayscale(1); opacity: .6; }
.besp-eintrag.status-erledigt .avatar, .besp-eintrag.status-erledigt .besp-avatar { filter: grayscale(1); opacity: .75; }

.anmeldemail-zeile { margin: 0; gap: 8px; }
.anmeldemail-zeile .input { flex: 1 1 260px; max-width: 360px; }

/* =====================================================================
   Abschlussprüfung iPhone / iPad (21.09.2026)
   Behebt: automatisches Hineinzoomen beim Tippen, zu kleine Tippflächen,
   Verzögerung und Doppeltipp-Zoom, Kontextmenü beim Ziehen.
   ===================================================================== */

/* 1) iPhone zoomt beim Antippen in jedes Feld mit weniger als 16px Schrift.
      Auf Geräten, die mit dem Finger bedient werden, sind daher alle
      Eingabefelder mindestens 16px groß. */

/* 2) Tippflächen bei Finger-Bedienung: mindestens 48 x 48 px (mobile-ui-Skill).
      Die Selektoren sind so spezifisch wie die Handy-Regeln oben, damit sie greifen. */

/* 3) Kein Warten auf den Doppeltipp und kein Hineinzoomen beim schnellen
      zweimaligen Antippen – gilt nur für Bedienelemente, nicht für Texte. */
button, .btn, .chk, .besp-fchip, .kal-opt, .linkbtn, .zeit-jetzt, .besp-fertig, .farb-opt, .seg-opt { touch-action: manipulation; }

/* 4) Beim Halten zum Ziehen darf iOS kein Kontextmenü („Kopieren …“) öffnen. */
.zieh-griff, .besp-eintrag, .anw td.name, table.data tbody th.std-tag {
  -webkit-touch-callout: none;
}
body.zieht-gerade, body.zieht-gerade * { -webkit-touch-callout: none; }

/* 5) Am iPad hochkant und am iPhone quer passten die sechs Reiter nicht in
      eine Zeile – ab hier die kurzen Beschriftungen verwenden. */

.std-datei-knopf { margin: 14px 0 4px; }
.std-datei-knopf .btn { display: block; text-align: center; text-decoration: none; min-height: 48px; line-height: 48px; }

/* Nachtrag zur iPhone-/iPad-Prüfung: Regeln mit genügend Gewicht, damit sie
   auch am iPad im Querformat greifen (dort ist der Schirm breiter als 900px,
   bedient wird aber mit dem Finger). */

/* iPhone im Querformat: die sechs Reiter etwas enger, damit sie in eine Zeile passen */

/* iPad im Querformat (bis 1100px): Marke, Reiter und Benutzerbox passen nicht in
   eine Zeile – die Reiter bekommen eine eigene Zeile, dann sind alle sechs sichtbar. */

/* Stundenblatt am Handy: die vier Knöpfe in zwei Reihen statt vier zu schmalen
   nebeneinander – sonst läuft der Text über den Knopfrand hinaus. */

/* Monatsname im Stundenblatt und im Kalender nicht abschneiden */

/* Kleine iPhones (bis 380px): Monatsname und Datum brauchen mehr Platz */

/* Einsatzkalender im Personen-Fenster: Häkchen am Tag = an diesem Tag aktiv */
.tk { border: 1px solid var(--line); border-radius: var(--radius); padding: 10px; background: var(--surface-3); }
.tk-label { display: block; font-weight: 600; margin-bottom: 6px; }
.tk-kopf { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 6px; }
.tk-titel { flex: 1; text-align: center; }
.tk-gitter { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.tk-wt { text-align: center; font-size: .875rem; color: var(--muted); font-weight: 600; }
.tk-tag { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 4px 0; border: 1px solid var(--border);
  border-radius: 8px; background: var(--card); cursor: pointer; font-size: .875rem; min-height: 44px; justify-content: center; }
.tk-tag input { width: 18px; height: 18px; margin: 0; accent-color: var(--green); cursor: pointer; }
.tk-tag.we { background: var(--surface-2); }
.tk-tag.an { background: var(--green-light); border-color: var(--green-mid); font-weight: 600; }
.tk-tag.heute { outline: 2px solid var(--green); outline-offset: -2px; }
.tk-tag.vorbei { opacity: .6; }
.tk-fuss { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 8px; }
.tk-info { flex-basis: 100%; }

/* mobile-ui Etappe 1: kein seitliches Scrollen, auch bei großer Systemschrift */
.besp-dateien, .besp-uploads, .besp-verlauf, .besp-antworten, .besp-menue, .offen-liste, .std-fehlend, .kal-liste {
  grid-template-columns: minmax(0, 1fr);
}

/* Datei-Chips am Eintrag: lange Dateinamen mit … kürzen statt die Karte breit zu drücken */
.besp-eintrag-dateien { min-width: 0; max-width: 100%; flex-basis: 100%; }
.besp-dchip-wrap { min-width: 0; max-width: 100%; }
.besp-dchip { min-width: 0; max-width: min(230px, 100%); }
.besp-chip-name { min-width: 0; }

/* Anwesenheit am Handy (Hochformat): Kästchen paarweise nebeneinander,
   Kürzel rechts neben dem Namen, KS über die ganze Breite */

/* Schalter Hell / Dunkel / Automatisch in der Kopfzeile */
.btn-darstellung { gap: 6px; padding: 0 12px; }
.btn-darstellung svg { width: 20px; height: 20px; flex: 0 0 auto; }

/* =====================================================================
   mobile-ui Etappe 3: Navigation
   Handy (bis 900 px): Leiste unten, 4 Punkte + „Mehr“ in Daumenreichweite.
   Ab 901 px (iPad quer, PC): Seitenleiste links.
   ===================================================================== */
:root { --nav-h: 64px; }
.nav-item {
  position: relative; display: flex; align-items: center; border: 0; background: transparent; color: var(--text-muted);
  font: inherit; cursor: pointer; text-align: left; -webkit-tap-highlight-color: transparent; touch-action: manipulation;
  -webkit-hyphens: none; hyphens: none;
}
.nav-icon { display: inline-flex; flex: 0 0 auto; }
.nav-icon svg { width: 24px; height: 24px; }
.nav-label { min-width: 0; }
.nav-item[aria-current="page"] { color: var(--primary); font-weight: 650; }
.nav-item:hover { color: var(--text); }
.nav .tab-blase { margin-left: 0; }

/* Fenster „Mehr“ am Handy */
.mehr-liste { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; }
.mehr-punkt { justify-content: flex-start; gap: 12px; min-height: 56px; font-size: 1.0625rem; }

/* =====================================================================
   ToDo (wie Microsoft To Do): Listen | Aufgaben | Details.
   Handy (bis 900 px): ein Bereich – .zeigt-liste → Aufgaben, .zeigt-detail → Details.
   901–1199 px: Listen + Aufgaben bzw. Listen + Details. Ab 1200 px alle drei.
   Farben nur aus Tokens bzw. den Personenfarben (.farbe-* mit --p / --p-bg).
   ===================================================================== */
.todo-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; align-items: start; }
.todo-layout > .card { margin-bottom: 0; min-width: 0; }
.todo-seite-titel { margin-bottom: 8px; }
.todo-feld-titel { font-weight: 600; font-size: .9rem; }
.todo-dialog-ue { font-size: 1rem; margin: 16px 0 8px; }

/* Suche */
.todo-suche-feld { position: relative; margin-bottom: 8px; }
.todo-suche-feld .todo-icon { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); color: var(--text-muted); pointer-events: none; }
.todo-suche-feld .input { width: 100%; padding-left: 40px; min-height: var(--tap); }

/* Listen links */
.todo-listen { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 2px; }
.todo-eigene { border-top: 1px solid var(--divider); margin-top: 8px; padding-top: 8px; }
.todo-listenpunkt {
  display: flex; align-items: center; gap: 12px; width: 100%; min-height: 48px; padding: 8px 12px;
  border: 0; border-radius: 8px; background: transparent; color: var(--text); font: inherit; text-align: left; cursor: pointer;
  -webkit-hyphens: none; hyphens: none; touch-action: manipulation;
}
.todo-listenpunkt:hover { background: var(--hover); }
.todo-listenpunkt[aria-current="true"] { background: var(--primary-soft); font-weight: 650; }
.todo-listenname { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.todo-von { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .875rem; }
.todo-anzahl { flex: 0 0 auto; color: var(--text-muted); font-size: .875rem; font-variant-numeric: tabular-nums; }
.todo-neue-liste { width: 100%; justify-content: flex-start; gap: 10px; margin-top: 8px; }

/* Symbole */
.todo-icon { display: inline-flex; flex: 0 0 auto; color: var(--primary); }
.todo-icon svg { width: 22px; height: 22px; }
.todo-icon.gross svg { width: 28px; height: 28px; }
.todo-meinTag .todo-icon { color: var(--warning); }
.todo-wichtig .todo-icon { color: var(--info); }
.hat-farbe .todo-icon { color: var(--p); }

/* Kopf der Liste */
.todo-inhalt:focus-visible, .todo-detail:focus-visible { outline: none; }
.todo-kopf { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 12px; margin-bottom: 12px; }
.todo-kopf h2 { margin: 0; min-width: 0; flex: 1 1 auto; overflow-wrap: anywhere; }
.todo-menue-knopf { min-width: var(--tap); font-size: 1.25rem; font-weight: 700; padding: 0 8px; }
.todo-datum { flex-basis: 100%; }
.todo-sortinfo { display: inline-flex; align-items: center; gap: 6px; flex-basis: 100%; }
.todo-zurueck { display: none; margin: -4px 0 8px -8px; }

/* Neue Aufgabe */
.todo-neu, .todo-neuer-schritt { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.todo-neu .input, .todo-neuer-schritt .input { flex: 1 1 auto; min-width: 0; min-height: var(--tap); }
/* schmal: Knopf unter das Feld, damit der Platzhalter lesbar bleibt */
.todo-neu { flex-wrap: wrap; }
.todo-neu .input { flex-basis: 13rem; }
.todo-neu .btn { flex: 1 0 auto; }
.todo-neu > .todo-icon, .todo-neuer-schritt > .todo-icon { color: var(--text-muted); }

/* Aufgaben */
.todo-aufgaben { list-style: none; margin: 0 0 8px; padding: 0; display: grid; gap: 6px; }
.todo-aufgabe {
  display: flex; align-items: center; gap: 4px; min-height: 56px; padding: 2px 4px;
  background: var(--surface); border: 1px solid var(--divider); border-radius: 8px;
}
.todo-aufgabe:hover { background: var(--surface-3); }
.todo-aufgabe.gewaehlt { border-color: var(--primary); background: var(--primary-soft); }
.todo-aufgabe-text {
  flex: 1 1 auto; min-width: 0; min-height: 48px; display: flex; flex-direction: column; justify-content: center; gap: 2px;
  padding: 6px 4px; border: 0; background: transparent; color: var(--text); font: inherit; text-align: left; cursor: pointer;
}
.todo-titel { overflow-wrap: anywhere; }
.todo-aufgabe.erledigt .todo-titel { text-decoration: line-through; color: var(--text-muted); }
.todo-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 12px; font-size: .875rem; color: var(--text-muted); }
.todo-meta > span { display: inline-flex; align-items: center; gap: 4px; min-width: 0; }
.todo-meta .todo-icon, .todo-meta .todo-icon svg { width: 16px; height: 16px; color: inherit; }
.todo-meta-liste .besp-punkt { width: 8px; height: 8px; }
.todo-meta-datum.heute { color: var(--primary); font-weight: 600; }
.ueberfaellig, .todo-meta-datum.ueberfaellig { color: var(--danger); font-weight: 600; }
.todo-kat { padding: 0 8px; border-radius: 99px; background: var(--p-bg); color: var(--text); }
.todo-kat .besp-punkt { width: 8px; height: 8px; }

/* Haken (Kreis) und Stern – Tippfläche 48 px */
.todo-haken, .todo-stern {
  flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px;
  border: 0; background: transparent; color: var(--text-muted); cursor: pointer; border-radius: 50%; padding: 0;
}
.todo-haken:hover, .todo-stern:hover { background: var(--hover); }
.todo-kreis { width: 22px; height: 22px; border: 2px solid var(--border); border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; }
.todo-haken:hover .todo-kreis { border-color: var(--primary); }
.todo-haken[aria-checked="true"] .todo-kreis { background: var(--primary); border-color: var(--primary); }
.todo-haken[aria-checked="true"] .todo-kreis::after { content: ""; width: 6px; height: 11px; margin-top: -2px; border: solid var(--on-primary); border-width: 0 2.5px 2.5px 0; transform: rotate(45deg); }
.todo-haken.klein { width: 44px; height: 44px; }
.todo-haken.klein .todo-kreis { width: 18px; height: 18px; }
.todo-haken.klein[aria-checked="true"] .todo-kreis::after { width: 5px; height: 9px; }
.todo-stern .todo-icon { color: inherit; }
.todo-stern[aria-pressed="true"] { color: var(--info); }
.todo-stern[aria-pressed="true"] svg { fill: currentColor; }
.todo-aufgabe .zieh-griff { align-self: stretch; }

/* Gruppen (Geplant) und „Erledigt“ */
.todo-gruppe { font-size: 1rem; margin: 16px 0 8px; }
.todo-gruppe:first-child { margin-top: 0; }
.todo-erledigt-knopf { gap: 8px; margin: 8px 0; font-weight: 650; }
.todo-pfeil { display: inline-block; width: 1em; }
.todo-leer .todo-icon { margin-bottom: 8px; color: var(--text-muted); }
.todo-leer p { margin: 0 auto 8px; max-width: var(--measure, 65ch); }

/* Details */
.todo-detail-leiste { display: flex; justify-content: flex-end; margin: -8px -8px 0; }
.todo-detail-zu { min-width: var(--tap); font-size: 1.25rem; }
.todo-detail-kopf { display: flex; align-items: flex-start; gap: 4px; margin-bottom: 8px; }
.todo-detail-titel {
  flex: 1 1 auto; min-width: 0; min-height: 48px; resize: none; overflow: hidden; font-size: 1.125rem; font-weight: 650;
  border-color: transparent; background: transparent; line-height: 1.4; padding: 10px 8px;
}
.todo-detail-titel:hover, .todo-detail-titel:focus { border-color: var(--border); background: var(--surface); }
.todo-detail-kopf.erledigt .todo-detail-titel { text-decoration: line-through; color: var(--text-muted); }
.todo-schritte { list-style: none; margin: 0 0 4px; padding: 0; display: grid; gap: 2px; }
.todo-schritt { display: flex; align-items: center; gap: 2px; }
.todo-schritt-text { flex: 1 1 auto; min-width: 0; min-height: var(--tap); border-color: transparent; background: transparent; }
.todo-schritt-text:hover, .todo-schritt-text:focus { border-color: var(--border); background: var(--surface); }
.todo-schritt.erledigt .todo-schritt-text { text-decoration: line-through; color: var(--text-muted); }
.todo-schritt-menue { min-width: var(--tap); font-weight: 700; padding: 0 6px; }
.todo-optionen { display: grid; gap: 6px; margin: 12px 0; }
.todo-option { display: flex; align-items: center; border: 1px solid var(--divider); border-radius: 8px; background: var(--surface); }
.todo-option-knopf {
  flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 12px; min-height: 48px; padding: 6px 12px;
  border: 0; background: transparent; color: var(--text-muted); font: inherit; text-align: left; cursor: pointer; border-radius: 8px;
}
.todo-option-knopf:hover { background: var(--hover); color: var(--text); }
.todo-option-knopf .todo-icon { color: inherit; }
.todo-option.aktiv .todo-option-knopf { color: var(--primary); font-weight: 600; }
.todo-option.todo-meinTag.aktiv .todo-option-knopf { color: var(--text); }
.todo-option.todo-meinTag.aktiv .todo-icon { color: var(--warning); }
.todo-option.ueberfaellig .todo-option-knopf { color: var(--danger); }
.todo-option-weg { min-width: var(--tap); font-size: 1.25rem; }
.todo-listenwahl select { width: 100%; }
.todo-notiz { width: 100%; min-height: 120px; }
.todo-detail-fuss { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; border-top: 1px solid var(--divider); padding-top: 12px; }
.todo-detail-fuss .btn { gap: 8px; }
.todo-detail-fuss .todo-icon { color: inherit; }
.todo-nur-schmal { display: none; }

/* Teilen, Zuweisen, Verständigen, Dateien (Etappe 3) */
.todo-neu-badge { margin-right: 6px; vertical-align: 1px; }
.todo-meta-person .todo-icon svg { width: 14px; height: 14px; }
.todo-geteilt-knopf { gap: 6px; }
.todo-geteilt-knopf .todo-icon svg { width: 16px; height: 16px; }
.todo-person { display: inline-flex; align-items: center; gap: 8px; min-width: 0; }
.todo-person > span:nth-child(2) { overflow-wrap: anywhere; }
.todo-wahl-liste { display: grid; gap: 4px; }
.todo-wahl { justify-content: flex-start; gap: 10px; padding: 0 8px; border: 1px solid var(--divider); }
.todo-wahl-person { justify-content: space-between; }
.todo-mitglieder { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.todo-mitglieder .badge { margin-left: 8px; }
.todo-zuweisung-info { margin: -4px 0 12px; }
.todo-nachricht { width: 100%; resize: vertical; margin-bottom: 8px; }
.todo-verstaendigen .btn { gap: 10px; }
.todo-verstaendigen .btn-primary .todo-icon { color: inherit; }
.todo-dateien { margin: 12px 0; }
.todo-dateiliste { list-style: none; margin: 0 0 8px; padding: 0; display: grid; gap: 4px; }
.todo-dateiliste li { display: flex; align-items: center; gap: 4px; border: 1px solid var(--divider); border-radius: 8px; }
.todo-datei-link { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 10px; min-height: 48px; padding: 4px 12px; text-decoration: none; }
.todo-datei-link:hover .todo-datei-name { text-decoration: underline; }
.todo-datei-name { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; color: var(--text); }
.todo-datei-knopf { gap: 8px; }
.todo-datei-knopf .todo-icon, .todo-datei-link .todo-icon { color: inherit; }
.todo-uploads { display: grid; gap: 4px; }
.todo-upload { display: flex; align-items: center; gap: 8px; }
.todo-upload span { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Besprechung ↔ ToDo (Etappe 4) */
.besp-todo-chip { gap: 4px; color: var(--primary); border-color: var(--primary-line); }
.besp-todo-chip .todo-icon, .besp-todo-chip .todo-icon svg { width: 16px; height: 16px; color: inherit; }
.besp-todo-chip.erledigt { color: var(--text-muted); border-color: var(--divider); }
.besp-eintrag.aufleuchten { outline: 3px solid var(--focus); outline-offset: 2px; transition: outline-color .3s; }
.todo-besp-link { gap: 6px; margin: -4px 0 12px; max-width: 100%; white-space: normal; text-align: left; }
.todo-besp-link .nav-icon svg { width: 16px; height: 16px; }
.todo-schon { margin: 0 0 12px; padding: 8px 12px; border-radius: 8px; }

/* Dialoge: Wiederholung, Kategorien, Vorschläge */
.todo-wdh-zeile { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 8px; }
.todo-wdh-zahl { width: 6em; }
.todo-wdh-tage { display: flex; flex-wrap: wrap; gap: 4px; }
.todo-wdh-tag, .todo-kat-opt { gap: 8px; padding: 0 12px 0 8px; border: 1px solid var(--divider); }
.todo-kat-wahl { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 8px; }
.todo-kat-opt { justify-content: flex-start; }
.todo-kat-opt input { accent-color: var(--p); }
.todo-vorschlaege { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.todo-vorschlag { display: flex; align-items: center; gap: 8px; padding: 8px 0; border-bottom: 1px solid var(--divider); }
.todo-vorschlag-text { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }

/* Handy: immer nur ein Bereich */
@media screen and (max-width: 900px) {
  .todo-zurueck { display: inline-flex; }
  .todo-layout.zeigt-liste .todo-seite, .todo-layout:not(.zeigt-liste) .todo-inhalt, .todo-layout.zeigt-detail .todo-inhalt { display: none; }
  .todo-nur-schmal { display: inline; }
  .todo-nur-breit { display: none; }
  .todo-detail-leiste { justify-content: flex-start; margin: -4px 0 4px -8px; }
}
@media screen and (min-width: 901px) {
  .todo-layout { grid-template-columns: clamp(260px, 16rem, 360px) minmax(0, 1fr); } /* Listen-Spalte wächst mit der Systemschrift */
  .todo-layout.zeigt-detail .todo-inhalt { display: none; }
  .todo-seite { position: sticky; top: 16px; }
}
@media screen and (min-width: 901px) and (max-width: 1199px) {
  .todo-nur-schmal { display: inline; }
  .todo-nur-breit { display: none; }
  .todo-detail-leiste { justify-content: flex-start; margin: -4px 0 4px -8px; }
}
@media screen and (min-width: 1200px) {
  .todo-layout.zeigt-detail { grid-template-columns: clamp(240px, 15rem, 340px) minmax(0, 1fr) minmax(300px, 380px); }
  .todo-layout.zeigt-detail .todo-inhalt { display: block; }
  .todo-detail { position: sticky; top: 16px; max-height: calc(100dvh - 32px); overflow-y: auto; }
}
.mehr-punkt[aria-current="page"] { background: var(--primary-soft); border-color: var(--primary); color: var(--primary); }

/* Kalender am kleinen Handy: Standort-Spalte schmäler, damit die Tage sichtbar bleiben */

/* Stundenblatt: bei sehr großer Schrift lange Knopfwörter trennen statt überlaufen */
.std-aktionen .btn { -webkit-hyphens: auto; hyphens: auto; }

/* Kopfzeile ohne Reiter: Benutzer, Darstellung und Abmelden rechtsbündig */
.userbox { margin-left: auto; }

/* =====================================================================
   mobile-ui Etappe 4
   ===================================================================== */
/* Griff ist jetzt ein Knopf: ziehen oder antippen (Menü ▲ ▼) */
button.zieh-griff { border: 0; background: transparent; padding: 0; font: inherit; border-radius: 6px; }
.reihen-knoepfe { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.reihen-knoepfe .btn { min-height: var(--tap); }

/* Fehler direkt unter dem Feld */
.field-error { color: var(--danger); font-size: .875rem; font-weight: 600; margin: 4px 0 0; }
[aria-invalid="true"] { border-color: var(--danger) !important; box-shadow: 0 0 0 1px var(--danger); }

/* =====================================================================
   Anpassungen je Bildschirmbreite (von breit nach schmal)
   1100 → 900 → 601–900 → 700 → 600 → 480 → 400 → 380 → ab 901 → Finger
   ===================================================================== */

@media screen and (max-width: 1100px) {
  .topbar-inner { flex-wrap: wrap; gap: 4px 10px; }
  .brand { flex: 1; }
}

@media screen and (max-width: 900px) {
  .topbar-inner { flex-wrap: wrap; padding: 6px 12px; gap: 4px 10px; }
  .brand { flex: 1; }
  .brand span { font-size: .95rem; }

  .user-name { display: none; }
  .main { padding: 12px; }

  /* Anwesenheit als Karten */
  .anw thead, .anw tfoot { display: none; }
  .anw, .anw tbody, .anw tr, .anw td { display: block; }
  .anw-wrap.table-scroll { background: transparent; box-shadow: none; overflow: visible; }
  .anw tr {
    display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; background: var(--surface); border-radius: var(--radius);
    box-shadow: var(--shadow); padding: 10px 12px 12px; margin-bottom: 10px;
  }
  .anw tr:hover td { background: transparent; }
  .anw td { border: 0 !important; padding: 0; position: static !important; background: transparent !important; }
  .anw td.name { grid-column: 1 / -1; font-size: 1.05rem; padding: 2px 2px 4px; white-space: normal; }
  .anw td.name2 { display: none; }
  .anw .vn-m { display: inline; }
  .anw td.c { grid-column: span 3; }
  .anw td.c .chk {
    width: 100%; justify-content: flex-start; gap: 10px; padding: 0 12px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface);
  }
  .anw td.c .chk .lbl { display: inline; font-weight: 600; }
  .anw td.c .chk.on { background: var(--green-light); border-color: var(--primary-line); }
  .anw td.krank .chk.on, .anw td.abw .chk.on { background: var(--red-light); border-color: var(--danger-line); }
  .anw td.urlaub .chk.on { background: var(--blue-light); border-color: var(--info-line); }
  .anw td.bus, .anw td.krank, .anw td.urlaub { grid-column: span 2; }
  .anw td.bus .chk, .anw td.krank .chk, .anw td.urlaub .chk { padding: 0 8px; gap: 6px; }
  .anw td.notiz { grid-column: 1 / -1; width: auto; min-width: 0; }
  .anw td.notiz input { min-height: var(--tap); font-size: 1rem; }

  /* Stammdaten als Karten */
  .stamm thead { display: none; }
  .stamm, .stamm tbody, .stamm tr, .stamm td { display: block; }
  .stamm-wrap.table-scroll { background: transparent; box-shadow: none; }
  .stamm tr { background: var(--surface); border-radius: var(--radius); box-shadow: var(--shadow); padding: 10px 14px; margin-bottom: 10px; }
  .stamm td { border: 0; padding: 1px 0; }
  .stamm td[data-label]:not(.nm)::before { content: attr(data-label) ": "; color: var(--muted); font-size: .875rem; }
  .stamm td.nm { font-weight: 700; font-size: 1.05rem; }
  .stamm td.leer{ display: none; }
  .stamm .vn-inline { display: inline; color: inherit; font-size: inherit; font-weight: inherit; }
  .stamm td.st-zwei span { display: inline; font-size: inherit; color: inherit; }
  .stamm td.st-zwei span + span::before { content: " · "; }
  .stamm td.st-kontakt, .stamm td.st-adr, .stamm td.st-notiz { max-width: none; }

  .responsive-cards thead { display: none; }
  .responsive-cards, .responsive-cards tbody, .responsive-cards tr, .responsive-cards td { display: block; }
  .responsive-cards tr { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 8px 12px; margin-bottom: 8px; }
  .responsive-cards td { border: 0 !important; padding: 2px 0 !important; }
  .responsive-cards td[data-label]::before { content: attr(data-label) ": "; color: var(--muted); font-size: .875rem; }
  .table-scroll.cards-wrap { background: transparent; box-shadow: none; }
  .topbar { position: static; }
  .topbar-inner { min-height: 0; }
  .brand img { width: 26px; height: 26px; }
  .topbar .btn-ghost { min-height: 38px; padding: 0 12px; }

  .counters { display: grid; grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); gap: 6px; }
  .counter { border-radius: 8px; padding: 4px 8px; display: flex; justify-content: space-between; gap: 6px; font-size: .875rem; }
  .anw td.c .chk { min-height: 42px; }
  .anw td.nein .chk.on { background: var(--red-light); border-color: var(--danger-line); }
  .anw td.bus .chk.on { background: var(--orange-light); border-color: var(--orange-line); }
  .import-table tr.cmp-row { padding: 0; border: 0; background: transparent; }
  .cmp-table th:last-child, .cmp-table td:last-child { width: auto; }
  .anw td.standort { grid-column: 1 / -1; min-width: 0; order: 2; }
  .anw td.notiz { order: 3; }
  .anw td.standort select { min-height: var(--tap); font-size: 1rem; }
  .st-row { display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; }
  .st-row .st-info { grid-column: 2 / -1; text-align: left; }
  .st-row .st-felder { grid-column: 2 / -1; }
  .st-row .switch { grid-column: 2; justify-self: start; } /* nicht in die schmale Nummern-Spalte rutschen */
  .st-row .btn { grid-column: span 1; }
  .st-row .btn:first-of-type { grid-column: 2; }
  .standort-leiste { margin: 0 0 10px; gap: 6px; }
  .standort-chips .counter { font-size: .875rem; padding: 6px 10px; border-radius: 8px; }
  #counters { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
  #counters .counter { font-size: .875rem; padding: 6px 10px; }
  .save-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; position: sticky; bottom: 0; z-index: 20;
    margin: 8px 0 0; padding: 10px 12px calc(10px + env(safe-area-inset-bottom, 0px)); background: var(--surface);
    border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 -4px 14px rgba(0,0,0,.10); }
  .save-bar .save-info { font-size: .875rem; color: var(--muted); flex: 1 1 8rem; min-width: 0; }
  .save-bar .btn-save { min-width: 8rem; flex: 0 0 auto; } /* rem: wächst mit der Systemschrift, wird nicht abgeschnitten */
  .anw tr.ohne-status { background: var(--hilite); box-shadow: inset 5px 0 0 var(--hilite-line), var(--shadow); }
  .anw tr.ohne-status > td { background: transparent !important; box-shadow: none !important; }
  .status-liste { columns: 1; }
  .main { padding-bottom: 12px; }
 .toast { bottom: calc(96px + env(safe-area-inset-bottom, 0px)); } 
  .zieh-griff { width: 26px; min-height: 34px; font-size: 1.15rem; }
  .kz-inp { width: 46px; min-height: 32px; }
  .stamm td.status-td { display: flex !important; align-items: center; gap: 8px; margin-top: 6px; }
  .stamm td.status-td::before { content: "Status" !important; }
  .besp-card { padding: 12px; }

  
  .besp-datei { grid-template-columns: 56px minmax(0, 1fr); }
  .besp-thumb, .besp-icon { width: 56px; height: 56px; }
  .besp-aktionen { grid-column: 1 / -1; justify-content: flex-start; }
  .besp-aktionen .btn { min-height: 38px; padding: 0 12px; font-size: .875rem; }
  .besp-up { grid-template-columns: minmax(0, 1fr) 90px 42px; }
  .besp-filter { justify-content: flex-start; flex-basis: 100%; order: 3; }
  .besp-eintrag, .besp-verlauf-item { gap: 10px; padding: 10px; }
  .besp-avatar { width: 34px; height: 34px; font-size: .875rem; }
  .besp-eintrag-body { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 10px; }
  .besp-eintrag-kopf { display: contents; }
  .besp-eintrag-kopf .spacer { display: none; }
  .besp-eintrag-text, .besp-edit { flex-basis: 100%; order: 4; margin-top: 2px; }
  .besp-eintrag-aktionen { flex-basis: 100%; order: 5; margin-top: 8px; }
  .besp-eintrag-aktionen .btn { min-height: 36px; padding: 0 12px; font-size: .875rem; }
  .besp-neu { padding: 10px; gap: 8px; }
  .besp-neu .besp-avatar { display: none; }
  .besp-antwort { padding: 8px; }
  .besp-antwort-kopf .btn-mini { min-height: 34px; }
  .besp-status-sel, .besp-status-pers { min-height: 38px; font-size: .9rem; max-width: 150px; }
  .besp-dchip { padding: 6px 26px 6px 6px; }
  .besp-menue-btn { min-height: 58px; }
  .kal-wrap { max-height: calc(100vh - 230px); max-height: calc(100dvh - 230px); }
  .kal-tag { min-width: 78px; }
  table.kal .kal-name { min-width: 110px; font-size: .875rem; }
  .kal-opt { min-height: 46px; }


  .toolbar .jahr-input { width: calc(4ch + 2.75rem); }
  .toolbar .monat-sel { width: auto; max-width: 150px; }
  .std-wrap { max-height: calc(100vh - 230px); max-height: calc(100dvh - 230px); }
  table.std { min-width: 660px; }
  table.std th, table.std td { padding: 4px 5px; }
  table.std th.std-tag { min-width: 5.25rem; }
  .zeit-inp, td.std-notiz input { min-height: 44px; }
  .zeit-jetzt { min-height: 44px; min-width: 48px; }
  .std-aktionen { width: 100%; gap: 6px; }
  .std-aktionen .btn { min-width: 0; padding: 0 8px; }
  .toolbar .std-aktionen .btn { flex: 1 1 calc(50% - 3px); } /* gewinnt gegen .toolbar .btn im 480er-Block */
  td.std-notiz { min-width: 150px; }
  .toolbar select.person-sel { flex: 1 1 100%; min-width: 0; width: 100%; }
 .feiertag-badge { max-width: 84px; } 
  /* Knopftexte dürfen umbrechen statt über den Rand zu laufen */
  .btn { white-space: normal; text-align: center; }
  .besp-person { white-space: normal; }
  /* Reiter: bei großer Schrift mit … kürzen statt überlappen */

  

  .tab-blase { flex: 0 0 auto; }
  .nav {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 25; display: flex;
    background: var(--surface); border-top: 1px solid var(--divider); box-shadow: 0 -2px 10px rgba(0,0,0,.06);
    padding: 0 env(safe-area-inset-right, 0px) env(safe-area-inset-bottom, 0px) env(safe-area-inset-left, 0px);
  }
  .nav-item {
    flex: 1 1 0; min-width: 0; flex-direction: column; justify-content: center; gap: 2px;
    min-height: var(--nav-h); padding: 6px 2px; font-size: .875rem; font-weight: 500; text-align: center;
  }
  .nav-item .nav-icon { padding: 2px 16px; border-radius: 999px; }
  .nav-item[aria-current="page"] .nav-icon { background: var(--primary-soft); }
  .nav-label { display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .nav .nav-lang, .nav .nav-nur-breit { display: none; }
  .nav .tab-blase { position: absolute; top: 3px; left: calc(50% + 8px); }
  /* Inhalt, Speicherleiste und Meldungen nicht von der Leiste verdecken */
  body.hat-nav .main { padding-bottom: calc(var(--nav-h) + 24px + env(safe-area-inset-bottom, 0px)); }
  body.hat-nav .save-bar { bottom: calc(var(--nav-h) + env(safe-area-inset-bottom, 0px) + 6px); padding-bottom: 10px; }
  .sk-leiste > .sk-jahrbar { display: grid; grid-template-columns: minmax(var(--tap), auto) minmax(0, 1fr) minmax(var(--tap), auto); flex: 1 1 100%; width: 100%; }
  .sk-jahrbar .sk-jahr { width: 100%; min-width: 0; text-overflow: ellipsis; }
  .sk-leiste > .sk-ansicht, .sk-leiste > #skNeu { flex: 1 1 auto; }
  .sk-leiste > .spacer { display: none; }
  .sk-leiste .sk-extra { display: none !important; }
  .sk-leiste .sk-mehr:not([hidden]) { display: inline-flex !important; }
  body.hat-nav .sk-agenda { bottom: calc(var(--nav-h) + env(safe-area-inset-bottom, 0px) + 6px); padding-bottom: 8px; }
  .sk-wrap { max-height: calc(100dvh - var(--nav-h) - 170px); min-height: 320px; }
  /* erste Spalte höchstens ein Drittel der Breite – auch bei großer Systemschrift bleiben die Tage erreichbar */
  .sk-tab .sk-ort { width: min(8.5rem, 34vw); min-width: min(8.5rem, 34vw); max-width: min(8.5rem, 34vw); font-size: .9375rem; overflow-wrap: anywhere; -webkit-hyphens: auto; hyphens: auto; }
  .sk-tab .sk-adr { display: none; }
  td.sk-feld { width: min(6.5rem, 30vw); min-width: min(6.5rem, 30vw); }
  /* Handy: dieselben Felder untereinander statt seitlich scrollen – Beginn/Ende, Pause 1/Pause 2, Gesamtstunden */
  .sk-std-wrap { overflow: visible; }
  table.std.sk-std { min-width: 0; }
  table.std.sk-std, table.std.sk-std tbody, table.std.sk-std tfoot, table.std.sk-std tr, table.std.sk-std th, table.std.sk-std td { display: block; }
  table.std.sk-std thead { display: none; }
  table.std.sk-std tr.std-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(8.5rem, 100%), 1fr)); gap: 6px 8px; padding: 8px 8px 4px; }
  table.std.sk-std tr.std-row > * { padding: 0; min-width: 0; border: 0; }
  table.std.sk-std tbody th.sk-wer { grid-column: 1 / -1; position: static; display: flex; align-items: center; justify-content: space-between; min-width: 0; }
  table.std.sk-std .sk-x { float: none; }
  table.std.sk-std .sk-umr { float: none; margin-left: auto; margin-right: 4px; }
  table.std.sk-std td[data-label]::before { content: attr(data-label); display: block; margin-bottom: 2px; font-size: .875rem; font-weight: 700; color: var(--muted); }
  table.std.sk-std td.std-gesamt { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 8px; text-align: left; }
  table.std.sk-std td.std-gesamt::before { display: inline; margin: 0; }
  table.std.sk-std tr.sk-plan-zeile td { padding: 0 8px 6px; }
  table.std.sk-std tr.std-row > *, table.std.sk-std tr.std-row:hover > * { background: transparent; }
  table.std.sk-std tfoot tr { display: flex; justify-content: space-between; background: var(--green-light); border-top: 2px solid var(--green); }
  table.std.sk-std tfoot td { position: static; border-top: 0; box-shadow: none; background: transparent; }
  /* Stundenübersicht: je Person eine Karte */
  .sk-ueb-wrap { overflow: visible; }
                                  .sk-ueb-name { min-height: 44px; }
  body.hat-nav .toast { bottom: calc(var(--nav-h) + 96px + env(safe-area-inset-bottom, 0px)); }
}

@media screen and (min-width: 601px) and (max-width: 900px) {
  .anw tr { grid-template-columns: repeat(12, minmax(0, 1fr)); padding: 8px 10px 10px; }
  .anw td.c { grid-column: span 2; }
  .anw td.bus, .anw td.krank, .anw td.urlaub { grid-column: span 2; }

  .anw td.c .chk { padding: 0 6px; gap: 6px; font-size: .875rem; }
  .anw td.c .chk input { width: 20px; height: 20px; }
  .anw td.bus, .anw td.urlaub { grid-column: span 2; }
  .anw td.krank { grid-column: span 3; }
  .anw td.notiz { grid-column: span 5; }
}

@media screen and (max-width: 700px) {
  .std-aktionen { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 6px; width: 100%; }
  .std-aktionen .btn { width: 100%; padding: 0 6px; }
}

@media screen and (max-width: 600px) {
  #counters { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 5px; }
  #counters .counter { flex-direction: column; align-items: center; justify-content: center; text-align: center;
    gap: 1px; padding: 5px 2px; font-size: .875rem; line-height: 1.15; border-radius: 8px; white-space: normal; }
  #counters .counter b { font-size: 1.05rem; line-height: 1.1; }
 .besp-status-von { white-space: normal; } 
  /* eigenes Raster: ◀ | Monat | Jahr | ▶ , darunter „Heute“ */

  .datebar.kal-bar .monat-sel { width: 100%; min-width: 0; max-width: none; }
  .datebar.kal-bar .jahr-input { width: 100%; }
  .datebar.kal-bar .btn:last-child { grid-column: 1 / -1; }
  .besp-fertig-text { display: none; }
  .besp-fertig { padding: 0 8px; }
  .datebar.kal-bar { grid-template-columns: 48px minmax(0, 1fr) calc(4ch + 30px) 48px; }
  .datebar.kal-bar .monat-sel { padding-right: 20px; }
  .anw td.name { grid-column: 1 / 6; order: 0; }
  .anw td.kz { grid-column: 6; order: 0; width: auto; min-width: 0; display: flex; align-items: flex-start; justify-content: flex-end; }
  .anw td[data-key] { grid-column: span 3; }
  .anw td[data-key="anw1"] { order: 1; }
  .anw td[data-key="anw0"] { order: 2; }
  .anw td[data-key="essWien"] { order: 3; }
  .anw td[data-key="essMay"] { order: 4; }
  .anw td[data-key="sch1"] { order: 5; }
  .anw td[data-key="sch0"] { order: 6; }
  .anw td[data-key="bus"] { order: 7; }
  .anw td[data-key="urlaub"] { order: 8; }
  .anw td[data-key="krank"] { grid-column: 1 / -1; order: 9; }
  .anw td.standort { order: 10; }
  .anw td.notiz { order: 11; }
  table.kal .kal-name { min-width: 92px; max-width: 112px; font-size: .875rem; -webkit-hyphens: auto; hyphens: auto; }
}

@media screen and (max-width: 480px) {
  .main { padding: 10px; }
  .card { padding: 12px; }
  .grid-2, .grid-plz { grid-template-columns: minmax(0, 1fr); }
  .toolbar .btn { flex: 1 1 auto; }
  .toolbar .search { max-width: none; flex-basis: 100%; }
  .datebar .date-input { flex: 1; }
  .date-label { flex-basis: 100%; }
  .dialog-body { padding: 14px; }
  .dialog-foot { padding-left: 14px; padding-right: 14px; }
  .dialog-foot .btn { flex: 1 1 auto; }
  .codes { grid-template-columns: minmax(0, 1fr); }
  .login-card { padding: 22px 16px; }
 .form-row .field { min-width: 0; flex: 1 1 100%; } .kv { grid-template-columns: minmax(0, 1fr); gap: 0; } .kv dd { margin-bottom: 6px; } 
  .brand span { font-size: .9rem; }
  .datebar { display: grid; grid-template-columns: 48px minmax(0, 1fr) 48px auto; width: 100%; }
  .datebar .date-label { grid-column: 1 / -1; }
  .datebar .btn { padding: 0 8px; }
  .datebar .date-input { min-width: 0; width: 100%; }
  .datebar .datebar-extra { grid-column: 1 / -1; }
  .datebar-extra .btn { flex: 1 1 0; }
  .toolbar > .spacer { display: none; }
  .brand-long { display: none; }
  .brand-short { display: inline; }
  .topbar-inner { flex-wrap: wrap; }
  .st-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .st-row .st-nr { display: none; }
  .st-row .input, .st-row .st-felder { grid-column: 1 / -1; }
  .st-row .switch { grid-column: 1; }
  .st-row .st-info { grid-column: 2; text-align: right; }
  .st-row .btn:first-of-type { grid-column: 1; }
  .standort-label { font-size: .875rem; }
  table.std { min-width: 620px; }
  .std-wt { display: none; }
  table.std th.std-tag { min-width: 3.875rem; }
  .std-grund, .std-fehlt-badge { padding: 1px 5px; font-size: .875rem; }
  .zeit-inp { min-width: 78px; }
 .feiertag-badge { max-width: 60px; padding: 1px 4px; } 
  .btn-darstellung { padding: 0; min-width: var(--tap); }
  .btn-darstellung .darstellung-text { display: none; }
}

@media screen and (max-width: 400px) {
  #counters { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .datebar.kal-bar { grid-template-columns: 48px minmax(0, 1fr) calc(4ch + 20px) 48px; gap: 4px; }
  .toolbar .jahr-input { width: 100%; min-width: 0; padding-left: 6px; padding-right: 2px; }
  .datebar .date-input { width: 100%; min-width: 0; }
  /* Datum ganz lesbar: ◀ Datum ▶, darunter „Heute“ */
  .datebar:not(.kal-bar) { grid-template-columns: 48px minmax(0, 1fr) 48px; }
  .datebar:not(.kal-bar) > .btn:last-child, .datebar .frei-tag { grid-column: 1 / -1; justify-self: start; }
  .datebar:not(.kal-bar) > .btn:last-child { justify-self: stretch; }
  /* schmale Handys: 5 Punkte à 64–80 px – Beschriftung normal stark, aktiv über Farbe + Markierung */
  .nav-item { padding: 6px 0; letter-spacing: -.01em; }
  .nav-item[aria-current="page"] { font-weight: 500; }
}

@media screen and (max-width: 380px) {
  .std-aktionen { grid-template-columns: minmax(0, 1fr); }
  /* ganz schmale Handys: „Anwesend“, „Abwesend“ passen ungetrennt in die Kästchen */
  .anw td.c .chk { padding: 0 6px; gap: 5px; }
  .anw td.c .chk .lbl { font-size: .9375rem; }
}

@media screen and (min-width: 901px) {
  .anw-wrap { max-height: calc(100vh - 230px); max-height: calc(100dvh - 230px); min-height: 320px; overflow: auto; }
  .stamm-wrap { max-height: calc(100vh - 250px); max-height: calc(100dvh - 250px); min-height: 320px; overflow: auto; }
  /* Import-Vorschau (Nutzer 26.10.2026): feste Spaltenbreiten statt nowrap – vorher drückten lange Namen/Orte die Tabelle
     über den Rahmen, die Knöpfe waren abgeschnitten und „Prüfung“ fast ohne Platz. Spalte 5 (Prüfung) bekommt den Rest. */
  .import-table { table-layout: fixed; }
  .import-table th:nth-child(1) { width: 4rem; }
  .import-table th:nth-child(2) { width: 16%; }
  .import-table th:nth-child(3) { width: 12%; }
  .import-table th:nth-child(4) { width: 15%; }
  .import-table th:nth-child(6) { width: 17rem; }
  .import-table td.imp-aktion select.aktion { width: 100%; max-width: none; }
  body.hat-nav { display: grid; grid-template-columns: clamp(220px, 14rem, 340px) minmax(0, 1fr); grid-template-rows: auto auto auto 1fr; min-height: 100dvh; } /* Seitenleiste wächst bei großer Systemschrift mit (bis 340 px) */
  body.hat-nav > .topbar { grid-column: 1 / -1; grid-row: 1; position: static; }
  body.hat-nav > .banner { grid-column: 2; }
  body.hat-nav > .nav {
    grid-column: 1; grid-row: 2 / -1; position: sticky; top: 0; align-self: start; height: 100vh; height: 100dvh; overflow-y: auto;
    display: flex; flex-direction: column; gap: 4px; padding: 16px 12px;
    background: var(--surface); border-right: 1px solid var(--divider);
  }
  body.hat-nav > .main { grid-column: 2; width: 100%; }
  .nav-item { gap: 12px; min-height: var(--tap); padding: 8px 12px; border-radius: 8px; color: var(--text); font-weight: 600; }
  .nav-item:hover { background: var(--hover); color: var(--text); }
  .nav-item[aria-current="page"] { background: var(--primary-soft); color: var(--primary); }
  .nav .nav-kurz, .nav .nav-mehr { display: none; }
  .nav .tab-blase { margin-left: auto; }
  /* lange Wörter nur an den weichen Trennstellen (Stunden-aufzeichnungen) umbrechen */
  .nav-label { white-space: normal; overflow-wrap: normal; -webkit-hyphens: manual; hyphens: manual; }
}

@media (pointer: coarse) {
 :root { --tap: 48px; } 
 .besp-cam { display: inline-flex; } .besp-drop-text { display: none; } 
  input, select, textarea { font-size: 1rem; }
  .kz-inp { width: 56px; font-size: 1rem; }
  th.kz, td.kz { width: 70px; min-width: 64px; }
  .standort-sel, .besp-status-sel, .zeit-inp { font-size: 1rem; }
  .besp-status-pers, .import-table select { font-size: 1rem; } /* sonst zoomt iOS beim Antippen (Prüfung 24.10.2026) */
  .subtab, .topbar .btn-ghost, .btn-mini, .linkbtn, .besp-chip, .kal-opt, .besp-fchip, .besp-fertig, .farb-opt, .zeit-jetzt, .std-datei-knopf .btn { min-height: var(--tap); }
  .btn-mini { padding: 0 12px; min-width: var(--tap); }
  .btn-icon { flex: 0 0 auto; min-width: var(--tap); }
  .besp-fchip { padding: 0 14px; }
  .besp-fertig { padding: 0 10px; }
  .besp-fertig input { width: 22px; height: 22px; }
  .banner-close { width: var(--tap); height: var(--tap); }

  .mon-btn { min-width: var(--tap); min-height: var(--tap); }
  table.mon th.kal-tag, table.mon td.mon-zelle { min-width: calc(var(--tap) + 4px); }

  .kal-tag { min-width: 120px; }
  .besp-dchip { min-height: var(--tap); padding-right: 52px; }
  .besp-dchip-x { width: var(--tap); height: var(--tap); right: 0; font-size: 1.25rem; }
  .zieh-griff { width: var(--tap); min-height: var(--tap); }
  .kz-inp { min-height: var(--tap); }
  .anw td.c .chk, .anw td.notiz input, .import-table select, .cmp-table td .input,
  .besp-status-sel, .besp-status-pers, .besp-aktionen .btn, .besp-eintrag-aktionen .btn,
  .besp-eintrag-aktionen .btn-mini, .besp-antwort-kopf .btn-mini { min-height: var(--tap); }
  .anw td.standort select { min-height: var(--tap); font-size: 1rem; }

  .zeit-jetzt, td.std-zeit .btn-mini, .zeit-inp, td.std-notiz input { min-height: var(--tap); }
  .save-bar .btn-save, .save-bar .btn { min-height: var(--tap); }
 .notiz-head .btn-save { min-height: var(--tap); font-size: .95rem; } 
 .tk-tag { min-height: var(--tap); } 
 .doppel-hinweis { min-height: var(--tap); padding: 0 12px; } 
}

/* =====================================================================
   Druck (alle Druckregeln gesammelt)
   ===================================================================== */
/* Stundenaufzeichnung am Handy (Nutzer 14.10.2026): Knöpfe hinter „⋯“, schmale Tabelle ohne seitliches Wischen,
   Notiz über den Tag, „Jetzt“ nur in der Zeile von heute; Monatsübersicht als Karten */
@media screen and (max-width: 700px) {
  .std-aktionen { display: none; }
  .std-mehr { display: inline-flex; align-items: center; justify-content: center; min-width: var(--tap); }
  /* Leiste: ◀ Monat Jahr ▶ in einer Zeile, darunter „Heute“ und „⋯“ nebeneinander */
  .std-datebar { display: grid; grid-template-columns: var(--tap) minmax(0, 1fr) minmax(0, 6rem) var(--tap); gap: 6px; width: 100%; }
  .std-datebar > *, .toolbar .std-datebar > select.input, .toolbar .std-datebar > input.input { min-width: 0; width: 100%; max-width: none; }
  .datebar.kal-bar.std-datebar > .btn:nth-last-child(2) { grid-column: 1 / 3; }
  .datebar.kal-bar.std-datebar > .btn.std-mehr { grid-column: 3 / 5; }
  .std-titel { font-size: 1rem; margin-bottom: 6px; }
  .kopf-lang { display: none; }
  .kopf-kurz { display: inline; }
  table.std { min-width: 0; width: 100%; table-layout: fixed; }
  table.std th, table.std td { padding: 3px 2px; }
  table.std thead th:nth-child(1) { width: 15%; }
  table.std thead th:nth-child(2), table.std thead th:nth-child(3) { width: 21%; }
  table.std thead th:nth-child(4), table.std thead th:nth-child(5) { width: 15%; }
  table.std thead th:nth-child(6) { width: 13%; }
}
@media screen and (max-width: 380px) {
  /* ganz schmale Handys: Pausen-Auswahl mindestens 44 px breit */
  table.std thead th:nth-child(1) { width: 13%; }
  table.std thead th:nth-child(2), table.std thead th:nth-child(3) { width: 20%; }
  table.std thead th:nth-child(4), table.std thead th:nth-child(5) { width: 17%; }
  table.std thead th:nth-child(6) { width: 13%; }
  table.std th, table.std td { padding: 3px 1px; }
}
@media screen and (max-width: 700px) {
  table.std th.std-tag { min-width: 0; white-space: normal; cursor: pointer; }
  table.std th.std-notiz, table.std td.std-notiz { display: none; }
  .std-wt { display: block; width: auto; }
  .std-nr { min-width: 0; }
  .std-notiz-zeichen:not([hidden]) { display: inline; }
  table.std .badge { display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .zeit-zelle { flex-direction: column; align-items: stretch; gap: 2px; }
  .zeit-inp { min-width: 0; width: 100%; padding: 4px 1px; }
  .zeit-jetzt { display: none; }
  .std-row.heute .zeit-jetzt { display: inline-flex; align-items: center; justify-content: center; min-width: 0; }
    table.std td.std-gesamt { font-size: 1rem; }
  table.std tr.std-woche td { white-space: normal; }
  /* Monatsübersicht: je Mitarbeiter eine Karte */
  .std-db-wrap { overflow: visible; }
  table.std-db, table.std-db tbody, table.std-db tfoot, table.std-db tr, table.std-db th, table.std-db td { display: block; }
  table.std-db thead { display: none; }
  table.std-db tr { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(6.5rem, 100%), 1fr)); gap: 4px 10px; margin-bottom: 10px; padding: 10px;
    border: 1px solid var(--linie); border-radius: var(--radius); background: var(--surface); }
  table.std-db tr > * { padding: 0; border: 0; min-width: 0; }
  table.std-db th.std-db-name { grid-column: 1 / -1; position: static; background: transparent; }
  table.std-db .r { text-align: left; }
  table.std-db td[data-label]::before { content: attr(data-label); display: block; font-size: .875rem; font-weight: 700; color: var(--muted); }
  table.std-db tfoot tr { background: var(--green-light); border-color: var(--green); }
  /* Gesamtauflistung: je Mitarbeiter eine Karte, die 7 Tage als kleines Raster */
  .std-ges-wrap { overflow: visible; }
  table.std-ges-tab, table.std-ges-tab tbody, table.std-ges-tab tfoot, table.std-ges-tab tr, table.std-ges-tab th, table.std-ges-tab td { display: block; }
  table.std-ges-tab thead { display: none; }
  table.std-ges-tab tr { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(2.5rem, 100%), 1fr)); gap: 3px; margin-bottom: 10px; padding: 10px;
    border: 1px solid var(--linie); border-radius: var(--radius); background: var(--surface); }
  table.std-ges-tab tr > * { padding: 0; border: 0; min-width: 0; }
  table.std-ges-tab th.std-ges-name { grid-column: 1 / -1; position: static; background: transparent; }
  table.std-ges-tab td.std-ges-tag { min-width: 0; padding: 2px; border: 1px solid var(--linie); border-radius: 6px; font-size: .875rem; overflow-wrap: anywhere; }
  table.std-ges-tab td.std-ges-tag::before { content: attr(data-kurz); display: block; font-weight: 700; color: var(--muted); }
  .std-ges-zeit { white-space: normal; font-size: .75rem; }
  table.std-ges-tab td.std-ges-sum, table.std-ges-tab td.r { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 10px; text-align: left; border-left: 0; }
  table.std-ges-tab td.r::before { content: attr(data-label); font-weight: 700; color: var(--muted); }
  table.std-ges-tab td.std-ges-frei.knapp, table.std-ges-tab td.std-ges-frei.ueber { padding: 2px 6px; border-radius: 6px; }
  table.std-ges-tab tfoot tr { background: var(--green-light); border-color: var(--green); }
}
/* Gesamtliste am Handy: je Person eine Karte */
@media screen and (max-width: 700px) {
  .gl-wrap { overflow: visible; }
  table.gl, table.gl tbody, table.gl tr, table.gl th, table.gl td { display: block; }
  table.gl thead { display: none; }
  table.gl tr { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(7rem, 100%), 1fr)); gap: 4px 10px; margin-bottom: 10px; padding: 10px;
    border: 1px solid var(--linie); border-radius: var(--radius); background: var(--surface); }
  table.gl tr > * { padding: 0; min-width: 0; border: 0; }
  table.gl th.gl-name, table.gl td.gl-notiz-td, table.gl td.gl-kontakt { grid-column: 1 / -1; position: static; background: transparent; min-width: 0; }
  table.gl tr.gl-ja { background: var(--primary-soft); }
  table.gl tr.gl-ja > * { background: transparent; }
  table.gl .r { text-align: left; }
  table.gl td[data-label]::before { content: attr(data-label); display: block; font-size: .875rem; font-weight: 700; color: var(--muted); }
  table.gl td { overflow-wrap: anywhere; }
  table.gl td.gl-kontakt { white-space: normal; }
  table.gl td[data-label] { min-width: 0; }
}
@media print {
 :root { color-scheme: light; } 
  .topbar, .banner, .toolbar .btn, .no-print, .toast, .datebar button, .datebar input { display: none !important; }
  body { background: #fff; font-size: 11px; }
  .main { padding: 0; max-width: none; }
  .table-scroll { box-shadow: none; overflow: visible; }
  .anw thead { display: table-header-group !important; }
  .anw td.notiz input { border: 0; padding: 0; }

  .print-only { display: block !important; }
  body.print-dialog > :not(#dialog) { display: none !important; }
  body.print-dialog #dialog { position: static; box-shadow: none; width: auto; max-height: none; }
  body.print-dialog .dialog-form { max-height: none; }
  body.print-dialog .dialog-foot, body.print-dialog #dialogClose { display: none !important; }
  body.print-dialog .dialog-body { overflow: visible; }
  @page { size: A4 landscape; margin: 10mm; }
  .toolbar, .counters { display: none !important; }
  .anw-wrap, .stamm-wrap { max-height: none !important; overflow: visible !important; }
  .anw thead th, .anw tfoot td, .anw td.name, .anw th.name { position: static !important; }
  .anw tfoot { display: table-row-group; }
  .anw tr.sum-row td { border-top: 2px solid #000; background: #eee !important; }
  .chk { min-width: 0; min-height: 0; }
  .chk input { width: 13px; height: 13px; }
  .anw td.notiz input { min-height: 0; height: auto; font-size: 10px; }
  .anw td.notiz input::placeholder { color: transparent; }
  .anw tr { page-break-inside: avoid; }
  .anw td.name::after { content: none !important; }
  .anw td.standort select { border: 0; padding: 0; min-height: 0; font-size: 10px; -webkit-appearance: none; appearance: none; background: transparent; }
  #standortHinweis .btn { display: none; }
  .standort-chips { flex-wrap: wrap; overflow: visible; }
  .standort-leiste.mehr::after { display: none; }
 .save-bar, .btn-save, .save-info { display: none !important; } 
 .zieh-griff, .kz-schalter { display: none !important; } 
 table.stamm tr.inaktiv td { -webkit-print-color-adjust: exact; print-color-adjust: exact; } 
  .besp-drop, .besp-uploads, .besp-aktionen, .besp-tage { display: none !important; }
  .besp-card { box-shadow: none; padding: 0; margin-bottom: 12px; }
  .besp-datei { grid-template-columns: 40px minmax(0, 1fr); border: 0; padding: 2px 0; }
  .besp-thumb, .besp-icon { width: 40px; height: 40px; font-size: 9px; }
  .besp-eintrag, .besp-verlauf-item { break-inside: avoid; border-left-width: 4px; padding: 6px 8px; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .besp-neu, .besp-filter, #bespVerlaufBtn { display: none !important; }
 .besp-filter-hinweis, .besp-neu-kopf { display: none !important; } 
 .tab-blase { display: none !important; } 
  .besp-antwort { break-inside: avoid; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .besp-antwort-neu { display: none !important; }
  .besp-status-chip { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .besp-status-chip.nur-druck { display: inline-flex; }
  .besp-dchip-x { display: none !important; }
  .besp-dchip { border-color: #ccc; }
  .kal-wrap { max-height: none; overflow: visible; }
  .datebar-extra { display: none !important; }
  table.mon { font-size: 9px; width: 100%; }
  table.mon th.kal-tag, table.mon td.mon-zelle { min-width: 0 !important; padding: 1px !important; }
  table.mon .kal-name { min-width: 0; max-width: none; white-space: nowrap; padding: 1px 4px !important; }
  table.mon tbody td, table.mon tfoot td { height: auto !important; }
  .mon-btn { min-width: 0 !important; min-height: 16px !important; font-size: 9px; border-radius: 3px; }
  .mon-btn, .mon-z, table.mon tfoot td, table.mon .mon-summe, table.mon .we { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  table.mon tr { page-break-inside: avoid; }
  table.mon .kal-wt { font-size: 8px; }
  table.mon .kal-nr { font-size: 9px; }
  .mon-legende { font-size: 9px; margin: 0 0 4px; }
  .mon-notiz { font-size: 8px; top: -2px; right: -2px; }
  .mon-notizen { font-size: 10px; break-inside: avoid; }
  .mon-notizen h2 { font-size: 12px; }


  table.kal .kal-name, table.kal thead th { position: static; }
  table.data th, table.data td { padding: 5px 6px !important; line-height: 1.45 !important; }
  table.data tbody tr { min-height: 26px; }
  table.data td input[type=text], table.data td input:not([type=checkbox]), table.data td select { min-height: 20px; line-height: 1.4; }
  table.anw tbody td, table.stamm tbody td, table.kal tbody td { height: 26px; }
  .anw .chk { padding: 2px 0; }
  .std-wrap { max-height: none; overflow: visible; }
  table.std { min-width: 0; }
  .zeit-jetzt { display: none !important; }
  .zeit-inp, td.std-notiz input { min-height: 0; border: 0; padding: 0; background: transparent; -webkit-appearance: none; appearance: none; }
  .zeit-inp::-webkit-calendar-picker-indicator { display: none !important; }
  table.std thead { display: table-header-group; }
  td.std-notiz input::placeholder { color: transparent; }
  table.std tbody th.std-tag, table.std thead th, table.std tfoot td { position: static; }
  table.std tr { page-break-inside: avoid; }
  .std-row.we > th.std-tag, .std-row.we > td,
  .std-row.fehlt > th.std-tag, .std-row.fehlt > td,
  table.std tr.std-woche td, table.std tfoot td { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .std-row.heute > th.std-tag, .std-row.heute > td { background: transparent !important; }
  .std-sign { margin-top: 30px; }
  /* Arbeitszeitaufzeichnung: feines Raster im Ausdruck (Nutzer 14.10.2026) */
  table.std th, table.std td { border: 0.5pt solid #888 !important; }
  table.std { border-collapse: collapse; }
  .sk-drucktab th, .sk-drucktab td { border-width: 0.5pt; border-color: #888; }
  .std-line { width: 100%; }
 #stdHinweis { display: none !important; } 
  .table-scroll { border: 1.5px solid #000; }
  table.data th, table.data td { border-bottom: 1px solid #555; }
  table.data thead th { border-bottom: 1.5px solid #000; box-shadow: none; background: #e6e6e6 !important; }
  table.data tfoot td, table.data tfoot th { border-top: 1.5px solid #000; }
  .anw td.name, .anw th.name, table.kal .kal-name { border-right: 1.5px solid #000; }
  table.kal th.kal-tag, .anw td.sep, .anw th.sep { border-left: 1px solid #777; }
  table.std tbody th.std-tag, table.std thead th { border-right: 1px solid #777; }
  .card, .besp-eintrag { border: 1px solid #777; }
 
  .nav { display: none !important; }
  body.hat-nav { display: block; }
 .doppel-hinweis { border: 0; background: none; padding: 0; min-height: 0; } 
}
@media print {
  .sk-agenda, .sk-hilfe, .sk-leiste .btn, .sk-ansicht { display: none !important; }
  .sk-wrap { max-height: none; overflow: visible; border: 0; }
  td.sk-feld, .sk-tab thead th { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}
@media print {
  body.sk-druck > :not(#skDruck) { display: none !important; }
  body.sk-druck #skDruck { display: block !important; color: #000; }
  #skDruck h1 { font-size: 14px; margin: 0 0 6px; }
  .sk-drucktab { width: 100%; table-layout: fixed; border-collapse: collapse; font-size: 8px; }
  .sk-drucktab th, .sk-drucktab td { border: 1px solid #999; padding: 2px; vertical-align: top; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .sk-drucktab .sk-ort { width: 26mm; text-align: left; }
  .sk-drucktab thead th { background: #e7eee9; text-align: center; }
  .sk-drucktab .frei { background: #ffd9d9; }
  .sk-drucktab tr.sonder .sk-ort { background: #eef1ef; }
  .sk-drucktab tbody td { height: 10mm; }
  .sk-drucktab tr.sonder td { height: 7mm; }
  .sk-drucktab .sk-wt, .sk-drucktab .sk-adr { display: block; font-weight: 400; color: #444; }
  .sk-drucktab, .sk-drucktab * { font-size: 7px !important; line-height: 1.2 !important; -webkit-hyphens: none !important; hyphens: none !important; }
  .sk-drucktab .sk-nr { font-size: 7.5px !important; }
  .sk-drucktab .sk-ort b { font-size: 8px !important; }
  .sk-drucktab .sk-txt { display: block; white-space: pre-line; overflow-wrap: anywhere; overflow: hidden; max-height: 10mm; }
  .sk-plan-druck .links { text-align: left; }
  .sk-plan-druck tbody td { height: auto; }
  .sk-plan-druck td.we { background: #f3f5f3; }
  .sk-drucktab tr { page-break-inside: avoid; }
  .sk-druck-legende { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 6px; font-size: 9px; align-items: center; }
  .sk-druck-legende i { display: inline-block; width: 12px; height: 12px; border: 1px solid #999; margin-right: 4px; vertical-align: middle; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .sk-druck-legende i.frei { background: #ffd9d9; }
  /* Standortkalender: je Monat eine Seite (14.10.2026) */
  .sk-druck-monat { break-after: page; page-break-after: always; }
  .sk-druck-monat:last-child { break-after: auto; page-break-after: auto; }
  /* Stundenübersicht drucken (Etappe 3, 14.10.2026) */
  .sk-druck-info { margin: 0 0 6px; font-size: 9px; color: #333; }
  .sk-drucktab.sk-ueb-druck { table-layout: auto; }
  .sk-drucktab.sk-ueb-druck, .sk-drucktab.sk-ueb-druck * { font-size: 10px !important; }
  .sk-drucktab.sk-ueb-druck tbody td { height: auto; text-align: right; font-variant-numeric: tabular-nums; }
  .sk-drucktab.sk-ueb-druck th { text-align: center; }
  .sk-drucktab.sk-ueb-druck .links { text-align: left !important; }
  .sk-drucktab.sk-ueb-druck tbody th { background: transparent; font-weight: 400; }
  /* Dienstplan (Etappe 5, 18.10.2026) */
  .sk-drucktab.dp-druck tbody td { height: 11mm; }
  .sk-drucktab.dp-druck.monat tbody td { height: 6mm; text-align: center; }
  .sk-drucktab.dp-druck .dp-d-wer { width: 32mm; text-align: left; }
  .sk-drucktab.dp-druck .dp-d-sum { width: 15mm; text-align: right; }
  .sk-drucktab.dp-druck th.we, .sk-drucktab.dp-druck td.we { background: #f2f5f3; }
  .sk-drucktab.dp-druck td.aus, .sk-druck-legende i.dp-d-schraffur { background: repeating-linear-gradient(45deg, #fff 0 3px, #c9d1cc 3px 4px); }
  .sk-drucktab.dp-druck td.sperre { background: #eef1ef; }
  .sk-drucktab.dp-druck td.null, .sk-druck-legende i.null { background: #fbe9e7; color: #b3261e; font-weight: 700; }
  .sk-drucktab.dp-druck .dp-d-bes td { height: auto; text-align: center; }
  .dp-d-ein { display: block; border: 1px solid; border-radius: 2px; padding: 0 2px; margin-bottom: 1px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
    -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .sk-drucktab.dp-druck.monat .dp-d-ein { text-align: center; font-weight: 700; }
  .dp-d-bes th .dp-d-ein { display: inline-block; min-width: 6mm; text-align: center; }
  .dp-d-pause { color: #555; }
  /* DV im Dienstplan (21.10.2026): Balken oben im Feld in der Farbe der Art, hell gestrichelt = noch nicht unterschrieben */
  .dp-d-dv { display: block; height: 3.2mm; line-height: 3.2mm; font-size: 7px; font-weight: 700; padding: 0 2px; margin: 0 -2px 1px; border: 1px solid; overflow: hidden;
    white-space: nowrap; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .dp-d-dv.offen { border-style: dashed; }
  .sk-drucktab.dp-druck td.dv-fehlt { box-shadow: inset 0 0 0 2px #b3261e; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .dp-d-ohnedv { color: #b3261e; font-weight: 700; }
  .sk-druck-legende i.dv-fehlt { background: #fff; border: 2px solid #b3261e; }
  .sk-drucktab.sk-ueb-druck tfoot th, .sk-drucktab.sk-ueb-druck tfoot td { background: #e4f0e8; text-align: right; }
      .sk-drucktab.sk-ueb-druck .sk-adr { font-size: 8.5px !important; }
}
/* Einsatzkalender am Handy: Tage mindestens 44 px breit (mobile-ui), Ränder schmäler */
@media screen and (max-width: 480px) {
  .dialog-body .tk { padding: 6px 2px; margin-left: -6px; margin-right: -6px; }
  .tk-gitter { gap: 2px; }
}

/* Handy: neben den Tagesstunden nur das Häkchen (Text steht im Hinweis oben und im Vorlese-Text) */
@media screen and (max-width: 700px) {
  .std-nachtrag { justify-content: center; min-width: var(--tap); margin: 0 -5px; }
  .std-nachtrag-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .std-nachtrag input { width: 24px; height: 24px; }
  .std-anfrage-badge { white-space: normal; }
}
/* Standortkalender im Querformat / niedrige Bildschirme (Nutzer 14.10.2026: „Bild lässt sich nicht schieben“):
   der Kalender passt genau zwischen Agenda-Leiste und Menü und gibt das Wischen an seinen Rändern an die Seite weiter */
@media screen and (max-height: 600px) {
  .sk-wrap { overscroll-behavior: auto; max-height: calc(100dvh - 120px); min-height: 170px; }
  .sk-agenda { margin-top: 6px; padding: 4px 8px calc(4px + env(safe-area-inset-bottom, 0px)); }
  .sk-agenda-kopf { flex-wrap: nowrap; margin-bottom: 2px; font-size: .8125rem; white-space: nowrap; overflow: hidden; }
  .sk-agenda-kopf #skAgendaInfo { overflow: hidden; text-overflow: ellipsis; min-width: 0; }
  .sk-agenda .sk-steine { padding-bottom: 2px; }
  /* Summenzeilen rollen mit (statt unten festzukleben) – so bleiben mehr Standorte im Blick; Kopfzeile bleibt oben stehen */
  .sk-tab tfoot td, .sk-tab tfoot th, .sk-tab tfoot tr:first-child > * { position: static; }
  .sk-tab tfoot .sk-ort { position: sticky; left: 0; bottom: auto; }
  .sk-tab thead th { padding: 3px 4px; }
}
@media screen and (max-width: 900px) and (max-height: 600px) {
  .sk-wrap { max-height: calc(100dvh - var(--nav-h) - 96px - env(safe-area-inset-bottom, 0px)); min-height: 170px; }
  body.hat-nav .sk-agenda { padding-bottom: 4px; }
}
/* Standortkalender am PC: Knöpfe zum Schieben + deutlich sichtbare Schiebeleiste (Nutzer 14.10.2026) */
.sk-tagnav { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin: 0 0 6px; }
.sk-tagnav[hidden] { display: none; }
.sk-tagnav-tipp { flex: 1 1 14rem; min-width: 0; }
@media (pointer: fine) {
  .sk-wrap { scrollbar-width: auto; scrollbar-color: var(--linie-stark) var(--surface-2); }
  .sk-wrap::-webkit-scrollbar { height: 14px; width: 12px; }
  .sk-wrap::-webkit-scrollbar-track { background: var(--surface-2); }
  .sk-wrap::-webkit-scrollbar-thumb { background: var(--linie-stark); border-radius: 8px; border: 3px solid var(--surface-2); }
}
/* Handy/Tablet (Finger): Knöpfe ausblenden – dort wird gewischt */
@media (pointer: coarse) { .sk-tagnav { display: none; } }


/* =====================================================================
   Handy: Hauptfelder vor Knöpfen (Nutzer 15.10.2026) – seltene Knöpfe hinter „⋯“, „Heute“/„Jetzt“ bleiben sichtbar,
   Eingabefelder kräftiger als die Knöpfe. Am PC/Tablet (ab 701 px) bleibt alles wie bisher.
   ===================================================================== */
.anw-mehr, .sk-heute, .sk-monat-sel { display: none; }
.sk-mehr-liste .sk-ansicht { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
@media screen and (max-width: 700px) {
  /* Anwesenheit: Wochentag · ◀ Datum ▶ Heute · Suche ⋯ – fließend: bei wenig Platz (320 px, große Schrift)
     rutscht „Heute“ in die Zeile mit Suche und ⋯, das Datum bleibt ganz lesbar */
  .toolbar.anw-leiste { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; width: 100%; }
  .anw-leiste > .datebar, .anw-leiste .datebar-extra { display: contents; }
  .anw-leiste > *, .anw-leiste .datebar > *, .anw-leiste .datebar-extra > * { order: 4; }
  .anw-leiste .date-label { order: 1; flex: 0 1 auto; }
  .anw-leiste .frei-tag { order: 2; }
  .anw-leiste::before { content: ""; order: 3; flex: 0 0 100%; height: 0; } /* Zeilenumbruch nach dem Wochentag */
  .anw-leiste .datebar > .btn { flex: 0 0 var(--tap); min-width: var(--tap); padding: 0 8px; }
  .anw-leiste .date-input { flex: 1 1 8em; width: auto; min-width: 0; }
  .anw-leiste .datebar-extra > .btn { flex: 0 0 auto; padding: 0 12px; }
  .anw-leiste .anw-extra, .anw-leiste > .spacer { display: none; }
  .toolbar.anw-leiste .search { flex: 1 1 8em; width: auto; min-width: 0; max-width: none; }
  .anw-leiste .anw-mehr { display: inline-flex; flex: 0 0 auto; min-width: var(--tap); padding: 0 14px; }

  /* Stunden: Zeitfelder und Pausen kräftig umrandet, „Jetzt“ ruhiger (bleibt sichtbar) */
  table.std .zeit-inp:not(:disabled){ border: 2px solid var(--text-muted); background: var(--surface); color: var(--text); font-weight: 600; }
  /* Überschrift „Monat · Name“ steht schon in der Leiste – nur für Vorlesehilfen behalten */
  .std-titel { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; margin: 0; }
  .std-row.heute .zeit-jetzt { background: var(--primary-soft); border-color: var(--primary-line); color: var(--primary); font-weight: 600; }

  /* Standortkalender: Jahr | Monat · Heute | ⋯ Mehr – Ansicht, Monatsreiter und Jahres-Hinweis wandern ins Menü */
  .toolbar.sk-leiste { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 6px; width: 100%; }
  .sk-leiste > .sk-jahrbar { display: contents; }
  .sk-leiste > .sk-jahrbar > .btn, .sk-leiste > .sk-zeitraum, .sk-leiste > .sk-ansicht { display: none; }
  .sk-leiste .sk-jahr, .sk-leiste .sk-monat-sel { width: 100%; min-width: 0; max-width: none; }
  .sk-leiste .sk-monat-sel:not([hidden]), .sk-leiste .sk-heute:not([hidden]) { display: inline-flex; }
  .sk-leiste .sk-monat-sel:not([hidden]) { display: block; }
  .sk-leiste > .btn { width: 100%; }
  .sk-monate, .sk-info { display: none !important; }
}

/* Agenda zum Auf-/Zuklappen (Nutzer 15.10.2026): Kopfzeile ist ein Knopf; zugeklappt nur eine Zeile mit gewähltem Stein */
button.sk-agenda-kopf { display: flex; align-items: center; flex-wrap: nowrap; gap: 8px; width: 100%; min-height: var(--tap); margin: 0 0 6px; padding: 0 2px;
  border: 0; background: transparent; color: var(--text); font: inherit; text-align: left; cursor: pointer; -webkit-tap-highlight-color: transparent; }
button.sk-agenda-kopf #skAgendaInfo { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sk-agenda-wahl { flex: 0 0 auto; width: 18px; height: 18px; border-radius: 4px; border: 1px solid var(--border); }
.sk-agenda-wahl[hidden] { display: none; }
.sk-agenda-pfeil { flex: 0 0 auto; margin-left: auto; font-weight: 700; color: var(--primary); white-space: nowrap; }
.sk-agenda.zu { padding-top: 2px; padding-bottom: calc(2px + env(safe-area-inset-bottom, 0px)); }
.sk-agenda.zu button.sk-agenda-kopf { margin-bottom: 0; }
@media screen and (max-width: 900px) {
  body.hat-nav .sk-agenda.zu { padding-bottom: 2px; }
}
@media screen and (max-width: 900px) and (min-height: 601px) {
  .sk-wrap.ag-zu { max-height: calc(100dvh - var(--nav-h) - 110px); } /* Querformat hat eigene Höhe */
}

/* Tagesfenster (15.10.2026): Erklärung zum Personal steht unter „+ Person einteilen“ */
.sk-personal-hilfe { margin: 16px 0 0; }
.sk-dlg .sk-auswahl, .sk-dlg .sk-personal { margin-top: 8px; }
.sk-dlg .sk-personal:empty { display: none; }

/* Personenauswahl (15.10.2026): langer Hinweis („schon auf … · über Höchststunden“) eigene Zeile unter dem Namen,
   bricht um – vorher schob er den Namen links aus dem Knopf */
.kal-opt { flex-wrap: wrap; text-align: left; justify-content: flex-start; }
.kal-opt-name { flex: 1 1 0; min-width: 0; overflow-wrap: anywhere; }
.kal-opt-grund { flex: 1 1 100%; min-width: 0; padding-left: 30px; overflow-wrap: anywhere; white-space: normal; }

/* Anwesenheit am Handy (15.10.2026): Zahlenkästen kompakt – „Name Zahl“ in einer Zeile, nebeneinander,
   damit die Personenliste früher beginnt (vorher 3–4 Spalten × 4 Reihen hohe Kästen) */
@media screen and (max-width: 600px) {
  #counters { display: flex; flex-wrap: wrap; gap: 4px 5px; margin: 2px 0 8px; }
  #counters .counter { flex: 1 1 auto; flex-direction: row; align-items: baseline; justify-content: space-between; gap: 6px;
    padding: 3px 9px; font-size: .875rem; line-height: 1.25; border-radius: 8px; white-space: nowrap; text-align: left; }
  #counters .counter b { font-size: .95rem; line-height: 1.25; }
}

/* Gesamtliste: kompakte Karte am Handy (15.10.2026) – Name | Tage, Adresse in einer Zeile, Telefon/E-Mail,
   Notiz | Häkchen „kontaktiert“; keine Überschrift je Feld mehr */
table.gl td.gl-kurz { display: none; }
@media screen and (max-width: 700px) {
  table.gl tr { grid-template-columns: minmax(0, 1fr) auto; gap: 4px 10px; padding: 10px 12px; margin-bottom: 8px; }
  table.gl td.gl-d { display: none; }
  table.gl td.gl-kurz { display: flex; flex-direction: column; gap: 2px; grid-column: 1 / -1; }
  table.gl th.gl-name { grid-column: 1; align-self: center; }
  table.gl th.gl-name .sk-ueb-name { font-size: 1.05rem; font-weight: 700; text-align: left; }
  table.gl td.gl-tage { grid-column: 2; grid-row: 1; align-self: center; padding: 2px 10px; border-radius: 999px; background: var(--green-light); white-space: nowrap; }
  table.gl td.gl-tage::before { content: "Tage "; display: inline; font-weight: 400; color: var(--muted); }
  table.gl td.gl-tage.leer { background: transparent; color: var(--muted); }
  .gl-wege { display: flex; flex-wrap: wrap; gap: 2px 16px; }
  .gl-wege a { display: inline-flex; align-items: center; min-height: 36px; }
  table.gl td.gl-notiz-td { grid-column: 1; }
  table.gl td.gl-notiz-td::before, table.gl td.gl-kontakt::before { content: none; display: none; }
  table.gl td.gl-kontakt { grid-column: 2; align-self: start; text-align: center; }
  table.gl td.gl-kontakt .gl-haken { min-height: var(--tap); gap: 6px; }
  table.gl td.gl-kontakt .gl-haken-text { position: static; width: auto; height: auto; overflow: visible; clip: auto; font-size: .875rem; }
  table.gl td.gl-kontakt .gl-kontakt-info { font-size: .875rem; max-width: 9rem; white-space: normal; }
}

/* Standortkalender am PC kompakt (Nutzer 15.10.2026: „Kalender im Verhältnis zu Buttons und Agenda zu klein“):
   Reihe 1 = ◀ Jahr ▶ · Jän … Dez · Kompakt|Details · Gesamtauflistung · ⋯ Mehr (Jahr bearbeiten, Excel, Drucken,
   Krank/frei-Zeile, Nächstes Jahr, angelegte Jahre); Reihe 2 = ◀ Woche · Heute · Woche ▶; Hinweise als Tooltip; Agenda flacher */
.sk-leiste .sk-monate { margin: 0; gap: 4px; }
@media screen and (min-width: 901px) {
  .sk-leiste { gap: 6px 10px; margin-bottom: 6px; }
  .sk-leiste .sk-extra:not(#skStdKnopf) { display: none !important; }
  .sk-leiste .sk-mehr:not([hidden]) { display: inline-flex !important; }
  .sk-leiste .sk-zeitraum, .sk-info, .sk-tagnav-tipp { display: none; }
  .sk-leiste .sk-monate .subtab { padding: 0 10px; min-width: var(--tap); }
  .sk-tagnav { margin: 0 0 4px; }
}
@media screen and (min-width: 901px) and (pointer: fine) {
  .sk-hilfe { display: none !important; }
  .sk-agenda { margin-top: 6px; padding: 4px 10px 6px; }
  button.sk-agenda-kopf { margin: 0 0 2px; }
  .sk-agenda .sk-steine { padding-bottom: 2px; }
}
.sk-umbruch { display: none; }
.sk-leiste > .sk-tagnav { margin: 0; }
@media screen and (min-width: 901px) {
  .sk-umbruch { display: block; flex: 0 0 100%; height: 0; }
}
@media screen and (max-width: 700px) {
  .sk-leiste > .sk-tagnav { grid-column: 1 / -1; }
}

/* Stundenaufzeichnung: Änderungsverlauf (15.10.2026) */
.std-verlauf-liste { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.std-verlauf-eintrag { padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.std-verlauf-kopf { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 10px; }
.std-verlauf-was { margin: 4px 0 2px; overflow-wrap: anywhere; }

/* Stundenaufzeichnung: Pausen von–bis (15.10.2026, § 26 AZG) – PC/Tablet zwei Uhrzeitfelder je Pause,
   Handy ein Knopf mit den Zeiten, der das Pausen-Fenster öffnet. .pause-inp sieht aus wie .zeit-inp (eigene Klasse,
   damit Beginn/Ende weiter genau zwei .zeit-inp je Zeile sind) */
.pause-inp { width: 100%; min-width: 86px; min-height: 40px; padding: 4px 6px; text-align: center; font-variant-numeric: tabular-nums; }
@media screen and (max-width: 900px) { .pause-inp { min-height: 44px; } }
@media (pointer: coarse) { .pause-inp { min-height: var(--tap); font-size: 1rem; } }
@media print { .pause-inp { min-height: 0; border: 0; padding: 0; background: transparent; -webkit-appearance: none; appearance: none; } }
table.std:not(.sk-std) { min-width: 940px; }
table.std:not(.sk-std) td.std-pause { min-width: 210px; }
.pause-zelle { display: flex; align-items: center; gap: 3px; }
.pause-zelle .pause-inp { flex: 1 1 0; min-width: 0; }
.pause-strich { flex: 0 0 auto; color: var(--muted); }
.pause-alt { display: block; margin-top: 2px; }
.pause-zwei { min-height: var(--tap); white-space: nowrap; }
table.std td.std-pause.pause-fehlt { box-shadow: inset 0 0 0 2px var(--red); }
.std-row.abgelaufen .pause-knopf, .std-row.abgelaufen .pause-zwei { pointer-events: none; }
.pause-knopf { display: inline-flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; min-height: var(--tap);
  padding: 2px 0; font-size: .875rem; font-weight: 600; line-height: 1.15; font-variant-numeric: tabular-nums; }
.pause-knopf:not(.hat) { color: var(--muted); font-size: 1.1rem; }
.std-pausen-fenster .pause-reihe { border: 1px solid var(--line); border-radius: 8px; padding: 6px 10px 10px; margin: 8px 0; }
.std-pausen-fenster legend { font-weight: 700; padding: 0 4px; }
.pause-felder { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; }
.pause-feld .zeit-zelle .zeit-inp { flex: 1 1 auto; min-width: 0; min-height: var(--tap); border: 2px solid var(--text-muted); font-weight: 600; text-align: center; }
@media screen and (max-width: 700px) {
  table.std:not(.sk-std) { min-width: 0; }
  table.std:not(.sk-std) td.std-pause { min-width: 0; }
}
@media screen and (max-width: 380px) {
  .pause-felder { grid-template-columns: minmax(0, 1fr); }
}
/* Pausen: „Jetzt“ im Pausen-Fenster immer zeigen (die Tabellen-Regel blendet es am Handy außerhalb von heute aus);
   „+ 2. Pause“ am PC dezent */
.std-pausen-fenster .zeit-jetzt { display: inline-flex !important; align-items: center; justify-content: center; min-height: var(--tap); }
.pause-knopf[hidden] { display: none; }
.pause-zwei { background: transparent; border-style: dashed; color: var(--muted); font-weight: 600; }
.pause-zwei:hover:not(:disabled) { color: var(--text); border-style: solid; }

/* Arbeitszeit-Hinweise (15.10.2026): Ruhezeit unter 11 h, mehr als 12 h am Tag – Schild in der Tag-Zelle, Liste beim Abschließen */
.std-warn-box:empty { display: none; }
.std-warn-box { display: block; }
table.std tr.hat-warnung th.std-tag { white-space: normal; }
.std-warn { display: inline-block; margin: 2px 0 0; background: var(--red-light); color: var(--red); font-size: .875rem; font-weight: 700; white-space: nowrap; }
.std-warn-liste { margin-top: 12px; padding: 8px 12px; border: 1px solid var(--danger-line); border-radius: 8px; background: var(--danger-soft-2, var(--red-light)); }
.std-warn-liste h3 { margin: 0 0 4px; font-size: 1rem; color: var(--red); }
.std-warn-liste ul { margin: 6px 0 0; padding-left: 18px; }
.std-warn-liste li { margin: 4px 0; }
.std-warn-liste .linkbtn { min-height: var(--tap); text-align: left; font-weight: 600; }
@media screen and (max-width: 700px) {
  table.std .badge.std-warn { display: block; margin: 2px 0 0; padding: 1px 3px; border-radius: 6px; white-space: normal; overflow: visible; text-overflow: clip; max-width: 100%;
    font-size: .875rem; line-height: 1.2; overflow-wrap: anywhere; }
}
.std-warn-tag p { margin: 2px 0; }

/* ===================================================================== */
/* Termine – zweiter Kalender wie Kalender.digital (15.10.2026)            */
/* ===================================================================== */
:root { --ter-luft: .75rem; --ter-balken: 1.5rem; --ter-kopf: 1.75rem; --ter-kw-breite: 3rem; }
.ter-kopf { display: flex; flex-direction: column; gap: 8px; margin-bottom: 8px; }
.ter-titel { margin: 0; font-size: 1.25rem; }
.ter-leiste { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; }
.ter-nav { display: inline-flex; gap: 6px; }
.ter-nav .btn { min-width: var(--tap); }
.ter-datum { display: inline-flex; gap: 6px; min-width: 0; flex: 1 1 14rem; }
.ter-datum .input { width: auto; min-width: 0; flex: 1 1 auto; font-weight: 700; }
.ter-jahr-sel { flex: 0 0 6.5rem !important; }
.ter-aktionen { display: inline-flex; flex-wrap: wrap; gap: 6px; }
.ter-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; align-items: start; }
@media (min-width: 1200px) {
  .ter-layout { grid-template-columns: 15rem minmax(0, 1fr); }
    }
.ter-chip { display: inline-block; max-width: 100%; padding: 2px 10px; border-radius: 6px; font-weight: 600; line-height: 1.4;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; vertical-align: middle; hyphens: none; }
.ter-chip.gross { padding: 6px 12px; font-size: 1.05rem; }

/* Monatsraster */
.ter-monat { border: 1px solid var(--linie-stark); border-radius: var(--radius); background: var(--surface); overflow: hidden; }
.ter-wt, .ter-woche { display: grid; grid-template-columns: var(--ter-kw-breite) repeat(7, minmax(0, 1fr)); }
.ter-wt { background: var(--head); border-bottom: 1px solid var(--linie-stark); }
.ter-wt-zelle { padding: 4px 2px; text-align: center; font-size: .875rem; font-weight: 600; color: var(--text-muted); }
.ter-wt-kurz { display: none; }
.ter-woche { position: relative; min-height: 6.5rem; border-bottom: 1px solid var(--linie); row-gap: 3px; padding-bottom: 2px; }
.ter-woche:last-child { border-bottom: 0; }
.ter-tag { position: relative; z-index: 0; display: flex; justify-content: space-between; align-items: flex-start; gap: 2px;
  min-width: 0; min-height: var(--tap); margin: 0; padding: 2px 6px; border: 0; border-right: 1px solid var(--linie); border-radius: 0;
  background: var(--surface); color: var(--text); font: inherit; text-align: right; cursor: pointer; }
.ter-tag:last-of-type { border-right: 0; }
.ter-tag:hover { background: var(--surface-3); }
.ter-tag.we { background: var(--info-soft); }
.ter-tag.fremd { background: var(--surface-2); color: var(--text-muted); }
.ter-tag.fremd .ter-tagnr { font-weight: 400; }
.ter-tag:focus-visible { outline: 3px solid var(--focus); outline-offset: -3px; z-index: 2; }
.ter-tagnr { margin-left: auto; font-weight: 700; font-size: .875rem; font-variant-numeric: tabular-nums; line-height: 1.6; }
.ter-tag.heute .ter-tagnr { background: var(--primary); color: var(--on-primary); border-radius: 999px; padding: 0 7px; }
.ter-kw { display: flex; flex-direction: column; align-items: center; padding-top: 2px; border-right: 1px solid var(--linie);
  background: var(--head); font-size: .875rem; font-weight: 700; color: var(--text); line-height: 1.3; font-variant-numeric: tabular-nums; }
.ter-kw-text { font-weight: 600; color: var(--text-muted); }
.ter-kw-kopf { border-right: 1px solid var(--linie); }
.ter-balken { position: relative; z-index: 1; display: block; min-width: 0; height: var(--ter-balken); margin: 0 3px; padding: 0 8px;
  border-radius: 999px; font-size: .875rem; font-weight: 600; line-height: var(--ter-balken); white-space: nowrap; overflow: hidden;
  text-overflow: ellipsis; pointer-events: none; hyphens: none; }
.ter-monat.maus .ter-balken { pointer-events: auto; cursor: pointer; }
.ter-monat.maus .ter-balken:hover { filter: brightness(.92); }
.ter-balken.weiter-links { border-top-left-radius: 0; border-bottom-left-radius: 0; margin-left: 0; }
.ter-balken.weiter-rechts { border-top-right-radius: 0; border-bottom-right-radius: 0; margin-right: 0; }
.ter-zeit { font-weight: 700; }

/* Tagesliste, Kurzinfo, Formular */
.ter-tagliste ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.ter-tag-eintrag { width: 100%; justify-content: flex-start; text-align: left; gap: 10px; }
.ter-tag-text { display: flex; flex-direction: column; min-width: 0; }
.ter-tag-text b { overflow-wrap: anywhere; }
.ter-punkt { display: inline-block; width: 14px; height: 14px; border-radius: 50%; flex: 0 0 auto; border: 1px solid var(--border); }
.ter-punkt.gross { width: 22px; height: 22px; }
.ter-info .kv { margin: 8px 0; }
.ter-beschreibung { white-space: pre-wrap; overflow-wrap: anywhere; }
.ter-kal-wahl { display: flex; align-items: center; gap: 8px; }
.ter-kal-wahl select { flex: 1 1 auto; min-width: 0; }
.ter-zeiten[hidden] { display: none; }

/* Unterkalender verwalten */
.btn-danger-outline { color: var(--danger); border-color: var(--danger-line); }
.ter-farben { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 8px; }
.ter-farbe { position: relative; display: inline-flex; width: var(--tap); height: var(--tap); padding: 3px; border-radius: 10px; border: 2px solid transparent; cursor: pointer; }
.ter-farbe input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.ter-farbe-feld { flex: 1; border-radius: 7px; }
.ter-farbe.gewaehlt { border-color: var(--text); }
.ter-farbe:focus-within { outline: 3px solid var(--focus); outline-offset: 1px; }
.ter-eigen { display: inline-flex; align-items: center; gap: 8px; min-height: var(--tap); font-weight: 600; }
.ter-farbe-eigen { width: var(--tap); height: var(--tap); padding: 2px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); }
.ter-vorschau-zeile { margin: 6px 0 0; }
.field-label { display: block; font-weight: 600; margin-bottom: 4px; }

/* Handy: kürzere Wochentage, schmälere Balken-Ränder */
@media (max-width: 700px) {
  .ter-wt-lang { display: none; }
  .ter-wt-kurz { display: inline; }
  .ter-tag { padding: 2px 3px; }
  .ter-balken { margin: 0 1px; padding: 0 4px; }
  :root { --ter-kw-breite: 2rem; }
  .ter-zeit { display: none; }
  .ter-woche { min-height: 5.5rem; }
  .ter-aktionen { flex: 1 1 100%; }
  .ter-aktionen .btn { flex: 1 1 8rem; }
}
@media print {
  .ter-leiste{ display: none !important; }
  .ter-balken, .ter-tag.we, .ter-tag.fremd, .ter-tag.heute .ter-tagnr { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* Termine Etappe 2 (16.10.2026): Ansicht-Umschalter, Woche/Tag (Stundenraster), Liste, Drucken */
:root { --ter-zeit-breite: 4.5rem; --ter-std: 3rem; }
.ter-ansicht { display: inline-flex; flex-wrap: wrap; gap: 6px; }
.ter-ansicht .btn[aria-pressed="true"] { background: var(--primary); color: var(--on-primary); border-color: var(--primary); font-weight: 700; }
.ter-zeitraum { margin: 0; font-weight: 700; font-size: 1.05rem; }
.ter-zeitraum[hidden] { display: none; }

.ter-zr { border: 1px solid var(--linie-stark); border-radius: var(--radius); background: var(--surface); overflow: hidden; }
.ter-zr-kopf, .ter-zr-ganz, .ter-zr-koerper { display: grid; }
.ter-zr-kopf { background: var(--head); border-bottom: 1px solid var(--linie-stark); }
.ter-zr-ecke { display: flex; flex-direction: column; align-items: center; justify-content: center; border-right: 1px solid var(--linie);
  font-size: .875rem; font-weight: 700; line-height: 1.3; font-variant-numeric: tabular-nums; }
.ter-zr-tag { display: flex; flex-direction: column; align-items: center; justify-content: center; min-width: 0; min-height: var(--tap);
  margin: 0; padding: 2px; border: 0; border-right: 1px solid var(--linie); border-radius: 0; background: transparent; color: var(--text);
  font: inherit; font-size: .875rem; font-weight: 600; line-height: 1.3; cursor: pointer; }
.ter-zr-tag:last-child { border-right: 0; }
.ter-zr-tag.we { background: var(--info-soft); }
.ter-zr-tag:hover { background: var(--surface-3); }
.ter-zr-tag:focus-visible, .ter-zr-ganz-feld:focus-visible, .ter-block:focus-visible { outline: 3px solid var(--focus); outline-offset: -3px; z-index: 3; }
.ter-zr-nr { font-size: 1rem; font-variant-numeric: tabular-nums; }
.ter-zr-tag.heute .ter-zr-nr { background: var(--primary); color: var(--on-primary); border-radius: 999px; padding: 0 7px; }
.ter-zr-ganz { position: relative; min-height: var(--tap); row-gap: 3px; border-bottom: 2px solid var(--linie-stark); }
.ter-zr-ganz-titel { display: flex; align-items: center; justify-content: center; padding: 0 2px; border-right: 1px solid var(--linie);
  background: var(--head); color: var(--text-muted); font-size: .875rem; font-weight: 600; text-align: center; overflow-wrap: anywhere; }
.ter-zr-ganz-feld { position: relative; z-index: 0; min-width: 0; min-height: var(--tap); margin: 0; padding: 0; border: 0;
  border-right: 1px solid var(--linie); border-radius: 0; background: var(--surface); cursor: pointer; }
.ter-zr-ganz-feld:last-of-type { border-right: 0; }
.ter-zr-ganz-feld.we { background: var(--info-soft); }
.ter-zr-ganz-feld:hover { background: var(--surface-3); }
.ter-zr.maus .ter-balken { pointer-events: auto; cursor: pointer; }
.ter-zr.maus .ter-balken:hover { filter: brightness(.92); }
.ter-zr-zeiten { display: grid; grid-template-rows: repeat(var(--ter-stunden), var(--ter-std)); border-right: 1px solid var(--linie); background: var(--head); }
.ter-zr-zeiten span { padding: 0 6px; font-size: .875rem; color: var(--text-muted); text-align: right; font-variant-numeric: tabular-nums; line-height: 1.4; }
.ter-zr-spalte { position: relative; min-width: 0; height: calc(var(--ter-stunden) * var(--ter-std)); border-right: 1px solid var(--linie);
  background-color: var(--surface); background-image: repeating-linear-gradient(to bottom, var(--linie) 0 1px, transparent 1px var(--ter-std)); cursor: cell; }
.ter-zr-spalte:last-child { border-right: 0; }
.ter-zr-spalte.we { background-color: var(--info-soft); }
.ter-block { position: absolute; z-index: 1; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start;
  box-sizing: border-box; min-width: 0; margin: 0; padding: 2px 6px; border: 1px solid var(--surface); border-radius: 6px;
  font: inherit; font-size: .875rem; line-height: 1.25; text-align: left; overflow: hidden; cursor: pointer; }
.ter-block:hover { filter: brightness(.92); }
.ter-block-zeit { font-weight: 700; font-variant-numeric: tabular-nums; }
.ter-block-titel { max-width: 100%; font-weight: 600; overflow-wrap: normal; word-break: normal; hyphens: none; } /* nicht Buchstabe für Buchstabe umbrechen, lange Wörter abschneiden */
.ter-jetzt { position: absolute; left: 0; right: 0; z-index: 2; height: 0; border-top: 2px solid var(--danger); pointer-events: none; }
.ter-jetzt::before { content: ''; position: absolute; left: -5px; top: -6px; width: 10px; height: 10px; border-radius: 50%; background: var(--danger); }
.ter-hinweis { margin: 6px 0 0; }

.ter-liste { display: grid; gap: 10px; }
.ter-liste-tag { padding: 8px 12px 12px; border: 1px solid var(--linie); border-radius: var(--radius); background: var(--surface); }
.ter-liste-tag.heute { border-color: var(--primary); box-shadow: inset 4px 0 0 var(--primary); }
.ter-liste-datum { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 6px; font-size: 1rem; }
.ter-heute-schild { padding: 0 8px; border-radius: 999px; background: var(--primary); color: var(--on-primary); font-size: .875rem; }
.ter-liste ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.ter-liste-zeit { flex: 0 0 6.5rem; font-weight: 700; font-variant-numeric: tabular-nums; }

@media (max-width: 700px) {
  :root { --ter-zeit-breite: 2.75rem; --ter-std: 2.75rem; }
  .ter-ansicht { flex: 1 1 100%; }
  .ter-ansicht .btn { flex: 1 1 0; min-width: 0; padding-inline: 6px; }
  .ter-zr-zeiten span { padding: 0 3px; }
  .ter-block { padding: 1px 3px; }
  .ter-zr:not(.ter-zr-1) .ter-block-zeit { display: none; }
  .ter-liste-zeit { flex-basis: 4.75rem; }
  .ter-druck-btn { display: none; }
}
@media print {
  .ter-ansicht, .ter-hinweis, .ter-zeitraum, .ter-jetzt { display: none !important; }
  .ter-druckkopf.print-only { display: flex !important; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 0 0 6px; color: #000; }
  .ter-druck-titel { font-size: 14px; margin-right: 8px; }
  .ter-druck-legende { display: inline-flex; flex-wrap: wrap; gap: 4px; }
    .ter-layout { display: block; }
  :root { --ter-std: 2.1rem; }
  .ter-block { flex-direction: row; flex-wrap: wrap; align-content: flex-start; column-gap: 4px; padding: 1px 4px; font-size: 10px; line-height: 1.2; }
  .ter-zr, .ter-monat { break-inside: avoid; }
  .ter-liste-tag { break-inside: avoid; }
  .ter-chip, .ter-block, .ter-punkt, .ter-zr-tag.we, .ter-zr-ganz-feld.we, .ter-zr-spalte, .ter-zr-tag.heute .ter-zr-nr, .ter-heute-schild {
    -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* Termine 16.10.2026 (Nachtrag): „Mitarbeiter“ statt Unterkalender, Leiste am PC einklappbar, Kalender breiter und höher */
.main:has(.ter-layout) { max-width: none; }
.ter-form .field[hidden] { display: none; }
.ter-eigen-hinweis { margin: 0 0 8px; }
.ter-eigen-hinweis[hidden] { display: none; }
@media (min-width: 1200px) {
    .ter-layout.leiste-zu { grid-template-columns: minmax(0, 1fr); }
    }
@media (min-width: 900px) {
  /* Monat: Wochenzeilen füllen die Bildschirmhöhe (5 Wochen sichtbar), mind. 7rem, höchstens 12rem */
  .ter-woche { min-height: clamp(7rem, calc((100vh - 15rem) / 5), 12rem); min-height: clamp(7rem, calc((100dvh - 15rem) / 5), 12rem); }
}
@media print {
    .ter-woche { min-height: 6.5rem; }
}

/* MA-Kalender (16.10.2026): Standort-Auswahl unter dem Monat, Standort auf Balken/Blöcken */
.ter-datum { flex-direction: column; align-items: stretch; }
.ter-datum-zeile { display: flex; gap: 6px; min-width: 0; }
.ter-datum-zeile .input { width: auto; min-width: 0; flex: 1 1 auto; font-weight: 700; }
.ter-ort-sel { width: 100%; font-weight: 600; }
.ter-ort-sel.gefiltert { border-color: var(--primary); box-shadow: inset 0 0 0 1px var(--primary); }
.ter-ort { font-weight: 400; }
.ter-block-ort { font-weight: 400; overflow-wrap: normal; }
@media print { .ter-ort-sel { display: none !important; } }
@media (min-width: 1200px) {
  /* Leiste etwas breiter, damit „Mitarbeiter · Alle aus · ◂“ in einer Zeile stehen */
  .ter-layout { grid-template-columns: 16.5rem minmax(0, 1fr); }
  .ter-layout.leiste-zu { grid-template-columns: minmax(0, 1fr); }
}

/* MA-Kalender 16.10.2026: Farbe direkt im Termin-Fenster */
.ter-farb-feld[hidden] { display: none; }
.ter-farb-hinweis { margin: 4px 0 0; }

/* MA-Kalender 16.10.2026: ohne Mitarbeiter-Leiste (Kalender volle Breite), Rückfrage beim Schließen des Termin-Fensters */
.ter-layout, .ter-layout.leiste-zu { grid-template-columns: minmax(0, 1fr); }
.ter-frage { margin: 0 0 12px; }
.ter-frage[hidden] { display: none; }
.ter-frage p { margin: 4px 0 8px; }
.ter-frage-knoepfe { display: flex; flex-wrap: wrap; gap: 8px; }
.ter-frage-knoepfe .btn { flex: 1 1 8rem; }
.ter-notiz-kurz { overflow-wrap: anywhere; }

/* MA-Kalender Etappe 3 (16.10.2026): Jahr und Planer */
:root { --ter-pl-name: 11.5rem; --ter-pl-tag: 1.6rem; --ter-pl-balken: 2rem; }
.ter-monat-sel[hidden] { display: none; }
.ter-ansicht { flex-wrap: wrap; }

.ter-jahr { display: grid; grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr)); gap: 12px; }
.ter-jahr-monat { border: 1px solid var(--linie-stark); border-radius: var(--radius); background: var(--surface); padding: 6px 8px 10px; }
.ter-jahr-monat.aktuell { border-color: var(--primary); box-shadow: inset 0 3px 0 var(--primary); }
.ter-jahr-titel { display: flex; justify-content: space-between; align-items: center; gap: 8px; width: 100%; min-height: var(--tap);
  margin: 0 0 4px; padding: 0 6px; border: 0; border-radius: 8px; background: transparent; color: var(--text); font: inherit; font-weight: 700; font-size: 1.05rem; cursor: pointer; }
.ter-jahr-titel:hover { background: var(--surface-3); }
.ter-jahr-titel:focus-visible, .ter-jahr-tag:focus-visible, .ter-pl-feld:focus-visible, .ter-pl-balken:focus-visible { outline: 3px solid var(--focus); outline-offset: -3px; z-index: 3; }
.ter-jahr-anz { font-size: .875rem; font-weight: 600; color: var(--text-muted); }
.ter-jahr-raster { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 2px; }
.ter-jahr-wt { text-align: center; font-size: .875rem; font-weight: 600; color: var(--text-muted); }
.ter-jahr-wt.we { color: var(--text); }
.ter-jahr-tag { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 2px; min-width: 0; min-height: 2.6rem;
  margin: 0; padding: 2px 0; border: 0; border-radius: 6px; background: var(--surface); color: var(--text); font: inherit; font-size: .875rem; cursor: pointer; }
.ter-jahr-tag.we { background: var(--info-soft); }
.ter-jahr-tag.belegt .ter-jahr-nr { font-weight: 700; }
.ter-jahr-tag:hover { background: var(--surface-3); }
.ter-jahr-tag.heute .ter-jahr-nr { background: var(--primary); color: var(--on-primary); border-radius: 999px; padding: 0 6px; }
.ter-jahr-nr { font-variant-numeric: tabular-nums; line-height: 1.4; }
.ter-jahr-punkte { display: flex; align-items: center; gap: 2px; }
.ter-jahr-punkte .ter-punkt { width: 8px; height: 8px; border: 0; }
.ter-jahr-mehr { font-size: .875rem; font-weight: 700; line-height: 1; }

.ter-planer { border: 1px solid var(--linie-stark); border-radius: var(--radius); background: var(--surface); overflow: hidden; }
.ter-pl-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.ter-pl-raster { min-width: calc(var(--ter-pl-name) + var(--ter-pl-tage) * var(--ter-pl-tag)); }
.ter-pl-kopf, .ter-pl-zeile { display: grid; }
.ter-pl-kopf { background: var(--head); border-bottom: 1px solid var(--linie-stark); }
.ter-pl-ecke, .ter-pl-name { position: sticky; left: 0; z-index: 4; border-right: 1px solid var(--linie-stark); }
.ter-pl-ecke { display: flex; align-items: center; padding: 0 8px; background: var(--head); font-size: .875rem; font-weight: 700; color: var(--text-muted); }
.ter-pl-tagkopf { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: var(--tap); border-right: 1px solid var(--linie);
  font-size: .875rem; line-height: 1.2; font-variant-numeric: tabular-nums; }
.ter-pl-tagkopf.we { background: var(--info-soft); }
.ter-pl-tagkopf.heute b { background: var(--primary); color: var(--on-primary); border-radius: 999px; padding: 0 5px; }
.ter-pl-wt { color: var(--text-muted); font-weight: 600; }
.ter-pl-zeile { position: relative; min-height: var(--tap); border-bottom: 1px solid var(--linie); row-gap: 2px; padding: 2px 0; }
.ter-pl-name { display: flex; align-items: center; gap: 6px; min-width: 0; padding: 0 8px; background: var(--surface); font-weight: 600; }
.ter-pl-name-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ter-pl-feld { z-index: 0; min-width: 0; margin: -2px 0; padding: 0; border: 0; border-right: 1px solid var(--linie); border-radius: 0; background: transparent; }
button.ter-pl-feld { cursor: cell; }
button.ter-pl-feld:hover { background: var(--surface-3); }
.ter-pl-feld.we { background: var(--info-soft); }
.ter-pl-feld.heute { box-shadow: inset 2px 0 0 var(--primary), inset -2px 0 0 var(--primary); }
.ter-pl-balken { position: relative; z-index: 2; display: block; min-width: 0; height: var(--ter-pl-balken); margin: 0 2px; padding: 0 6px; border: 0;
  border-radius: 999px; font: inherit; font-size: .875rem; font-weight: 600; line-height: var(--ter-pl-balken); text-align: left; white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis; cursor: pointer; }
.ter-pl-balken:hover { filter: brightness(.92); }
.ter-pl-balken.weiter-links { border-top-left-radius: 0; border-bottom-left-radius: 0; margin-left: 0; }
.ter-pl-balken.weiter-rechts { border-top-right-radius: 0; border-bottom-right-radius: 0; margin-right: 0; }
.ter-planer .empty { margin: 0; }

@media (max-width: 700px) {
  :root { --ter-pl-name: 7.5rem; --ter-pl-tag: 3rem; --ter-pl-balken: 2.75rem; }
  .ter-ansicht .btn { flex: 1 1 30%; }
  .ter-jahr { grid-template-columns: minmax(0, 1fr); }
  .ter-jahr-tag { min-height: var(--tap); }
}
@media print {
  .ter-jahr { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
  .ter-jahr-monat { break-inside: avoid; padding: 2px 4px 4px; }
  .ter-jahr-titel { min-height: 0; font-size: 11px; }
  .ter-jahr-tag { min-height: 0; font-size: 9px; }
  .ter-jahr-wt { font-size: 8px; }
  .ter-pl-scroll { overflow: visible; }
  .ter-pl-raster { min-width: 0; }
  :root { --ter-pl-name: 26mm; --ter-pl-tag: 0px; --ter-pl-balken: 14px; }
  .ter-pl-tagkopf, .ter-pl-balken, .ter-pl-name, .ter-pl-ecke { font-size: 8px; min-height: 0; }
  .ter-pl-zeile { min-height: 0; }
  .ter-pl-balken, .ter-pl-feld.we, .ter-pl-tagkopf.we, .ter-jahr-tag.we, .ter-jahr-punkte .ter-punkt { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* Gesamtliste: Beträge a + b + c − d mit Einblick-Code (16.10.2026) */
.bet-leiste { display: inline-flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.bet-leiste:empty { display: none; }
table.gl .gl-nur-lesen { text-decoration: none; color: inherit; font-weight: 700; } /* Manager: Name ohne Link */
table.gl td.gl-betrag { white-space: nowrap; min-width: 8.5rem; }
table.gl th.gl-bet-kopf { white-space: nowrap; }
table.gl .gl-bet, table.gl .gl-bet-zu { min-height: var(--tap); min-width: 7.5rem; justify-content: flex-end; font-variant-numeric: tabular-nums; font-weight: 700; }
table.gl .gl-bet.leer { font-weight: 400; color: var(--muted); }
table.gl .gl-bet.minus, .bet-summe.minus { color: var(--danger, #b42318); }
table.gl .gl-bet-zu { color: var(--muted); letter-spacing: .08em; }
.bet-form { display: flex; flex-direction: column; gap: 4px; max-width: 24rem; }
.bet-zeile { display: grid; grid-template-columns: 1.5rem minmax(0, 1fr); align-items: end; gap: 8px; }
.bet-zeile .field { margin: 0; }
.bet-zeile input.r { text-align: right; font-variant-numeric: tabular-nums; font-size: 1.05rem; }
.bet-zeichen { font-size: 1.4rem; font-weight: 700; text-align: center; line-height: var(--tap); color: var(--muted); }
.bet-ergebnis { border-top: 2px solid var(--border); padding-top: 8px; margin-top: 4px; }
.bet-label { display: block; font-weight: 600; margin-bottom: 4px; }
.bet-summe { display: block; font-size: 1.3rem; font-weight: 700; text-align: right; font-variant-numeric: tabular-nums; min-height: var(--tap); line-height: var(--tap); }
.bet-summe.fehler { font-size: 1rem; font-weight: 600; color: var(--danger, #b42318); text-align: left; }
@media screen and (max-width: 700px) {
  table.gl td.gl-betrag { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 8px; min-width: 0; }
  table.gl td.gl-betrag::before { content: "Zahlen"; display: inline; font-size: .875rem; font-weight: 700; color: var(--muted); }
  .bet-leiste { flex-basis: 100%; }
}

/* MA-Kalender am Handy kompakt (Nutzer 16.10.2026): oben nur ◀ Monat/Jahr ▶ Heute, darunter Standort, Ansicht, + Termin –
   der Kalender bekommt den restlichen Platz. Am PC unverändert. */
.ter-saison-sel, .ter-ansicht-sel, .ter-umbruch { display: none; }
@media (max-width: 700px) {
  .ter-titel { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .ter-kopf { gap: 4px; margin-bottom: 6px; }
  .ter-leiste { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
  .ter-nav, .ter-datum, .ter-aktionen { display: contents; }
  .ter-datum-zeile, .ter-ansicht { display: none !important; }
  .ter-leiste .btn { padding-inline: 10px; min-width: var(--tap); }
  .ter-leiste .input { min-width: 0; width: auto; padding-inline: 8px; font-size: 1rem; }
  #terZurueck { order: 1; }
  .ter-saison-sel { display: block; order: 2; flex: 1 1 6rem; font-weight: 700; }
  #terWeiter { order: 3; }
  .ter-nav .btn:not([id]) { order: 4; }
  .ter-umbruch { display: block; order: 5; flex: 0 0 100%; height: 0; }
  .ter-leiste .ter-datum .ter-ort-sel { order: 6; flex: 1 1 0; width: 0; }
  .ter-ansicht-sel { display: block; order: 7; flex: 0 0 6.25rem; width: 6.25rem; }
  #terNeuBtn { order: 8; flex: 0 0 auto; white-space: nowrap; }
  .ter-druck-btn { display: none !important; }
  .ter-zeitraum { margin: 0; font-size: .875rem; }
  .ter-woche { min-height: max(4.5rem, var(--ter-woche-min, 4.5rem)); } /* füllt den Platz (JS terMonatHoehe) */
}
/* Rolle Mitarbeiter: Drucken gesperrt – auch über das Browser-Menü (Nutzer 16.10.2026) */
@media print {
  body.ter-kein-druck #main > * { display: none !important; }
  body.ter-kein-druck #main::after { content: "Drucken ist für Mitarbeiter nicht freigegeben."; display: block; font: 16px sans-serif; }
}

/* Standortkalender (Nutzer 16.10.2026): am PC volle Breite, Agenda senkrecht links neben dem Kalender; Handy/Tablet unverändert
   (Agenda unten). Die Zeile „Standorte offen“ gibt es nicht mehr. */
.main:has(#skHaupt) { max-width: none; }
.sk-haupt { display: flex; flex-direction: column; }
.sk-haupt > .sk-wrap { order: 1; }
.sk-haupt > .sk-agenda { order: 2; }
/* nicht am Tablet quer (17.10.2026): dort bleibt die Agenda unten, damit der Kalender die ganze Breite hat */
@media (min-width: 1100px) and (min-height: 601px) and (not ((orientation: landscape) and (pointer: coarse))) {
  .sk-haupt { display: grid; grid-template-columns: 14.5rem minmax(0, 1fr); gap: 10px; align-items: start; }
  .sk-haupt:has(> .sk-agenda[hidden]) { grid-template-columns: minmax(0, 1fr); }
  .sk-haupt:has(> .sk-agenda.zu) { grid-template-columns: 3.25rem minmax(0, 1fr); }
  .sk-haupt > .sk-agenda { order: 0; position: sticky; top: 8px; bottom: auto; margin: 0; padding: 8px; overflow-y: auto; box-shadow: none; }
  .sk-haupt > .sk-wrap { order: 0; }
  .sk-haupt button.sk-agenda-kopf { flex-wrap: wrap; align-items: baseline; height: auto; }
  .sk-haupt button.sk-agenda-kopf #skAgendaInfo { flex: 1 1 100%; order: 3; white-space: normal; overflow: visible; font-size: .875rem; line-height: 1.35; }
  .sk-haupt .sk-steine { flex-direction: column; flex-wrap: nowrap; overflow: visible; gap: 6px; padding: 0; }
  .sk-haupt .sk-stein { width: 100%; white-space: normal; text-align: left; line-height: 1.2; padding-block: 4px; border-radius: 12px; }
  .sk-haupt .sk-stein .sk-farbe { flex: 0 0 auto; }
  /* zugeklappt: schmale Spalte, „Agenda“ senkrecht */
  .sk-haupt > .sk-agenda.zu { padding: 6px 2px; }
  .sk-haupt > .sk-agenda.zu button.sk-agenda-kopf { flex-direction: column; align-items: center; gap: 8px; min-height: 8rem; }
  .sk-haupt > .sk-agenda.zu button.sk-agenda-kopf b { writing-mode: vertical-rl; }
  .sk-haupt > .sk-agenda.zu #skAgendaInfo { display: none; }
  .sk-haupt > .sk-agenda.zu .sk-agenda-pfeil { margin: 0; }
}

/* Verwaltung → Benutzer (17.10.2026): Warnung „keine Person zugeordnet“ darf umbrechen */
.badge.benutzer-ohne-person { white-space: normal; line-height: 1.3; }

/* MA-Kalender Etappe 4 (17.10.2026): Wiederholen, Serien-Rückfrage, Einstellungen */
.ter-wdh { display: flex; flex-direction: column; gap: 6px; padding: 8px 10px; border: 1px solid var(--linie); border-radius: var(--radius); background: var(--surface-2); }
.ter-wdh .field { margin: 0; }
.ter-wdh-tage { display: flex; flex-wrap: wrap; gap: 4px 12px; }
.ter-wdh-tage[hidden] { display: none; }
.ter-wdh-tag { min-height: var(--tap); }
.ter-wdh-info { margin: 0; }
.ter-serie-frage { margin: 0 0 12px; }
.ter-serie-frage p { margin: 4px 0 8px; }
.ter-serie-frage .ter-frage-knoepfe { display: flex; flex-wrap: wrap; gap: 8px; }
.ter-serie-frage .ter-frage-knoepfe .btn { flex: 1 1 8rem; }
.ter-einst-monate { display: grid; grid-template-columns: repeat(auto-fill, minmax(8rem, 1fr)); gap: 2px 12px; }
.ter-einst-monate .check-line { min-height: var(--tap); }
@media (max-width: 700px) {
  .ter-leiste .ter-aktionen .ter-einst-btn { order: 4; flex: 0 0 var(--tap); width: var(--tap); padding-inline: 0; }
}

/* MA-Kalender-Standorte je Person (17.10.2026) */
.ter-std-haken { display: grid; grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr)); gap: 0 12px; }
.ter-std-haken .check-line { min-height: var(--tap); }
table.gl td.gl-terstd { min-width: 9rem; }
table.gl .gl-terstd-btn { min-height: var(--tap); white-space: normal; text-align: left; line-height: 1.25; }
@media screen and (max-width: 700px) {
  table.gl td.gl-terstd { grid-column: 1 / -1; min-width: 0; }
  table.gl td.gl-terstd::before { content: none; display: none; }
}

/* Standortkalender am Tablet quer (Nutzer 17.10.2026: „Reiter und Button viel zu groß – die Kalenderansicht zum Eintragen
   ist das Wichtigste“): Seitenleiste hinter ☰, Jahr · Monate · Ansicht · ⋯ in einer schmalen Zeile (Gesamtauflistung
   unter ⋯ Mehr), kein Erklärtext, Standort-Spalte schmäler → ca. 7 Tage; Kalenderhöhe bis zur Agenda (skWrapHoehe).
   Gilt nur für Finger-Bedienung quer ab 901 px – PC und Handy bleiben wie bisher. */
.nav-knopf { display: none; }
@media screen and (min-width: 901px) and (orientation: landscape) and (pointer: coarse) {
  body.hat-nav:has(#skHaupt, #anwTable, #stammBody) { grid-template-columns: minmax(0, 1fr); }
  body.hat-nav:has(#skHaupt, #anwTable, #stammBody) > .main, body.hat-nav:has(#skHaupt, #anwTable, #stammBody) > .banner { grid-column: 1; }
  body.hat-nav:has(#skHaupt, #anwTable, #stammBody) > .nav { display: none; }
  body.hat-nav.nav-offen:has(#skHaupt, #anwTable, #stammBody) > .nav { display: flex; position: fixed; top: 0; left: 0; z-index: 60; width: clamp(220px, 14rem, 340px);
    height: 100vh; height: 100dvh; padding-top: calc(16px + env(safe-area-inset-top, 0px)); box-shadow: 6px 0 24px rgba(0,0,0,.3); }
  body.hat-nav.nav-offen:has(#skHaupt, #anwTable, #stammBody)::after { content: ""; position: fixed; inset: 0; z-index: 55; background: rgba(0,0,0,.35); }
  body.hat-nav:has(#skHaupt, #anwTable, #stammBody) .nav-knopf { display: inline-flex; min-width: var(--tap); padding: 0; font-size: 1.25rem; }
  /* Kopfzeile flacher */
  body.hat-nav:has(#skHaupt, #anwTable, #stammBody) .topbar { --tap: 38px; }
  body.hat-nav:has(#skHaupt, #anwTable, #stammBody) .topbar-inner { min-height: 46px; padding: 4px 12px; gap: 10px; }
  body.hat-nav:has(#skHaupt, #anwTable, #stammBody) .topbar .btn-ghost { padding: 0 12px; }
  .main:has(#skHaupt, #anwTable, #stammBody) { padding: 8px 12px 12px; }
  /* eine schmale Zeile */
  .sk-leiste { --tap: 36px; flex-wrap: wrap; gap: 4px 6px; margin-bottom: 6px; }
  .sk-leiste .btn, .sk-leiste .input, .sk-leiste .subtab { min-height: var(--tap); font-size: .9375rem; }
  .sk-leiste .btn { padding: 0 10px; }
  .sk-leiste .sk-jahrbar { gap: 4px; }
  .sk-leiste .sk-jahr { min-width: 7.5rem; padding: 2px 8px; }
  .sk-leiste .sk-monate { gap: 3px; flex-wrap: nowrap; }
  .sk-leiste .sk-monate .subtab { min-width: 0; padding: 0 7px; }
  .sk-umbruch, .sk-leiste .sk-tagnav { display: none !important; }
  #main > #skReiter { display: flex; } .sk-leiste > .sk-reiter-leiste { display: none !important; } /* Tablet quer: Reiter als eigene schmale Zeile */
  .sk-hilfe { display: none !important; }
  /* Kalender: Standort-Spalte schmäler, Tage bleiben gut antippbar */
  .sk-tab .sk-ort { width: 10rem; min-width: 10rem; max-width: 10rem; padding: 6px 8px; overflow-wrap: anywhere; }
  .sk-tab .sk-adr { font-size: .8125rem; }
  .sk-tab thead th { padding: 3px 4px; }
  /* Agenda flacher */
  .sk-agenda { --tap: 38px; margin-top: 6px; padding: 3px 10px 5px; }
  button.sk-agenda-kopf { margin: 0 0 2px; }
  .sk-agenda.zu button.sk-agenda-kopf { margin: 0; }
  .sk-agenda .sk-steine { padding-bottom: 2px; }
}

/* Anwesenheit am Tablet quer (Nutzer 17.10.2026: „Anwesenheit am Tablet genau so umbauen“): Seitenleiste hinter ☰ (siehe oben),
   Datum · ◀ ▶ · Heute · Suche · ⋯ in einer schmalen Zeile (Monat, Nach Kürzel ordnen, Excel, Drucken unter ⋯), Zähler und Standorte
   je eine flache Zeile, Tabellenkopf flacher; die Häkchen bleiben groß (Arbeitsfläche), die Liste reicht bis unten (anwWrapHoehe). */
@media screen and (min-width: 901px) and (orientation: landscape) and (pointer: coarse) {
  .toolbar.anw-leiste { --tap: 36px; flex-wrap: nowrap; align-items: center; gap: 6px; margin-bottom: 6px; }
  .anw-leiste .datebar, .anw-leiste .datebar-extra { flex-wrap: nowrap; gap: 4px; }
  .anw-leiste .btn, .anw-leiste .input { min-height: var(--tap); font-size: .9375rem; }
  .anw-leiste .btn { padding: 0 10px; }
  .anw-leiste .datebar > .btn { min-width: var(--tap); padding: 0 8px; }
  .anw-leiste .date-label { font-size: 1rem; white-space: nowrap; margin-right: 2px; }
  .anw-leiste .date-input { min-width: 0; width: 9.5rem; padding: 2px 8px; }
  .anw-leiste .anw-extra, .anw-leiste > .spacer { display: none !important; }
  .toolbar.anw-leiste .search { flex: 1 1 10rem; width: auto; min-width: 8rem; max-width: 22rem; margin-left: auto; padding: 2px 10px; }
  .anw-leiste .anw-mehr { display: inline-flex; flex: 0 0 auto; min-width: var(--tap); padding: 0 12px; }
  #counters { flex-wrap: nowrap; overflow-x: auto; gap: 4px; margin: 0 0 6px; scrollbar-width: none; }
  #counters .counter { flex: 0 0 auto; padding: 2px 9px; font-size: .8125rem; line-height: 1.35; }
  .standort-leiste { margin: 0 0 6px; }
  .standort-chips .counter { padding: 2px 9px; font-size: .8125rem; line-height: 1.35; }
  .anw thead th { padding-top: 4px; padding-bottom: 4px; line-height: 1.2; }
  .anw-wrap { min-height: 240px; }
  .notiz-head .btn-save { min-height: 34px; }
}

/* PC und Tablet (ab 901 px) nach der Regel „Arbeitsfläche groß, Leisten klein“ (Nutzer 17.10.2026, Fotos Sicherung-2026-10-15/
   Screenshot/PC_Ansicht*.jpg): alle Seiten volle Breite; Knöpfe und Felder in Leisten 36 px (Eingabefelder, Häkchen, Zeitfelder
   bleiben groß); Anwesenheit: Monat, Kürzel, Excel, Drucken unter ⋯; Stunden: Gesamtauflistung + Fehlende Stunden sichtbar,
   der Rest unter ⋯. Seitenleiste am PC bleibt. */
@media screen and (min-width: 901px) {
  .main { max-width: none; }
  .toolbar:not(.anmeldemail-zeile) { --tap: 36px; }
  .toolbar:not(.anmeldemail-zeile) .btn, .toolbar:not(.anmeldemail-zeile) .input, .toolbar:not(.anmeldemail-zeile) .subtab { min-height: var(--tap); }
  .toolbar:not(.anmeldemail-zeile) .btn { padding: 0 12px; }
  .toolbar:not(.anmeldemail-zeile) .input { padding-top: 2px; padding-bottom: 2px; }
  /* Anwesenheit: eine Zeile – Datum · ◀ ▶ · Heute · Suche · ⋯ */
  .toolbar.anw-leiste { flex-wrap: nowrap; align-items: center; }
  .anw-leiste .anw-extra, .anw-leiste > .spacer { display: none !important; }
  .toolbar.anw-leiste .search { flex: 0 1 22rem; width: auto; min-width: 8rem; margin-left: auto; }
  .anw-leiste .anw-mehr { display: inline-flex; flex: 0 0 auto; min-width: var(--tap); padding: 0 12px; }
  /* Stunden: Person · ◀ Monat Jahr ▶ · Heute · ⋯ … Gesamtauflistung · Fehlende Stunden */
  .std-aktionen .btn:not(#stdGesBtn):not(#stdFehltBtn) { display: none; }
  .std-datebar .std-mehr { display: inline-flex; align-items: center; justify-content: center; min-width: var(--tap); }
  .toolbar > select.person-sel { flex: 0 1 17rem; width: auto; min-width: 9rem; } /* gewinnt gegen .toolbar select.input */
  .std-datebar { flex-wrap: nowrap; gap: 4px; }
  .std-datebar select.monat-sel { width: 8.5rem; min-width: 0; }
  .std-datebar .jahr-input { width: 5.5rem; min-width: 0; }
  .std-aktionen { flex-wrap: nowrap; gap: 6px; }
  .std-aktionen .btn { white-space: nowrap; }
}

/* MA-Kalender ganz sperren (17.10.2026): Häkchen über den Standorten, gesperrt = Standorte ausgegraut */
.ter-sperre-zeile { font-weight: 600; }
.ter-std-haken.aus { opacity: .45; }

/* Anwesenheit (17.10.2026): 2. Kopfzeile klebt unter der 1. (Höhe misst anwWrapHoehe → --anw-kopf1); gilt auf allen Breiten mit Tabelle */
.anw thead tr:nth-child(2) th { top: var(--anw-kopf1, 2.5rem); }
/* Tablet quer: Tabelle passt ohne seitliches Wischen bis zur Notiz (vorher 1402 px bei 1072 px Platz) – Namensspalte schmäler
   (Hinweis „nicht eingeplant“ unter dem Namen), Kopfwörter kleiner, Häkchen bleiben ≥ 44 px, Standort/Notiz schmäler */
@media screen and (min-width: 901px) and (orientation: landscape) and (pointer: coarse) {
  .anw-wrap { --tap: 44px; }
  .anw td.name, .anw th.name { width: clamp(9rem, 18.5vw, 14rem); min-width: clamp(9rem, 18.5vw, 14rem); max-width: clamp(9rem, 18.5vw, 14rem); white-space: normal; overflow-wrap: break-word; }
  .anw td.name .badge { display: inline-block; margin-top: 2px; }
  .anw td.name2, .anw th.name2 { display: none; } /* Vorname steht unter dem Namen (.vn-m wie am Handy) */
  .anw td.name .vn-m { display: inline; font-weight: 400; }
  .anw td.standort select { min-width: 0; }
  .anw th, .anw td { padding-left: 4px; padding-right: 4px; }
  .anw thead th { font-size: .75rem; }
  .anw th.c, .anw td.c { padding-left: 2px; padding-right: 2px; min-width: 0; }
  .anw th.kz, .anw td.kz { width: 50px; min-width: 50px; }
  .anw .kz-inp { width: 44px; }
  .anw thead th.c { font-size: .6875rem; letter-spacing: -.01em; }
  .anw td.standort { min-width: 0; width: clamp(7.5rem, 12vw, 9rem); }
  .anw td.notiz { min-width: 7.5rem; width: auto; }
  .anw th.notiz-head { white-space: normal; min-width: 7.5rem; }
  .anw th.notiz-head .notiz-head-inner { flex-wrap: wrap; gap: 4px; }
  .anw th.notiz-head .save-info { font-size: .6875rem; }
}

/* Gesamtliste (Nutzer 17.10.2026): „Kontakt“ + Kästchen KJ / KT („wer soll anrufen“, schließen sich aus; Häkchen „Kontakt“ leert sie) */
table.gl td.gl-wer, table.gl th.gl-wer-kopf { text-align: center; width: 3.25rem; min-width: 3.25rem; }
table.gl thead th { vertical-align: middle; } /* Kopf einheitlich mittig (vorher standen „Notiz“/„KT“ oben) */
table.gl td.gl-wer .gl-haken { justify-content: center; min-height: var(--tap); }
.gl-wer-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.gl-wer-haken { width: 22px; height: 22px; accent-color: var(--primary); }
@media screen and (max-width: 700px) {
  /* Karte: Name | Tage · Adresse · Notiz · [Kontakt …… KJ ☐ KT ☐] */
  table.gl tr { grid-template-columns: minmax(0, 1fr) auto auto auto; }
  table.gl th.gl-name { grid-column: 1 / 4; }
  table.gl td.gl-tage { grid-column: 4; }
  table.gl td.gl-notiz-td { grid-column: 1 / -1; }
  table.gl td.gl-kontakt { grid-column: 1 / 3; text-align: left; display: flex; flex-wrap: wrap; align-items: center; gap: 0 10px; }
  table.gl td.gl-wer { grid-column: auto; width: auto; min-width: 0; }
  table.gl td.gl-wer::before { content: none; display: none; }
  table.gl td.gl-wer .gl-haken { gap: 6px; padding: 0 4px; }
  table.gl td.gl-wer .gl-wer-text { position: static; width: auto; height: auto; overflow: visible; clip: auto; font-size: .875rem; font-weight: 700; }
}

/* Listen-Seiten ab 701 px (Nutzer 17.10.2026: „Ansichtleiste einfrieren“): listenEinpassen() gibt der Liste die Höhe bis zum unteren
   Rand → nur die Liste rollt, Such-/Filterleiste bleibt oben, Spalten-Kopfzeile klebt (table.data thead th ist sticky) */
@media screen and (min-width: 701px) {
  .liste-fest { overflow: auto; } /* kein overscroll contain – am Rand darf die Seite weiterrollen (Lehre aus SK quer) */
  .liste-fest table.data thead tr:nth-child(2) th { top: var(--liste-kopf1, 2.5rem); }
}
@media print { .liste-fest { max-height: none !important; overflow: visible !important; } }

/* Standortkalender (Nutzer 17.10.2026, Foto Standortkalender_verdeckt.jpg → „nicht mehr festkleben“): „Personal eingeteilt“ ist eine
   normale letzte Zeile – klebt nicht mehr unten und verdeckt keine Zeile; die Spalte „Standort“ bleibt beim seitlichen Schieben links */
.sk-tab tfoot td, .sk-tab tfoot th, .sk-tab tfoot tr:first-child > * { position: static; bottom: auto; }
.sk-tab tfoot tr > th.sk-ort { position: sticky; left: 0; bottom: auto; z-index: 2; } /* stärker als die Zeile darüber (tr:first-child > *) */

/* Dienstvertrag Etappe 4 (18.10.2026, nur Admin): 📄 = eingeteilt ohne unterschriebenen Dienstvertrag */
.anw .vt-warn { background: var(--amber-light); color: var(--warning-text); border: 1px solid var(--warning-line); font-weight: 600; margin-left: 4px; }
.anw .vt-warn { cursor: help; }
@media (min-width: 701px) { .anw .vt-warn-text { display: none; } .anw .vt-warn { padding: 0 4px; } }
.dp-vt { margin-right: 4px; cursor: help; }
.dp-tab td.dp-feld.vt-fehlt { box-shadow: inset 0 -3px 0 var(--warning-line); }
.dp-tab .dp-vt-text { color: var(--warning-text); padding: 0 0 2px; font-weight: 600; }

/* Verwaltung → Vertragsvorlage: Ablage KV-Kategorien / Verwendungen (18.10.2026) – Zeilen mit × am Ende, am Handy untereinander */
.vv-zeilen { display: grid; gap: 6px; margin-bottom: 8px; }
.vv-zeile { display: grid; gap: 0 10px; align-items: end; padding: 6px 0; border-bottom: 1px solid var(--divider); }
.vv-kv { grid-template-columns: minmax(0, 1fr) 11rem 44px; }
.vv-vw { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.4fr) 44px; }
.vv-zeile .field { margin-bottom: 0; }
.vv-weg { min-width: 44px; min-height: 44px; padding: 0; font-size: 1.2rem; margin-bottom: 2px; }
.vv-vw-aufg { min-height: 44px; }
@media (max-width: 700px) {
  .vv-kv, .vv-vw { grid-template-columns: minmax(0, 1fr) 44px; }
  .vv-zeile .field { grid-column: 1; }
  .vv-weg { grid-column: 2; grid-row: 1; align-self: start; margin-top: 22px; }
}

/* Google Authenticator (2FA, 20.10.2026): QR-Code, Schlüssel zum Eintippen */
.zf-einrichten { margin: 4px 0 8px; }
.zf-schritte { margin: 0 0 8px; padding-left: 1.3em; font-size: .9rem; }
.zf-schritte li { margin: 2px 0; }
.zf-qr { display: block; width: 216px; max-width: 100%; height: auto; margin: 6px auto 10px; border-radius: 6px; image-rendering: pixelated; }
.zf-manuell > summary { cursor: pointer; min-height: 44px; display: flex; align-items: center; font-weight: 600; }
.zf-geheim { display: block; font: 700 1.05rem/1.5 ui-monospace, Consolas, monospace; letter-spacing: .05em; word-break: break-all; background: var(--head); padding: 8px 10px; border-radius: 6px; margin: 4px 0 8px; }
.zf-stand .badge { white-space: nowrap; }

/* Benutzertabelle (Verwaltung → Benutzer, 20.10.2026): passt am Tablet quer (1024 px) ohne seitliches Wischen –
   E-Mail unter dem Namen, Kopf darf umbrechen, Anmeldung bricht zwischen Datum und Uhrzeit, Knöpfe bis 1280 px nur ✎/🗑 (44 px) */
.benutzer-mail { color: var(--muted); font-size: .875rem; overflow-wrap: normal; word-break: normal; }
@media screen and (min-width: 701px) {
  table.data.benutzer-tab thead th { white-space: normal; }
  table.data.benutzer-tab td { overflow-wrap: normal; }
  table.data.benutzer-tab .badge.benutzer-ohne-person { border-radius: 8px; display: inline-block; max-width: 17rem; }
  table.data.benutzer-tab .benutzer-knoepfe { width: 1%; }
}
@media screen and (min-width: 701px) and (max-width: 1280px) {
  table.data.benutzer-tab th, table.data.benutzer-tab td { padding: 6px 8px; }
  table.data.benutzer-tab .benutzer-knoepfe .btn { min-width: var(--tap); padding: 0 10px; }
  table.data.benutzer-tab .bt-txt { display: none; }
  table.data.benutzer-tab .besp-person { white-space: normal; }
}

/* DV im Dienstplan (Häkchen „DV“, Nutzer 21.10.2026, Admin + Manager): je Dienstverhältnis ein Balken oben im Feld über den Zeitraum von–bis,
   Farbe je Art (Verwaltung → Vorlage DV), gestreift = noch nicht unterschrieben; eingeteilt ohne DV = rot umrandet */
.dp-dv-haken { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; user-select: none; }
.dp-dv-haken input { width: 18px; height: 18px; margin: 0; accent-color: var(--primary); cursor: pointer; }
.dp-dv-haken:has(input:checked) { background: var(--primary-soft); border-color: var(--primary); font-weight: 700; }
.dp-tab.mit-dv .dp-feld { position: relative; height: 68px; padding-top: 18px; }
.dp-wrap.monat .dp-tab.mit-dv .dp-feld { height: 58px; padding-top: 16px; }
.dp-dv { position: absolute; top: 2px; left: 0; right: 0; height: 13px; background: var(--p); color: var(--on-p, #fff); font-size: .6875rem; font-weight: 700; line-height: 13px;
  padding: 0 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dp-dv.start { left: 3px; border-top-left-radius: 7px; border-bottom-left-radius: 7px; }
.dp-dv.ende { right: 3px; border-top-right-radius: 7px; border-bottom-right-radius: 7px; }
.dp-dv.offen { background: repeating-linear-gradient(135deg, var(--p-bg) 0 5px, var(--p-line) 5px 8px); color: var(--p); box-shadow: inset 0 0 0 1px var(--p);
  text-shadow: 0 0 3px var(--p-bg), 0 0 3px var(--p-bg); }
.dp-wrap.monat .dp-dv { padding: 0 2px; }
.dp-tab td.dp-feld.dv-fehlt { box-shadow: inset 0 0 0 2px var(--danger); }
.dp-tab .dp-dv-fehlt-text { color: var(--danger); }
.zl-dv { top: 0; height: 11px; line-height: 11px; font-size: .625rem; z-index: 1; pointer-events: none; }
.zl-spur.dv-fehlt { box-shadow: inset 0 0 0 2px var(--danger); }
.zl-dv-fehlt { position: absolute; left: 6px; font-weight: 700; color: var(--danger); }
.dp-muster.dv { background: var(--p); border-color: var(--p); }
.dp-muster.dv.offen { background: repeating-linear-gradient(135deg, var(--p-bg) 0 4px, var(--p-line) 4px 6px); border-color: var(--p); }
.dp-muster.dv-fehlt { box-shadow: inset 0 0 0 2px var(--danger); }
/* Verwaltung → Vorlage DV: Farbe je Art */
.vv-artfarben { display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: 6px 12px; }
.vv-artfarbe { display: flex; align-items: center; gap: 8px; min-width: 0; }
.vv-artfarbe-name { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vv-artfarbe select { flex: 0 0 8.5rem; width: 8.5rem; min-height: 44px; }
/* Handy (21.10.2026): DV, ⚡ und ⎙ stecken im „⋯“ – die Leiste bleibt zwei Zeilen, der Zeitraum hat Platz */
.dp-mehr { display: none; }
@media (max-width: 700px) {
  .dp-leiste .dp-dv-haken, .dp-leiste .dp-schnell, .dp-leiste .dp-ausgabe-knopf { display: none; }
  .dp-leiste .dp-mehr { display: inline-flex; min-width: var(--tap); padding: 0 12px; font-weight: 700; }
  .dp-mehr[aria-pressed="true"] { background: var(--primary-soft); border-color: var(--primary); color: var(--primary); }
}
/* STK (21.10.2026): Stundenliste im Standortkalender – Leiste wie im Dienstplan, Tabelle wie in der Stundenaufzeichnung + Spalte Urlaub/EF/FT/ZA */
#main.sk-stk-an > :not(#skStk):not(h1) { display: none !important; }
#main:not(.sk-stk-an) > #skStk { display: none; }
.stk-leiste .stk-person { width: auto; min-width: 0; max-width: 16rem; min-height: 36px; padding-top: 0; padding-bottom: 0; }
.stk-leiste .stk-zeitraum { min-width: 7.5rem; text-align: center; }
.stk-art-zelle { display: flex; gap: 4px; align-items: center; }
.stk-art-sel { flex: 1 1 6.5rem; min-width: 5.5rem; min-height: 40px; }
.stk-art-std { flex: 0 0 3.75rem; width: 3.75rem; min-height: 40px; text-align: right; font-variant-numeric: tabular-nums; }
table.stk-tab td.stk-art { min-width: 10.5rem; }
table.stk-tab td.std-notiz { min-width: 140px; width: auto; }
.stk-ungleich { margin-left: 4px; padding: 0 5px; background: var(--amber-light); color: var(--ink); font-weight: 700; }
.stk-fuss { display: flex; flex-wrap: wrap; gap: 4px 16px; align-items: baseline; margin-top: 6px; }
.stk-summen { font-variant-numeric: tabular-nums; }
.stk-art-knopf { min-height: var(--tap); min-width: 3rem; padding: 2px 6px; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; line-height: 1.1; }
.stk-art-knopf.hat { background: var(--primary-soft); border-color: var(--primary); color: var(--primary); }
.stk-ueb-knoepfe { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.stk-ueb-info p { margin: 6px 0; }
@media (pointer: coarse) { .stk-art-sel, .stk-art-std { min-height: var(--tap); } }
/* Tabelle schmal genug fürs Tablet quer: Zeitfelder fest schmal, Pausen in einer Spalte, Arbeitsflächen 44 px */
table.stk-tab th, table.stk-tab td { padding: 6px 6px; }
table.stk-tab .zeit-inp, table.stk-tab .pause-inp { width: 6.5rem; flex: 0 0 auto; min-width: 0; min-height: 44px; }
.stk-art-sel, .stk-art-std { min-height: 44px; }
table.stk-tab td.stk-pausen { min-width: 0; white-space: nowrap; }
table.stk-tab td.std-zeit { min-width: 0; width: 1%; }
table.stk-tab th.std-tag { min-width: 4.5rem; white-space: normal; }
table.stk-tab .feiertag-badge { display: inline-block; max-width: 5.5rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: middle; }
table.stk-tab td.std-notiz input { min-height: 44px; }
.stk-pause-reihe + .stk-pause-reihe { margin-top: 4px; }
.stk-pause-zwei { min-height: 44px; padding: 0 8px; margin-left: 3px; }
table.stk-tab tr.std-woche td.c, table.stk-tab tfoot td.c { white-space: nowrap; font-variant-numeric: tabular-nums; }
.stk-text-kurz { display: none; }
@media (min-width: 1281px) and (max-width: 1700px) { .stk-leiste .stk-text { display: none; } .stk-leiste .stk-text-kurz { display: inline; } }
@media (pointer: coarse) { table.stk-tab .zeit-inp, table.stk-tab .pause-inp { width: 4.75rem; } }
/* Tablet quer (bis 1280 px): Leiste eine Zeile – Heute und ⎙ unter „⋯“, Übernehmen nur ⇩ */
@media (max-width: 1280px) {
  .stk-leiste .stk-heute, .stk-leiste .stk-ausgabe, .stk-leiste .stk-text { display: none; }
  .stk-leiste .dp-mehr { display: inline-flex; min-width: var(--tap); padding: 0 12px; font-weight: 700; }
  .stk-leiste .stk-person { max-width: 11rem; }
  table.stk-tab th, table.stk-tab td { padding: 4px 5px; }
  table.stk-tab th.std-tag { min-width: 5rem; }
  table.stk-tab td.std-notiz { min-width: 110px; }
}
@media (max-width: 700px) {
  .stk-leiste .stk-heute, .stk-leiste .stk-uebernehmen { display: none; }
  .stk-leiste .stk-person { flex: 1 1 6rem; max-width: none; }
  table.stk-tab .stk-arbeit { display: none; }
  table.stk-tab td.stk-art { min-width: 0; }
  table.stk-tab .zeit-inp { width: 100%; }
  .stk-pause-knopf span { font-size: .8rem; }
  table.stk-tab .feiertag-badge { max-width: 3.4rem; margin-left: 0; }
  table.stk-tab tr.std-woche td.c, table.stk-tab tfoot td.c { font-size: .85rem; }
  .stk-legende { display: none; }
}
@media print {
  .stk-druck tbody td { height: auto !important; }
  .stk-druck tr.we td { background: #f7f9f7; }
  .stk-druck tr.stk-d-summe td { background: #eef1ef; }
}
/* Dienstplan-Leiste bleibt am Tablet/Handy wie bisher (21.10.2026): STK dort über den Kalender-Reiter bzw. „⋯“ */
@media (max-width: 1280px) { .dp-leiste:not(.stk-leiste) .dp-reiter-stk { display: none; } }

/* LV – Lohnverrechnung (23.10.2026): Seite LV (Werk-/Kalendertage, Monatsstunden) und Verwaltung → Vorlage LV */
.grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 12px; }
.lv-leiste .lv-jahr { min-width: 6.5rem; }
.lv-leiste .subtabs { margin-bottom: 0; }
.lv-zahlen { display: flex; flex-wrap: wrap; gap: 10px; margin: 4px 0 12px; }
.lv-zahl { border: 1px solid var(--linie); border-radius: var(--radius); background: var(--surface); padding: 6px 14px; min-width: 9rem; }
.lv-zahl b { display: block; font-size: 1.5rem; line-height: 1.2; font-variant-numeric: tabular-nums; }
.lv-zahl span { color: var(--text-muted); font-size: .85rem; }
table.lv-tab thead th { white-space: normal; vertical-align: bottom; }
table.lv-tab .r { text-align: right; font-variant-numeric: tabular-nums; }
table.lv-tab td.r { white-space: nowrap; }
table.lv-tab .lv-kurz, table.lv-tab .lv-ft-klein { display: none; }
table.lv-tab tr.lv-jetzt td { background: var(--primary-soft); }
table.lv-tab tfoot td { font-weight: 700; border-top: 2px solid var(--linie-stark); }
table.lv-tab td.lv-ft { font-size: .875rem; }
table.lv-tab td.lv-wahl { font-weight: 700; background: var(--primary-soft); }
table.lv-tab tr.lv-voll td { font-weight: 600; }
.lv-eingabe { display: grid; grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); gap: 0 12px; }
.lv-gf { padding: 8px 12px; margin: 4px 0 10px; border-radius: var(--radius); background: var(--info-soft); border: 1px solid var(--info-line); }
.lv-gf.lv-ueber { background: var(--danger-soft); border-color: var(--danger-line); }
/* Vorlage LV: Lohntafel- und Sachbezug-Zeilen mit × am Ende; am Handy zweizeilig mit kleinen Beschriftungen */
.lv-zeilen { display: grid; gap: 2px; margin-bottom: 8px; }
.lv-tz, .lv-sb { display: grid; gap: 0 8px; align-items: center; padding: 4px 0; border-bottom: 1px solid var(--divider); }
.lv-tz { grid-template-columns: 4.5rem minmax(0, 1fr) 8rem 8rem 8rem 44px; }
.lv-sb { grid-template-columns: minmax(0, 1fr) 9rem 9rem 44px; }
.lv-tz-kopf { font-size: .8rem; font-weight: 700; color: var(--text-muted); padding: 2px 0; }
.lv-tz-kopf .r { text-align: right; }
.lv-tz label, .lv-sb label { display: block; margin: 0; min-width: 0; }
.lv-tz .input, .lv-sb .input { width: 100%; min-height: 44px; }
.lv-tz .lv-gew, .lv-tz .lv-fach, .lv-tz .lv-meister, .lv-sb .lv-sb-betrag { text-align: right; font-variant-numeric: tabular-nums; }
.lv-kl { display: none; }
.lv-tz .vv-weg, .lv-sb .vv-weg { margin: 0; }
.lv-tafel-leiste .lv-ab { display: inline-flex; align-items: center; gap: 6px; margin: 0; font-weight: 600; white-space: nowrap; }
.lv-tafel-leiste .lv-ab .input { width: auto; min-height: 44px; }
@media (max-width: 700px) {
  .grid-3 { grid-template-columns: minmax(0, 1fr); }
  .lv-tz-kopf { display: none; }
  .lv-kl { display: block; font-size: .75rem; color: var(--text-muted); }
  .lv-tz { grid-template-columns: repeat(3, minmax(0, 1fr)) 44px; grid-template-areas: "nr bez bez weg" "gew fach meister ."; row-gap: 4px; }
  .lv-z-nr { grid-area: nr; } .lv-z-bez { grid-area: bez; } .lv-z-gew { grid-area: gew; } .lv-z-fach { grid-area: fach; } .lv-z-meister { grid-area: meister; }
  .lv-tz .vv-weg { grid-area: weg; align-self: end; }
  .lv-sb { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 44px; grid-template-areas: "name name weg" "betrag je ."; row-gap: 4px; }
  .lv-z-name { grid-area: name; } .lv-z-betrag { grid-area: betrag; } .lv-z-je { grid-area: je; }
  .lv-sb .vv-weg { grid-area: weg; align-self: end; }
  table.lv-tab#lvMsTab td.lv-ms-w { font-weight: 700; }
  .lv-zahl { flex: 1 1 6rem; min-width: 0; padding: 6px 10px; }
  .lv-zahl span { font-size: .75rem; }
  table.lv-tab .lv-lang, table.lv-tab .lv-ft { display: none; }
  table.lv-tab .lv-kurz { display: inline; }
  table.lv-tab .lv-ft-klein { display: block; font-size: .75rem; color: var(--text-muted); }
}
/* LV Etappe 2 (23.10.2026): Abrechnung – am PC Eingabe links, Vorschau rechts (klebt); Tablet/Handy untereinander */
.lv-abr { display: grid; gap: 0 16px; }
@media (min-width: 1281px) {
  .lv-abr { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); align-items: start; }
  .lv-vorschau { position: sticky; top: 8px; }
}
.lv-eingabe-2 { grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); }
.lv-ag { margin: -4px 0 8px; }
.lv-satzinfo { font-weight: 600; margin: 4px 0 8px; }
.lv-zahlen-klein .lv-zahl { min-width: 7.5rem; padding: 4px 10px; }
.lv-zahlen-klein .lv-zahl b { font-size: 1.15rem; }
.lv-sach { display: grid; gap: 4px; }
.lv-sach-zeile { display: grid; grid-template-columns: minmax(0, 1fr) 7rem; gap: 8px; align-items: center; }
.lv-sach-zeile .check-line { min-height: 44px; margin: 0; }
.lv-sach-anz { text-align: right; }
.toolbar.lv-abr-knoepfe { --tap: 44px; } /* „Berechnen“ ist Arbeitsfläche, keine Leiste */
.lv-abr-knoepfe .btn { min-height: 44px; }
.lv-vs-kopf { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: 8px 16px; margin-bottom: 10px; font-size: .9rem; }
.lv-vs-kopf div { display: flex; flex-direction: column; }
.lv-vs-kopf span { color: var(--text-muted); }
table.lv-vs-tab td.lv-text { overflow-wrap: anywhere; }
table.lv-vs-tab tr.lv-summe td { font-weight: 700; border-top: 2px solid var(--linie-stark); }
table.lv-vs-tab .lv-menge-klein { display: none; }
table.lv-vs-tab td.lv-betrag { font-weight: 600; }
.lv-brutto { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 10px 12px; margin: 10px 0; border-radius: var(--radius);
  background: var(--primary-soft); border: 1px solid var(--primary-line); font-size: 1.05rem; }
.lv-brutto b { font-size: 1.3rem; font-variant-numeric: tabular-nums; }
@media (max-width: 700px) {
  table.lv-vs-tab#lvVsBezuege th, table.lv-vs-tab#lvVsBezuege td { padding: 4px 5px; font-size: .875rem; }
  table.lv-vs-tab#lvVsBezuege .lv-menge { display: none; }
  table.lv-vs-tab#lvVsBezuege .lv-menge-klein { display: block; font-size: .75rem; color: var(--text-muted); }
  table.lv-vs-tab#lvVsBezuege tr.lv-summe td[colspan] { white-space: normal; }
  .lv-sach-zeile { grid-template-columns: minmax(0, 1fr) 5rem; }
}
/* LV Etappe 3 (23.10.2026): Netto, Dienstgeberanteile, Vorlage SV/Lohnsteuer */
.lv-netto { margin-top: 6px; }
.lv-netto-box { background: var(--primary-soft); }
table.lv-vs-tab tr.lv-zw td { font-weight: 600; border-top: 1px solid var(--linie-stark); }
table.lv-vs-tab td.lv-info { color: var(--text-muted); font-size: .85rem; }
.lv-dg > summary { cursor: pointer; min-height: 44px; display: flex; align-items: center; font-weight: 600; }
#lvvSvKarte h3 { font-size: 1rem; margin: 12px 0 4px; }
.lv-stufen { display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: 6px 16px; margin-bottom: 8px; }
.lv-stufe { display: grid; grid-template-columns: minmax(0, 1fr) 6rem; gap: 8px; }
.lv-stufe label { margin: 0; min-width: 0; }
.lv-stufe .input { width: 100%; min-height: 44px; text-align: right; }
@media (max-width: 700px) { .lv-stufe .lv-kl { display: block; } }
/* LV Etappe 4 (23.10.2026): Speichern/PDF/Drucken in der Vorschau, Historie, veraltete Vorschau */
.toolbar.lv-vs-knoepfe { --tap: 44px; margin: 4px 0 10px; }
.lv-vs-knoepfe .btn { min-height: 44px; }
.lv-vorschau.lv-veraltet table, .lv-vorschau.lv-veraltet .lv-brutto { opacity: .55; }
.lv-vs-dialog .lv-vs-knoepfe { margin-top: 0; }
.lv-hi-leiste h2 { margin: 0 8px 0 0; }
.lv-hi-leiste .check-line { margin: 0; min-height: 36px; }
table.lv-hi-tab td { vertical-align: middle; }
table.lv-hi-tab .lv-hi-name b { font-weight: 600; }
table.lv-hi-tab .lv-hi-fassung span { display: block; }
table.lv-hi-tab .lv-hi-warn { color: var(--danger); font-weight: 700; cursor: help; }
table.lv-hi-tab tr.lv-alt td { color: var(--text-muted); background: var(--surface); }
.lv-hi-knoepfe { white-space: nowrap; text-align: right; }
.lv-hi-knoepfe .btn { min-height: 44px; min-width: 44px; padding: 0 10px; margin-left: 4px; }
@media (max-width: 700px) {
  .lv-hi-knoepfe { text-align: left; white-space: normal; }
  .lv-hi-knoepfe .btn { margin: 4px 4px 0 0; }
  .lv-vs-knoepfe .btn { flex: 1 1 auto; }
}
table.lv-hi-tab td:first-child { white-space: nowrap; }
@media (max-width: 1280px) { .lv-hi-knoepfe .btn { padding: 0 8px; margin-left: 2px; } table.lv-hi-tab th, table.lv-hi-tab td { padding-left: 6px; padding-right: 6px; } }
/* STK löschen (23.10.2026): Häkchen in der Tag-Spalte, Knopf 🗑 mit Zahl der angehakten Tage, Fenster mit Wer/Was */
.stk-haken-l { display: inline-flex; align-items: center; justify-content: center; margin: -6px 0 -6px -6px; cursor: pointer; vertical-align: middle; }
/* Arbeitsfläche 44 px (Bau-Regel), sichtbar ein 20-px-Kästchen in der Mitte (Rand 12 px durchsichtig) */
.stk-haken-l input.stk-haken { -webkit-appearance: none; appearance: none; width: 44px; height: 44px; margin: 0; cursor: pointer; border: 12px solid transparent; border-radius: 15px;
  background: var(--surface); background-clip: padding-box; box-shadow: inset 0 0 0 2px var(--linie-stark); }
.stk-haken-l input.stk-haken:checked { background-color: var(--primary); box-shadow: inset 0 0 0 2px var(--primary);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M4.5 10.5l3.5 3.5 7.5-8' fill='none' stroke='white' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: center; background-size: 16px 16px; }
/* Dunkelmodus: dunkles Häkchen auf hellgrünem Grund (weiß hatte nur 2:1 – Prüfung 24.10.2026) */
@media screen and (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .stk-haken-l input.stk-haken:checked { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M4.5 10.5l3.5 3.5 7.5-8' fill='none' stroke='%230b2616' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); } }
:root[data-theme="dark"] .stk-haken-l input.stk-haken:checked { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M4.5 10.5l3.5 3.5 7.5-8' fill='none' stroke='%230b2616' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.stk-haken-l input.stk-haken:focus-visible { outline: 2px solid var(--focus); outline-offset: -10px; }
.stk-leiste .stk-loeschen-knopf { flex: 0 0 auto; }
.stk-l-zahl { display: inline-block; min-width: 1.4em; margin-left: 4px; padding: 0 5px; border-radius: 999px; background: var(--danger); color: var(--on-danger); font-size: .8rem; font-weight: 700; line-height: 1.4; }
.stk-l-zahl[hidden] { display: none; }
.stk-loeschen .stk-l-gruppe { border: 1px solid var(--linie); border-radius: var(--radius); padding: 4px 12px 8px; margin: 0 0 10px; }
.stk-loeschen legend { font-weight: 700; padding: 0 4px; }
.stk-loeschen .stk-l-wahl { min-height: 44px; margin: 0; }
@media (max-width: 700px) { .stk-leiste .stk-loeschen-knopf { display: none; } }
/* PC 1281–1700: Platz für 🗑 in derselben Zeile */
@media (min-width: 1281px) and (max-width: 1700px) { .stk-leiste .stk-person { max-width: 13rem; } }
/* LV: gesperrte Felder (Daten aus DV, STK, Anwesenheit, Vorlage – 23.10.2026) – grau hinterlegt, Herkunft klein darunter */
.lv-abr .input.lv-gesperrt, .lv-abr select.input:disabled, .lv-karte .input.lv-gesperrt, .lv-karte select.input:disabled { background: var(--hover); color: var(--text); border-style: dashed; cursor: not-allowed; opacity: 1; }
.lv-abr .lv-gesperrt:focus { box-shadow: none; }
.lv-abr .lv-gesperrt:focus-visible { outline: 2px dashed var(--focus); outline-offset: 2px; }
.lv-abr .field .hint, .lv-abr .lv-aus, .lv-karte .field .hint { font-size: .78rem; color: var(--text-muted); }
/* STK: Spalten „DV“ und „Zu“ (23.10.2026), Tag- und Pausenspalte schmäler, damit der Rahmen wieder passt */
table.stk-tab th.std-tag { min-width: 0; }
table.stk-tab th.std-tag .std-wt { font-size: .75rem; }
table.stk-tab th.std-tag .feiertag-badge { max-width: 4.2rem; }
table.stk-tab .pause-inp { width: 5.75rem; }
table.stk-tab .stk-dv-sp { width: 1%; white-space: nowrap; padding-left: 4px; padding-right: 4px; }
.stk-dv { display: inline-block; padding: 2px 6px; border-radius: 6px; font-size: .78rem; line-height: 1.3; background: var(--p-bg); border-left: 4px solid var(--p); color: var(--text); white-space: nowrap; }
.stk-dv.offen { background: repeating-linear-gradient(135deg, var(--p-bg) 0 4px, var(--p-line) 4px 6px); }
.stk-kein-dv { display: inline-block; font-size: .75rem; font-weight: 700; color: var(--danger); white-space: nowrap; }
table.stk-tab .stk-zu-sp { width: 1%; padding-left: 3px; padding-right: 3px; }
.stk-zu-knopf { min-width: 44px; min-height: 44px; padding: 0 6px; font-size: .85rem; font-weight: 600; }
.stk-zu-knopf.an { background: var(--warning-soft); border-color: var(--warning-line); color: var(--warning-text); }
.stk-dv span { display: none; } /* nur „DV 1“ – Art und Zeitraum im Tooltip (Platz) */
@media (min-width: 1701px) { .stk-dv span { display: inline; } }
@media (min-width: 1281px) and (max-width: 1700px) {
  table.stk-tab .zeit-inp { width: 6rem; }
  table.stk-tab .pause-inp { width: 5.6rem; }
  table.stk-tab td.std-notiz { min-width: 7rem; }
}
@media (max-width: 1280px) {
  table.stk-tab .pause-inp { width: 4.6rem; }
  table.stk-tab .stk-art-sel { max-width: 4.6rem; }
  table.stk-tab td.std-notiz { min-width: 90px; }
}
@media (pointer: coarse) { table.stk-tab .pause-inp { width: 4.6rem; } }
@media (max-width: 700px) { table.stk-tab .stk-dv-sp, table.stk-tab .stk-zu-sp { display: none; } }
.lv-ms-lohn { margin-top: 4px; }
/* Vorlage DV: Wochenstunden-Zeilen (23.10.2026) */
.vv-ws { grid-template-columns: 9rem minmax(0, 1fr) 44px; }
@media (max-width: 700px) { .vv-ws { grid-template-columns: minmax(0, 1fr) 44px; } }
/* LV Rechner (manuell, 23.10.2026): gesperrte Vorlage-Werte mit 🔓 */
.lv-sperr-zeile { display: flex; gap: 6px; align-items: stretch; }
.lv-sperr-zeile .input { flex: 1 1 auto; min-width: 0; }
.lv-entsperren { min-width: 44px; min-height: 44px; padding: 0; font-size: 1.05rem; }

/* ==========================================================================
   Formatprüfung 25.10.2026 (Nutzer: „A, F, E, B umsetzen“, D: 44 px auch am PC mit Maus) – Bericht Pruefung/FORMATPRUEFUNG-INTERN-2026-10-25.md
   A  Tabellen ohne seitliches Wischen (Stunden, Anwesenheit, Dienstplan, DV)
   B  Tablet-Schrift wie Auslieferung/Lagerstand: Tabellenkopf 16 px, Text 18 px, Zahlen 20 px mittig, Zähler als Kästchen 16/24 px – nie kleiner
   D  Arbeitsflächen (Felder, Häkchen, Knöpfe in Tabellen) auch am PC mindestens 44 px – Leisten bleiben 36 px
   E  Eingabefelder mindestens 16 px (iPhone/iPad vergrößern sonst beim Antippen)
   F  nichts abschneiden (Feiertag, Abwesend, Standort im Dienstplan, Jahresfeld am Handy)
   Steht bewusst am Ende: gewinnt gegen die älteren, kleineren Werte weiter oben. Nur am Bildschirm, der Druck bleibt unverändert.
   ========================================================================== */
@media screen {
  /* E: Felder nie unter 16 px */
  input:not([type=checkbox]):not([type=radio]):not([type=range]), select, textarea { font-size: max(1rem, 16px) !important; }

  /* F: Feiertag/Abwesend umbrechen statt „…“ */
  .feiertag-badge, table.stk-tab .feiertag-badge, table.stk-tab th.std-tag .feiertag-badge, .std-grund, table.std .badge {
    max-width: none !important; white-space: normal !important; overflow: visible !important; text-overflow: clip !important; overflow-wrap: anywhere; hyphens: auto; }
  /* F: Jahresfeld ohne Pfeilknöpfe (sonst überdecken sie die Zahl), Zahl mittig */
  .jahr-input { -moz-appearance: textfield; appearance: textfield; text-align: center; }
  .jahr-input::-webkit-inner-spin-button, .jahr-input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
  /* F + B: Dienstplan-Kästchen umbrechen statt „…“, Feld wächst mit */
  .dp-ein { white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; }
  .dp-wrap:not(.monat) .dp-feld { height: auto; min-height: 52px; }
}

/* D: Arbeitsflächen am PC (Maus) wie am Tablet mindestens 44 px; Leisten (.toolbar, Reiter) bleiben 36 px */
@media screen and (min-width: 701px) {
  .zeit-inp, .pause-inp, td.std-notiz input, .anw td.notiz input, .anw td.standort select, .anw-chip, .besp-fchip, .besp-status-sel,
  table.std td .btn-mini, .zeit-jetzt { min-height: var(--tap, 44px); }
  table.std td .btn-mini { min-width: 44px; }
  .anw .kz-inp { min-height: 44px; width: 52px; }
  .zieh-griff { min-width: 30px; min-height: 44px; vertical-align: middle; } /* 44 px hoch, schmal – passt neben den Namen */
}

/* B: Tablet-Schrift ab 601 px */
@media screen and (min-width: 601px) {
  table.data thead th, .anw thead th, .anw thead th.c, table.std thead th, .dp-tab thead th, table.lv-tab thead th { font-size: 1rem; letter-spacing: normal; }
  table.data tbody td, table.data tbody th, table.data tfoot td, table.data tfoot th { font-size: 1.125rem; }
  /* Zahlen: 20 px, fett, genau mittig */
  table.data td.r, table.data th.r, table.data td.c.std-gesamt, table.std tr.std-woche td.c, table.std tfoot td.c, table.data tfoot td.r,
  .dp-tab .dp-sum, .zl-sum, table.mon .mon-summe, table.lv-tab .r, table.gl .r, table.std-db .r, table.std-ges-tab .r {
    font-size: 1.25rem; font-weight: 700; text-align: center !important; font-variant-numeric: tabular-nums; }
  /* Zähler der Anwesenheit: Beschriftung 16 px, Zahl 24 px fett – nebeneinander in einer flachen Zeile, damit die Liste (Arbeitsfläche)
     am Tablet mit 600 px Höhe Platz behält; Rahmen je Wert */
  #counters .counter { display: inline-flex; align-items: baseline; gap: 6px; border: 1px solid var(--linie-stark); border-radius: 8px;
    padding: 2px 10px; font-size: 1rem; font-weight: 600; color: var(--text-muted); line-height: 1.3; white-space: nowrap; }
  #counters .counter b { font-size: 1.5rem; color: var(--text); line-height: 1.2; }
  .standort-chips .counter { font-size: 1rem; }
  /* Dienstplan: Namen 18 px, Einträge 16 px */
  .dp-tab th.dp-wer { font-size: 1.125rem; }
  .dp-ein { font-size: 1rem; line-height: 1.3; }
  .dp-verf, .dp-ohne, .dp-grund { font-size: .875rem; }
}

/* A: Stunden und DV am Tablet quer wie Standortkalender/Anwesenheit – Seitenleiste hinter ☰, die Tabelle bekommt die ganze Breite */
@media screen and (min-width: 901px) and (orientation: landscape) and (pointer: coarse) {
  body.hat-nav:has(#stdTable, table.vt-tab, table.lv-tab) { grid-template-columns: minmax(0, 1fr); }
  body.hat-nav:has(#stdTable, table.vt-tab, table.lv-tab) > .main, body.hat-nav:has(#stdTable, table.vt-tab, table.lv-tab) > .banner { grid-column: 1; }
  body.hat-nav:has(#stdTable, table.vt-tab, table.lv-tab) > .nav { display: none; }
  body.hat-nav.nav-offen:has(#stdTable, table.vt-tab, table.lv-tab) > .nav { display: flex; position: fixed; top: 0; left: 0; z-index: 60; width: clamp(220px, 14rem, 340px);
    height: 100vh; height: 100dvh; padding-top: calc(16px + env(safe-area-inset-top, 0px)); box-shadow: 6px 0 24px rgba(0,0,0,.3); }
  body.hat-nav.nav-offen:has(#stdTable, table.vt-tab, table.lv-tab)::after { content: ""; position: fixed; inset: 0; z-index: 55; background: rgba(0,0,0,.35); }
  body.hat-nav:has(#stdTable, table.vt-tab, table.lv-tab) .nav-knopf { display: inline-flex; min-width: var(--tap); padding: 0; font-size: 1.25rem; }
  .main:has(#stdTable, table.vt-tab, table.lv-tab) { padding: 8px 12px 12px; }
}
/* A: Stundenaufzeichnung ab 701 px schmäler – Tag umbricht (Feiertag/Abwesend darunter), Zeitfelder 84 px, Gesamt/Notiz schmäler */
@media screen and (min-width: 701px) {
  table.std { min-width: 0; }
  table.std th, table.std td { padding-left: 4px; padding-right: 4px; }
  table.std th.std-tag { min-width: 6.5rem; width: 7rem; white-space: normal; }
  td.std-zeit, td.std-pause, table.std:not(.sk-std) td.std-pause { min-width: 0; }
  .zeit-inp, .pause-inp { min-width: 5.25rem; width: 5.25rem; }
  td.std-zeit .zeit-jetzt, td.std-zeit .btn-mini { padding-left: 6px; padding-right: 6px; }
  table.std td.std-gesamt { width: 5.5rem; }
  td.std-notiz { min-width: 8rem; width: auto; }
  table.data td .btn-mini { min-height: 44px; }
  table.std thead th { white-space: normal; hyphens: manual; line-height: 1.2; } /* „Gesamt-stunden“ zweizeilig statt breiter Spalte */
}
@media screen and (min-width: 701px) and (max-width: 1100px) {
  .zeit-inp, .pause-inp { min-width: 4.75rem; width: 4.75rem; padding-left: 2px; padding-right: 2px; }
}
/* A: Anwesenheit am PC (Maus, mit Seitenleiste) – wie am Tablet: Vorname unter dem Namen, Standort/Notiz schmäler, Kopfwörter umbrechen */
@media screen and (min-width: 901px) and (pointer: fine) {
  .anw td.name, .anw th.name { width: clamp(10rem, 15vw, 15rem); min-width: clamp(10rem, 15vw, 15rem); max-width: clamp(10rem, 15vw, 15rem); white-space: normal; overflow-wrap: break-word; }
  .anw td.name .badge { display: inline-block; margin-top: 2px; }
  .anw td.name2, .anw th.name2 { display: none; }
  .anw td.name .vn-m { display: inline; font-weight: 400; }
  .anw th, .anw td { padding-left: 4px; padding-right: 4px; }
  .anw th.c, .anw td.c { padding-left: 2px; padding-right: 2px; min-width: 0; }
  .anw td.standort { min-width: 0; width: clamp(8rem, 11vw, 12rem); }
  .anw td.standort select { min-width: 0; }
  .anw td.notiz { min-width: 8rem; width: auto; }
  .anw th.notiz-head { white-space: normal; min-width: 8rem; }
}
/* B + A: Kopfwörter der Anwesenheit dürfen umbrechen (16 px statt verkleinert) */
@media screen and (min-width: 701px) {
  .anw thead th.c, .anw thead th.grp { white-space: normal; hyphens: manual; line-height: 1.2; }
}
/* A: Anwesenheit am Tablet quer mit 16-px-Kopf – Namensspalte etwas schmäler (Vorname steht darunter), Kürzel knapp */
@media screen and (min-width: 901px) and (orientation: landscape) and (pointer: coarse) {
  .anw td.name, .anw th.name { width: clamp(9rem, 16vw, 14rem); min-width: clamp(9rem, 16vw, 14rem); max-width: clamp(9rem, 16vw, 14rem); }
  .anw td.notiz, .anw th.notiz-head { min-width: 6.5rem; }
  .anw td.name .zieh-griff { margin-right: 2px; }
  .anw th.kz, .anw td.kz { padding-left: 2px; padding-right: 2px; width: 56px; min-width: 56px; }
}
@media screen and (min-width: 701px) and (max-width: 1100px) {
  table.stk-tab th, table.stk-tab td { padding-left: 3px; padding-right: 3px; } /* STK passt am Tablet 1024 ganz */
}
/* F: Namen im Dienstplan (Woche und Tag) umbrechen statt „Beispiel0…“; B: 18 px wie Tabellentext */
@media screen {
  .zl-wer, .dp-tab th.dp-wer, .dp-bes th.dp-wer { white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; line-height: 1.25; }
}
@media screen and (min-width: 601px) {
  .zl-wer { font-size: 1.125rem; }
  .zl-kopf, .zl-std { font-size: 1rem; }
  .zl-sum, .zl-zahl { font-size: 1.25rem; font-weight: 700; text-align: center; }
}
/* Reste aus der Nachmessung 25.10.2026: Besprechung-Knöpfe am PC 44 px, Handy-Leiste STK 44 px, Zahlen am Handy 20 px mittig, Namen nicht abschneiden */
@media screen and (min-width: 701px) {
  .besp-head .btn-mini, .besp-eintrag .btn-mini { min-height: 44px; }
}
@media screen and (max-width: 700px) {
  .stk-person, #stkPerson { min-height: 44px; }
  label:has(> #lvHiAlle) { min-height: 44px; display: inline-flex; align-items: center; }
}
@media screen and (max-width: 600px) {
  table.std td.std-gesamt, table.std td.std-gesamt b, table.std tr.std-woche td.c, table.std tfoot td.c, table.data td.r, table.lv-tab .r, table.std-ges-tab .r {
    font-size: 1.25rem; font-weight: 700; text-align: center !important; font-variant-numeric: tabular-nums; }
}
@media screen {
  .vv-artfarbe-name { white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; }
}
@media screen and (max-width: 600px) {
  /* Std.-Spalte am Handy ist schmal: Summen in einer Zeile (sonst „48,7“ / „5“) */
  table.std td.std-gesamt, table.std td.std-gesamt b, table.std tr.std-woche td.c, table.std tfoot td.c { font-size: 1.125rem; white-space: nowrap; }
}
@media screen and (max-width: 600px) {
  table.std tr.std-woche td.c, table.std tfoot td.c { font-size: 1rem; }
  /* schmale Tag-Spalte: „Feiertag“ statt „Na-tio-nal-fei-er-tag“ über sechs Zeilen (voller Name bleibt für Bildschirmleser im Text) */
  table.std th.std-tag .feiertag-badge { font-size: 0; padding: 1px 4px; }
  table.std th.std-tag .feiertag-badge::after { content: "Feiertag"; font-size: .875rem; }
}
@media screen and (min-width: 701px) and (pointer: fine) {
  /* PC: Uhrzeit-Felder mit Uhr-Symbol brauchen 104 px, sonst wird „07:30“ abgeschnitten */
  .zeit-inp, .pause-inp { width: 6.5rem; min-width: 6.5rem; padding-left: 4px; padding-right: 4px; }
}

/* Text außerhalb der Tabellen ab 601 px mindestens 16 px (Nutzer 25.10.2026: „Text außerhalb der Tabellen auch auf 16px“) – alle älteren
   Regeln mit kleinerer Schrift (Hinweise, Badges, Chips, Leisten, Besprechung, ToDo, MA-Kalender, LV …) werden hier auf 1rem gehoben.
   Ausgenommen sind enge Raster mit fester Zellgröße: Dienstplan-Monat, DV-Streifen der Zeitleiste, MA-Kalender-Jahr, Zahlenblase am
   Menü, Namenskürzel-Kreise, Wochentag-Kürzel, Farbmuster, Schloss-Zeichen. Handy (bis 600 px) bleibt nach der Tablet-Regel etwas kleiner. */
@media screen and (min-width: 601px) {
  .small,
  .user-name,
  .banner,
  .hilfe-mehr,
  .sk-plan-ort,
  .field label,
  .field .hint,
  .badge,
  .login-links,
  .msg,
  .counter,
  table.data thead th,
  .stamm-leiste .btn,
  .stamm .vn-inline,
  .stamm td.st-zwei span + span,
  .import-table select,
  .btn-mini,
  .st-row .st-nr,
  .switch-lbl,
  .anw td.standort select,
  .standort-label,
  .notiz-head .btn-save,
  .notiz-head .save-info,
  .kz-inp,
  .doppel-hinweis,
  .besp-chip b,
  .besp-chip-info,
  .besp-up,
  .besp-icon,
  .besp-fchip,
  .besp-fchip-n,
  .farb-opt,
  .besp-filter-hinweis,
  .hinweis-box,
  .besp-antwort-kopf .besp-autor,
  .besp-erwartet,
  .besp-status-sel,
  .besp-status-pers,
  .besp-status-chip,
  .besp-menue-hinweis,
  .besp-dchip,
  .besp-chip-typ,
  .besp-dchip-x,
  .kal-nr,
  .kal-opt-kz,
  .kal-opt-grund,
  .sk-wt,
  .sk-adr,
  .sk-txt,
  .sk-person,
  .sk-anzahl,
  .sk-vm,
  .sk-nm,
  .sk-agenda-kopf b,
  .sk-ampel,
  .sk-ueb-hinweis,
  .sk-pm,
  .tk-zeit,
  .dp-tab thead th,
  .dp-grund,
  .dp-ein,
  .dp-verf,
  .dp-ohne,
  .dp-trenner th,
  .dp-trenner td,
  .dp-bes td,
  .uw-st,
  .uw-sp,
  .dp-werkzeug-text,
  .zl-kopf,
  .zl-std,
  .zl-grund,
  .zl-trenner,
  .anw-chip,
  .mon-legende,
  .mon-btn,
  .mon-notiz,
  .std-grund,
  .std-fehlt-badge,
  .std-nachtrag,
  .zeit-jetzt,
  .std-ges-zeit,
  .std-fehlend-namen,
  .feiertag-badge,
  .besp-fertig,
  .tk-wt,
  .tk-tag,
  .todo-feld-titel,
  .todo-von,
  .todo-anzahl,
  .todo-meta,
  .field-error,
  .brand span,
  .stamm td[data-label]:not(.nm)::before,
  .responsive-cards td[data-label]::before,
  .standort-chips .counter,
  #counters .counter,
  .save-bar .save-info,
  .besp-aktionen .btn,
  .besp-eintrag-aktionen .btn,
  table.kal .kal-name,
  .nav-item,
  .sk-tab .sk-ort,
  table.std.sk-std td[data-label]::before,
  .anw td.c .chk,
  .sk-agenda-kopf,
  .pause-knopf,
  .std-warn,
  .ter-wt-zelle,
  .ter-tagnr,
  .ter-kw,
  .ter-balken,
  .ter-zr-ecke,
  .ter-zr-tag,
  .ter-zr-ganz-titel,
  .ter-zr-zeiten span,
  .ter-block,
  .ter-heute-schild,
  .ter-pl-ecke,
  .ter-pl-tagkopf,
  .ter-pl-balken,
  .sk-haupt button.sk-agenda-kopf #skAgendaInfo,
  .sk-leiste .btn,
  .sk-leiste .input,
  .sk-leiste .subtab,
  .sk-tab .sk-adr,
  .anw-leiste .btn,
  .anw-leiste .input,
  .anw thead th,
  .anw thead th.c,
  .anw th.notiz-head .save-info,
  .zf-schritte,
  .benutzer-mail,
  .dp-dv,
  .lv-zahl span,
  table.lv-tab td.lv-ft,
  .lv-tz-kopf,
  .lv-vs-kopf,
  table.lv-vs-tab td.lv-info,
  .stk-l-zahl,
  .lv-abr .field .hint,
  .lv-abr .lv-aus,
  .lv-karte .field .hint,
  .stk-dv,
  .stk-kein-dv,
  .stk-zu-knopf { font-size: 1rem; }
}
@media screen and (min-width: 701px) {
  /* STK: DV-Hinweis mit 16 px zweizeilig („kein / DV“) statt breiter Spalte – Tabelle passt am Tablet 1024 und PC 1366 */
  table.stk-tab .stk-dv-sp { white-space: normal; width: 4.25rem; min-width: 4.25rem; }
  .stk-kein-dv, .stk-dv { white-space: normal; overflow-wrap: anywhere; }
}

/* Handy (bis 600 px) wie die Auslieferung-App (Nutzer 25.10.2026: Weg 1): Grundtext und Felder 16 px (bleiben), Nebentexte mindestens
   14 px, Zahlen 16 px fett (in Tabellen mit .r 20 px, siehe oben), Zähler der Anwesenheit: Beschriftung 13 px, Zahl 20 px.
   Schon 14 px oder größer bleibt unverändert (nie verkleinern); ausgenommen: Dienstplan-Monat, Stundenmarken und DV-Streifen der Zeitleiste. */
@media screen and (max-width: 600px) {
  .sk-plan-ort,
  .dp-tab thead th,
  .dp-grund,
  .dp-ein,
  .dp-verf,
  .dp-ohne,
  .dp-trenner th,
  .dp-trenner td,
  .dp-bes td,
  .uw-sp,
  .vt-tab td:not(.nm):not([data-label=""])::before,
  .dp-werkzeug-text,
  .zl-kopf,
  .zl-grund,
  .zl-trenner,
  .std-nachtrag,
  .std-ges-zeit,
  .sk-agenda-kopf,
  .stk-pause-knopf span,
  .lv-tz-kopf,
  .lv-kl,
  table.lv-tab .lv-ft-klein,
  table.lv-vs-tab#lvVsBezuege .lv-menge-klein,
  table.lv-vs-tab td.lv-info,
  .lv-abr .field .hint,
  .lv-abr .lv-aus,
  .lv-karte .field .hint,
  table.stk-tab th.std-tag .std-wt,
  .stk-dv,
  .stk-kein-dv,
  .stk-zu-knopf { font-size: .875rem; }
  .dp-tab .dp-sum,
  .zl-sum,
  .zl-zahl,
  table.stk-tab tr.std-woche td.c,
  table.stk-tab tfoot td.c,
  .stk-l-zahl,
  .lv-zahl span { font-size: 1rem; font-weight: 700; }
  #counters .counter { font-size: .8125rem; font-weight: 600; color: var(--text-muted); align-items: baseline; }
  #counters .counter b { font-size: 1.25rem; color: var(--text); }
}
@media screen and (max-width: 600px) {
  button.sk-agenda-kopf #skAgendaInfo, .sk-agenda-kopf #skAgendaInfo { white-space: normal; overflow: visible; text-overflow: clip; } /* Agenda-Hinweis umbrechen statt „…“ */
}
@media screen {
  /* „📣 braucht Hilfe“ in der schmalen Gesamt-Spalte: nur zwischen den Wörtern umbrechen (sonst „brau / ht Hilfe“) */
  table.std .badge.std-anfrage-badge { overflow-wrap: normal !important; word-break: normal; hyphens: manual; padding-left: 3px; padding-right: 3px; margin-left: 0; }
}

/* Stammdaten → „Löschen“: Häkchen je Person, „alle“ oben (Nutzer 25.10.2026). Häkchen 24 px, Zeile bleibt ≥ 44 px, Schrift ≥ 16 px. */
#stammLoeschBtn[aria-pressed="true"] { background: var(--danger); border-color: var(--danger); color: var(--on-danger); }
.stamm-loeschleiste { align-items: center; flex-wrap: wrap; padding: 6px 10px; border: 1px solid var(--danger-line); border-radius: var(--radius); background: var(--danger-soft-2); }
.stamm-loesch-zahl { font-size: 1rem; font-weight: 700; }
.stamm-cb { width: 24px; height: 24px; margin: 0; accent-color: var(--danger); cursor: pointer; flex: 0 0 auto; }
.stamm-cb-alle { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-size: 1rem; font-weight: 700; cursor: pointer; white-space: nowrap; }
table.stamm th.stamm-cb-th, table.stamm td.stamm-cb-td { width: 3.75rem; text-align: center; vertical-align: middle; }
table.stamm td.stamm-cb-td { min-height: 44px; }
table.stamm tr.stamm-gewaehlt td:first-child { box-shadow: inset 5px 0 0 var(--danger); }
.stamm-alle-leiste { display: none; }
@media screen and (max-width: 900px) {
  .stamm-alle-leiste { display: inline-flex; }
  .stamm td.stamm-cb-td { display: flex !important; align-items: center; min-height: 44px; }
  .stamm td.stamm-cb-td::before { content: none !important; }
  .stamm tr.stamm-gewaehlt { outline: 2px solid var(--danger); }
}

/* Verwaltung → Standorte: Reihenfolge mit ▲/▼ (Nutzer 25.10.2026), Knöpfe 44 × 44 px */
.st-row .st-pfeile { display: inline-flex; gap: 4px; flex: 0 0 auto; }
.st-row .st-pfeil { min-width: 44px; min-height: 44px; padding: 0; font-size: 1.125rem; line-height: 1; }
.st-row .st-pfeil:disabled { opacity: .35; }
@media screen and (max-width: 900px) {
  .st-row .st-pfeile { grid-column: 1 / -1; justify-self: start; }
}
#stammLoeschBtn { flex: 0 0 auto; margin-left: auto; }
@media screen and (max-width: 900px) {
  .stamm td.stamm-cb-td { width: auto; border: 0; background: transparent; padding: 0; }
}

/* Art „Fahrer“ (Nutzer 25.10.2026): Zeile im Standortkalender mit 🚚, Gruppe in den Stammdaten, zwei Einteilen-Knöpfe */
.sk-tab tr.fahrer > th.sk-ort { background: var(--head); }
.ter-std-gruppe { margin: 10px 0 2px; font-size: 1rem; font-weight: 700; }
.sk-plus-knoepfe { display: flex; flex-wrap: wrap; gap: 8px; }
.sk-plus-knoepfe .btn { min-height: 44px; font-size: 1rem; }
.sk-plus-knoepfe .btn[aria-pressed="true"] { background: var(--primary-soft, var(--head)); border-color: var(--primary, currentColor); }

/* Freies Personal (Nutzer 25.10.2026, Etappe B): zweite Kopfzeile im Standortkalender, klebt unter der Datumszeile */
.sk-tab thead tr.sk-frei-zeile > * { position: sticky; top: var(--sk-kopf-h, 3.25rem); z-index: 3; background: var(--primary-soft); border-bottom: 2px solid var(--linie-stark); }
.sk-tab thead tr.sk-frei-zeile > th.sk-ort { z-index: 4; left: 0; background: var(--primary-soft); text-align: left; }
.sk-tab thead tr.sk-frei-zeile > td.sk-frei-feld.leer { color: var(--muted); }
td.sk-frei-feld { cursor: pointer; vertical-align: top; }
.sk-frei-person { border-style: dashed; }
.sk-frei-mehr { align-self: flex-start; font-size: .875rem; font-weight: 700; padding: 0 6px; border-radius: 999px; background: var(--surface); border: 1px solid var(--linie-stark); }
.sk-tab.kompakt .sk-frei-mehr { display: none; }
.sk-frei-liste { display: flex; flex-direction: column; gap: 8px; }
.sk-frei-eintrag { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 6px 10px; border: 1px solid var(--linie); border-radius: var(--radius); font-size: 1rem; }
.sk-frei-name { flex: 1 1 auto; min-width: 0; }
.sk-frei-eintrag .btn { min-height: 44px; }
.dp-tab tr.dp-frei th.dp-wer, .dp-tab tr.dp-frei td { background: var(--primary-soft); }
.dp-tab td.dp-frei-feld { cursor: pointer; font-weight: 700; }
.dp-tab td.dp-frei-feld { font-size: 1rem; height: 44px; }

/* Standortkalender: Woche (So–Sa) | Monat (Nutzer 25.10.2026) – Woche füllt die Breite, Blättern ◀ Heute ▶ auf allen Geräten */
.sk-zeit .btn[aria-pressed="true"] { background: var(--primary); color: var(--on-primary); border-color: var(--primary); font-weight: 700; }
.sk-wochenav { display: inline-flex; gap: 6px; align-items: center; }
.sk-wochenav[hidden] { display: none; }
.sk-wochenav .btn { min-width: 44px; }
.sk-tab.woche { width: 100%; }
.sk-tab.woche td.sk-feld, .sk-tab.woche thead th.sk-tag { width: auto; }
.sk-fahrer-zeichen { display: inline; }
@media screen and (max-width: 700px) {
  .sk-leiste > .sk-zeit { display: grid; grid-template-columns: 1fr 1fr; }
  .sk-leiste > .sk-wochenav:not([hidden]) { display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px; }
}
/* Woche: 7 Tage passen auch bei 1366 px mit Agenda links – Felder dürfen schmaler sein (Schrift gleich, lange Namen mit …) */
.sk-tab.woche td.sk-feld, .sk-tab.woche thead th.sk-tag { min-width: 5.5rem; }
@media screen and (min-width: 1101px) {
  .sk-tab.woche .sk-ort { width: 11rem; min-width: 11rem; max-width: 11rem; overflow-wrap: anywhere; }
  .sk-tab.woche td.sk-feld, .sk-tab.woche thead th.sk-tag { min-width: 5.25rem; }
}
@media screen and (min-width: 901px) {
  /* feste Aufteilung: 7 gleich breite Tage, die Standort-Spalte bestimmt die erste Kopfzelle */
  .sk-tab.woche { table-layout: fixed; }
  .sk-tab.woche td.sk-feld, .sk-tab.woche thead th.sk-tag { min-width: 0; }
}
.sk-tagnav > .btn { min-width: 44px; }

/* Feiertag (Nutzer 25.10.2026): Wochentag + ★, in der Wochenansicht auch der Name */
.sk-fei { color: var(--danger); }
.sk-fei-name { display: none; }
.sk-tab.woche .sk-fei-name { display: block; font-size: .875rem; font-weight: 600; color: var(--danger); line-height: 1.2; white-space: normal; overflow-wrap: anywhere; hyphens: auto; }

/* Saisonkalender (Nutzer 25.10.2026): Baukasten links (PC) bzw. unten (Handy), Kalender wie Standortkalender */
.sai-titel { margin: 0; font-size: 1.125rem; }
.sai-ansicht .btn[aria-pressed="true"] { background: var(--primary); color: var(--on-primary); border-color: var(--primary); font-weight: 700; }
.sai-haupt { display: grid; grid-template-columns: 15rem minmax(0, 1fr); gap: 10px; align-items: start; }
.sai-kasten { border: 1px solid var(--linie); border-radius: var(--radius); background: var(--surface); padding: 10px; display: flex; flex-direction: column; gap: 8px; }
.sai-kasten-kopf { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 1rem; }
.sai-kasten-kopf .btn { min-height: 44px; }
.sai-bausteine { display: flex; flex-direction: column; gap: 6px; }
.sai-baustein { display: flex; align-items: center; gap: 6px; min-height: 44px; padding: 4px 6px; border: 1px solid var(--linie); border-radius: var(--radius-sm, 8px); font-size: 1rem; }
.sai-baustein.aus { opacity: .7; }
.sai-baustein-name { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
.sai-pfeile { display: inline-flex; gap: 4px; }
.sai-pfeil, .sai-bearbeiten { min-width: 44px; min-height: 44px; padding: 0 8px; }
.sai-pfeil:disabled { opacity: .35; }
.sai-chip { display: inline-block; width: 14px; height: 14px; border-radius: 4px; flex: 0 0 auto; background: var(--p, var(--muted)); border: 1px solid var(--p-line, var(--linie-stark)); margin-right: 6px; vertical-align: middle; }
.sai-aus summary { cursor: pointer; min-height: 44px; display: flex; align-items: center; font-size: 1rem; }
.sai-wrap { overflow: auto; max-height: calc(100vh - 190px); max-height: calc(100dvh - 190px); }
.sai-tab tbody th.sk-ort b { display: inline; }
td.sai-leer { padding: 16px; font-size: 1rem; color: var(--muted); }
td.sai-feld { cursor: default; }
@media screen and (max-width: 900px) {
  .sai-haupt { grid-template-columns: minmax(0, 1fr); }
  .sai-kasten { order: 2; }
  .sai-wrap { max-height: none; }
  .sai-titel { grid-column: 1 / -1; }
}
/* Baukasten: Name in eigener Zeile (kein Umbruch mitten im Wort), Knöpfe darunter rechts */
.sai-baustein { flex-wrap: wrap; }
.sai-baustein-name { flex: 1 1 calc(100% - 30px); overflow-wrap: normal; word-break: normal; }
.sai-baustein .sai-pfeile { margin-left: auto; }
@media screen and (max-width: 700px) {
  .sk-leiste > .sai-ansicht { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; }
}

/* Saisonkalender Etappe 3: Einteilen-Fenster mit Hackerl-Blöcken je Tätigkeit */
.sai-dlg { display: flex; flex-direction: column; gap: 10px; }
.sai-wahl { border: 1px solid var(--linie); border-radius: var(--radius); padding: 8px 10px; }
.sai-wahl.an { border-color: var(--primary-line, var(--primary)); background: var(--primary-soft); }
.sai-haken { display: flex; align-items: center; gap: 10px; min-height: 44px; font-size: 1rem; cursor: pointer; flex-wrap: wrap; }
.sai-cb { width: 24px; height: 24px; margin: 0; accent-color: var(--primary); flex: 0 0 auto; }
.sai-wahl-info { margin-left: auto; font-size: 1rem; }
.sai-zeiten { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: flex-end; margin: 6px 0 2px 34px; }
.sai-zf { display: flex; flex-direction: column; gap: 2px; font-size: 1rem; }
.sai-zf > span { font-size: .875rem; color: var(--muted); font-weight: 600; }
.sai-zf .input { min-height: 44px; font-size: 1rem; width: 7rem; }
.sai-zf .pause-zelle { display: flex; align-items: center; gap: 4px; }
.sai-zf .pause-zelle .input { width: 6.5rem; }
.sai-pause.pause-fehlt .input { border-color: var(--warn, #b45309); }
.sai-pause-zwei { min-height: 44px; }
.sai-summe { font-size: 1rem; margin: 0; }
.sai-dlg h3 { margin: 4px 0 0; font-size: 1rem; }
.sai-name { min-height: 44px; font-weight: 700; }
td.sai-feld { cursor: pointer; }
.sk-tab .sk-person[data-pid] { cursor: pointer; }
@media screen and (max-width: 700px) {
  .sai-zeiten { margin-left: 0; }
  .sai-zf .input, .sai-zf .pause-zelle .input { width: 100%; }
  .sai-zf { flex: 1 1 calc(50% - 12px); }
  .sai-pause { flex-basis: 100%; }
}

/* Saisonkalender Etappe 4: Tätigkeit im Dienstplan (🧰, gestrichelt = nur Anzeige), Häkchen „Saisonkalender (Web)“ */
.dp-ein.dp-sai { border-style: dashed; }
.sai-web-zeile { min-height: 44px; font-size: 1rem; }

/* Saisonkalender Etappe 5: Drucken / PDF */
.sai-ausgabe-knopf { white-space: nowrap; }
.sai-ausgabe .btn { min-height: 44px; width: 100%; font-size: 1rem; }
.sai-ausgabe { display: flex; flex-direction: column; gap: 8px; }
@media screen and (max-width: 700px) { .sk-leiste > .sai-ausgabe-knopf { grid-column: 1 / -1; } }
@media print {
  .sai-druckseite .neue-seite { break-before: page; page-break-before: always; }
  .sai-drucktab { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 9px; }
  .sai-drucktab th, .sai-drucktab td { border: 1px solid #9aa59f; padding: 3px 4px; vertical-align: top; }
  .sai-drucktab thead th { background: #e7eee9; text-align: center; }
  .sai-drucktab thead th.frei { background: #f3dede; }
  .sai-drucktab th.sk-ort { width: 26mm; text-align: left; }
  .sai-drucktab .sk-wt, .sai-drucktab .sk-nr, .sai-d-fei, .sai-d-name { display: block; }
  .sai-d-fei { color: #b3261e; font-size: 8px; }
  .sai-d-frei th, .sai-d-frei td { background: #eef5f0; }
  .sai-d-chip { display: inline-block; width: 8px; height: 8px; margin-right: 4px; }
  .sai-d-name i { font-style: normal; color: #444; }
}

/* Dienstplan Etappe C (Nutzer 25.10.2026): Mitarbeiter-Felder niedrig (Zeichen oben rechts, Verfügbarkeit als Strich), Sicht nach Standort */
.dp-tab td.dp-feld { position: relative; }
.dp-zeichen { position: absolute; top: 1px; right: 2px; display: flex; gap: 1px; font-size: .875rem; line-height: 1; pointer-events: none; }
.dp-tab td.dp-feld:has(.dp-zeichen) .dp-ein:first-of-type { margin-right: 1.4rem; }
.dp-verf-strich { position: absolute; left: 3px; right: 3px; bottom: 2px; height: 3px; border-radius: 2px; background: var(--primary-line, var(--primary)); opacity: .7; }
.dp-muster.verf-strich { height: 4px; border: 0; background: var(--primary-line, var(--primary)); vertical-align: middle; }
.dp-muster.zu { background: var(--surface-3); }
.dp-sicht .btn[aria-pressed="true"] { background: var(--primary); color: var(--on-primary); border-color: var(--primary); font-weight: 700; }
.dp-st-tab td.dp-st-feld { padding: 3px; vertical-align: top; cursor: pointer; min-height: 44px; height: 44px; }
.dp-st-tab td.dp-st-feld.zu { background: var(--surface-3); color: var(--muted); }
.dp-st-tab td.dp-st-feld.null { background: var(--danger-soft); }
.dp-st-tab td.dp-st-feld.dp-frei-feld { background: var(--primary-soft); }
.dp-st-tab .dp-st-name { display: block; border: 1px solid var(--p-line, var(--linie)); background: var(--p-bg, var(--surface)); color: var(--p, var(--text)); border-radius: 5px; padding: 1px 5px; margin-bottom: 2px;
  font-size: .875rem; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; }
.dp-st-tab .dp-st-name.frei { border-style: dashed; background: var(--surface); color: var(--text); }
.dp-st-tab .dp-st-name i { font-style: normal; opacity: .85; }
.dp-st-tab tr.dp-st-frei th.dp-wer { background: var(--primary-soft); }
.dp-st-tab tr.dp-st-sonder th.dp-wer, .dp-st-tab tr.dp-st-fahrer th.dp-wer { background: var(--surface-2); }
.dp-st-tab tr.dp-st-trenner > * { border-top: 3px solid var(--linie-stark); }
.dp-wrap.monat .dp-st-tab td.dp-st-feld { text-align: center; font-weight: 700; vertical-align: middle; }
@media screen and (min-width: 601px) { .dp-st-tab .dp-st-name { font-size: 1rem; } }
@media (max-width: 700px) {
  .dp-leiste .dp-sicht { display: none; }  /* am Handy im „⋯“ */
  .sk-mehr-liste .dp-sicht { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
  .dp-st-tab thead th.dp-wer { width: 7.5rem; }
  .dp-st-tab th.dp-wer { white-space: normal; overflow-wrap: anywhere; font-size: .9375rem; }
}
/* Etappe C: am PC zwei geordnete Zeilen – oben Reiter | Tag/Woche/Monat | Standort/Mitarbeiter, unten ◀ Zeitraum ▶ · Heute · DV · ⚡ · ⎙ */
.dp-leiste .dp-umbruch-pc { display: none; }
@media (min-width: 701px) { .dp-leiste .dp-umbruch-pc { display: block; flex: 0 0 100%; height: 0; } }

/* Saisonkalender: Baukasten im Fenster „🧱 Bausteine“ (Nutzer 25.10.2026: „am PC sehr breit“) – Kalender ganze Breite, je Baustein eine Zeile */
.sai-haupt { display: block; }
.sai-kasten { border: 0; padding: 0; background: transparent; }
.sai-kasten-kopf { flex-wrap: wrap; }
.sai-kasten-kopf p { flex: 1 1 14rem; margin: 0; }
.sai-baustein { flex-wrap: nowrap; }
.sai-baustein-name { flex: 1 1 auto; }
.sai-kasten-knopf { white-space: nowrap; }
.sai-tab th.sai-ort-knopf { cursor: pointer; }
.sai-tab th.sai-ort-knopf:hover b, .sai-tab th.sai-ort-knopf:focus-visible b { text-decoration: underline; }
@media screen and (max-width: 700px) { .sk-leiste > .sai-kasten-knopf { grid-column: 1 / -1; } }

/* Saisonkalender schmäler (Nutzer 26.10.2026: „Bausteine in der Y-Achse schmäler … Kalender so gut als möglich sichtbar“,
   „am Handy zu viel Reiter und Bausteine“): Zeilen 44 px (mit Namen höher, Schrift gleich), „Freies Personal“ einklappbar
   (zu = „N frei“), Handy eine Zeile Monat · ◀ Heute ▶ · ⋯, Tablet quer ☰ + eine schmale Zeile, Kalender bis zum unteren Rand */
.sai-tab td.sk-feld { height: 44px; }
.sai-tab .sk-leute { padding: 2px 4px; }
.sai-tab tbody th.sk-ort { padding-top: 4px; padding-bottom: 4px; }
.sai-wrap { max-height: calc(100dvh - 120px); }
.sai-frei-kopf { cursor: pointer; }
.sai-frei-kopf:hover b, .sai-frei-kopf:focus-visible b { text-decoration: underline; }
.sai-frei-kopf b { display: inline; }
.sai-frei-pfeil { font-weight: 700; }
.sai-frei-zahl { display: none; }
.sai-tab.frei-zu thead tr.sk-frei-zeile > th.sk-ort { padding-top: 4px; padding-bottom: 4px; }
.sai-tab.frei-zu thead tr.sk-frei-zeile .sk-adr { display: none; }
.sai-tab.frei-zu .sk-frei-feld .sk-leute, .sai-tab.frei-zu .sk-frei-feld .sk-anzahl { display: none; }
.sai-tab.frei-zu .sk-frei-feld { height: 44px; vertical-align: middle; text-align: center; }
.sai-tab.frei-zu .sai-frei-zahl { display: block; font-size: 1rem; font-weight: 700; white-space: nowrap; }
.sai-tab.frei-zu td.sk-frei-feld.leer .sai-frei-zahl { font-weight: 400; color: var(--muted); }
/* Kompakt: wie bisher nur die Zahl (Spalten 44 px schmal) – auf oder zu */
.sai-tab.kompakt .sai-frei-zahl { display: none !important; }
.sai-tab.kompakt.frei-zu .sk-frei-feld .sk-anzahl { display: block; }
.sai-mehr { display: none; }
.sai-mehr-liste .sai-mehr-seg { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.sai-mehr-liste .sai-mehr-seg .btn[aria-pressed="true"] { background: var(--primary); color: var(--on-primary); border-color: var(--primary); font-weight: 700; }
.sai-mehr-liste .btn, .sai-mehr-liste .input { min-height: 44px; font-size: 1rem; }

/* Tablet quer: Seitenleiste hinter ☰, eine schmale Zeile (Jahr · Monat · Woche/Monat · ◀ Heute ▶ · ⋯) */
@media screen and (min-width: 901px) and (orientation: landscape) and (pointer: coarse) {
  body.hat-nav:has(#saiTab) { grid-template-columns: minmax(0, 1fr); }
  body.hat-nav:has(#saiTab) > .main, body.hat-nav:has(#saiTab) > .banner { grid-column: 1; }
  body.hat-nav:has(#saiTab) > .nav { display: none; }
  body.hat-nav.nav-offen:has(#saiTab) > .nav { display: flex; position: fixed; top: 0; left: 0; z-index: 60; width: clamp(220px, 14rem, 340px);
    height: 100vh; height: 100dvh; padding-top: calc(16px + env(safe-area-inset-top, 0px)); box-shadow: 6px 0 24px rgba(0,0,0,.3); }
  body.hat-nav.nav-offen:has(#saiTab)::after { content: ""; position: fixed; inset: 0; z-index: 55; background: rgba(0,0,0,.35); }
  body.hat-nav:has(#saiTab) .nav-knopf { display: inline-flex; min-width: var(--tap); padding: 0; font-size: 1.25rem; }
  body.hat-nav:has(#saiTab) .topbar { --tap: 38px; }
  body.hat-nav:has(#saiTab) .topbar-inner { min-height: 46px; padding: 4px 12px; gap: 10px; }
  body.hat-nav:has(#saiTab) .topbar .btn-ghost { padding: 0 12px; }
  .main:has(#saiTab) { padding: 8px 12px 12px; }
  .sk-leiste.sai-leiste { flex-wrap: nowrap; }
  .sai-leiste > .sk-monate, .sai-leiste > .sai-titel, .sai-leiste > .sk-zeitraum,
  .sai-leiste > .sai-ansicht, .sai-leiste > .sai-kasten-knopf, .sai-leiste > .sai-ausgabe-knopf { display: none !important; }
  .sai-leiste > .sk-monat-sel { display: block; width: auto; min-width: 8.5rem; }
  .sai-leiste > .sai-mehr { display: inline-flex; }
}

/* Handy und Tablet hoch: eine Zeile Monat · ◀ Heute ▶ · ⋯ – Jahr, Woche/Monat, Ansicht, Bausteine, Drucken unter ⋯ */
@media screen and (max-width: 900px) {
  .toolbar.sk-leiste.sai-leiste { display: flex; flex-wrap: nowrap; align-items: center; gap: 6px; width: 100%; margin-bottom: 6px; }
  .sai-leiste > .sai-x, .sai-leiste > .sk-monate, .sai-leiste > .sai-titel, .sai-leiste > .sk-zeitraum,
  .sai-leiste > .sk-umbruch, .sai-leiste > .spacer { display: none !important; }
  .sai-leiste > .sk-monat-sel { display: block; flex: 0 1 8.5rem; width: 8.5rem; min-width: 0; font-size: 1rem; padding-left: 8px; padding-right: 4px; }
  .sai-leiste > .sk-wochenav:not([hidden]) { display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px; flex: 1 1 auto; min-width: 0; gap: 4px; }
  .sai-leiste > .sk-wochenav .btn { min-width: 44px; padding: 0 6px; }
  .sai-leiste > .sk-wochenav:not([hidden]) { min-width: 9.5rem; }
  .sai-leiste > .sai-mehr { display: inline-flex; flex: 0 0 auto; width: auto; min-width: 44px; padding: 0 10px; font-size: 1.25rem; justify-content: center; }
  .sai-leiste > .sai-mehr .sai-mehr-text { display: none; }
  .sai-haupt { display: block; }
}
/* Handy: Tätigkeits-Spalte schmal (mehr Platz für die Tage), Namen dürfen umbrechen */
@media screen and (max-width: 700px) {
  .sai-tab .sk-ort { width: 7.5rem; min-width: 7.5rem; max-width: 7.5rem; padding-left: 6px; padding-right: 6px; overflow-wrap: anywhere; }
  .sai-tab .sai-chip { margin-right: 4px; }
}
/* Namen in den Zellen etwas enger übereinander (Schrift gleich, Rahmen bleibt) */
.sai-tab .sk-person { padding-top: 0; padding-bottom: 0; line-height: 1.25; }

/* Standortkalender wie Saisonkalender (Nutzer 26.10.2026: „Am Handy sind auch die Reiter und Button im Vordergrund“):
   Handy/Tablet hoch eine Zeile [Kalender ▼] · ◀ Heute ▶ · ⋯ (Reiter als Auswahl, Jahr/Monat/Woche-Monat/Ansicht unter ⋯),
   Dienstplan [Dienstplan ▼] · ◀ KW ▶ · ⋯, STK [STK ▼] [Person ▼] ⋯ + ◀ Monat ▶, Gesamtauflistung kompakt;
   „Freies Personal“ einklappbar (zu = „N frei“) auf allen Geräten, Kalender bis zum unteren Rand. Tablet quer und PC wie bisher. */
.sk-reiter-sel, .dp-titel-knapp { display: none; }
.sk-frei-zeile .sai-frei-kopf b { display: inline; }
.sk-tab.frei-zu thead tr.sk-frei-zeile > th.sk-ort { padding-top: 4px; padding-bottom: 4px; }
.sk-tab.frei-zu thead tr.sk-frei-zeile .sk-adr { display: none; }
.sk-tab.frei-zu .sk-frei-feld .sk-leute, .sk-tab.frei-zu .sk-frei-feld .sk-anzahl { display: none; }
.sk-tab.frei-zu .sk-frei-feld { height: 44px; vertical-align: middle; text-align: center; }
.sk-tab.frei-zu .sai-frei-zahl { display: block; font-size: 1rem; font-weight: 700; white-space: nowrap; }
.sk-tab.frei-zu td.sk-frei-feld.leer .sai-frei-zahl { font-weight: 400; color: var(--muted); }
.sk-tab.kompakt .sai-frei-zahl { display: none !important; }
.sk-tab.kompakt.frei-zu .sk-frei-feld .sk-anzahl { display: block; }
.sk-mehr-liste .sai-mehr-seg { display: grid; grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); }
.sk-mehr-liste .sai-mehr-seg .btn[aria-pressed="true"] { background: var(--primary); color: var(--on-primary); border-color: var(--primary); font-weight: 700; }
.sk-mehr-liste .btn, .sk-mehr-liste .input { min-height: 44px; font-size: 1rem; }

@media screen and (max-width: 900px) {
  /* Reiter: nur noch die Auswahl in der Leiste */
  #main > #skReiter, .sk-leiste > .sk-reiter-leiste, .dp-leiste > .dp-reiter { display: none !important; }
  .sk-reiter-sel { display: block; flex: 0 0 7.5rem; width: 7.5rem; min-width: 0; font-size: 1rem; font-weight: 700; padding-left: 8px; padding-right: 4px; }
  /* Kalender + Gesamtauflistung: eine Zeile */
  .toolbar.sk-leiste:not(.sai-leiste) { display: flex; flex-wrap: nowrap; align-items: center; gap: 6px; width: 100%; margin-bottom: 6px; }
  .sk-leiste:not(.sai-leiste) > :not(.sk-reiter-sel):not(.sk-wochenav):not(.sk-heute):not(.sk-mehr) { display: none !important; }
  .sk-leiste:not(.sai-leiste) > .sk-wochenav:not([hidden]) { display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px; flex: 1 1 auto; min-width: 0; gap: 4px; }
  .sk-leiste:not(.sai-leiste) > .sk-wochenav .btn { min-width: 44px; padding: 0 6px; }
  .sk-leiste:not(.sai-leiste) > .sk-heute:not([hidden]) { display: inline-flex; flex: 1 1 auto; width: auto; justify-content: center; }
  .sk-leiste:not(.sai-leiste) > .sk-mehr:not([hidden]) { display: inline-flex !important; flex: 0 0 auto; width: auto; min-width: 44px; margin-left: auto; padding: 0 10px; font-size: 0; }
  .sk-leiste:not(.sai-leiste) > .sk-mehr:not([hidden])::before { content: "⋯"; font-size: 1.25rem; font-weight: 700; }
  /* Dienstplan: [Dienstplan ▼] ◀ KW 44 ▶ ⋯ */
  .dp-leiste:not(.stk-leiste) { display: flex; flex-wrap: nowrap; align-items: center; gap: 4px; }
  .dp-leiste:not(.stk-leiste) > :not(.sk-reiter-sel):not(.dp-zur):not(.dp-zeitraum):not(.dp-vor):not(.dp-mehr) { display: none !important; }
  .dp-leiste:not(.stk-leiste) > .dp-zeitraum { flex: 1 1 auto; min-width: 0; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .dp-leiste:not(.stk-leiste) > .dp-zeitraum > .dp-titel-lang, .dp-leiste:not(.stk-leiste) > .dp-zeitraum > .dp-titel-kurz { display: none !important; }
  .dp-leiste:not(.stk-leiste) > .dp-zeitraum > .dp-titel-knapp { display: inline !important; }
  .dp-leiste:not(.stk-leiste) > .dp-zur, .dp-leiste:not(.stk-leiste) > .dp-vor, .dp-leiste:not(.stk-leiste) > .dp-mehr { flex: 0 0 44px; min-width: 44px; padding: 0; }
  .dp-leiste > .dp-mehr { display: inline-flex !important; align-items: center; justify-content: center; }
  .dp-leiste > .btn, .dp-leiste > select, .sk-reiter-sel { min-height: 44px; } /* Handy/Tablet hoch: Fingerfläche */
  /* STK: [STK ▼] [Person ▼] ⋯ / ◀ Okt 2026 ▶ */
  .stk-leiste { display: grid !important; grid-template-columns: 7.5rem minmax(0, 1fr) 44px; gap: 6px; align-items: center; }
  .stk-leiste > :not(.sk-reiter-sel):not(.stk-person):not(.dp-zur):not(.stk-zeitraum):not(.dp-vor):not(.dp-mehr) { display: none !important; }
  .stk-leiste > .sk-reiter-sel { grid-column: 1; grid-row: 1; width: 100%; }
  .stk-leiste > .stk-person { grid-column: 2; grid-row: 1; width: 100%; min-width: 0; max-width: none; min-height: 44px; }
  .stk-leiste > .dp-mehr { grid-column: 3; grid-row: 1; min-width: 44px; padding: 0; }
  .stk-leiste > .dp-zur { grid-column: 1; grid-row: 2; justify-self: start; min-width: 44px; }
  .stk-leiste > .stk-zeitraum { grid-column: 2; grid-row: 2; text-align: center; }
  .stk-leiste > .dp-vor { grid-column: 3; grid-row: 2; min-width: 44px; padding: 0; }
  /* Gesamtauflistung: ◀ KW ▶ und Suche | Filter, Excel/Drucken/Planung unter ⋯ */
  .sk-ueb-leiste { display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 6px; }
  .sk-ueb-leiste > .sk-jahrbar { grid-column: 1 / -1; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 4px; }
  .sk-ueb-leiste > .sk-jahrbar > .btn { min-width: 44px; padding: 0 8px; }
  .sk-info { display: none !important; } /* „Angelegte Jahre …“ steht im ⋯-Fenster */
  .sk-ueb-leiste > .search, .sk-ueb-leiste > .sk-ueb-filter { width: 100%; min-width: 0; max-width: none; }
  .sk-ueb-leiste > .spacer, .sk-ueb-leiste > .sk-ueb-knoepfe { display: none !important; }
}

/* Anwesenheit am Handy wie Saison-/Standortkalender (Nutzer 26.10.2026): eine Leistenzeile ◀ Datum ▶ 🔍 ⋯ (Heute, Monat,
   Kürzel, Excel, Drucken unter ⋯), Zahlen + Standorte einklappbar (zu = eine Zeile), Speichern-Leiste schmal,
   Personenkarte am Handy 3 × 3 Kästchen (Schrift gleich, Kurzwörter), Standort | Notiz in einer Zeile. Tablet quer/PC wie bisher. */
.anw-such-knopf, .anw-zahlen-knopf, .save-kurz, .lbl-kurz { display: none; }
@media screen and (max-width: 900px) {
  .toolbar.anw-leiste { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; width: 100%; }
  .toolbar.anw-leiste::before { display: none; content: none; }
  .anw-leiste > .datebar, .anw-leiste .datebar-extra { display: contents; }
  .anw-leiste .date-label, .anw-leiste .frei-tag, .anw-leiste .datebar-extra > *, .anw-leiste > .spacer, .anw-leiste > .kz-schalter, .anw-leiste > .anw-extra { display: none !important; }
  .anw-leiste .datebar > .btn { order: 1; flex: 0 0 44px; min-width: 44px; padding: 0; }
  .anw-leiste .datebar > .date-input { order: 2; flex: 1 1 8rem; width: auto; min-width: 0; }
  .anw-leiste .datebar > .btn:last-of-type { order: 3; }
  .anw-leiste > .anw-such-knopf { display: inline-flex; order: 4; flex: 0 0 44px; min-width: 44px; padding: 0; justify-content: center; }
  .anw-leiste > .anw-mehr { display: inline-flex !important; order: 5; flex: 0 0 44px; min-width: 44px; padding: 0; justify-content: center; }
  .toolbar.anw-leiste > .search { display: none; order: 9; flex: 1 1 100%; width: 100%; max-width: none; }
  .main.anw-suche-an .toolbar.anw-leiste > .search { display: block; }
  .anw-leiste > .anw-such-knopf[aria-pressed="true"] { background: var(--primary-soft); border-color: var(--primary-line); }
  .anw-leiste .date-input.anw-frei-datum { border-color: var(--danger); color: var(--danger); font-weight: 700; }
  /* Zahlen + Standorte */
  .anw-zahlen-knopf { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; min-height: 44px; margin: 0 0 8px; padding: 4px 12px;
    border: 1px solid var(--linie-stark); border-radius: 8px; background: var(--surface); color: var(--text); font: inherit; font-size: 1rem; text-align: left; cursor: pointer; }
  .anw-zahlen-text { flex: 1 1 auto; min-width: 0; }
  .anw-zahlen-text b { font-size: 1.25rem; line-height: 1.2; } /* wie die Zähler: Handy 20 px, Tablet 24 px (feedback Tablet-Schrift) */
  .anw-zahlen-pfeil { flex: 0 0 auto; font-weight: 700; color: var(--primary); white-space: nowrap; }
  .main:not(.anw-zahlen-auf) > #counters, .main:not(.anw-zahlen-auf) > #standortLeiste { display: none !important; }
  /* Speichern-Leiste schmal */
  .save-bar { flex-wrap: nowrap; gap: 8px; padding: 4px 6px 4px 12px; }
  .save-bar .save-info { display: none; }
  .save-bar .save-kurz { display: block; flex: 1 1 auto; min-width: 0; font-size: .875rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .save-bar .btn-save { min-height: 44px; }
  body.hat-nav .save-bar { padding-bottom: 4px; }
}
@media screen and (max-width: 700px) {
  .anw tr { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 4px 6px; padding: 8px 10px 10px; }
  .anw td.c, .anw td.bus, .anw td.krank, .anw td.urlaub { grid-column: span 2 !important; padding: 0 !important; }
  .anw td.c .chk { min-height: 44px; padding: 0 6px; gap: 6px; }
  .anw td.c .chk .lbl, .anw td.c .chk .lbl-kurz { white-space: normal; line-height: 1.15; }
  .anw td.c .chk:has(.lbl-kurz) .lbl { display: none; }
  .anw td.c .chk .lbl-kurz { display: inline; font-weight: 600; }
  .anw td.standort { grid-column: span 3; padding: 0 !important; }
  .anw td.notiz { grid-column: span 3; padding: 0 !important; }
}
/* Tablet hoch (601–900 px): Kurzwörter, kein Umbruch mitten im Wort, Standort | Notiz in einer Zeile */
@media screen and (min-width: 601px) and (max-width: 900px) {
  .anw td.c, .anw td.bus, .anw td.krank, .anw td.urlaub { grid-column: span 2 !important; padding: 0 !important; }
  .anw td.c .chk { min-height: 44px; }
  .anw td.c .chk:has(.lbl-kurz) .lbl { display: none; }
  .anw td.c .chk .lbl-kurz { display: inline; font-weight: 600; }
  .anw td.c .chk .lbl, .anw td.c .chk .lbl-kurz { white-space: nowrap; overflow-wrap: normal; word-break: normal; }
  .anw tr { gap: 4px 6px; }
  .anw td.standort { grid-column: span 6; padding: 0 !important; }
  .anw td.notiz { grid-column: span 6; padding: 0 !important; }
}
@media screen and (min-width: 601px) and (max-width: 900px) { .anw-zahlen-text b { font-size: 1.5rem; } }

/* Abmeldezeit je Benutzer (Nutzer 26.10.2026): Verwaltung → Benutzer → ✎ */
.leerlauf-feld { display: flex; flex-direction: column; gap: 4px; margin: 8px 0; }
.leerlauf-label { font-size: 1rem; font-weight: 600; }
.leerlauf-sel { min-height: 44px; font-size: 1rem; max-width: 22rem; }

/* Stammdaten, Gesamtliste, Verwaltung am Handy wie Kalender/Anwesenheit (Nutzer 26.10.2026):
   eine Zeile [Suchen][+ bzw. 🔒 Spalte][⋯], der Rest unter ⋯ (⋯ markiert, solange ein Filter aktiv ist);
   Verwaltung: Bereich als Auswahl statt 11 Knöpfen. Tablet quer/PC unverändert (Hülle display: contents). */
.stamm-kopf, .gl-kopf { display: contents; }
.leiste-mehr, .verw-sel { display: none; }
@media screen and (max-width: 900px) {
  .stamm-kopf, .gl-kopf { display: flex; flex-wrap: nowrap; align-items: center; gap: 6px; width: 100%; margin: 0 0 8px; }
  .stamm-kopf > .toolbar, .gl-kopf > .toolbar { display: contents; }
  .stamm-kopf > .toolbar > *, .gl-kopf > .toolbar > * { display: none !important; }
  .stamm-kopf > .toolbar > .search, .gl-kopf > .toolbar > .search { display: block !important; order: 1; flex: 1 1 auto; width: auto; min-width: 0; max-width: none; min-height: 44px; font-size: 1rem; }
  .stamm-kopf > .toolbar > .stamm-neu { display: inline-flex !important; order: 2; flex: 0 0 44px; min-width: 44px; min-height: 44px; padding: 0; justify-content: center; font-size: 1.25rem; }
  .stamm-neu .stamm-neu-text { display: none; }
  .gl-kopf > .toolbar > .bet-leiste:not(:empty) { display: inline-flex !important; order: 2; flex: 0 0 auto; }
  .gl-kopf > .toolbar > .bet-leiste .btn { min-height: 44px; }
  .stamm-kopf > .toolbar > .leiste-mehr, .gl-kopf > .toolbar > .leiste-mehr { display: inline-flex !important; order: 3; flex: 0 0 44px; min-width: 44px; min-height: 44px; padding: 0; justify-content: center; font-size: 1.25rem; font-weight: 700; }
  .leiste-mehr.gefiltert { background: var(--primary-soft); border-color: var(--primary); color: var(--primary); position: relative; }
  .leiste-mehr.gefiltert::after { content: ""; position: absolute; top: 5px; right: 5px; width: 9px; height: 9px; border-radius: 50%; background: var(--primary); }
  /* Verwaltung */
  #main > .verw-titel, #main > .verw-reiter { display: none !important; }
  .verw-sel { display: block; width: 100%; min-height: 44px; font-size: 1rem; font-weight: 700; margin: 0 0 10px; }
}

/* Import-Vorschau (26.10.2026): „Vergleichen“ + „✎ In Maske“ nebeneinander, am Handy untereinander */
.imp-knoepfe { display: flex; flex-wrap: wrap; gap: 6px; }
.imp-knoepfe .btn { min-height: 44px; }
/* Import-Vorschau (Nutzer 26.10.2026): Auswahl + Knöpfe in der Spalte „Aktion“ untereinander, Text nur zwischen
   ganzen Wörtern umbrechen (vorher „anywhere“ + Silbentrennung → „Numme / r“), Auswahl 44 px / 16 px */
.import-table td { overflow-wrap: break-word; -webkit-hyphens: none; hyphens: none; }
.import-table select.aktion { min-height: 44px; font-size: 1rem; }
.import-table td.imp-aktion .imp-knoepfe { margin-top: 6px; }
.import-table td.imp-aktion .imp-knoepfe .btn { flex: 1 1 auto; padding-left: 10px; padding-right: 10px; }
.import-table td.imp-aktion .aktion-info:empty { display: none; }

/* DEMO 06.11.2026: Schulung in Intern, Wiederherstellungscodes */
.schul-thema h3{margin:0 0 .25rem}.schul-liste{list-style:none;margin:.6rem 0 0;padding:0;display:grid;gap:.5rem}
.schul-link{display:flex;align-items:center;gap:.75rem;padding:.65rem .8rem;border:1px solid var(--line,#d9dfd9);border-radius:10px;text-decoration:none;color:inherit;min-height:44px}
.schul-link:hover,.schul-link:focus-visible{border-color:var(--accent,#1f5f3f)}
.schul-link>span:nth-child(2){flex:1;min-width:0}.schul-beschr{display:block;white-space:pre-line}
.schul-sym{font-size:1.4rem;flex:none}.schul-gesehen{flex:none;color:var(--accent,#1f5f3f);font-weight:700;min-width:1.2em;text-align:right}
.schul-wer{margin:.25rem 0 0 .8rem;font-size:.85rem}.zf-codes{columns:2;font-size:1.05rem;line-height:1.9}