@charset "UTF-8";
/*
 * Auszug der Bauteil-Regeln aus der App – ERZEUGT von php tools/assets_verteilen.php (tools/assets_auszuege.php).
 * Nie von Hand bearbeiten: Quelle sind die genannten Dateien unter public/. tests/GleichlaufTest.php prüft den Stand.
 * Klassen: kat-, unsichtbar, icon, datum, pruefsumme, blattnr, betrag, chip, chipreihe, anlagennr, mail, tel, ampel, stempel, plakette, siegel, konfidenz, laufzettel, kette, glied, kettenglyphe, luecke-marke, deckblatt, feldraster, blatt, aenderungen, folgezeile, vorschlag-marke, lagesatz, wiedervorlage, eingangskarte, karteikarte, schraffur, lineal, lineal-rahmen, fristenleiste, etikett, lebenslinie, lebenslinie-rahmen, legende
 */
/* public/assets/css/basis.css */
.kat-1 { --kat: var(--kat-1); }
.kat-2 { --kat: var(--kat-2); }
.kat-3 { --kat: var(--kat-3); }
.kat-4 { --kat: var(--kat-4); }
.kat-5 { --kat: var(--kat-5); }
.kat-6 { --kat: var(--kat-6); }
.kat-7 { --kat: var(--kat-7); }
.kat-8 { --kat: var(--kat-8); }
.kat-9 { --kat: var(--kat-9); }
.kat-10 { --kat: var(--kat-10); }
.kat-text { color: var(--kat, var(--tinte-2)); }
.kat-band { box-shadow: inset 4px 0 0 var(--kat, var(--linie-stark)); }
.datum, .betrag { font-variant-numeric: tabular-nums; }
.datum, .betrag, .pruefsumme, .blattnr { font-family: var(--schrift-mono); font-size: .92em; white-space: nowrap; }
.datum--leer, .betrag--leer, .pruefsumme--leer { color: var(--tinte-3); }
.pruefsumme { letter-spacing: .02em; color: var(--tinte-2); }
.blattnr { color: var(--tinte-2); }
.icon { width: 1.15em; height: 1.15em; flex: none; vertical-align: -.2em; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; overflow: visible; }
.icon--gross { width: 1.6em; height: 1.6em; }
.unsichtbar { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
.chipreihe .chip[aria-current] { color: var(--blatt); background: var(--tinte); border-color: var(--tinte); }
.chipreihe .chip[aria-current] .chip__kuerzel { color: inherit; }
.glied__plus { display: inline-grid; place-items: center; width: 1.75rem; height: 1.75rem; flex: none; color: var(--aktenblau); background: var(--blatt); border: 1.5px solid var(--aktenblau); border-radius: 50%; text-decoration: none; cursor: pointer; transition: background-color var(--bewegung-kurz), color var(--bewegung-kurz); }
.glied__plus:hover { color: var(--auf-aktenblau); background: var(--aktenblau); }
.glied__plus .icon { width: 1rem; height: 1rem; stroke-width: 2.4; }
.vorschlag-marke { display: inline-flex; align-items: center; gap: .3rem; font: 700 .66rem/1.2 var(--schrift); letter-spacing: .09em; text-transform: uppercase; color: var(--vorschlag); }
.vorschlag-marke::before { content: ""; width: .5rem; height: .5rem; background: var(--vorschlag); transform: rotate(45deg); border-radius: 1px; }
.folgezeile { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem 0; margin: 0; padding: .6rem .9rem; font-size: .875rem; line-height: 1.4; background: var(--blau-grund); border: 1px dashed color-mix(in srgb, var(--aktenblau) 45%, var(--linie)); border-radius: var(--radius); }
.folgezeile__pfeil { color: var(--aktenblau); margin-right: .55rem; }
.folgezeile__teil + .folgezeile__teil::before { content: "·"; margin: 0 .55rem; color: var(--tinte-3); }
.folgezeile__wert { font-family: var(--schrift-mono); font-weight: 650; font-size: .95em; }
.folgezeile__teil--ok .folgezeile__wert, .folgezeile__teil--ok { color: var(--ok); }
.folgezeile__teil--warn { color: var(--warn); }
.folgezeile__teil--stop { color: var(--stop); font-weight: 600; }
.folgezeile__teil--vorschlag { color: var(--vorschlag); }
.folgezeile.htmx-request { opacity: .6; }
.lineal-rahmen, .lebenslinie-rahmen__scroll { position: relative; }
.chip { display: inline-flex; align-items: center; gap: .35rem; max-width: 100%; min-height: 1.55rem; padding: .1rem .5rem; font-size: .78rem; font-weight: 600; line-height: 1.25; color: var(--tinte); text-decoration: none; white-space: nowrap; background: var(--blatt); border: 1px solid var(--linie-stark); border-radius: var(--radius); }
.chip .icon { width: .9rem; height: .9rem; }
.chip__text { overflow: hidden; text-overflow: ellipsis; }
a.chip:hover { border-color: var(--tinte-2); background: var(--karton-hell); }
.chip--leise { background: transparent; border-color: var(--linie); color: var(--tinte-2); }
.chip--ok { color: var(--ok); background: var(--ok-grund); border-color: color-mix(in srgb, var(--ok) 40%, var(--linie)); }
.chip--warn { color: var(--warn); background: var(--warn-grund); border-color: color-mix(in srgb, var(--warn) 45%, var(--linie)); }
.chip--stop { color: var(--stop); background: var(--stop-grund); border-color: color-mix(in srgb, var(--stop) 40%, var(--linie)); }
.chip--blau { color: var(--aktenblau); background: var(--blau-grund); border-color: color-mix(in srgb, var(--aktenblau) 40%, var(--linie)); }
.chip--vorschlag { color: var(--vorschlag); background: var(--vorschlag-grund); border-color: var(--vorschlag); }
.chip--kat { padding-left: .35rem; }
.chip__marke { width: .5rem; height: .9rem; flex: none; background: var(--kat, var(--tinte-3)); border-radius: 1px; }
.chip__kuerzel { font: 700 .72rem var(--schrift-mono); color: var(--tinte-2); }
.chipreihe { display: flex; flex-wrap: wrap; gap: .35rem; }
.anlagennr { display: inline-flex; align-items: center; flex: none; padding: .26rem .45rem .24rem; font: 700 .82rem/1 var(--schrift-mono); letter-spacing: .03em; white-space: nowrap; color: var(--tinte); text-decoration: none; background: var(--blatt); border: 1.5px solid var(--tinte); border-radius: var(--radius); box-shadow: inset 4px 0 0 var(--kat, transparent); }
.anlagennr[class*="kat-"] { padding-left: .7rem; }
a.anlagennr:hover { color: var(--blatt); background: var(--tinte); }
.anlagennr--gross { font-size: 1.1rem; padding: .4rem .65rem .36rem; }
.anlagennr--gross[class*="kat-"] { padding-left: .95rem; box-shadow: inset 6px 0 0 var(--kat, transparent); }
.tel, .mail { display: inline-flex; align-items: center; gap: .35rem; text-decoration: none; }
.tel:hover span, .mail:hover span { text-decoration: underline; }
.tel { font-family: var(--schrift-mono); font-size: .92em; }
.tel .icon, .mail .icon { width: .95rem; height: .95rem; }
.ampel { display: inline-flex; flex-wrap: wrap; align-items: center; gap: .15rem .4rem; font-size: .8125rem; font-weight: 600; line-height: 1.2; color: var(--tinte); }
.ampel__text, .ampel__tage { white-space: nowrap; }
.ampel__symbol { display: inline-grid; place-items: center; width: 1.2rem; height: 1.2rem; flex: none; font: 800 .74rem/1 var(--schrift); }
.ampel__tage { font: 500 .78rem var(--schrift-mono); color: var(--tinte-2); }
.ampel--rot { color: var(--stop); }
.ampel--rot .ampel__symbol { color: var(--blatt); background: var(--stop); border-radius: var(--radius); }
.ampel--gelb .ampel__symbol { color: var(--blatt); background: var(--warn); clip-path: polygon(50% 2%, 100% 98%, 0 98%); padding-top: .3rem; font-size: .66rem; }
.ampel--gruen .ampel__symbol { color: var(--ok); font-size: .95rem; }
.ampel--offen { color: var(--tinte-2); }
.ampel--offen .ampel__symbol { color: var(--tinte-2); font-size: .95rem; }
.ampel--ruhend { color: var(--tinte-2); font-weight: 500; }
.ampel--ruhend .ampel__symbol { color: var(--tinte-3); }
.ampel--kompakt .ampel__text, .ampel--kompakt .ampel__tage { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.ampel--kompakt { position: relative; }
.stempel { display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: .05rem; padding: .18rem .55rem .2rem; vertical-align: middle; font: 800 .7rem/1.15 var(--schrift); letter-spacing: .09em; text-transform: uppercase; white-space: nowrap; color: var(--tinte-2); border: 2px solid currentColor; border-radius: 3px; transform: rotate(-2deg); opacity: .93; }
.stempel__zusatz { font: 700 .76rem/1.15 var(--schrift-mono); letter-spacing: .02em; text-transform: none; }
.stempel--klein { font-size: .6rem; padding: .08rem .35rem; border-width: 1.5px; }
.stempel--gross { font-size: .95rem; padding: .35rem .85rem .38rem; border-width: 2.5px; }
.stempel--gross .stempel__zusatz { font-size: 1rem; }
.stempel--gerade { transform: none; }
.stempel--neu { animation: stempel-auf var(--bewegung-lang) ease-out both; }
.stempel--ohne_befund, .stempel--maengel_behoben, .stempel--erledigt, .stempel--behoben, .stempel--vollstaendig, .stempel--laeuft { color: var(--ok); }
.stempel--maengel, .stempel--quittung, .stempel--offen { color: var(--warn); }
.stempel--stoerung, .stempel--kuendigen, .stempel--luecken, .stempel--gekuendigt, .stempel--aussonderung { color: var(--stop); }
.stempel--instandsetzung, .stempel--beauftragt, .stempel--eroeffnet, .stempel--pruefung, .stempel--pflicht, .stempel--vertrag, .stempel--auszug { color: var(--aktenblau); }
.stempel--verworfen { color: var(--tinte-2); text-decoration: line-through; text-decoration-thickness: 2px; }
.stempel--nachtrag { color: var(--tinte-2); }
.stempel--uebernommen { color: var(--aktenblau); }
.stempel--deckblatt, .stempel--dokument, .stempel--beendet, .stempel--neutral { color: var(--tinte-2); }
@keyframes stempel-auf { from { opacity: 0; transform: rotate(-2deg) scale(1.15); } to { opacity: .93; transform: rotate(-2deg) scale(1); } }
.plakette { display: block; flex: none; width: 4.75rem; height: 4.75rem; --plakette: var(--ok); }
.plakette--s { width: 2.1rem; height: 2.1rem; }
.plakette--l { width: 8rem; height: 8rem; }
.plakette--gruen { --plakette: var(--ok); }
.plakette--gelb { --plakette: var(--warn); }
.plakette--rot { --plakette: var(--stop); }
.plakette--offen { --plakette: var(--tinte-3); }
.plakette__grund { fill: var(--blatt); stroke: var(--plakette); stroke-width: 1; }
.plakette__segment { fill: var(--plakette); stroke: var(--blatt); stroke-width: 1.1; }
.plakette--offen .plakette__segment { fill: var(--linie); }
.plakette__segment--faellig { fill: var(--tinte); }
.plakette__monat { fill: var(--blatt); font: 700 8.5px var(--schrift); }
.plakette--offen .plakette__monat { fill: var(--tinte-2); }
.plakette__monat--faellig { font-size: 10px; }
.plakette__kern { fill: var(--blatt); stroke: var(--plakette); stroke-width: 1.2; }
.plakette__kerbe { fill: var(--tinte); }
.plakette__jahr { fill: var(--tinte); font: 800 23px var(--schrift-mono); letter-spacing: -.5px; }
.plakette__jahr-voll { fill: var(--tinte-2); font: 600 6.5px var(--schrift-mono); letter-spacing: .5px; }
.plakette--s .plakette__monat, .plakette--s .plakette__jahr-voll { display: none; }
.plakette--s .plakette__jahr { font-size: 26px; }
.siegel { display: inline-flex; flex-wrap: wrap; align-items: center; gap: .35rem .55rem; margin: 0; padding: .25rem .55rem; font-size: .78rem; color: var(--tinte-2); background: var(--blatt); border: 1px solid var(--linie-stark); border-radius: var(--radius); }
.siegel .icon { width: .95rem; height: .95rem; color: var(--ok); }
.siegel__text { font-weight: 600; color: var(--tinte); }
.siegel--gebrochen { border-color: var(--stop); background: var(--stop-grund); }
.siegel--gebrochen .icon, .siegel--gebrochen .siegel__text { color: var(--stop); }
.konfidenz { display: inline-flex; align-items: center; gap: .35rem; font-size: .78rem; font-weight: 650; white-space: nowrap; }
.konfidenz__symbol { display: inline-grid; place-items: center; width: 1.1rem; height: 1.1rem; font-size: .7rem; border-radius: 50%; color: var(--blatt); }
.konfidenz--eindeutig { color: var(--ok); }
.konfidenz--eindeutig .konfidenz__symbol { background: var(--ok); }
.konfidenz--mehrdeutig { color: var(--warn); }
.konfidenz--mehrdeutig .konfidenz__symbol { background: var(--warn); }
.konfidenz--unbekannt { color: var(--tinte-2); }
.konfidenz--unbekannt .konfidenz__symbol { background: var(--tinte-3); }
.laufzettel { display: flex; list-style: none; margin: 0; padding: 0; counter-reset: stufe; }
.laufzettel__stufe { position: relative; flex: 1 1 0; display: grid; justify-items: start; align-content: start; gap: .1rem; min-width: 5.5rem; padding: 1.9rem .5rem 0 0; counter-increment: stufe; }
.laufzettel__stufe::before { content: ""; position: absolute; top: .7rem; left: 1.7rem; right: .25rem; height: 2px; background: var(--linie-stark); }
.laufzettel__stufe:last-child::before { display: none; }
.laufzettel__stufe--erledigt::before { background: var(--tinte); }
.laufzettel__punkt { position: absolute; top: 0; left: 0; display: grid; place-items: center; width: 1.45rem; height: 1.45rem; font: 700 .7rem/1 var(--schrift-mono); color: var(--tinte-2); background: var(--blatt); border: 2px dashed var(--linie-stark); border-radius: 50%; }
.laufzettel__punkt::after { content: counter(stufe); }
.laufzettel__stufe--erledigt .laufzettel__punkt { color: var(--blatt); background: var(--tinte); border: 2px solid var(--tinte); }
.laufzettel__stufe--erledigt .laufzettel__punkt::after { content: "\2713"; }
.laufzettel__stufe--aktiv .laufzettel__punkt { color: var(--aktenblau); border: 2px solid var(--aktenblau); box-shadow: 0 0 0 3px var(--blau-grund); }
.laufzettel__label { font-size: .8125rem; font-weight: 600; color: var(--tinte-2); }
.laufzettel__stufe--aktiv .laufzettel__label { color: var(--tinte); font-weight: 700; }
.laufzettel__datum .datum { font-size: .75rem; color: var(--tinte-2); }
.laufzettel--verworfen { opacity: .6; }
.laufzettel--verworfen .laufzettel__label { text-decoration: line-through; }
.laufzettel--stoerung .laufzettel__stufe--aktiv .laufzettel__punkt { color: var(--stop); border-color: var(--stop); box-shadow: 0 0 0 3px var(--stop-grund); }
.kette { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.1rem; align-items: stretch; }
.glied { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: .6rem; min-height: 3.75rem; padding: .55rem .65rem; color: var(--tinte); text-decoration: none; background: var(--blatt); border: 1.5px solid var(--linie-stark); border-radius: 10px; transition: border-color var(--bewegung-kurz), background-color var(--bewegung-kurz); }
.glied + .glied::before { content: ""; position: absolute; left: calc(-1.1rem - 1.5px); top: 50%; width: 1.1rem; height: 2px; margin-top: -1px; background: var(--tinte-2); }
.glied--luecke::before { height: 6px !important; margin-top: -3px !important; background: var(--luecke) !important; }
a.glied:hover { border-color: var(--aktenblau); background: var(--blau-grund); }
.glied__key { display: grid; place-items: center; width: 1.65rem; height: 1.65rem; font: 800 .76rem/1 var(--schrift-mono); color: var(--tinte); background: var(--karton); border-radius: 50%; }
.glied__inhalt { display: grid; min-width: 0; line-height: 1.25; }
.glied__art { font-size: .62rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--tinte-2); }
.glied__label, .glied__detail { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; overflow-wrap: anywhere; }
.glied__label { font-weight: 650; font-size: .86rem; }
.glied__detail { font-size: .75rem; color: var(--tinte-2); }
.glied__status { font-weight: 800; font-size: .9rem; }
.glied--ok { border-color: color-mix(in srgb, var(--ok) 50%, var(--linie)); }
.glied--ok .glied__key { color: var(--ok); background: var(--ok-grund); }
.glied--ok .glied__status { color: var(--ok); }
.glied--warn { border-color: var(--warn); }
.glied--warn .glied__key { color: var(--blatt); background: var(--warn); }
.glied--warn .glied__status { color: var(--warn); }
.glied--stop { border-color: var(--stop); background: var(--stop-grund); }
.glied--stop .glied__key { color: var(--blatt); background: var(--stop); }
.glied--stop .glied__status { color: var(--stop); }
.glied--luecke { border: 1.5px dashed var(--tinte-2); padding-top: .8rem; }
.glied--luecke::after { content: ""; position: absolute; left: 8px; right: 8px; top: -1.5px; height: 6px; background: var(--luecke); border-radius: 0 0 2px 2px; }
.glied--luecke .glied__key { background: transparent; border: 1.5px dashed var(--tinte-2); }
.glied--luecke .glied__label { color: var(--tinte-2); font-style: italic; }
@container (max-width: 52rem) { .kette { grid-template-columns: repeat(2, minmax(0, 1fr)); } .glied:nth-child(3)::before { display: none; } }
.kettenglyphe { display: inline-flex; gap: 2px; vertical-align: middle; }
.kettenglyphe__glied { display: inline-grid; place-items: start center; width: 1.15rem; height: 1.2rem; padding-top: .08rem; font: 800 .6rem/1 var(--schrift-mono); color: var(--tinte-2); background: var(--blatt); border: 1.5px solid var(--linie-stark); border-radius: 3px; }
.kettenglyphe__glied--ok { color: var(--ok); border-color: var(--ok); background: var(--ok-grund); }
.kettenglyphe__glied--warn { color: var(--blatt); border-color: var(--warn); background: var(--warn); }
.kettenglyphe__glied--stop { color: var(--blatt); border-color: var(--stop); background: var(--stop); box-shadow: inset 0 0 0 1px var(--blatt); }
.kettenglyphe__glied { position: relative; }
.kettenglyphe__glied--warn::after, .kettenglyphe__glied--stop::after { position: absolute; left: 0; right: 0; bottom: .06rem; font: 800 .5rem/1 var(--schrift-mono); text-align: center; }
.kettenglyphe__glied--warn::after { content: "!"; }
.kettenglyphe__glied--stop::after { content: "\2715"; }
.kettenglyphe__glied--luecke { color: var(--tinte); border: 1.5px dashed var(--tinte-2); background: var(--luecke) bottom / 100% 40% no-repeat, var(--blatt); }
.luecke-marke { display: inline-block; width: 1.5rem; height: .65rem; vertical-align: middle; background: var(--luecke); border-radius: 1px; }
.deckblatt { position: relative; margin: 1.7rem 0 1.25rem; padding: 1.35rem 1.5rem 1.25rem 1.75rem; background: var(--karton); border: 1px solid var(--linie); border-radius: 0 var(--radius-gross) var(--radius-gross) var(--radius-gross); box-shadow: inset 6px 0 0 var(--kat, var(--aktenblau)); }
.deckblatt::before { content: attr(data-reiter); position: absolute; left: -1px; top: -1.65rem; height: 1.65rem; display: flex; align-items: center; padding: 0 1rem 0 .9rem; font: 700 .68rem/1 var(--schrift-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--tinte-2); background: var(--karton); border: 1px solid var(--linie); border-bottom: 0; border-radius: var(--radius-gross) var(--radius-gross) 0 0; }
.deckblatt:not([data-reiter])::before { content: "Akte"; }
.deckblatt__kopf { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 1rem 1.5rem; }
.deckblatt__titel { min-width: 0; flex: 1 1 24rem; }
.deckblatt__nr { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .75rem; margin: 0 0 .15rem; }
.deckblatt__nummer { font: 700 2rem/1.1 var(--schrift-mono); letter-spacing: .01em; }
.deckblatt__bezeichnung { margin: 0 0 .5rem; font-size: 1.35rem; font-weight: 600; letter-spacing: -.01em; }
.deckblatt__zeile { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .75rem; margin: 0; font-size: .875rem; color: var(--tinte-2); }
.deckblatt__seite { display: flex; align-items: center; gap: .9rem; }
.deckblatt__fuss { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem 1rem; margin-top: 1rem; }
.deckblatt__aktionen { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; padding-top: 1rem; border-top: 1px dashed var(--linie-stark); }
.feldraster { display: grid; grid-template-columns: repeat(auto-fill, minmax(11.5rem, 1fr)); margin: 1rem 0 0; background: var(--blatt); border-top: 1px solid var(--linie-stark); border-left: 1px solid var(--linie-stark); }
.feldraster__feld { min-width: 0; padding: .42rem .65rem .5rem; border-right: 1px solid var(--linie-stark); border-bottom: 1px solid var(--linie-stark); }
.feldraster__feld--breit { grid-column: span 2; }
.feldraster dt, .feldraster__label { margin: 0 0 .12rem; font-size: .64rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; color: var(--tinte-2); }
.feldraster dd, .feldraster__wert { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .5rem; margin: 0; font-weight: 550; overflow-wrap: anywhere; }
.feldraster__feld--luecke dd::before, .feldraster__feld--luecke .feldraster__wert::before { content: ""; width: 1.6rem; height: .7rem; background: var(--luecke); border-radius: 1px; }
.feldraster__feld--luecke dd { color: var(--tinte-2); font-style: italic; font-weight: 500; }
.blatt { position: relative; min-height: 7.5rem; margin: 0 0 1rem; padding: 1.2rem 1.5rem 1.2rem 3rem; background: var(--blatt); border: 1px solid var(--linie); border-radius: var(--radius); }
.blatt::before, .blatt::after { content: ""; position: absolute; left: 1.05rem; width: .72rem; height: .72rem; border-radius: 50%; background: var(--papier); border: 1px solid var(--linie-stark); box-shadow: inset 0 1px 2px rgba(0, 0, 0, .14); }
.blatt::before { top: calc(50% - 2.6rem); }
.blatt::after { top: calc(50% + 1.9rem); }
.blatt--ohne-lochung { padding-left: 1.5rem; }
.blatt--ohne-lochung::before, .blatt--ohne-lochung::after { display: none; }
.blatt__kopf { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: .5rem 1rem; padding-bottom: .65rem; margin-bottom: .9rem; border-bottom: 1px dashed var(--linie-stark); }
.blatt__nr { margin: 0 0 .15rem; font: 600 .76rem var(--schrift-mono); letter-spacing: .03em; color: var(--tinte-2); }
.blatt__titel { margin: 0; font-size: 1.1rem; }
.blatt__inhalt > :last-child { margin-bottom: 0; }
.blatt__fuss { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .35rem 1rem; margin-top: 1rem; padding-top: .6rem; font: .74rem/1.4 var(--schrift-mono); color: var(--tinte-2); border-top: 1px solid var(--linie); }
.blatt__navigation { display: flex; justify-content: space-between; gap: .5rem; margin-top: .5rem; }
.blatt--nachtrag { margin-left: 2rem; min-height: 0; background: var(--karton-hell); border-style: dashed; border-color: var(--linie-stark); }
.blatt--nachtrag::before, .blatt--nachtrag::after { display: none; }
.blatt--nachtrag { padding-left: 1.5rem; }
.blatt--a4 { max-width: 48rem; margin-left: auto; margin-right: auto; aspect-ratio: auto; }
.blatt--neu { animation: blatt-ab var(--bewegung-lang) ease-out both; }
.aenderungen { display: grid; gap: .25rem; margin: 0; font-size: .875rem; }
.aenderungen > div { display: grid; grid-template-columns: 10rem minmax(0, 1fr); gap: .75rem; }
.aenderungen dt { color: var(--tinte-2); }
.aenderungen dd { margin: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: .4rem; }
.aenderungen del { color: var(--tinte-2); text-decoration-color: var(--stop); }
.aenderungen ins { text-decoration: none; font-weight: 650; background: var(--ok-grund); padding: 0 .2em; border-radius: var(--radius); }
.lagesatz { margin: 0 0 1.25rem; font-size: clamp(1.1rem, 1.9vw, 1.42rem); line-height: 1.45; font-weight: 550; letter-spacing: -.01em; }
.lagesatz__teil { white-space: nowrap; }
.lagesatz__teil + .lagesatz__teil::before { content: "·"; margin: 0 .45rem; color: var(--tinte-3); font-weight: 400; }
.lagesatz__zahl { font-family: var(--schrift-mono); font-weight: 700; }
.lagesatz__teil--stop { color: var(--stop); }
.lagesatz__teil--warn .lagesatz__zahl { color: var(--warn); }
.lagesatz__teil--ok { color: var(--ok); }
.lagesatz a { color: inherit; text-decoration-color: color-mix(in srgb, currentColor 40%, transparent); }
.wiedervorlage { display: grid; gap: 1.35rem; }
.wiedervorlage__kopf { display: inline-flex; align-items: center; gap: .55rem; margin: 0; padding: .38rem .85rem .36rem; font-size: .74rem; font-weight: 750; letter-spacing: .09em; text-transform: uppercase; color: var(--tinte); background: var(--karton); border: 1px solid var(--linie); border-bottom: 0; border-radius: var(--radius-gross) var(--radius-gross) 0 0; }
.wiedervorlage__gruppe--stop .wiedervorlage__kopf { box-shadow: inset 0 3px 0 var(--stop); }
.wiedervorlage__gruppe--warn .wiedervorlage__kopf { box-shadow: inset 0 3px 0 var(--warn); }
.wiedervorlage__liste { list-style: none; margin: 0; padding: 0; background: var(--blatt); border: 1px solid var(--linie); border-radius: 0 var(--radius) var(--radius) var(--radius); }
.wiedervorlage__zeile { display: grid; grid-template-columns: 8.75rem auto minmax(0, 1fr) auto auto; align-items: center; gap: .5rem 1rem; padding: .7rem 1rem; border-bottom: 1px solid var(--linie); }
.wiedervorlage__zeile:last-child { border-bottom: 0; }
.wiedervorlage__text { min-width: 0; }
.wiedervorlage__titel { margin: 0; font-weight: 600; line-height: 1.3; }
.wiedervorlage__titel a { color: var(--tinte); text-decoration: none; }
.wiedervorlage__titel a:hover { color: var(--aktenblau); text-decoration: underline; }
.wiedervorlage__detail { margin: .1rem 0 0; font-size: .8rem; color: var(--tinte-2); }
.wiedervorlage__datum { font: .82rem var(--schrift-mono); color: var(--tinte-2); white-space: nowrap; }
.wiedervorlage__aktionen { display: flex; gap: .35rem; justify-content: flex-end; }
.wiedervorlage__zeile--quittiert { background: color-mix(in srgb, var(--karton) 25%, transparent); }
.wiedervorlage__zeile--quittiert .wiedervorlage__titel { color: var(--tinte-2); }
.wiedervorlage__quittung { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .5rem; margin: .3rem 0 0; font-size: .78rem; color: var(--tinte-2); }
.wiedervorlage__leer { padding: .9rem 1rem; color: var(--tinte-2); font-size: .875rem; }
.eingangskarte { display: grid; gap: .85rem; padding: 1rem 1.1rem 1.05rem; margin-bottom: 1rem; background: var(--blatt); border: 1px solid var(--linie); border-left: 4px solid var(--tinte-3); border-radius: var(--radius); }
.eingangskarte--eindeutig { border-left-color: var(--ok); }
.eingangskarte--mehrdeutig { border-left-color: var(--warn); }
.eingangskarte--unbekannt { border-left-color: var(--tinte-3); }
.eingangskarte__kopf { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: .65rem; }
.eingangskarte__kopf > .icon { width: 1.4rem; height: 1.4rem; color: var(--tinte-2); }
.eingangskarte__datei { margin: 0; font: 600 .84rem/1.35 var(--schrift-mono); overflow-wrap: anywhere; }
.eingangskarte__meta { display: block; font: .75rem var(--schrift); color: var(--tinte-2); }
.eingangskarte__grund { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .6rem; margin: 0; padding: .45rem .65rem; font-size: .8125rem; color: var(--tinte-2); background: var(--karton-hell); border-radius: var(--radius); }
.eingangskarte__grund strong { color: var(--tinte); font-family: var(--schrift-mono); font-weight: 650; }
.eingangskarte__fuss { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; padding-top: .75rem; border-top: 1px solid var(--linie); }
.eingangskarte__fuss .knopf--primaer { margin-left: auto; }
.eingangskarte--abgelegt { animation: karte-weg var(--bewegung-lang) ease-in forwards; }
.karteikarte { display: grid; align-content: start; background: var(--blatt); border: 1px solid var(--linie); border-radius: var(--radius); }
.karteikarte__kopf { display: flex; align-items: baseline; justify-content: space-between; gap: .5rem; padding: .8rem 1rem .6rem; border-bottom: 2px solid color-mix(in srgb, var(--stop) 55%, var(--linie)); }
.karteikarte__name { margin: 0; font-size: 1rem; }
.karteikarte__name a { color: var(--tinte); text-decoration: none; }
.karteikarte__name a:hover { color: var(--aktenblau); text-decoration: underline; }
.karteikarte__gewerk { font-size: .75rem; font-weight: 650; letter-spacing: .06em; text-transform: uppercase; color: var(--tinte-2); white-space: nowrap; }
.karteikarte__inhalt { display: grid; gap: .45rem; padding: .7rem 1rem .8rem; font-size: .85rem; }
.karteikarte__kontakt { display: grid; gap: .1rem; }
.karteikarte__kontakt strong { font-weight: 650; }
.karteikarte__rolle { font-size: .75rem; color: var(--tinte-2); }
.karteikarte__notdienst { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin: 0; padding: .35rem .55rem; color: var(--stop); background: var(--stop-grund); border-radius: var(--radius); font-weight: 650; font-size: .82rem; }
.karteikarte__notdienst .tel { color: var(--stop); }
.karteikarte__fuss { display: flex; flex-wrap: wrap; gap: .25rem .75rem; padding: .55rem 1rem; font-size: .76rem; color: var(--tinte-2); border-top: 1px solid var(--linie); background: var(--karton-hell); }
.schraffur__a { fill: var(--signalgelb); }
.schraffur__b { fill: var(--luecke-streifen); }
.schraffur__stop { fill: var(--stop); }
.schraffur__grund { fill: var(--blatt); }
.lineal-rahmen { margin: 0 0 .75rem; overflow-x: auto; }
.lineal { display: block; width: 100%; min-width: 30rem; height: auto; font-family: var(--schrift); }
.lineal__achse { stroke: var(--linie-stark); stroke-width: 1.5; }
.lineal__takt { stroke: var(--linie-stark); stroke-width: 1; }
.lineal__jahr { fill: var(--tinte-2); font: 600 10.5px var(--schrift-mono); }
.lineal__laufzeit { fill: var(--aktenblau); }
.lineal__laufzeit--offen { fill: color-mix(in srgb, var(--aktenblau) 70%, transparent); }
.lineal__verlaengerung { fill: var(--blau-grund); stroke: var(--aktenblau); stroke-width: 1.5; stroke-dasharray: 5 4; }
.lineal__fenster { stroke: var(--stop); stroke-width: 1.2; opacity: .85; }
.lineal__stichtag { stroke: var(--stop); stroke-width: 2; }
.lineal__stichtag-text { fill: var(--stop); font: 700 12px var(--schrift); }
.lineal__datum { fill: var(--tinte-2); font: 11px var(--schrift-mono); }
.lineal__heute { stroke: var(--tinte); stroke-width: 1.5; stroke-dasharray: 3 3; }
.lineal__heute-punkt { fill: var(--tinte); }
.lineal__heute-text { fill: var(--tinte); font: 700 11px var(--schrift); }
.lebenslinie-rahmen { margin: 0 0 1rem; }
.lebenslinie-rahmen__scroll { overflow-x: auto; background: var(--blatt); border: 1px solid var(--linie); border-radius: var(--radius); -webkit-overflow-scrolling: touch; }
.lebenslinie { display: block; width: 100%; min-width: 46rem; height: auto; font-family: var(--schrift); }
.lebenslinie__bahn { fill: var(--blatt); }
.lebenslinie__bahn--b { fill: var(--karton-hell); }
.lebenslinie__bahnlabel { fill: var(--tinte); font: 600 12.5px var(--schrift); }
.lebenslinie__spur { stroke: var(--linie-stark); stroke-width: 1; stroke-dasharray: 2 3; }
.lebenslinie__achse { stroke: var(--tinte-2); stroke-width: 1; }
.lebenslinie__raster { stroke: var(--linie); stroke-width: 1; }
.lebenslinie__takt { stroke: var(--tinte-3); stroke-width: 1; }
.lebenslinie__jahr { fill: var(--tinte-2); font: 700 11.5px var(--schrift-mono); }
.lebenslinie__heute { stroke: var(--aktenblau); stroke-width: 1.5; }
.lebenslinie__heute-flagge { fill: var(--aktenblau); }
.lebenslinie__heute-text { fill: var(--auf-aktenblau); font: 700 9.5px var(--schrift); }
.lebenslinie__marke { stroke: var(--blatt); stroke-width: 1.5; }
.lebenslinie__marke--ohne_befund, .lebenslinie__marke--maengel_behoben { fill: var(--ok); }
.lebenslinie__marke--maengel { fill: var(--warn); }
.lebenslinie__marke--plan, .lebenslinie__marke--offen { fill: var(--blatt); stroke: var(--aktenblau); stroke-width: 1.6; stroke-dasharray: 3 2.2; }
.lebenslinie__marke--ueberfaellig { fill: var(--stop-grund); stroke: var(--stop); stroke-width: 1.8; }
.lebenslinie__marke--stoerung { fill: var(--stop); }
.lebenslinie__marke--instandsetzung { fill: var(--aktenblau); }
.lebenslinie__marke--dokument { fill: var(--tinte-2); }
.lebenslinie__haken { fill: none; stroke: var(--blatt); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.lebenslinie__kreuz { fill: none; stroke: var(--stop); stroke-width: 1.6; stroke-linecap: round; }
.lebenslinie__balken { stroke: none; }
.lebenslinie__balken--ausfall { fill: color-mix(in srgb, var(--stop) 30%, var(--blatt)); stroke: var(--stop); stroke-width: 1; }
.lebenslinie__balken--vertrag { fill: color-mix(in srgb, var(--aktenblau) 22%, var(--blatt)); stroke: var(--aktenblau); stroke-width: 1; }
.lebenslinie__balken--verlaengerung { fill: none; stroke: var(--aktenblau); stroke-width: 1.2; stroke-dasharray: 4 3; }
.lebenslinie__balken--kuendigung { stroke: var(--stop); stroke-width: .8; }
.lebenslinie__balken--luecke { stroke: var(--tinte); stroke-width: .8; }
.lebenslinie__link { cursor: pointer; }
.lebenslinie__link:hover .lebenslinie__marke, .lebenslinie__link:focus .lebenslinie__marke { stroke: var(--tinte); stroke-width: 2; }
.lebenslinie__link:focus { outline: none; }
.lebenslinie__link:focus-visible .lebenslinie__marke { stroke: var(--aktenblau); stroke-width: 3; }
.legende { display: flex; flex-wrap: wrap; gap: .35rem 1rem; margin-top: .5rem; font-size: .75rem; color: var(--tinte-2); }
.legende__eintrag { display: inline-flex; align-items: center; gap: .35rem; }
.legende__marke { width: 1rem; height: 1rem; }
.legende__balken { display: inline-block; width: 1.4rem; height: .6rem; border-radius: 1px; }
.legende__balken--ausfall { background: color-mix(in srgb, var(--stop) 30%, var(--blatt)); border: 1px solid var(--stop); }
.legende__balken--kuendigung { background: var(--fenster); box-shadow: inset 0 0 0 1px var(--stop); }
@media (max-width: 1100px) { .kette { grid-template-columns: repeat(2, minmax(0, 1fr)); } .glied:nth-child(3)::before { display: none; } .wiedervorlage__zeile { grid-template-columns: 8.75rem minmax(0, 1fr) auto; } .wiedervorlage__zeile > .anlagennr, .wiedervorlage__zeile > .chip { grid-column: 2; grid-row: 1; justify-self: start; } .wiedervorlage__text { grid-column: 2 / -1; } .wiedervorlage__datum { grid-column: 3; grid-row: 1; justify-self: end; } .wiedervorlage__aktionen { grid-column: 2 / -1; justify-content: flex-start; } }
@media (max-width: 759px) { .lagesatz__teil { white-space: normal; } .kette { grid-template-columns: minmax(0, 1fr); gap: .8rem; } .glied + .glied::before, .glied:nth-child(3)::before { display: block; left: 1.35rem; top: calc(-.8rem - 1.5px); width: 2px; height: .8rem; margin-top: 0; } .glied--luecke::before { width: 6px !important; height: .8rem !important; margin-top: 0 !important; left: calc(1.35rem - 2px) !important; } .laufzettel__stufe { min-width: 0; } .wiedervorlage__zeile { grid-template-columns: minmax(0, 1fr) auto; padding: .7rem .8rem; } .wiedervorlage__zeile > .ampel { grid-column: 1; } .wiedervorlage__zeile > .anlagennr, .wiedervorlage__zeile > .chip { grid-column: 2; grid-row: 1; justify-self: end; } .wiedervorlage__text, .wiedervorlage__aktionen { grid-column: 1 / -1; } .wiedervorlage__datum { grid-column: 1; grid-row: auto; justify-self: start; } .deckblatt { padding: 1.1rem 1rem 1rem 1.25rem; } .deckblatt__nummer { font-size: 1.6rem; } .feldraster { grid-template-columns: repeat(2, minmax(0, 1fr)); } .feldraster__feld--breit { grid-column: 1 / -1; } .blatt { padding: 1rem 1rem 1rem 2.4rem; } .blatt::before, .blatt::after { left: .8rem; } .blatt--nachtrag { margin-left: .75rem; padding-left: 1rem; } .eingangskarte__kopf { grid-template-columns: auto minmax(0, 1fr); } .eingangskarte__kopf > .konfidenz { grid-column: 2; } .eingangskarte__fuss .knopf--primaer { margin-left: 0; width: 100%; } }
/* public/assets/css/modul/lage.css */
.lagesatz--zweit { font-size: 1rem; font-weight: 500; color: var(--tinte-2); }
.lagesatz--zweit .lagesatz__zahl { color: var(--tinte); }
.lagesatz--zweit .lagesatz__teil--stop .lagesatz__zahl { color: var(--stop); }
.lagesatz__teil + .lagesatz__teil--anschluss::before { content: ","; margin: 0 .4rem 0 -.3em; color: var(--tinte-2); }
.lagesatz a:hover { text-decoration-thickness: 2px; }
.fristenleiste { display: block; width: 100%; height: auto; font-family: var(--schrift); }
.fristenleiste__monat { fill: var(--blatt); }
.fristenleiste__monat--b { fill: var(--karton-hell); }
.fristenleiste__monatstext { fill: var(--tinte-2); font: 700 11px var(--schrift-mono); letter-spacing: .04em; }
.fristenleiste__monatslinie { stroke: var(--linie); stroke-width: 1; }
.fristenleiste__takt { stroke: var(--tinte-3); stroke-width: 1; }
.fristenleiste__tag { fill: var(--tinte-2); font: 9.5px var(--schrift-mono); }
.fristenleiste__achse { stroke: var(--tinte-2); stroke-width: 1.2; }
.fristenleiste__grenze { stroke: var(--warn); stroke-width: 1; stroke-dasharray: 3 3; }
.fristenleiste__grenztext { fill: var(--tinte-2); font: 600 9.5px var(--schrift); }
.fristenleiste__heute { stroke: var(--aktenblau); stroke-width: 1.6; }
.fristenleiste__heute-flagge { fill: var(--aktenblau); }
.fristenleiste__heute-text { fill: var(--auf-aktenblau); font: 700 9.5px var(--schrift); }
.fristenleiste__rinne { fill: var(--stop-grund); stroke: var(--stop); stroke-width: 1.2; }
.fristenleiste__rinne--leer { fill: var(--karton-hell); stroke: var(--linie); }
.fristenleiste__rinnenzahl { fill: var(--stop); font: 800 24px var(--schrift-mono); }
.fristenleiste__rinnenzahl--leer { fill: var(--tinte-3); }
.fristenleiste__rinnentext { fill: var(--tinte-2); font: 700 10px var(--schrift); letter-spacing: .04em; }
.fristenleiste__stiel { stroke: var(--linie-stark); stroke-width: 1; }
.fristenleiste__marke { stroke: var(--blatt); stroke-width: 1.5; }
.fristenleiste__marke--gelb { fill: var(--warn); }
.fristenleiste__marke--gruen { fill: var(--ok); }
.fristenleiste__marke--kuendigung { fill: var(--aktenblau); }
.fristenleiste__marke--vertragsende { fill: var(--tinte-2); }
.fristenleiste__zahl { fill: var(--blatt); font: 800 9.5px var(--schrift-mono); pointer-events: none; }
.fristenleiste__link { cursor: pointer; }
.fristenleiste__link:focus { outline: none; }
.fristenleiste__link:hover .fristenleiste__marke, .fristenleiste__link:focus-visible .fristenleiste__marke { stroke: var(--tinte); stroke-width: 2.4; }
.fristenleiste__link:focus-visible .fristenleiste__rinne { stroke: var(--aktenblau); stroke-width: 3; }
.wiedervorlage__gruppe--leer .wiedervorlage__kopf { color: var(--tinte-2); }
.wiedervorlage__gruppe--leer .wiedervorlage__leer { margin: 0; padding: .45rem 1rem; border: 1px dashed var(--linie-stark); border-radius: 0 var(--radius) var(--radius) var(--radius); }
.wiedervorlage__aktionen { flex-wrap: wrap; }
.wiedervorlage__datum .datum { font-size: 1em; }
.wiedervorlage__zeile.wv-zeile--unter { grid-template-columns: auto minmax(0, 1fr) auto; gap: .2rem .75rem; padding: .4rem 0; background: transparent; border-bottom: 1px dashed var(--linie); }
@media (max-width: 759px) { .wiedervorlage__zeile.wv-zeile--unter { grid-template-columns: auto minmax(0, 1fr); } .wiedervorlage__aktionen { justify-content: flex-start; } }
.laufzettel--liste { display: grid; gap: 0; counter-reset: stufe; }
.laufzettel--liste .laufzettel__stufe { display: grid; grid-template-columns: 1.6rem minmax(0, 1fr) auto; align-items: start; gap: .1rem .7rem; min-width: 0; padding: .45rem 0 .55rem; border-bottom: 1px solid var(--linie); }
.laufzettel--liste .laufzettel__stufe:last-child { border-bottom: 0; }
.laufzettel--liste .laufzettel__stufe::before { display: none; }
.laufzettel--liste .laufzettel__punkt { position: static; grid-row: 1 / span 2; }
.laufzettel--liste .laufzettel__label { font-size: .875rem; }
.laufzettel--liste .laufzettel__label a { color: inherit; }
.laufzettel--liste .laufzettel__datum { grid-column: 3; grid-row: 1; font-family: var(--schrift-mono); font-size: .75rem; color: var(--tinte-2); }
.laufzettel--liste .laufzettel__hinweis { grid-column: 2 / -1; font-size: .78rem; color: var(--tinte-2); }
.laufzettel--liste .laufzettel__stufe--offen .laufzettel__label { color: var(--tinte-2); font-weight: 600; }
/* public/assets/css/modul/pruefung.css */
.laufzettel--gross .laufzettel__label { font-size: .9rem; }
.laufzettel--gross .laufzettel__datum .datum { font-size: .82rem; }
.etikett { position: relative; box-sizing: border-box; width: 70mm; height: 37mm; overflow: hidden; display: grid; grid-template-columns: 25mm minmax(0, 1fr); align-items: center; gap: 0 2.2mm; padding: 2mm 2.4mm 2mm 3.6mm; color: var(--tinte); background: var(--blatt); box-shadow: inset 1.3mm 0 0 var(--kat, var(--tinte-3)); font-family: var(--schrift); line-height: 1.1; }
.etikett--leer { box-shadow: none; }
.etikett__qr-rahmen { width: 25mm; height: 25mm; }
.etikett__qr { display: block; width: 25mm; height: 25mm; }
.etikett__text { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "kopf plakette" "nr plakette" "bez bez" "sn sn" "fuss fuss"; align-content: center; gap: .5mm 1mm; min-width: 0; height: 100%; }
.etikett__text p { margin: 0; }
.etikett__kopf { grid-area: kopf; font: 700 5.2pt/1.15 var(--schrift-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--tinte-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.etikett__nr { grid-area: nr; font: 800 15pt/1 var(--schrift-mono); letter-spacing: 0; white-space: nowrap; }
.etikett__plakette { grid-area: plakette; align-self: start; }
.etikett__plakette .plakette { width: 9.5mm; height: 9.5mm; }
.etikett__bezeichnung { grid-area: bez; font: 650 7pt/1.15 var(--schrift); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; overflow-wrap: anywhere; }
.etikett__sn { grid-area: sn; font: 600 6.2pt/1.1 var(--schrift-mono); color: var(--tinte-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.etikett__fuss { grid-area: fuss; display: flex; align-items: center; gap: .8mm; margin-top: .4mm !important; font: 800 5.8pt/1 var(--schrift); letter-spacing: .05em; text-transform: uppercase; color: var(--stop); }
.etikett__fuss .icon { width: 2.6mm; height: 2.6mm; }
@media print { .etikett { outline: 0 !important; color: var(--tinte); -webkit-print-color-adjust: exact; print-color-adjust: exact; break-inside: avoid; } .etikett__fuss { color: var(--tinte) !important; } }
