:root{--ink:#2B2F36;--ink2:#1d232a;--accent:#45E7F2;--bg:#f4f7f8;--card:#fff;--muted:#6f7b85;--line:#dbe3e7;--danger:#b93645;--ok:#16836b;--radius:18px;--shadow:0 14px 34px rgba(31,44,52,.09)}*{box-sizing:border-box}html{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg)}body{margin:0}a{color:inherit;text-decoration:none}img{max-width:100%}.topbar{height:76px;background:var(--ink2);color:#fff;display:flex;align-items:center;padding:0 28px;gap:24px;position:sticky;top:0;z-index:20}.brand{display:flex;align-items:center;gap:14px}.brand img{width:220px;max-height:48px}.topbar .spacer{flex:1}.avatar{width:38px;height:38px;border-radius:12px;background:var(--accent);color:var(--ink);display:grid;place-items:center;font-weight:800}.shell{display:grid;grid-template-columns:250px 1fr;min-height:calc(100vh - 76px)}.sidebar{background:#fff;border-right:1px solid var(--line);padding:24px 14px}.nav-label{font-size:11px;font-weight:800;letter-spacing:.13em;color:#95a0a8;padding:12px}.nav a{display:flex;gap:11px;align-items:center;padding:12px 14px;border-radius:12px;margin:3px 0;font-weight:650}.nav a:hover,.nav a.active{background:#eefdff;color:#17262b}.nav img{width:22px;height:22px}.main{padding:32px;min-width:0}.page-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:24px}.page-head h1{margin:0 0 5px;font-size:31px}.muted{color:var(--muted)}.grid{display:grid;gap:18px}.grid.stats{grid-template-columns:repeat(4,minmax(0,1fr))}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.card{background:var(--card);border:1px solid #e4eaed;border-radius:var(--radius);box-shadow:var(--shadow);padding:22px}.stat strong{display:block;font-size:31px;margin-top:12px}.stat .eyebrow{font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);font-weight:800}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:11px;padding:11px 16px;font-weight:750;cursor:pointer;background:var(--accent);color:var(--ink)}.btn.secondary{background:#fff;border:1px solid var(--line)}.btn.dark{background:var(--ink);color:#fff}.btn.danger{background:#fff0f1;color:var(--danger)}.actions{display:flex;gap:9px;flex-wrap:wrap}.table-wrap{overflow:auto}.table{width:100%;border-collapse:collapse}.table th,.table td{text-align:left;padding:13px 12px;border-bottom:1px solid #edf1f2;vertical-align:top}.table th{font-size:12px;text-transform:uppercase;color:var(--muted);letter-spacing:.07em}.badge{display:inline-flex;border-radius:99px;background:#eefdff;padding:5px 9px;font-size:12px;font-weight:750}.badge.ok{background:#e8f8f3;color:var(--ok)}.badge.warn{background:#fff5db;color:#88610b}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.field{display:grid;gap:7px}.field.full{grid-column:1/-1}.field label{font-size:13px;font-weight:750}.field input,.field select,.field textarea{width:100%;padding:12px 13px;border:1px solid #cfd9de;border-radius:10px;background:#fff;font:inherit}.field textarea{min-height:110px}.flash{padding:13px 16px;border-radius:12px;margin-bottom:16px;background:#e9fbfd;border:1px solid #bceff3}.object-card{display:grid;grid-template-columns:64px 1fr auto;align-items:center;gap:16px}.object-icon{width:60px;height:60px;border-radius:16px;background:#eefdff;padding:13px}.login-page{min-height:100vh;display:grid;grid-template-columns:1.1fr .9fr;background:#fff}.login-visual{background:var(--ink2);color:#fff;padding:8vw;display:flex;flex-direction:column;justify-content:center}.login-visual img{width:370px;margin-bottom:50px}.login-box{display:grid;place-items:center;padding:40px}.login-card{width:min(430px,100%)}.login-card h1{font-size:38px;margin:0 0 8px}.public-header{height:84px;display:flex;align-items:center;padding:0 6vw;border-bottom:1px solid var(--line);background:#fff}.public-header img{width:245px}.hero{padding:95px 6vw;background:linear-gradient(90deg,#fff 0 58%,#eefcfd 58%)}.hero h1{font-size:clamp(42px,6vw,76px);line-height:1.02;max-width:850px;margin:0 0 22px}.hero p{font-size:20px;line-height:1.6;max-width:760px;color:#53616a}.public-sections{padding:65px 6vw}.public-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.feature{padding:26px;border:1px solid var(--line);border-radius:18px}.feature img{width:34px}.footer{padding:35px 6vw;background:var(--ink2);color:#fff}.label-preview{display:flex;gap:20px;flex-wrap:wrap;align-items:flex-start}.label{border:1px solid #aeb8bd;background:#fff;display:grid;place-items:center;text-align:center;padding:2mm;font-weight:700;overflow:hidden}.small{font-size:12px}@media(max-width:980px){.shell{grid-template-columns:1fr}.sidebar{display:none}.grid.stats{grid-template-columns:repeat(2,1fr)}.public-grid{grid-template-columns:1fr}.login-page{grid-template-columns:1fr}.login-visual{display:none}}@media(max-width:640px){.main{padding:20px}.topbar{padding:0 16px}.brand img{width:180px}.grid.stats,.grid.two,.form-grid{grid-template-columns:1fr}.page-head{display:block}.page-head .actions{margin-top:15px}.hero{padding:70px 24px;background:#fff}.public-header{padding:0 24px}}
@media print{.topbar,.sidebar,.no-print{display:none!important}.shell{display:block}.main{padding:0}.card{box-shadow:none;border:0}.print-sheet{page-break-after:always}}

/* --- Ergänzungen 1.2.0: mobile Navigation, Statusfarben, Baumansicht, Protokoll --- */
.navtoggle{display:none;flex-direction:column;justify-content:center;gap:5px;width:42px;height:42px;border:0;border-radius:11px;background:rgba(255,255,255,.12);cursor:pointer;padding:0 10px}
.navtoggle span{display:block;height:2px;background:#fff;border-radius:2px}
.topsearch input{padding:9px 13px;border-radius:10px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.12);color:#fff;font:inherit;width:200px}
.topsearch input::placeholder{color:rgba(255,255,255,.65)}
.app-footer{padding:18px 32px;border-top:1px solid var(--line);background:#fff;font-size:12px;color:var(--muted)}
.app-footer a{text-decoration:underline}
.footer-links{display:flex;gap:16px;margin-bottom:8px}
.footer-links a{text-decoration:underline}
.badge.danger{background:#fdecee;color:var(--danger)}
.flash-error{background:#fdecee;border-color:#f5c2c9;color:#8c2532}
.flash-warn{background:#fff5db;border-color:#f0dda4;color:#6b4e07}
.nowrap{white-space:nowrap}
.listrow{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:11px 0;border-bottom:1px solid #edf1f2;flex-wrap:wrap}
.listrow:last-child{border-bottom:0}
.tree{font-size:14px}
.tree-root{font-weight:800;padding-bottom:8px;border-bottom:1px solid var(--line);margin-bottom:10px}
.tree-group{margin:0 0 14px}
.tree-type{font-weight:750;color:#3d4a52;margin:10px 0 6px}
.tree-item{display:flex;justify-content:space-between;gap:12px;align-items:baseline;padding:6px 0 6px 16px;border-left:2px solid #e4eaed}
.tree-item a{text-decoration:underline;color:var(--muted)}
.timeline-item{padding:11px 0 11px 14px;border-left:2px solid var(--accent);margin-bottom:10px}
.checklist{list-style:none;padding:0;margin:0;font-size:14px}
.checklist li{padding:9px 0 9px 26px;position:relative;border-bottom:1px solid #edf1f2}
.checklist li:last-child{border-bottom:0}
.checklist li::before{position:absolute;left:0;top:9px;font-weight:800}
.checklist li.ok::before{content:"✓";color:var(--ok)}
.checklist li.todo::before{content:"!";color:var(--danger)}
.legal{max-width:820px;margin:0 auto;padding:60px 24px}
.legal h1{font-size:36px;margin:0 0 8px}
.legal h2{font-size:19px;margin:30px 0 8px}
.legal p,.legal li{line-height:1.65;color:#3d4a52}
.legal code{background:#eef3f5;padding:2px 6px;border-radius:5px;font-size:13px}
.iconpicker label{user-select:none}
@media(max-width:980px){
  .navtoggle{display:flex}
  .sidebar{display:none;position:fixed;top:76px;left:0;right:0;bottom:0;z-index:30;overflow-y:auto}
  .sidebar.open{display:block}
  .topsearch{display:none}
  .hide-sm{display:none}
}

/* ===========================================================================
   Ergänzungen 1.3.0 – moderner Login, Mieterlisten, Symbolauswahl
   Farben bleiben unverändert: Anthrazit #2B2F36, Türkis #45E7F2, Warnrot #C64242
   =========================================================================== */

/* --- Login ---------------------------------------------------------------- */
body.on-login{overflow-x:hidden}
.login-visual{position:relative;overflow:hidden}
.login-visual-inner{position:relative;z-index:2}
.aurora{position:absolute;inset:0;z-index:1;filter:blur(70px);opacity:.55}
.aurora span{position:absolute;display:block;border-radius:50%}
.aurora span:nth-child(1){width:46vw;height:46vw;background:#45E7F2;top:-12%;left:-10%;animation:drift1 22s ease-in-out infinite}
.aurora span:nth-child(2){width:34vw;height:34vw;background:#1f7d88;bottom:-14%;right:-8%;animation:drift2 26s ease-in-out infinite}
.aurora span:nth-child(3){width:26vw;height:26vw;background:#2B2F36;top:38%;left:44%;animation:drift3 30s ease-in-out infinite}
@keyframes drift1{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(6vw,5vh) scale(1.12)}}
@keyframes drift2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-5vw,-4vh) scale(1.08)}}
@keyframes drift3{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-4vw,6vh) scale(1.15)}}

.login-points{list-style:none;padding:0;margin:38px 0 0;display:grid;gap:14px}
.login-points li{display:flex;align-items:center;gap:12px;font-size:15px;color:#d7e2e6}
.login-points img{width:22px;height:22px;filter:brightness(0) invert(1);opacity:.85}

.login-card{position:relative;border-radius:22px;border:1px solid #e2e9ec;box-shadow:0 24px 60px rgba(26,38,45,.13)}
.login-mark{width:70px;height:70px;border-radius:20px;background:#eefdff;display:grid;place-items:center;margin-bottom:20px}
.login-card h1{font-size:32px;margin:0 0 6px}

.field.floaty{position:relative;display:block}
.field.floaty input{width:100%;padding:22px 14px 10px;border:1px solid #cfd9de;border-radius:12px;font:inherit;background:#fff;transition:border-color .18s,box-shadow .18s}
.field.floaty input:focus{outline:none;border-color:#45E7F2;box-shadow:0 0 0 4px rgba(69,231,242,.18)}
.field.floaty label{position:absolute;left:15px;top:16px;font-size:15px;color:#8a959c;pointer-events:none;transition:all .16s ease;font-weight:500}
.field.floaty input:focus + label,
.field.floaty input:not(:placeholder-shown) + label{top:7px;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:#5d6a72;font-weight:700}
.peek{position:absolute;right:12px;top:16px;background:none;border:0;font:inherit;font-size:12px;font-weight:700;color:#5d6a72;cursor:pointer;text-decoration:underline}

.login-btn{position:relative;overflow:hidden;transition:transform .16s ease,box-shadow .16s ease}
.login-btn:hover{transform:translateY(-1px);box-shadow:0 10px 22px rgba(69,231,242,.36)}
.login-btn .login-btn-spinner{display:none;width:17px;height:17px;border-radius:50%;border:2.5px solid rgba(43,47,54,.25);border-top-color:#2B2F36;animation:spin .7s linear infinite}
.login-btn.is-loading .login-btn-label{opacity:.45}
.login-btn.is-loading .login-btn-spinner{display:inline-block}
@keyframes spin{to{transform:rotate(360deg)}}

.login-status{margin-top:14px;font-size:13px;color:#5d6a72;text-align:center;opacity:0;transform:translateY(4px);transition:opacity .3s,transform .3s}
.login-status.visible{opacity:1;transform:none}
body.is-authenticating .login-card{animation:cardBreathe 1.6s ease-in-out infinite}
@keyframes cardBreathe{0%,100%{box-shadow:0 24px 60px rgba(26,38,45,.13)}50%{box-shadow:0 24px 70px rgba(69,231,242,.34)}}

.reveal{opacity:0;transform:translateY(14px);animation:reveal .6s cubic-bezier(.22,.9,.3,1) forwards}
.reveal-1{animation-delay:.08s}.reveal-2{animation-delay:.16s}.reveal-3{animation-delay:.24s}
@keyframes reveal{to{opacity:1;transform:none}}

/* --- Oberfläche allgemein ------------------------------------------------- */
.topbar{backdrop-filter:saturate(1.4) blur(8px)}
.card{transition:box-shadow .2s ease,transform .2s ease}
a.card:hover,.object-card:hover{transform:translateY(-2px);box-shadow:0 18px 40px rgba(31,44,52,.14)}
.btn{transition:transform .14s ease,box-shadow .14s ease,background .14s ease}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.main>*{animation:fadeUp .34s ease both}
@keyframes fadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* --- Mieter und Haushalte -------------------------------------------------- */
.household .person{padding:11px 0;border-top:1px solid #edf1f2}
.household .person:first-of-type{border-top:0}
.household .person a{text-decoration:underline}
.badge{align-items:center}
.hint{display:block}

/* --- Symbolauswahl im Schildereditor -------------------------------------- */
.icon-search{width:100%;padding:11px 13px;border:1px solid #cfd9de;border-radius:10px;font:inherit;margin:6px 0 12px}
.iconpicker{max-height:340px;overflow-y:auto;border:1px solid var(--line);border-radius:12px;padding:12px;background:#fbfdfd}
.icon-group{margin-bottom:16px}
.icon-group-title{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#95a0a8;margin-bottom:8px}
.icon-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px}
.icon-chip{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 6px;border:1px solid var(--line);border-radius:11px;background:#fff;cursor:pointer;text-align:center;transition:border-color .15s,background .15s,transform .15s}
.icon-chip:hover{transform:translateY(-1px);border-color:#9fd9df}
.icon-chip input{position:absolute;opacity:0;width:0;height:0}
.icon-chip:has(input:checked){border-color:var(--ink);background:#eefdff;box-shadow:inset 0 0 0 1px var(--ink)}
.icon-chip-art{display:grid;place-items:center;height:30px}
.icon-chip-label{font-size:11px;line-height:1.25;color:#4a555c}

/* --- Bewegung reduzieren --------------------------------------------------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .aurora{display:none}
}

@media print{
  .app-footer,.topsearch,.navtoggle{display:none!important}
  .table{font-size:12px}
  .card{page-break-inside:avoid}
}

/* --- Mietakte 1.4.0 -------------------------------------------------------- */
.aktenleiste{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.akten-tab{display:flex;align-items:center;gap:9px;padding:11px 15px;border:1px solid var(--line);border-radius:12px;background:#fff;font-size:13px;font-weight:650;color:var(--ink);transition:border-color .15s,transform .15s}
.akten-tab:hover{border-color:#9fd9df;transform:translateY(-1px)}
.akten-tab img{width:18px;height:18px;opacity:.75}
.akte-phase{scroll-margin-top:90px}
.akte-zeile{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:12px 0;border-top:1px solid #edf1f2;flex-wrap:wrap}
.akte-zeile:first-of-type{border-top:0}
.akte-info a{text-decoration:none}
.akte-info a:hover strong{text-decoration:underline}
.jahr-block{margin:14px 0 4px;padding-left:14px;border-left:3px solid var(--accent)}
.jahr-titel{font-weight:800;font-size:15px;letter-spacing:.02em;margin-bottom:4px;color:#3d4a52}

/* --- Ablage, Papierkorb, Sicherungen 1.7.0 --------------------------------- */
/* Der Ordnerbaum benutzt <details>: aufklappen ohne eine Zeile JavaScript,
   und was zugeklappt ist, bleibt beim Drucken auch zugeklappt. */
.tree-folder{padding:5px 0 5px 16px;border-left:2px solid #e4eaed}
.tree-folder>summary{cursor:pointer;list-style:none;padding:3px 0;font-size:14px}
.tree-folder>summary::-webkit-details-marker{display:none}
.tree-folder>summary::before{content:"▸";display:inline-block;width:16px;color:var(--muted);transition:transform .12s}
.tree-folder[open]>summary::before{content:"▾"}
.tree-folder>summary:hover{color:var(--accent-ink,#12707a)}

/* Ein einzelner Prüf- oder Fortschrittsblock im Sicherungsbereich. */
.fortschritt{background:#e8ebef;border-radius:8px;height:16px;overflow:hidden;margin:12px 0}
.fortschritt>span{display:block;background:var(--accent);height:100%}

/* Aufklappbare Gefahrenzone (endgültig löschen, archivieren). */
details.card>summary{cursor:pointer;font-weight:700}
details>summary{cursor:pointer}

.city-groups{display:grid;gap:30px}.city-group{display:grid;gap:12px}.city-title{margin:0;font-size:22px}.tree-item-fixed{display:grid!important;grid-template-columns:minmax(220px,1fr) 110px 150px;align-items:start!important;column-gap:18px}.tree-item-fixed>span:nth-child(2){text-align:left}.tree-actions{text-align:right;white-space:nowrap}.brand img{width:260px;max-height:58px}.topbar{height:84px}.shell{min-height:calc(100vh - 84px)}@media(max-width:780px){.tree-item-fixed{grid-template-columns:1fr}.tree-actions{text-align:left}.brand img{width:220px}}
.public-header img{width:310px;max-height:64px}.login-visual img{width:440px;max-width:90%}

/* --- Ergänzungen 1.8.0/1.8.1: Sprachwahl, Übersetzungshinweis, Kacheln --- */

/* Sprachwahl ab 1.8.1: reine Verweise, kein Formular und kein <select>.
   Auf der Anmeldeseite steht der Umschalter innerhalb des Anmeldeformulars –
   ein Formular im Formular gibt es in HTML nicht, der Browser hätte dort das
   Anmeldeformular beendet. Verweise können das nicht. */
.flagge{border-radius:3px;box-shadow:0 0 0 1px rgba(0,0,0,.12);display:block;width:auto;height:13px}
.flagge-ersatz{display:inline-flex;align-items:center;justify-content:center;height:13px;min-width:19px;padding:0 3px;font-size:9px;font-weight:800;letter-spacing:.04em;background:#eef3f5;color:#5d6a72;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Anmeldeseite: alle Sprachen offen nebeneinander. */
.login-sprache{margin:16px 0 6px;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:#fbfdfd}
.login-sprache-titel{display:block;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#8a959c;margin-bottom:9px}
.sprachwahl-anmeldung{display:flex;flex-wrap:wrap;gap:7px}
.sprach-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border:1px solid var(--line);border-radius:99px;background:#fff;font-size:13px;font-weight:650;line-height:1.2;color:var(--ink);transition:border-color .14s,transform .14s,box-shadow .14s}
.sprach-chip:hover{border-color:#9fd9df;transform:translateY(-1px)}
.sprach-chip.ist-aktiv{border-color:var(--ink);background:#eefdff;box-shadow:inset 0 0 0 1px var(--ink)}

/* Kopfzeile und öffentliche Seiten: aufklappbares Menü ohne JavaScript. */
.sprachmenue{position:relative;margin:0}
.sprachmenue>summary{display:flex;align-items:center;gap:7px;cursor:pointer;list-style:none;padding:7px 11px;border-radius:10px;border:1px solid var(--line);background:#fff;font-size:13px;font-weight:650;white-space:nowrap}
.sprachmenue>summary::-webkit-details-marker{display:none}
.sprachmenue-pfeil{font-size:10px;opacity:.7}
.sprachmenue-liste{position:absolute;right:0;top:calc(100% + 6px);z-index:40;min-width:210px;max-height:60vh;overflow:auto;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 18px 40px rgba(31,44,52,.18);padding:7px}
.sprach-eintrag{display:flex;align-items:center;gap:9px;padding:9px 11px;border-radius:10px;font-size:14px;color:var(--ink)}
.sprach-eintrag:hover{background:#eefdff}
.sprach-eintrag.ist-aktiv{font-weight:800;background:#f2fbfc}
.topbar-sprache{display:flex;align-items:center}
.topbar-sprache .sprachmenue>summary{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.22);color:#fff}
.public-header .sprachmenue{margin-right:14px}

/* Pflichthinweis zur maschinellen Übersetzung. Er ist absichtlich nicht
   wegklickbar: Er gehört zur rechtlichen Aussage der Seite, nicht zur Bedienung. */
.sprachhinweis{border:1px solid #f0dda4;background:#fffaf0;border-radius:12px;padding:12px 16px;margin-bottom:18px;font-size:13px;line-height:1.5}
.sprachhinweis p{margin:0}
.sprachhinweis-de{margin-top:6px!important;color:#6b4e07;font-size:12px}

/* Kacheln des Mieterportals. Große Berührungsflächen, auf dem Handy einspaltig. */
.kacheln{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px;margin-top:22px}
.kachel{display:flex;flex-direction:column;gap:6px;background:var(--card);border:1px solid #e4eaed;border-radius:var(--radius);box-shadow:var(--shadow);padding:22px;min-height:150px;transition:transform .14s ease,box-shadow .14s ease}
.kachel:hover,.kachel:focus-visible{transform:translateY(-2px);box-shadow:0 18px 40px rgba(31,44,52,.14)}
.kachel-symbol{width:40px;height:40px;margin-bottom:6px}
.kachel-titel{font-size:19px;font-weight:800;line-height:1.25}
.kachel-text{color:var(--muted);font-size:14px;line-height:1.45}
.kachel-hinweis{margin-top:auto;align-self:flex-start;background:#eefdff;border-radius:99px;padding:5px 11px;font-size:12px;font-weight:750}
/* Der auffällige Knopf: „Schaden melden“ soll man auch ohne Lesen finden. */
.kachel-gross{background:var(--accent);border-color:var(--accent);grid-column:span 2}
.kachel-gross .kachel-text{color:#1c4f54}
.kachel-gross .kachel-hinweis{background:rgba(255,255,255,.55)}

.wohnung-karte h2{font-size:22px}
.auftrag-karte h2{font-size:20px}
.auftrag-karte h2 a{text-decoration:underline}

@media(max-width:640px){
  .kacheln{grid-template-columns:1fr}
  .kachel-gross{grid-column:span 1}
  .kachel{min-height:0;padding:20px}
  /* In der Kopfzeile bleibt auf dem Handy nur die Flagge stehen – der
     Sprachname steht ohnehin im aufgeklappten Menü. */
  .topbar-sprache .sprachmenue-name{display:none}
  .sprach-chip{font-size:12px;padding:6px 9px}
}
@media print{.sprachwahl,.topbar-sprache{display:none!important}}
.abschnitt{font-size:17px;margin:6px 0 4px;letter-spacing:.01em}

/* 1.23.15: einheitliche Passwortqualitaet */
.pw-quality{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px}.pw-quality span{font-size:11px;padding:4px 7px;border-radius:999px;background:#f1f3f4;color:#69757d;border:1px solid #dde3e6}.pw-quality span::before{content:'○ ';font-weight:800}.pw-quality span.ok{background:#e8f8f3;color:#126c59;border-color:#bfe9dc}.pw-quality span.ok::before{content:'✓ '}.pw-quality span.bad{background:#fff0f1;color:#a5313d;border-color:#f0c8cd}

/* 1.23.15: Breitenbegrenzung fuer sehr grosse Displays und Login-Feinschliff */
@media(min-width:1500px){.main{width:min(100%,1680px);margin:0 auto}.public-header>*:first-child{margin-left:max(0px,calc((100vw - 1680px)/2))}.public-header>*:last-child{margin-right:max(0px,calc((100vw - 1680px)/2))}.hero,.public-sections,.footer{padding-left:max(6vw,calc((100vw - 1680px)/2));padding-right:max(6vw,calc((100vw - 1680px)/2))}}
.login-visual-inner>img{background:transparent;width:min(520px,90%);height:auto}.login-points li{display:grid;grid-template-columns:28px minmax(0,1fr);align-items:center;min-height:34px}.login-points img{justify-self:center;margin:0}.login-sprache{max-width:100%}.sprachwahl-anmeldung{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.sprach-chip{min-width:0;justify-content:flex-start;padding:6px 8px;font-size:12px}.public-header{max-width:none}.public-header>a:first-child img{object-fit:contain}
@media(max-width:520px){.sprachwahl-anmeldung{grid-template-columns:1fr 1fr}.sprach-chip{font-size:11px;padding:6px}.login-card{padding:18px}.login-box{padding:18px}}

/* --- 1.23.36: Logo-Zwischenbild (Splash) bei An- und Abmeldung ------------ */
/* Der Splash nutzt bewusst denselben Aurora-Hintergrund wie die Anmeldeseite,
   damit Anmeldung und Ankunft wie ein Guss wirken. Als Einblendung nach der
   Anmeldung (.bi-splash.overlay) verschwindet er nach gut einer Sekunde von
   selbst; auf der Abmeldeseite bleibt er stehen, bis die Weiterleitung greift. */
.bi-splash{position:fixed;inset:0;z-index:12000;background:var(--ink2);display:flex;align-items:center;justify-content:center;overflow:hidden}
.bi-splash .aurora{opacity:.5}
.bi-splash-inner{position:relative;z-index:2;text-align:center;padding:24px}
.bi-splash-inner img{width:min(420px,80vw);display:block;margin:0 auto;opacity:0;transform:translateY(12px) scale(.94);animation:biSplashLogo .8s cubic-bezier(.22,.9,.3,1) .1s forwards}
.bi-splash-inner p{color:rgba(255,255,255,.88);font-size:clamp(19px,2.4vw,27px);font-weight:700;letter-spacing:.02em;margin:28px 0 0;opacity:0;animation:biSplashText .55s ease .6s forwards}
.bi-splash-inner .small{margin-top:16px;font-size:14px;font-weight:500;color:rgba(255,255,255,.6)}
.bi-splash-inner .small a{text-decoration:underline;color:rgba(255,255,255,.75)}
@keyframes biSplashLogo{to{opacity:1;transform:none}}
@keyframes biSplashText{to{opacity:1}}
/* Variante nach der Anmeldung: liegt über der bereits geladenen Seite und
   blendet sich nach kurzem Verweilen aus; visibility verhindert danach jede
   Interaktionssperre, das Skript im Layout entfernt den Knoten zusätzlich. */
.bi-splash.overlay{animation:biSplashOut .55s ease 2.6s forwards}
@keyframes biSplashOut{to{opacity:0;visibility:hidden}}
@media(prefers-reduced-motion:reduce){
  .bi-splash-inner img,.bi-splash-inner p{animation:none;opacity:1;transform:none}
  .bi-splash.overlay{animation:biSplashOut .01s ease 1.2s forwards}
}

/* --- 1.23.37: Feinschliff Oberfläche -------------------------------------- */
/* „Meine Daten": Felder packen ihre Zeilen oben zusammen. Vorher streckte das
   Raster ein einzelnes Eingabefeld (Telefon) auf die Höhe der hohen
   Nachbarzelle (E-Mail mit Hinweis und Knopf) – das sah wie ein Textfeld aus. */
.form-grid .field{align-content:start}

/* Flaggen bekommen eine feste Breite. Einzelne SVG-Dateien bringen keine
   brauchbaren Maße mit; mit width:auto wurden sie dann bildschirmbreit
   gerendert und zogen den Sprachknopf ins Riesige. */
.flagge{width:20px;height:14px;object-fit:cover}
.sprachmenue>summary .flagge,.sprach-chip .flagge{flex:0 0 auto}

/* Aurora-Hintergrund der Anmeldeseite: Größe am Container statt am
   Bildschirm. Mit vw-Maßen wuchsen die Farbflächen im Vollbild zu harten
   Riesenkreisen; in Prozent der Spalte wirken halbes und ganzes Fenster
   gleich, die Unschärfe wächst maßvoll mit. */
.aurora{filter:blur(clamp(60px,5vw,110px))}
.aurora span:nth-child(1){width:min(64%,880px);height:auto;aspect-ratio:1/1}
.aurora span:nth-child(2){width:min(50%,720px);height:auto;aspect-ratio:1/1}
.aurora span:nth-child(3){width:min(38%,540px);height:auto;aspect-ratio:1/1}

/* „Objekt archivieren" unauffällig: nur eine dezente Zeile, das eigentliche
   Formular erscheint erst nach dem Aufklappen als Karte. */
details.archiv-leise{margin:0 0 18px}
details.archiv-leise>summary{display:inline-flex;align-items:center;gap:6px;cursor:pointer;list-style:none;font-size:13px;font-weight:650;color:var(--muted);padding:4px 2px}
details.archiv-leise>summary::-webkit-details-marker{display:none}
details.archiv-leise>summary::before{content:"\25B8";display:inline-block;transition:transform .12s}
details.archiv-leise[open]>summary::before{transform:rotate(90deg)}
details.archiv-leise>summary:hover{color:var(--danger)}
details.archiv-leise>.card{margin-top:10px}

/* Versionsnummer im Kopf des Verwaltungsbereichs. */
.version-badge{font-size:11px;font-weight:700;letter-spacing:.04em;color:rgba(255,255,255,.55);border:1px solid rgba(255,255,255,.16);border-radius:8px;padding:4px 8px;white-space:nowrap}
@media(max-width:700px){.version-badge{display:none}}

/* --- 1.23.38: Anmeldeseite bildschirmfüllend + Flaggen endgültig fixiert -- */
/* Vorher deckelte die Anmeldeseite bei 1920 px und stand mit weißen Rändern
   mittig im 4K-Vollbild. Jetzt füllt sie jede Breite: Die dunkle Verlaufshälfte
   reicht bis an den linken Rand, die Anmeldebox bis an den rechten. Damit die
   Texte links auf sehr breiten Spalten nicht zerlaufen, ist der Inhalt der
   Bildhälfte auf 880 px begrenzt und mittig in seiner Spalte gesetzt. */
.login-page{max-width:none;margin:0;box-shadow:none}
.login-visual{padding:clamp(48px,7vw,150px)}
.login-visual-inner{width:100%;max-width:880px;margin-inline:auto}
/* Logo auf der Anmeldeseite deutlich größer (vorher 520 px). */
.login-visual-inner>img{width:min(680px,92%)}
/* Aurora darf auf sehr breiten Spalten mitwachsen, sonst wirkt der Verlauf
   im 4K-Vollbild wie ein kleiner Fleck in einer großen dunklen Fläche. */
.aurora{filter:blur(clamp(60px,5vw,160px))}
.aurora span:nth-child(1){width:min(70%,1400px)}
.aurora span:nth-child(2){width:min(54%,1100px)}
.aurora span:nth-child(3){width:min(40%,820px)}
/* Flaggen: feste Breite auch im aufgeklappten Sprachmenü (der Eintragstyp
   fehlte in 1.23.37); die harte Bremse sitzt seit 1.23.38 zusätzlich als
   Inline-Stil direkt am Bild (core/i18n.php, flag_img). */
.sprach-eintrag .flagge{flex:0 0 auto}
.flagge{max-width:22px}
.flagge-ersatz{max-width:none}