/* =========================================================================
   KOMPAKTE ANSICHT (alle Seiten)
   Wird nach allen anderen Stylesheets geladen (head.php) und gilt, solange
   <body> die Klasse "tsp-dicht" trägt. Das ist der Standard; über den Knopf
   „Ansicht“ in der Kopfleiste kann jeder auf „Groß“ umstellen (Cookie
   tsp_ansicht=gross, gilt für diesen Browser).

   :where(body.tsp-dicht) zählt bei der Gewichtung nicht mit: Die Regeln
   ersetzen nur die allgemeinen Vorgaben (style.css, layout.css …); genauere
   Regeln einzelner Seiten bleiben. Ziel: weniger Scrollen – kleinere
   Abstände, Schrift und Tabellenzeilen. Auf dem Handy bleiben Knöpfe und
   Eingabefelder groß genug zum Tippen (mindestens 40 px, Schrift in Feldern
   16 px, sonst zoomt iOS beim Antippen hinein).
   ========================================================================= */
/* Knopf „Ansicht“ in der Kopfleiste (gilt in beiden Ansichten) */
.tsp-top .tsp-ansicht { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border: 1px solid var(--tsp-line, #d6deea); border-radius: 8px;
    color: var(--tsp-muted, #5a6680); background: none; font: inherit; font-size: 13px; cursor: pointer; line-height: 1.2; }
.tsp-top .tsp-ansicht .tsp-i { width: 16px; height: 16px; }
.tsp-top .tsp-ansicht:hover { color: var(--tsp-royal, #1660d6); border-color: var(--tsp-royal, #1660d6); background: none; }
.tsp-top .tsp-ansicht:focus-visible { outline: 3px solid rgba(22, 96, 214, .4); outline-offset: 2px; }
@media (max-width: 600px) {
    /* nur das Symbol; der Text bleibt für Bildschirmleser lesbar */
    .tsp-top .tsp-ansicht span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
    .tsp-top .tsp-ansicht { padding: 6px 8px; }
    .tsp-top .tsp-ansicht { min-height: 36px; min-width: 36px; justify-content: center; }
}
@media print { .tsp-top .tsp-ansicht { display: none; } }


/* Alles Weitere nur am Bildschirm; der Druck behält seine eigenen Regeln */
@media screen {
body.tsp-dicht { font-size: 13px; }

/* Rahmen: Kopfleiste, Seitenleiste, Inhalt – nur am PC; die Schublade auf dem Handy bleibt groß genug zum Tippen */
@media (min-width: 993px) {
    body.tsp-dicht { --tsp-top-h: 46px; --tsp-side-w: 220px; }
    :where(body.tsp-dicht) header.main-header.tsp-top { padding: 4px 18px; }
    :where(body.tsp-dicht) .tsp-brand { padding: 10px 16px 8px; }
    :where(body.tsp-dicht) .tsp-brand img { max-width: 140px; }
    :where(body.tsp-dicht) .tsp-nav { padding: 6px 8px 12px; }
    :where(body.tsp-dicht) .tsp-link, :where(body.tsp-dicht) .tsp-grp-btn { padding-top: 5px; padding-bottom: 5px; font-size: 11px; }
    :where(body.tsp-dicht) .tsp-grp-btn { font-size: 9.5px; padding-top: 7px; padding-bottom: 3px; }
    :where(body.tsp-dicht) .tsp-top .session-timer, :where(body.tsp-dicht) .tsp-top .btn-logout, :where(body.tsp-dicht) .tsp-top .tsp-ansicht { padding-top: 4px; padding-bottom: 4px; font-size: 11px; }
    :where(body.tsp-dicht) .tsp-top .user-badge { padding: 4px 9px; font-size: 10px; }
}
:where(body.tsp-dicht).tsp-mit-sidebar .approval-bar { padding-top: 7px; padding-bottom: 7px; font-size: 13px; }
body.tsp-dicht.tsp-mit-sidebar .container { margin: 12px auto; padding: 0 16px; }

/* Überschriften */
:where(body.tsp-dicht) h1 { font-size: 20px; margin: 0 0 8px; }
:where(body.tsp-dicht) h2 { font-size: 16.5px; margin: 0 0 8px; }
:where(body.tsp-dicht) h3 { font-size: 14.5px; margin: 0 0 6px; }
:where(body.tsp-dicht) h4 { font-size: 13px; margin: 10px 0 6px; }

/* Karten */
:where(body.tsp-dicht) .card { padding: 12px 14px; margin-bottom: 10px; border-radius: 10px; }
:where(body.tsp-dicht) .card > h2:first-child, :where(body.tsp-dicht) .card > h3:first-child { margin-top: 0; }

/* Tabellen */
/* Zellen bewusst mit Gewicht: auch Tabellen mit eigener Regel (.liste td …) werden niedriger */
@media (min-width: 769px) {
    body.tsp-dicht th, body.tsp-dicht td { padding-top: 4px; padding-bottom: 4px; }
    :where(body.tsp-dicht) th { font-size: 9.5px; }
}
:where(body.tsp-dicht) table { margin-top: 6px; font-size: 12.5px; }
:where(body.tsp-dicht) .bs-tabelle th, :where(body.tsp-dicht) .bs-tabelle td { padding: 4px 7px; }

/* Lange Spalten (nur kompakte Ansicht am PC; auf dem Handy sind die Listen Karten): eine Zeile, Rest mit „…“; der volle Text steht im title (Darüberfahren) */
@media (min-width: 769px) {
    :where(body.tsp-dicht) .tsp-kurz { display: block; max-width: var(--tsp-kurz, 220px); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}

/* Formulare */
@media (min-width: 601px) {
    :where(body.tsp-dicht) input:not(:where([type=checkbox], [type=radio], [type=file], [type=submit], [type=range], [type=color], [type=hidden])), :where(body.tsp-dicht) select, :where(body.tsp-dicht) textarea { padding: 5px 8px; font-size: 13px; }
}
:where(body.tsp-dicht) .bs-form { gap: 6px; }
:where(body.tsp-dicht) .bs-form label { font-size: 12px; gap: 3px; }
:where(body.tsp-dicht) .input-wrapper select { padding: 7px; font-size: 13px; }

/* Knöpfe */
@media (min-width: 601px) {
    :where(body.tsp-dicht) .bs-knopf { padding: 5px 11px; }
    :where(body.tsp-dicht) button { padding: 6px 11px; }
}

/* Einheitliche Knöpfe (knopf.css) am PC niedriger; auf dem Handy bleiben sie 44 px hoch */
@media (min-width: 601px) {
    html body.tsp-dicht :is(.bs-knopf, .va-knopf, .ep-knopf, .tp-knopf, .sb-knopf, .db-knopf, .btn-print, .btn-assign, .btn-calendar, .btn-save, .btn-edit, .btn-reset, .oa-knopf-rot, .ob-knopf-rot, .oa-knopf-rot-voll, .ob-knopf-rot-voll, .knopf-haupt, .knopf-neben, .knopf-gefahr, .knopf-gefahr-voll) { min-height: 34px; padding: 0 13px; font-size: 13px; gap: 6px; border-radius: 8px; }
    html body.tsp-dicht table :is(.bs-knopf, .va-knopf, .ep-knopf, .tp-knopf, .sb-knopf, .db-knopf, .btn-print, .btn-assign, .btn-calendar, .btn-save, .btn-edit, .btn-reset, .oa-knopf-rot, .ob-knopf-rot, .oa-knopf-rot-voll, .ob-knopf-rot-voll, .knopf-haupt, .knopf-neben, .knopf-gefahr, .knopf-gefahr-voll),
    html body.tsp-dicht .knopf-klein, html body.tsp-dicht .va-knopf--lila, html body.tsp-dicht .btn-print, html body.tsp-dicht .btn-assign { min-height: 28px; padding: 0 10px; font-size: 12px; border-radius: 7px; }
}

/* Meldungen und Hinweise */
:where(body.tsp-dicht) .bs-meldung { padding: 6px 10px; margin-bottom: 8px; }
:where(body.tsp-dicht) .bs-kopf { margin-bottom: 6px; }

/* Akten (Mitarbeiter, Kunde, Objekt, Subunternehmen)
   Nur am PC: für schmale Fenster und das Handy hat akte.css eigene Regeln (eine Spalte, Reiter als Schaltflächen). */
@media (min-width: 901px) {
    :where(body.tsp-dicht) .akte { grid-template-columns: 236px minmax(0, 1fr); gap: 12px; }
    :where(body.tsp-dicht) .akte-kopf { gap: 6px; }
    :where(body.tsp-dicht) .akte-foto { width: 88px; height: 106px; font-size: 28px; }
    :where(body.tsp-dicht) .oa-qr { width: 96px; height: 96px; padding: 5px; }
    :where(body.tsp-dicht) .akte-reiter { padding: 6px 12px 0; }
    :where(body.tsp-dicht) .akte-reiter a { padding: 5px 10px; font-size: 11px; }
    :where(body.tsp-dicht) .akte-pfeil, :where(body.tsp-dicht) .akte-zurliste { min-height: 32px; font-size: 11px; }
    :where(body.tsp-dicht) .akte-blaettern { grid-template-columns: 32px minmax(0, 1fr) 32px; }
    :where(body.tsp-dicht) .akte-bereiche { padding-top: 6px; }
    :where(body.tsp-dicht) .akte-bereiche a { min-height: 30px; font-size: 11px; }
}
@media (min-width: 601px) {
    :where(body.tsp-dicht) .akte-koerper, :where(body.tsp-dicht) .akte-reiter + .akte-koerper { padding: 8px 12px 12px; gap: 8px; }
    :where(body.tsp-dicht) .akte-felder { gap: 0 20px; }
    :where(body.tsp-dicht) .akte-feld { grid-template-columns: 160px minmax(0, 1fr); min-height: 28px; padding: 1px 0; gap: 8px; }
    :where(body.tsp-dicht) .akte-feld dt, :where(body.tsp-dicht) .akte-feld > label { font-size: 12.5px; }
    :where(body.tsp-dicht) .akte-titel { padding: 10px 14px 0; }
}
@media (max-width: 600px) {
    :where(body.tsp-dicht) .akte-feld { padding: 5px 0; }
}
:where(body.tsp-dicht) .akte-titel h2 { font-size: 17px; }
:where(body.tsp-dicht) .akte-titel + .akte-koerper { margin-top: 10px; }

/* Überblick */
:where(body.tsp-dicht) .ub { gap: 10px; }
:where(body.tsp-dicht) .ub-kopf h1 { font-size: 20px; }
:where(body.tsp-dicht) .ub-karte { padding: 11px 13px; gap: 8px; }
:where(body.tsp-dicht) .ub-karte-kopf h2 { font-size: 14.5px; }
:where(body.tsp-dicht) .ub-todo-zeile { padding: 5px 0; gap: 10px; }
:where(body.tsp-dicht) .ub-zahlen b, :where(body.tsp-dicht) .ub-bestand b { font-size: 19px; }
:where(body.tsp-dicht) .ub-knopf { min-height: 34px; padding: 0 12px; font-size: 12.5px; }
:where(body.tsp-dicht) .ub-saeule-bahn { height: 90px; }
:where(body.tsp-dicht) .ub-zl-bahn { height: 26px; }
:where(body.tsp-dicht) .ub-zl-blk { top: 3px; height: 20px; font-size: 11px; }
:where(body.tsp-dicht) .ub-raster, :where(body.tsp-dicht) .ub-spalte { gap: 10px; }

/* Tablet und Handy: Schrift etwas größer, Felder 16 px (sonst zoomt iOS) */
@media (max-width: 768px) {
    body.tsp-dicht { font-size: 14px; }
    :where(body.tsp-dicht) input:not(:where([type=checkbox], [type=radio], [type=file], [type=submit], [type=range], [type=color], [type=hidden])), :where(body.tsp-dicht) select, :where(body.tsp-dicht) textarea { font-size: 16px; }
}
/* Handy: etwas weniger Rand; Knöpfe und Felder behalten die Größen aus mobile.css und knopf.css */
@media (max-width: 600px) {
    body.tsp-dicht.tsp-mit-sidebar .container { padding: 0 10px; margin: 10px auto; }
}


/* Listen: Objekte (objekte.css) */
@media (min-width: 769px) {
    :where(body.tsp-dicht) .ol-seite { gap: 10px; }
    :where(body.tsp-dicht) .ol-kopf h1 { font-size: 17px; }
    :where(body.tsp-dicht) .ol-neu { min-height: 34px; padding: 0 13px; font-size: 11px; border-radius: 8px; }
    :where(body.tsp-dicht) .ol-ansicht a { min-height: 30px; padding: 0 12px; font-size: 11px; }
    :where(body.tsp-dicht) .ol-kunde select { min-height: 32px; font-size: 11px; }
    :where(body.tsp-dicht) .ol-icon { width: 30px; height: 30px; }
}

/* Status-Reiter über Listen (Aktiv / Inaktiv …) */
@media (min-width: 769px) {
    :where(body.tsp-dicht) .status-tabs { margin: 8px 0 8px; gap: 6px; }
    :where(body.tsp-dicht) .status-tab { padding: 5px 12px; font-size: 11px; gap: 6px; }
}

/* ---------------- Paket 2: Seiten mit eigenen Stylesheets (nur am PC) ---------------- */
@media (min-width: 769px) {
    /* Größen in rem (vor allem va.css, Veranstaltungen) mitverkleinern: 1rem = 14 px statt 16 px */
    html:has(> body.tsp-dicht) { font-size: 12px; }
    :where(body.tsp-dicht) .vp-pl-kopf, :where(body.tsp-dicht) .vp-chip small, :where(body.tsp-dicht) .osf-wt span { font-size: 9px; }

    /* Formulare mit Zeilen: Einstellungen (style.css .set-*), Veranstaltungen (va.css .va-*) */
    :where(body.tsp-dicht) .set-gruppe { padding: 6px 12px 2px; margin: 0 0 10px; }
    :where(body.tsp-dicht) .set-gruppe legend, :where(body.tsp-dicht) .va-gruppe legend { font-size: 12px; }
    :where(body.tsp-dicht) .set-zeile { padding: 4px 0; gap: 2px 14px; }
    :where(body.tsp-dicht) .va-form { padding: 12px 16px; margin-bottom: 16px; }
    :where(body.tsp-dicht) .va-gruppe { padding: 4px 12px 6px; margin: 0 0 10px; }
    :where(body.tsp-dicht) .va-zeile { padding: 4px 0; gap: 2px 14px; }

    /* Tabellen mit Sortierung (style.css .osl-tabelle): weniger Abstand links und rechts */
    :where(body.tsp-dicht) .osl-tabelle th, :where(body.tsp-dicht) .osl-tabelle td { padding-left: 8px; padding-right: 8px; }

    /* Veranstaltungsliste: Datum und Kunde dürfen umbrechen (die Zeilen sind ohnehin zweizeilig) */
    :where(body.tsp-dicht) #tbl_va td.va-datum { white-space: normal; min-width: 120px; }
    :where(body.tsp-dicht) #tbl_va td.va-kunde { white-space: normal; min-width: 120px; }
    :where(body.tsp-dicht) #tbl_va td.va-umbruch { min-width: 130px; }
    /* Veranstaltungsplanung: linke Spalte der Schichttabelle schmaler, damit nichts seitlich scrollt */
    :where(body.tsp-dicht) .vp-tabelle { min-width: 860px; --vp-links-b: 406px; }
    :where(body.tsp-dicht) .vp-tabelle.vp-mit-satz { min-width: 860px; --vp-links-b: 496px; }
    :where(body.tsp-dicht) .vp-mit-satz .vp-zeile { grid-template-columns: var(--vp-links-b) minmax(360px, 1fr); }
    :where(body.tsp-dicht) .vp-zeile { grid-template-columns: var(--vp-links-b) minmax(440px, 1fr); }
    :where(body.tsp-dicht) .vp-spalten { grid-template-columns: 114px 90px 78px 42px 40px; gap: 4px; }
    :where(body.tsp-dicht) .vp-mit-satz .vp-spalten { grid-template-columns: 114px 90px 78px 42px 40px 86px; }

    /* Lohnvorbereitung: viele Zahlenspalten – enger, Spaltenköpfe dürfen umbrechen */
    body.tsp-dicht .lv-tab th, body.tsp-dicht .lv-tab td { padding-left: 6px; padding-right: 6px; }
    body.tsp-dicht .lv-tab thead th { white-space: normal; vertical-align: bottom; }
    body.tsp-dicht .lv-tab table { min-width: 960px; }
    body.tsp-dicht .lv-detail .lv-tab table { min-width: 840px; }

    /* Stundenzettel: Abgleich-Marke und „laut Abgleich …“ in einer Zeile unter dem Einsatzort (Druck unverändert) */
    @media (max-width: 1399px) {
        :where(body.tsp-dicht) .timesheet-table td > strong + br:has(+ .abgl-badge) { display: none; }
        :where(body.tsp-dicht) .timesheet-table td > strong + br + .abgl-badge { margin-left: 6px; }
    }
    @media (min-width: 1400px) {
        :where(body.tsp-dicht) .timesheet-table td > .abgl-badge + br { display: none; }
        :where(body.tsp-dicht) .timesheet-table td > .abgl-badge { margin-right: 4px; }
    }

    /* Kontingente (kontingente.css) */
    :where(body.tsp-dicht) .ko-karten { gap: 10px; }
    :where(body.tsp-dicht) .ko-karte { padding: 9px 12px; gap: 5px; font-size: 11px; }
    :where(body.tsp-dicht) .ko-tag { margin-top: 8px; font-size: 12px; }
    :where(body.tsp-dicht) .ko-zeile { padding: 5px 10px; gap: 4px 10px; }

    /* Veranstaltungsplanung (va.css .vp-*) */
    :where(body.tsp-dicht) .vp-kopf { gap: 8px; }
    :where(body.tsp-dicht) .vp-daten { gap: 6px 16px; }
    :where(body.tsp-dicht) .vp-pl { padding: 3px 8px; min-height: 30px; }

    /* Tagesplanung (tagesplanung.css) */
    :where(body.tsp-dicht) .tp-kacheln { gap: 8px; }
    :where(body.tsp-dicht) .tp-kachel { padding: 8px 12px; }
    :where(body.tsp-dicht) .tp-kachel span { font-size: 10px; }
    :where(body.tsp-dicht) .tp-kachel strong { font-size: 18px; }
}
/* Schrift ab 769 px (Stufe 2); Tablet und Handy behalten die Werte von oben */
@media (min-width: 769px) {
    body.tsp-dicht { font-size: 11px; }
    :where(body.tsp-dicht).tsp-mit-sidebar .approval-bar { font-size: 11px; }
    :where(body.tsp-dicht) h1 { font-size: 17px; }
    :where(body.tsp-dicht) h2 { font-size: 14px; }
    :where(body.tsp-dicht) h3 { font-size: 12.5px; }
    :where(body.tsp-dicht) h4 { font-size: 11px; }
    :where(body.tsp-dicht) table { font-size: 11px; }
    :where(body.tsp-dicht) input:not(:where([type=checkbox], [type=radio], [type=file], [type=submit], [type=range], [type=color], [type=hidden])), :where(body.tsp-dicht) select, :where(body.tsp-dicht) textarea { font-size: 11px; }
    :where(body.tsp-dicht) .bs-form label { font-size: 10.5px; }
    :where(body.tsp-dicht) .input-wrapper select { font-size: 11px; }
    html body.tsp-dicht :is(.bs-knopf, .va-knopf, .ep-knopf, .tp-knopf, .sb-knopf, .db-knopf, .btn-print, .btn-assign, .btn-calendar, .btn-save, .btn-edit, .btn-reset, .oa-knopf-rot, .ob-knopf-rot, .oa-knopf-rot-voll, .ob-knopf-rot-voll, .knopf-haupt, .knopf-neben, .knopf-gefahr, .knopf-gefahr-voll) { min-height: 30px; padding: 0 12px; font-size: 11px; }
    html body.tsp-dicht table :is(.bs-knopf, .va-knopf, .ep-knopf, .tp-knopf, .sb-knopf, .db-knopf, .btn-print, .btn-assign, .btn-calendar, .btn-save, .btn-edit, .btn-reset, .oa-knopf-rot, .ob-knopf-rot, .oa-knopf-rot-voll, .ob-knopf-rot-voll, .knopf-haupt, .knopf-neben, .knopf-gefahr, .knopf-gefahr-voll),
    html body.tsp-dicht .knopf-klein, html body.tsp-dicht .va-knopf--lila, html body.tsp-dicht .btn-print, html body.tsp-dicht .btn-assign { min-height: 25px; padding: 0 9px; font-size: 10.5px; }
    :where(body.tsp-dicht) .akte-feld dt, :where(body.tsp-dicht) .akte-feld > label { font-size: 11px; }
    :where(body.tsp-dicht) .akte-titel h2 { font-size: 15px; }
    :where(body.tsp-dicht) .ub-kopf h1 { font-size: 17px; }
    :where(body.tsp-dicht) .ub-karte-kopf h2 { font-size: 12.5px; }
    :where(body.tsp-dicht) .ub-zahlen b, :where(body.tsp-dicht) .ub-bestand b { font-size: 17px; }
    :where(body.tsp-dicht) .ub-knopf { font-size: 11px; }
    :where(body.tsp-dicht) .ub-zl-blk { font-size: 10px; }
}

/* ---------------- Stufe 2: Breite und Fenster zum Anlegen von Schichten ---------------- */
/* Inhalt bis 1700 px breit, auch Seiten mit eigener, engerer Grenze */
@media (min-width: 901px) {
    body.tsp-dicht.tsp-mit-sidebar .container { max-width: 1700px; }
    :where(body.tsp-dicht) .ub { max-width: none; }
}
/* Kopfleiste: Uhr und Logout wie die übrigen Knöpfe (stärker als die erzeugten Regeln aus dicht_schrift.css) */
@media (min-width: 993px) {
    body.tsp-dicht .tsp-top :is(.session-timer, .btn-logout) { font-size: 11px; }
}
/* Mehr Platz: lange Angaben in den Listen erst später mit „…“ */
@media (min-width: 1700px) {
    :where(body.tsp-dicht) .osl-tabelle.ms-liste .tsp-kurz { --tsp-kurz: 200px; }
    :where(body.tsp-dicht) .osl-tabelle.ms-liste td.ms-ort .tsp-kurz { --tsp-kurz: 170px; }
    :where(body.tsp-dicht) .osl-tabelle.ms-liste td.ms-mail .tsp-kurz { --tsp-kurz: 240px; }
    :where(body.tsp-dicht) .osl-tabelle.su-liste .tsp-kurz { --tsp-kurz: 160px; }
    :where(body.tsp-dicht) .osl-tabelle.su-liste td.su-name .tsp-kurz { --tsp-kurz: 280px; }
    :where(body.tsp-dicht) .osl-tabelle.su-liste td.su-mail .tsp-kurz { --tsp-kurz: 240px; }
}

/* Schicht anlegen und bearbeiten (Veranstaltung „Neue Schicht“, Objekt „Schichten hinzufügen“, Masterschicht,
   mehrere Schichten bearbeiten, Schichtkalender):
   breit und zweispaltig, damit nichts gescrollt werden muss. Unter 1000 px bleibt es einspaltig. */
@media (min-width: 1000px) {
    body.tsp-dicht dialog.vp-dialog:not(.vp-dialog--schmal), body.tsp-dicht dialog.osf-dialog, body.tsp-dicht dialog.sk-dialog { width: min(1180px, calc(100vw - 32px)); }
    body.tsp-dicht dialog.vp-dialog:not(.vp-dialog--schmal) form.vp-form { display: block; columns: 2; column-gap: 22px; padding: 12px 18px; }
    body.tsp-dicht dialog.vp-dialog:not(.vp-dialog--schmal) form.vp-form > * { break-inside: avoid; margin: 0 0 8px; }
    body.tsp-dicht dialog.vp-dialog:not(.vp-dialog--schmal) form.vp-form > :is(h3, .vp-dialog-aktionen, p.osf-hinweis, .osf-kopf, .va-hilfe, .vp-bes-hinweis, .vp-zeitmeldung, .vp-bes-warn) { column-span: all; }
    body.tsp-dicht dialog.vp-dialog:not(.vp-dialog--schmal) form.vp-form > label { display: flex; }
    /* Fenster „Schicht“ der Veranstaltung: Besetzung beginnt immer die rechte Spalte – gleiche Anordnung beim Anlegen und Ändern */
    body.tsp-dicht #dlgSchicht form.vp-form > #s_bes_feld { break-before: column; }
    body.tsp-dicht .vp-form :is(input[type=text], input[type=date], input[type=number], select) { height: 28px; font-size: 11px; }
    body.tsp-dicht .vp-form label { font-size: 10.5px; gap: 2px; }
    body.tsp-dicht .vp-vr { padding: 5px 10px 7px; gap: 4px; }
    /* Liste „Eigener Mitarbeiter / Subunternehmen“: niedriger, sie scrollt in sich */
    body.tsp-dicht dialog.vp-dialog .vp-bes-liste { max-height: 150px; }

    body.tsp-dicht .sk-dialog-kopf { padding: 8px 18px; }
    body.tsp-dicht .sk-dialog-kopf h2 { font-size: 14px; }
    body.tsp-dicht .sk-dialog-inhalt { grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-flow: row dense; padding: 10px 18px; gap: 7px 16px; }
    body.tsp-dicht .sk-dialog-inhalt :is(select, input[type=date], input[type=time], input[type=number], input[type=text]) { min-height: 28px; height: 28px; font-size: 11px; }
    body.tsp-dicht :is(.sk-dialog-inhalt > label, .sk-frei > label, .sk-block-raster > label, .sk-radio > span, .sk-tage legend) { font-size: 10.5px; gap: 2px; }
    body.tsp-dicht .sk-chip span { min-height: 26px; padding: 0 9px; font-size: 11px; }
    body.tsp-dicht .sk-frei { grid-column: 1 / 3; grid-row: span 2; gap: 7px 12px; padding: 9px; align-content: start; }
    body.tsp-dicht .sk-dialog-inhalt:has(> .sk-frei:not([hidden])) > .sk-block { grid-column: 3 / 5; }
    body.tsp-dicht .sk-dialog-inhalt:not(:has(> .sk-frei:not([hidden]))) > .sk-block { grid-column: span 2; }
    body.tsp-dicht .sk-block { padding: 5px 10px 7px; gap: 5px; }
    body.tsp-dicht .sk-block legend { font-size: 11.5px; }
    body.tsp-dicht :is(.sk-block .sk-check, .sk-radio) { font-size: 11px; gap: 2px; }
    body.tsp-dicht .sk-block .sk-check input[type=radio] { width: 14px; height: 14px; }
    body.tsp-dicht .sk-block-raster { gap: 8px; }
    body.tsp-dicht .sk-summe { padding: 4px 8px; font-size: 10px; }
    body.tsp-dicht .sk-summe strong { font-size: 12px; }
    body.tsp-dicht :is(.sk-vorschau) { padding: 5px 10px; font-size: 11px; }
    body.tsp-dicht .sk-hinweis { font-size: 10.5px; }
    body.tsp-dicht .sk-dialog-fuss { padding: 8px 18px; }
}
} /* Ende @media screen */