/* ===========================================================
   Das Hohe Haus · styles.css · V23 (21.09.2026)
   Design-System „Wilde Habitate / Habitat-Tycoon" (Claude Design d8550ead), Farbtokens aus tokens/colors.css, Stand 20.09.2026.
   Dunkel ist Standard (:root), Hell über [data-theme="light"]. Eine Schrift (Archivo) in fünf Stufen, Zahlen tabular.
   Abstände 4/8/12/16/24/32/48 · Radien 4/6/8 (V21: Modernist-Kanten aus V9.1/V11 zurückgenommen) · Rahmen 1 px, Farbe wechselt nach Zustand ·
   zwei Schatten (Karte angehoben, Fläche über der Seite) · Bewegung 120/200/400 ms · prefers-reduced-motion schaltet alles ab.
   Keine Hex-Werte im Komponenten-CSS: Farben nur über Tokens. Keine Pillen, keine Farb-Emoji, kein Glow.
   V23 (21.09.2026): Palette ohne Türkis (Honiggold als Hauptaktion, Blattgrün als Auswahl), --disabled/--disabled-fg statt Deckkraft,
   die Diagrammfarbe heißt jetzt --chart-gruen, --brand-ink trägt die Schrift, die früher Honiggold gewesen wäre.
   Brückennamen (--ink, --line, --brand …) bleiben als Alias auf die Tokens, damit ältere Komponentenregeln weiterlaufen.
   =========================================================== */
@import url("https://fonts.googleapis.com/css2?family=Archivo:wght@400;500;600;700&display=swap");

:root{
  /* Farben (Wilde Habitate, dunkel) · V23: tokens/colors.css 1:1, Palette ohne Tuerkis.
     Waldschwarz, Waldgruen, Olivgrau, Elfenbein, Honiggold (Hauptaktion, dunkle Schrift), Blattgruen (Auswahl, Link, Fokus), Apricot (Warnung). */
  --bg:#171d18; --surface:#242d23; --surface-2:#333d2d; --header-bg:#10150f; --panel:#1d251d;
  --border:rgba(244,238,220,0.13); --border-strong:rgba(244,238,220,0.2);
  --text:#f4eedc; --text-2:rgba(244,238,220,0.7); --text-3:rgba(244,238,220,0.55);
  --fill:rgba(244,238,220,0.08); --fill-soft:rgba(244,238,220,0.05);
  --accent:#b9cc8a; --accent-strong:#cddba6; --accent-soft:rgba(185,204,138,0.16);
  --action:#e4b85c; --action-hover:#efc873; --action-fg:#171d18; --on-action:var(--action-fg);
  --link:#b9cc8a; --focus:#b9cc8a;
  --warn:#f0a777; --warn-bg:rgba(240,167,119,0.16);
  --crit:#d98a80; --crit-bg:rgba(217,138,128,0.14); --crit-text:#e8aca4;
  --pos:#8fbf9f; --pos-bg:rgba(143,191,159,0.14);
  --info:#c9cfa8; --info-bg:rgba(185,204,138,0.12);
  --chart-gruen:#a3b876; --chart-peach:#cfae7e; --chart-coral:#c56a4e; --chart-grid:rgba(233,233,236,0.14);
  --on-band:#171d18; --backdrop:rgba(23,29,24,0.6);
  /* Chronik-Papier und Rang-Rahmen aus tokens/colors.css. Das Hohe Haus benutzt sie heute nirgends;
     sie stehen hier, damit die Token-Zone die Quelle vollständig abbildet (das Papierbild liegt im Spiel-Repo). */
  --ht-papier:#1b211b; --ht-papier-2:#262e25; --ht-tinte:#ece7dd; --ht-tinte-2:rgba(236,231,221,0.72);
  --ht-linie:rgba(236,231,221,0.16); --ht-ocker:#d9b36a; --chronik-papier-bild:none;
  --rang-gold:linear-gradient(160deg,#e2ac5a,#b7782a); --rang-silber:linear-gradient(160deg,#cfc8b9,#8d867a); --rang-bronze:linear-gradient(160deg,#c98b5a,#805127);
  /* Deaktiviert: warmes Olivgrau statt bloßer Deckkraft */
  --disabled:#3f4a3a; --disabled-fg:#a3a996;
  --muted:var(--text-2);
  /* Schrift */
  --font-ui:"Archivo",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,sans-serif;
  --stufe-1:0.7rem; --stufe-2:0.8rem; --stufe-3:1rem; --stufe-4:1.125rem; --stufe-5:1.5rem; --ht-schau-zahl:2.25rem;
  --leading-ui:1.35; --leading-text:1.5;
  /* Abstand, Form, Tiefe, Bewegung */
  --s-4:4px; --s-8:8px; --s-12:12px; --s-16:16px; --s-24:24px; --s-32:32px; --s-48:48px; --ziel-min:44px;
  --radius-s:4px; --radius-m:6px; --radius-l:8px; --rahmen:1px; --band:6px; --kachel:56px; --icon-kachel:24px; --icon-chip:20px;
  --shadow:0 4px 16px rgba(0,0,0,0.25); --shadow-card:0 6px 20px rgba(0,0,0,0.3); --shadow-pop:0 8px 24px rgba(0,0,0,0.35);
  --motion-fast:120ms; --motion-base:200ms; --motion-slow:400ms; --motion-ease:cubic-bezier(0.2,0.7,0.3,1); --motion-stagger:40ms; --motion-rise:8px;
  /* Text auf Bild (in beiden Themen hell) */
  --photo-bg:#171d18; --on-photo:#ebe6dd; --on-photo-2:rgba(235,230,221,0.78); --on-photo-3:rgba(235,230,221,0.62); --on-photo-line:rgba(255,255,255,0.28); --on-photo-fill:rgba(255,255,255,0.12);
  --hero-scrim-strong:rgba(20,19,18,0.94); --hero-scrim-soft:rgba(20,19,18,0.38);
  --schatten-figur:0 2px 4px rgba(0,0,0,0.25);
  color-scheme:dark;

  /* Brücke zu den bisherigen GF-Weekly-Namen (Komponentenregeln bleiben, Look kommt aus den Habitate-Tokens) */
  --ink:var(--text); --ink-2:var(--text-2);
  --line:var(--border-strong); --line-soft:var(--border);
  --brand:var(--action); --brand-d:var(--action-hover); --brand-soft:var(--accent-soft);
  /* V23: Honiggold traegt Flaechen, nicht Schrift (auf Creme nur 1,8:1). Text, der frueher --brand war, nimmt --brand-ink. */
  --brand-ink:var(--accent-strong);
  --accent-d:var(--accent-strong);
  --ok:var(--pos); --ok-soft:var(--pos-bg);
  --warn-soft:var(--warn-bg);
  --info-soft:var(--info-bg);
  --danger:var(--crit); --danger-soft:var(--crit-bg);
  --chip-bg:var(--fill); --chip-ink:var(--text-2);
  --shadow-1:none; --shadow-2:none; --shadow-3:var(--shadow-pop);
  --ring:0 0 0 2px var(--focus);
  --r-s:var(--radius-s); --r:var(--radius-l); --r-l:var(--radius-l); --r-xl:var(--radius-l);
  --ease:var(--motion-ease);
  --maxw:1120px;
  --fs-h1:var(--stufe-4); --fs-title:var(--stufe-3); --fs-body:var(--stufe-3); --fs-sm:var(--stufe-2);
}
[data-theme="light"]{
  --bg:#f7f3ec; --surface:#fffdf8; --surface-2:#f1ebe0; --header-bg:#f1ebe0; --panel:#fffdf8;
  --border:rgba(35,32,27,0.12); --border-strong:rgba(35,32,27,0.25);
  --text:#23201b; --text-2:rgba(35,32,27,0.74); --text-3:rgba(35,32,27,0.66);
  --fill:rgba(35,32,27,0.07); --fill-soft:rgba(35,32,27,0.045);
  --accent:#5b7036; --accent-strong:#465828; --accent-soft:rgba(91,112,54,0.14);
  --action:#e4b85c; --action-hover:#d4a63f; --action-fg:#171d18; --on-action:var(--action-fg);
  /* Nur hell: 1-px-Rand am Honiggold-Knopf, die Flaeche hat auf Creme sonst nur 1,8:1 Randkontrast */
  --action-border:#c79a3a;
  --link:#5b7036; --focus:#5b7036;
  --warn:#9c5122; --warn-bg:rgba(240,167,119,0.22);
  --crit:#b04a3e; --crit-bg:rgba(217,138,128,0.18); --crit-text:#93382e;
  --pos:#2a6e46; --pos-bg:rgba(143,191,159,0.22);
  --info:#5a6640; --info-bg:rgba(91,112,54,0.1);
  --chart-gruen:#5e7438; --chart-peach:#d3a878; --chart-coral:#c56a4e; --chart-grid:rgba(35,32,27,0.14);
  --on-band:#ffffff; --backdrop:rgba(23,29,24,0.45);
  --ht-papier:#efe9dd; --ht-papier-2:#e6dfd0; --ht-tinte:#23201b; --ht-tinte-2:rgba(35,32,27,0.72);
  --ht-linie:rgba(35,32,27,0.16); --ht-ocker:#a8792a; --chronik-papier-bild:url("../assets/chronik/chronik-papier.jpg");
  --disabled:#cfcdbd; --disabled-fg:#5e6255;
  --muted:var(--text-2);
  --shadow:0 4px 16px rgba(35,32,27,0.14); --shadow-card:0 6px 20px rgba(35,32,27,0.12);
  color-scheme:light;
}
/* Altes drittes Thema „colorful" → hell */
[data-theme="colorful"]{ color-scheme:light }

/* ---------- Base ---------- */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; color:var(--ink);
  background:var(--bg);
  
  font-family:var(--font-ui);
  line-height:var(--leading-text); -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  transition:background-color .3s var(--ease), color .3s var(--ease);
}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
input,textarea,select{font-family:inherit;color:var(--ink)}
a{color:var(--accent-d);text-decoration:none}
a:hover{text-decoration:underline}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:var(--radius-s)}

/* ---------- Gate ---------- */
#gate{position:fixed;inset:0;z-index:90;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(360px,.9fr);background:var(--bg)}
#gate::before{content:"";display:block;background:var(--photo-bg) url("img/tor-menschen.webp") center/cover no-repeat;border-right:var(--rahmen) solid var(--border)}
#gate .gate-card{position:relative;align-self:center;justify-self:center;margin:24px;box-shadow:none;border:var(--rahmen) solid var(--border)}
@media(max-width:760px){ #gate{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto;overflow:auto} #gate::before{border-right:0;border-bottom:var(--rahmen) solid var(--border);min-height:38vh} #gate .gate-card{margin:20px auto 32px} }
.gate-card{width:100%;max-width:380px;background:var(--surface);border-radius:var(--r-xl);box-shadow:var(--shadow-3);padding:38px 32px;text-align:left;animation:pop .4s var(--ease)}
@keyframes pop{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
.gate-card .mark{width:54px;height:54px;border-radius:var(--radius-m);margin:0 0 14px;display:grid;place-items:center;background:var(--action);color:var(--on-action);font-weight:600;font-size:var(--stufe-5);box-shadow:none}
.gate-card h1{margin:0 0 2px;font-size:var(--stufe-5);letter-spacing:-.02em}
.gate-card .sub{color:var(--muted);font-size:var(--stufe-2);margin-bottom:20px}
.gate-card input{width:100%;padding:14px;border:var(--rahmen) solid var(--line);border-radius:var(--radius-m);background:var(--surface-2);text-align:left;font-size:var(--stufe-3)}
.err{color:var(--danger);font-size:var(--stufe-2);min-height:18px;margin-top:8px}
.badge-conf{display:inline-block;font-size:var(--stufe-1);letter-spacing:.04em;text-transform:uppercase;font-weight:600;color:var(--brand-ink);background:var(--brand-soft);padding:4px 11px;border-radius:var(--radius-s);margin-bottom:6px}

/* ---------- Shell ---------- */
.app,.cwrap,.iwrap{display:none}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 22px 120px}
.wrap.narrow{max-width:680px}
.wrap.mid{max-width:860px}

/* ---------- Marke (die Kopfzeile aus V12 ist seit V18 die Seitenleiste, Regeln dort) ---------- */
.brand{display:flex;align-items:center;gap:11px;min-width:0;text-decoration:none;color:inherit}
.brand:hover{text-decoration:none}
.brand .mark{width:36px;height:36px;border-radius:var(--radius-m);display:grid;place-items:center;background:var(--action);color:var(--on-action);font-weight:600;font-size:var(--stufe-3);flex:0 0 auto}
.brand h1{font-size:var(--fs-h1);margin:0;letter-spacing:-.02em;line-height:1.1;white-space:nowrap}
.brand .meta{font-size:var(--stufe-2);color:var(--muted)}
.sb-nav a .nbadge{background:var(--warn);color:var(--on-band);border-radius:var(--radius-s);font-size:var(--stufe-1);font-weight:600;padding:1px 6px;min-width:17px;text-align:center;font-variant-numeric:tabular-nums}
.sb-nav a.active .nbadge{background:var(--action);color:var(--on-action)}

/* theme switch */
.theme-sw{display:flex;gap:3px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-m);padding:3px;box-shadow:var(--shadow-1)}
.theme-sw button{min-width:44px;height:32px;padding:0 10px;border-radius:var(--radius-s);font-size:var(--stufe-2);font-weight:500;display:grid;place-items:center;color:var(--ink-2);transition:.15s}
.theme-sw button:hover{background:var(--surface-2)}
.theme-sw button.on{background:var(--action);color:var(--on-action)}
.whoami{display:flex;align-items:center;gap:3px;font-size:var(--stufe-2);color:var(--muted);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-m);padding:3px;box-shadow:var(--shadow-1)}
.whoami span{padding:0 6px 0 8px}
.whoami button{min-width:44px;height:32px;padding:0 10px;border-radius:var(--radius-s);font-size:var(--stufe-2);font-weight:500;color:var(--ink-2);transition:.15s}
.whoami button:hover{background:var(--surface-2)} .whoami button.on{background:var(--action);color:var(--on-action)}

/* ---------- Section headers ---------- */
.section{margin-top:26px}
.sec-h{display:flex;align-items:center;gap:11px;margin:0 2px 13px}
.sec-h h2{font-size:var(--stufe-3);margin:0;font-weight:600;letter-spacing:-.01em}
.sec-h .hint{font-size:var(--stufe-2);color:var(--muted)}
.sec-h .line{flex:1;height:var(--rahmen);background:var(--line)}

/* ---------- Dashboard ---------- */
.dash{display:grid;grid-template-columns:1.25fr 1fr 1fr 1fr;gap:14px;margin:8px 0}
.stat{background:var(--surface);border:var(--rahmen) solid var(--line);border-radius:var(--radius-l);padding:16px 18px;box-shadow:none;display:flex;flex-direction:column;gap:4px;min-height:var(--kachel)}
.stat .k{order:2;font-size:var(--stufe-1);font-weight:500;letter-spacing:.02em;color:var(--muted);display:flex;align-items:center;gap:6px}
.stat .v{order:1;font-size:var(--ht-schau-zahl);font-weight:600;letter-spacing:-.02em;line-height:1;font-variant-numeric:tabular-nums}
.stat .cap{order:3;font-size:var(--stufe-2);color:var(--ink-2)}
.stat.accent{background:var(--action);color:var(--on-action);border-color:var(--action-border,var(--action))}
.stat.accent .k,.stat.accent .cap,.stat.accent .v{color:var(--on-action)}
.ring-wrap{display:flex;align-items:center;gap:15px;margin-top:12px}
.ring{position:relative;--p:0;--c:var(--ok);width:72px;height:72px;border-radius:50%;flex:0 0 auto;display:grid;place-items:center;
  background:conic-gradient(var(--c) calc(var(--p)*1%), var(--on-photo-fill) 0)}
.ring::after{content:"";position:absolute;width:52px;height:52px;border-radius:50%;background:var(--brand-d)}
.ring b{position:relative;z-index:1;font-size:var(--stufe-4);font-weight:600;color:var(--on-action)}
.dot-led{width:9px;height:9px;border-radius:50%;display:inline-block}
.led-offen{background:var(--accent)} .led-klaerung{background:var(--warn)} .led-erledigt{background:var(--ok)}

/* ---------- Recurring check-in (compact, scannable) ---------- */
.recurring-band{background:var(--brand-soft);border:1px solid color-mix(in srgb,var(--brand) 22%, transparent);border-radius:var(--r-xl);padding:16px 16px 6px;margin:8px 0 4px}
.recurring-band .sec-h h2{color:var(--brand-ink)}
.rec-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.rec-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow-1);overflow:hidden}
.rec-head{padding:12px 14px;cursor:pointer;display:flex;gap:11px;align-items:flex-start}
.rec-head:hover{background:var(--surface-2)}
.rec-main{flex:1;min-width:0}
.rec-title{font-weight:600;font-size:var(--stufe-3);letter-spacing:-.01em}
.rec-q{font-size:var(--stufe-2);color:var(--ink-2);margin-top:3px}
.rec-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.rec-cta{flex:0 0 auto;display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.freqtag{font-size:var(--stufe-1);font-weight:600;letter-spacing:.03em;text-transform:uppercase;color:var(--brand-ink);background:var(--brand-soft);padding:3px 8px;border-radius:var(--radius-s);white-space:nowrap}
.btn-discussed{font-size:var(--stufe-1);font-weight:600;color:var(--ok);background:var(--ok-soft);border-radius:var(--radius-s);padding:4px 9px;white-space:nowrap}
.btn-discussed:hover{filter:brightness(.96)}

/* ---------- Cards ---------- */
.next-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.next{background:var(--surface);border:var(--rahmen) solid var(--line);border-left:var(--band) solid var(--accent);border-radius:var(--r);padding:13px 15px;box-shadow:var(--shadow-1);cursor:pointer;transition:.18s var(--ease)}
.next:hover{box-shadow:var(--shadow-card);transform:translateY(-2px)}
.next.p-mittel{border-left-color:var(--warn)} .next.p-niedrig{border-left-color:var(--ok)}
.next .t{font-weight:600;font-size:var(--stufe-3);line-height:1.4}
.next .m{display:flex;gap:7px;align-items:center;flex-wrap:wrap;margin-top:9px}

.toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:6px 2px 14px}
.search{flex:1;min-width:210px;display:flex;align-items:center;gap:9px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-m);padding:10px 14px;box-shadow:var(--shadow-1)}
.search input{border:none;outline:none;background:none;width:100%;font-size:var(--stufe-3)}
.segs{display:flex;background:var(--surface-2);border:1px solid var(--line);border-radius:var(--radius-m);padding:3px;gap:2px;flex-wrap:wrap}
.seg{padding:8px 13px;border-radius:var(--radius-m);font-size:var(--stufe-2);font-weight:500;color:var(--ink-2);transition:.15s}
.seg.on{background:var(--action);color:var(--on-action)}
.select{padding:10px 12px;border-radius:var(--radius-m);border:1px solid var(--line);font-weight:600;background:var(--surface);font-size:var(--stufe-2);box-shadow:var(--shadow-1)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:var(--ziel-min);border-radius:var(--radius-m);padding:8px 16px;font-weight:600;font-size:var(--stufe-3);line-height:1.25;border:var(--rahmen) solid transparent;transition:background var(--motion-fast) var(--motion-ease),border-color var(--motion-fast) var(--motion-ease)}
.btn-primary{background:var(--action);color:var(--on-action);border-color:var(--action-border,var(--action))}
.btn-primary:hover{background:var(--action-hover)}
.btn-brand{background:transparent;color:var(--text);border-color:var(--border-strong)}
.btn-brand:hover{background:var(--surface-2)}
.btn-ghost{background:transparent;color:var(--text);border-color:var(--border)}
.btn-ghost:hover{background:var(--surface-2);border-color:var(--border-strong)}

.add{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-l);box-shadow:none;padding:14px;margin-bottom:18px}
.add .row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.add input.title{flex:1;min-width:220px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--radius-m);background:var(--surface-2);font-size:var(--stufe-3)}
.add input.title:focus,.add .select:focus{outline:none;border-color:var(--accent)}

/* group + card */
.group{margin-top:18px}
.group-h{display:flex;align-items:center;gap:9px;margin:0 2px 11px;font-size:var(--stufe-2);font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.group-h .n{background:var(--chip-bg);color:var(--chip-ink);border-radius:var(--radius-s);padding:1px 9px;font-size:var(--stufe-2)}

.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow-1);margin-bottom:12px;overflow:hidden;transition:box-shadow .2s var(--ease),opacity .2s}
.card:hover{box-shadow:var(--shadow-card)}
.card.done{opacity:.62}
.card-top{display:flex;align-items:flex-start;gap:13px;padding:15px 17px}
.check{appearance:none;-webkit-appearance:none;width:22px;height:22px;border:var(--rahmen) solid var(--border-strong);border-radius:var(--radius-m);margin-top:2px;flex:0 0 auto;background:var(--surface-2);display:grid;place-items:center;transition:.15s;cursor:pointer}
.check:hover{border-color:var(--ok)}
.check:checked{background:var(--ok);border-color:var(--ok)}
.check:checked::after{content:"✓";color:var(--on-band);font-size:var(--stufe-2);font-weight:600}
.card-main{flex:1;min-width:0}
.ttl{font-weight:600;font-size:var(--fs-title);line-height:1.4;letter-spacing:-.01em;cursor:pointer;word-break:break-word}
.card.done .ttl{text-decoration:line-through;text-decoration-color:var(--muted)}
.subline{font-size:var(--stufe-2);color:var(--ink-2);margin-top:4px;line-height:1.5;max-width:70ch}
.card-meta{display:flex;gap:7px;align-items:center;flex-wrap:wrap;margin-top:10px}
.chev{flex:0 0 auto;color:var(--muted);transition:transform .25s var(--ease);font-size:var(--stufe-2);margin-top:4px}
.card.open .chev{transform:rotate(90deg)}

/* tags / chips */
.pill{font-size:var(--stufe-1);font-weight:600;padding:3px 9px;border-radius:var(--radius-s);letter-spacing:.01em;white-space:nowrap}
.pill.prio{cursor:pointer}
.p-hoch{background:var(--accent-soft);color:var(--accent-d)} .p-mittel{background:var(--warn-soft);color:var(--warn)} .p-niedrig{background:var(--ok-soft);color:var(--ok)}
.s-offen{background:var(--accent-soft);color:var(--accent-d)} .s-in_klaerung{background:var(--warn-soft);color:var(--warn)} .s-erledigt{background:var(--ok-soft);color:var(--ok)}
.rel{font-size:var(--stufe-1);font-weight:600;padding:3px 9px;border-radius:var(--radius-s);white-space:nowrap}
.rel-kritisch{background:var(--danger-soft);color:var(--crit-text)} .rel-hoch{background:var(--accent-soft);color:var(--accent-d)} .rel-mittel{background:var(--warn-soft);color:var(--warn)} .rel-niedrig{background:var(--ok-soft);color:var(--ok)}
.mchip{font-size:var(--stufe-1);font-weight:600;padding:3px 9px;border-radius:var(--radius-s);background:var(--chip-bg);border:1px solid var(--line);color:var(--chip-ink);display:inline-flex;gap:5px;align-items:center;white-space:nowrap}
.time-chip{background:var(--info-soft);border-color:transparent;color:var(--info)}
.by{font-size:var(--stufe-1);color:var(--muted)}
.src-claude{font-size:var(--stufe-1);color:var(--brand-ink);background:var(--brand-soft);padding:2px 8px;border-radius:var(--radius-s);font-weight:600}
.deleg-tags{display:inline-flex;gap:5px;flex-wrap:wrap}
.ptag{font-size:var(--stufe-1);font-weight:600;padding:3px 9px;border-radius:var(--radius-s);background:var(--brand-soft);color:var(--brand-ink);display:inline-flex;align-items:center;gap:5px}

.expand-btn{margin-top:11px;display:inline-flex;align-items:center;gap:6px;font-size:var(--stufe-2);font-weight:600;color:var(--accent-d)}

/* detail (progressive disclosure) */
.detail{max-height:0;overflow:hidden;transition:max-height .34s var(--ease)}
.detail.open{max-height:2200px}
.detail-inner{padding:2px 17px 17px 52px}
@media(max-width:560px){.detail-inner{padding-left:17px}}
.dsection{background:var(--surface-2);border:1px solid var(--line-soft);border-radius:var(--r);padding:12px 14px;margin-top:11px}
.dsection.reco{background:var(--brand-soft);border-color:color-mix(in srgb,var(--brand) 20%, transparent)}
.dsection.deleg{background:var(--info-soft);border-color:transparent}
.dlabel{font-size:var(--stufe-1);font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);margin-bottom:6px;display:flex;align-items:center;gap:7px}
.dsection.reco .dlabel{color:var(--brand-ink)}
.dtext{font-size:var(--stufe-3);color:var(--ink);white-space:pre-wrap;line-height:1.6;max-width:74ch}
.inferred{font-size:var(--stufe-1);font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--brand-ink);background:var(--surface);padding:1px 6px;border-radius:var(--radius-m)}

/* linked docs */
.linklist{display:flex;flex-direction:column;gap:7px}
.linkrow{display:flex;align-items:center;gap:9px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-m);padding:8px 11px;font-size:var(--stufe-2)}
.linkrow .lt{font-size:var(--stufe-1);font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--on-band);background:var(--info);border-radius:var(--radius-s);padding:2px 6px;flex:0 0 auto}

/* delegation control */
.deleg-row{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-bottom:10px}
.dd{position:relative}
.dd-btn{display:inline-flex;align-items:center;gap:7px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-m);padding:8px 12px;font-size:var(--stufe-2);font-weight:500;color:var(--ink-2)}
.dd-btn:hover{border-color:var(--brand)}
.dd-pop{position:absolute;z-index:20;top:calc(100% + 6px);left:0;width:240px;max-height:260px;overflow:auto;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-m);box-shadow:var(--shadow-3);padding:7px;display:none}
.dd-pop.open{display:block}
.dd-opt{display:flex;align-items:center;gap:9px;padding:8px 9px;border-radius:var(--radius-m);font-size:var(--stufe-2);cursor:pointer}
.dd-opt:hover{background:var(--surface-2)}
.dd-opt input{width:16px;height:16px;accent-color:var(--brand)}
.dd-team{font-size:var(--stufe-1);text-transform:uppercase;letter-spacing:.05em;color:var(--muted);padding:8px 9px 4px;font-weight:600}
.actions-row{display:flex;gap:9px;flex-wrap:wrap;align-items:center;margin-top:6px}
.btn-sm{font-size:var(--stufe-2);font-weight:600;border-radius:var(--radius-m);min-height:var(--ziel-min);padding:6px 12px;display:inline-flex;align-items:center;justify-content:flex-start;gap:7px}
.btn-copy{background:var(--brand);color:var(--on-action)}.btn-copy:hover{background:var(--brand-d)}
.btn-asana{background:var(--crit);color:var(--on-band)}.btn-asana:hover{filter:brightness(.95)}
.btn-soft{background:var(--surface);border:1px solid var(--line);color:var(--ink-2)}.btn-soft:hover{border-color:var(--accent);color:var(--accent-d)}

/* card foot */
.card-foot{display:flex;align-items:center;gap:12px;margin-top:13px;flex-wrap:wrap}
.card-foot .selectx{padding:8px 10px;border:1px solid var(--line);border-radius:var(--radius-m);background:var(--surface);font-size:var(--stufe-2);font-weight:600}
.saved{font-size:var(--stufe-1);color:var(--ok);opacity:0;transition:opacity .3s}
.saved.show{opacity:1}
.del{margin-left:auto;color:var(--muted);font-size:var(--stufe-2);font-weight:600}
.del:hover{color:var(--danger)}
.pipe{display:flex;align-items:center;gap:4px;margin-top:4px}
.pipe .step{flex:1;height:5px;border-radius:var(--radius-s);background:var(--line)}
.pipe .step.on{background:var(--brand)}

/* protocol bar */
.protocol{position:fixed;left:0;right:0;bottom:0;z-index:35;display:flex;justify-content:center;padding:14px;background:var(--bg);border-top:var(--rahmen) solid var(--border)}
.btn-finish{background:var(--action);color:var(--on-action);border:var(--rahmen) solid var(--action-border,var(--action));border-radius:var(--radius-m);min-height:56px;padding:8px 24px;font-weight:600;font-size:var(--stufe-4);box-shadow:var(--shadow-pop);display:inline-flex;align-items:center;gap:9px;transition:.15s var(--ease)}
.btn-finish:hover{background:var(--action-hover)}

/* empty + toast + loading */
.empty{text-align:center;color:var(--muted);padding:48px 22px;background:var(--surface);border:var(--rahmen) dashed var(--line);border-radius:var(--r-l)}
.empty .ico{font-size:var(--ht-schau-zahl)}
.empty h3{margin:10px 0 4px;color:var(--ink);font-size:var(--stufe-3)}
.empty p{margin:0 auto;font-size:var(--stufe-3);max-width:400px}
.toast{position:fixed;left:50%;bottom:92px;transform:translateX(-50%) translateY(8px);background:var(--surface-2);color:var(--text);border:var(--rahmen) solid var(--border-strong);padding:12px 18px;border-radius:var(--radius-m);box-shadow:var(--shadow-3);font-size:var(--stufe-2);font-weight:600;opacity:0;pointer-events:none;transition:.28s var(--ease);z-index:95}
.toast.show{opacity:1;transform:translateX(-50%)}
.loading{text-align:center;color:var(--muted);padding:48px;font-size:var(--stufe-3)}

/* ---------- Capture ---------- */
.cform label{display:block;font-size:var(--stufe-1);font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);margin:16px 0 8px}
.cform label.first{margin-top:0}
.cform textarea#raw{width:100%;min-height:130px;padding:15px;border:var(--rahmen) solid var(--line);border-radius:var(--radius-m);background:var(--surface-2);resize:vertical;font-size:var(--stufe-4)}
.cform textarea#raw:focus,.cform input:focus{outline:none;border-color:var(--accent)}
.tip{font-size:var(--stufe-2);color:var(--muted);margin-top:7px;display:flex;gap:6px;align-items:center}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{border:var(--rahmen) solid var(--line);background:var(--surface);border-radius:var(--radius-s);padding:9px 15px;font-size:var(--stufe-3);color:var(--ink-2);font-weight:600;transition:.14s var(--ease)}
.chip:hover{border-color:var(--accent)}
.chip.on{background:var(--action);border-color:var(--action);color:var(--on-action)}
.chip.u-hoch.on{background:var(--accent);border-color:var(--accent)} .chip.u-mittel.on{background:var(--warn);border-color:var(--warn)} .chip.u-niedrig.on{background:var(--ok);border-color:var(--ok)}
.row2{display:flex;gap:11px;flex-wrap:wrap}.row2>div{flex:1;min-width:150px}
.txt{width:100%;padding:12px 13px;border:1px solid var(--line);border-radius:var(--radius-m);background:var(--surface-2);font-size:var(--stufe-3)}
.more{display:block;margin:14px auto 0;color:var(--accent-d);font-weight:600;font-size:var(--stufe-2)}
.extra{display:none}
.okcard{text-align:center;padding:34px 16px}
.okcard .big{font-size:var(--ht-schau-zahl)}.okcard h2{margin:10px 0 4px;font-size:var(--stufe-5)}.okcard p{color:var(--muted);font-size:var(--stufe-3);margin:0 0 20px}
.foot{text-align:center;margin-top:20px;font-size:var(--stufe-2);color:var(--muted)}

/* ---------- Inbox ---------- */
.inbox-item{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-l);box-shadow:var(--shadow-1);padding:16px 18px;margin-bottom:14px}
.raw{font-size:var(--stufe-3);font-weight:600;line-height:1.45;white-space:pre-wrap;letter-spacing:-.01em;max-width:74ch}
.imeta{font-size:var(--stufe-1);color:var(--muted);margin-top:8px;display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.src{background:var(--chip-bg);border-radius:var(--radius-s);padding:2px 9px;font-weight:600}
.ai{margin-top:13px;padding:13px;border:1px dashed color-mix(in srgb,var(--brand) 30%, transparent);background:var(--brand-soft);border-radius:var(--radius-m)}
.ai-h{font-size:var(--stufe-1);letter-spacing:.06em;text-transform:uppercase;color:var(--brand-ink);font-weight:600;margin-bottom:9px;display:flex;align-items:center;gap:8px}
.needs{background:var(--accent-soft);color:var(--accent-d);border-radius:var(--radius-s);padding:2px 9px;font-size:var(--stufe-1);font-weight:600}
.ch{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-s);padding:4px 11px;font-size:var(--stufe-2)}.ch b{color:var(--muted);font-weight:600}
.na{margin-top:9px;font-size:var(--stufe-2)}.na b{color:var(--brand-ink)}
.pending{color:var(--warn);font-style:italic;margin-top:11px;font-size:var(--stufe-2)}
.iedit{display:flex;gap:9px;flex-wrap:wrap;align-items:center;margin-top:13px}
.iedit input.ititle{flex:1;min-width:220px;padding:10px 12px;border:1px solid var(--line);border-radius:var(--radius-m);background:var(--surface-2);font-size:var(--stufe-3)}

/* ---------- Edit (bearbeiten) ---------- */
.editcard{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow-1);margin-bottom:11px;overflow:hidden}
.editcard .eh{padding:13px 15px;cursor:pointer;display:flex;align-items:center;gap:10px}
.editcard .eh .et{font-weight:600;flex:1}
.editcard .ebody{max-height:0;overflow:hidden;transition:max-height .34s var(--ease)}
.editcard.open .ebody{max-height:3600px}
.editcard .ebody-inner{padding:4px 15px 16px;border-top:1px dashed var(--line-soft)}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:11px 14px}
@media(max-width:620px){.fgrid{grid-template-columns:1fr}}
.ffull{grid-column:1/-1}
.fld label{font-size:var(--stufe-1);font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin-bottom:4px;display:block}
.fld input,.fld select,.fld textarea{width:100%;border:1px solid var(--line);border-radius:var(--radius-m);padding:9px 11px;background:var(--surface-2);font-size:var(--stufe-3)}
.fld textarea{resize:vertical;min-height:42px}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:none;border-color:var(--accent)}
.kindtag{font-size:var(--stufe-1);font-weight:600;border-radius:var(--radius-s);padding:2px 9px}
.kind-recurring{background:var(--brand-soft);color:var(--brand-ink)} .kind-einmalig{background:var(--chip-bg);color:var(--chip-ink)}
.muted-row{opacity:.55}

/* ---------- Agenda / checkin ---------- */
.agenda{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-l);box-shadow:none;padding:18px;margin-top:14px}
.ag-item{padding:13px 0;border-bottom:1px dashed var(--line-soft)}.ag-item:last-child{border-bottom:none}
.ag-h{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}
.ag-num{font-weight:600;color:var(--brand-ink)}.ag-t{font-weight:600;font-size:var(--stufe-3)}.ag-min{margin-left:auto;font-weight:600;color:var(--info)}
.ag-meta{font-size:var(--stufe-2);color:var(--ink-2);margin-top:5px;line-height:1.6}.ag-meta b{color:var(--ink)}
.ag-total{display:flex;align-items:center;gap:10px;margin-top:6px;padding:12px;background:var(--info-soft);border-radius:var(--radius-m);font-weight:600;color:var(--info)}
.prep-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:13px}
@media(max-width:880px){.prep-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.prep-grid{grid-template-columns:1fr}}
.prep-col h3{font-size:var(--stufe-2);margin:0 0 9px;color:var(--ink-2)}
.prep-item{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-m);box-shadow:var(--shadow-1);padding:10px 12px;margin-bottom:8px;font-size:var(--stufe-2)}
.prep-item .pt{font-weight:600}
.prep-item .pm{font-size:var(--stufe-1);color:var(--muted);margin-top:4px;display:flex;gap:7px;flex-wrap:wrap;align-items:center}

/* ---------- Responsive ---------- */
@media(max-width:920px){ .dash{grid-template-columns:1fr 1fr} .next-grid{grid-template-columns:1fr} .rec-grid{grid-template-columns:1fr} }
@media(max-width:680px){
  .wrap{padding:0 14px 120px}
  .brand .meta{display:none}
  .dash{grid-template-columns:1fr 1fr;gap:11px}
  .stat .v{font-size:var(--stufe-5)}
}

/* ===========================================================
   V8 · Steuerungsmaske (index.html)
   =========================================================== */
.start-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:22px;flex-wrap:wrap;margin:10px 2px 18px}
.start-hero h2{font-size:var(--stufe-5);letter-spacing:-.025em;margin:0 0 6px}
.start-hero p{margin:0;max-width:620px;color:var(--ink-2);font-size:var(--fs-body);line-height:1.5}
.start-stats{display:flex;gap:10px;flex-wrap:wrap}
.sstat{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:10px 14px;min-width:92px;box-shadow:var(--shadow-1)}
.sstat{display:flex;flex-direction:column;gap:2px}
.sstat .k{order:2;font-size:var(--stufe-1);font-weight:500;letter-spacing:.02em;color:var(--muted)}
.sstat .v{order:1;font-size:var(--stufe-5);font-weight:600;letter-spacing:-.02em;line-height:1.1;font-variant-numeric:tabular-nums}
#editMode.on-edit{background:var(--accent-soft);border-color:var(--accent);color:var(--accent-d)}
.sites-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.site{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-l);box-shadow:var(--shadow-1);padding:0;display:flex;flex-direction:column;gap:0;min-width:0;overflow:hidden;transition:box-shadow .2s var(--ease),transform .2s var(--ease)}
.site-body{padding:13px 16px 13px;display:flex;flex-direction:column;gap:8px;flex:1;min-width:0}
.site.editcard{padding:16px;overflow:visible}
.site:hover{box-shadow:var(--shadow-card);transform:translateY(-1px)}
.site.is-entwurf{border-style:dashed}
.site.is-archiv{opacity:.62}
.site-top{display:flex;align-items:flex-start;gap:8px}
.site-name{font-weight:600;font-size:var(--fs-title);letter-spacing:-.01em;color:var(--ink);flex:1;min-width:0;line-height:1.25}
.site-name:hover{color:var(--brand-ink);text-decoration:none}
.site-host{display:flex;align-items:center;gap:6px;font-size:var(--stufe-2);color:var(--muted);margin-top:-4px;min-width:0}
.site-host span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.site-purpose{margin:0;font-size:var(--stufe-2);line-height:1.45;color:var(--ink-2)}
.site-purpose.muted{color:var(--muted);font-style:italic}
.site-notes{margin:0;font-size:var(--stufe-2);line-height:1.4;color:var(--muted);border-left:2px solid var(--line);padding-left:8px}
.site-login{background:var(--surface-2);border:1px solid var(--line-soft);border-radius:var(--r-s);padding:8px 10px;display:flex;flex-direction:column;gap:4px;margin-top:auto}
.site-login.none{flex-direction:row;align-items:center;gap:8px}
.site-login .lk{font-size:var(--stufe-1);font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.lrow{display:flex;align-items:center;gap:6px;min-width:0}
.lv{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--stufe-2);font-weight:600}
.lv.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.04em}
.lnote{font-size:var(--stufe-2);color:var(--muted);line-height:1.35}
.mini{min-width:26px;height:26px;padding:0 6px;font-size:var(--stufe-1);border-radius:var(--radius-m);display:inline-grid;place-items:center;font-size:var(--stufe-2);color:var(--ink-2);background:var(--surface);border:1px solid var(--line);flex:0 0 auto;transition:.14s}
.mini:hover{border-color:var(--accent);color:var(--accent-d)}
.icon-btn{width:30px;height:30px;border-radius:var(--radius-m);display:inline-grid;place-items:center;background:var(--surface-2);border:1px solid var(--line);color:var(--ink-2);flex:0 0 auto}
.icon-btn:hover{border-color:var(--accent);color:var(--accent-d)}
.site-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:2px}
.site-meta{font-size:var(--stufe-1);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pill-entwurf{background:var(--warn-soft);color:var(--warn)}
.pill-archiv{background:var(--chip-bg);color:var(--chip-ink)}
.site.editcard{grid-column:1/-1;padding:16px}
.site.editcard .actions-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.site.editcard .btn.del{margin-left:auto;color:var(--crit-text)}
.start-foot{margin:28px 2px 0;font-size:var(--stufe-2);color:var(--muted)}
@media(max-width:560px){ .sites-grid{grid-template-columns:1fr} .start-hero h2{font-size:var(--stufe-5)} }

/* ===========================================================
   V8 · Startseite (index.html): Jahreszyklus & Überblick
   =========================================================== */
.cycle{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xl);box-shadow:none;padding:20px 22px 26px;margin:8px 0 14px}
.cycle-head{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:18px;align-items:start;margin-bottom:18px}
.cycle .k{font-size:var(--stufe-1);font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.cycle-now{background:var(--s);border-left:var(--band) solid var(--c);border-radius:var(--r);padding:14px 16px}
.cycle-now .v{font-size:var(--ht-schau-zahl);font-weight:600;letter-spacing:-.03em;line-height:1.05;margin-top:4px;color:var(--ink)}
.cycle-now .lead{margin-top:6px;font-size:var(--stufe-3);color:var(--ink-2);line-height:1.4}
.cycle-next{padding:14px 4px}
.cycle-next .v2{font-size:var(--stufe-4);font-weight:600;letter-spacing:-.01em;margin-top:4px}
.cycle-next .cap{font-size:var(--stufe-2);color:var(--ink-2);margin-top:3px}
.cycle-legend{display:flex;flex-direction:column;gap:6px;padding:14px 4px;font-size:var(--stufe-2);color:var(--ink-2)}
.cycle-legend span{display:flex;align-items:center;gap:8px}
.cycle-legend i{width:10px;height:10px;border-radius:var(--radius-s);background:var(--c);display:inline-block}
.cycle-legend em{font-style:normal;color:var(--muted);font-size:var(--stufe-2)}
.cycle-strip{position:relative;padding-top:24px;padding-bottom:40px}
.cmonths{display:grid;grid-template-columns:repeat(12,1fr);gap:3px}
.cm{height:34px;border-radius:var(--radius-m);background:var(--s);border:1px solid color-mix(in srgb,var(--c) 35%,transparent);display:grid;place-items:center;font-size:var(--stufe-2);font-weight:600;color:var(--c)}
.cm.now{background:var(--c);color:var(--on-band)}
.today{position:absolute;top:auto;bottom:40px;transform:translateX(-50%);display:flex;flex-direction:column-reverse;align-items:center;pointer-events:none}
.today i{display:block;width:2px;height:44px;background:var(--ink);border-radius:var(--radius-s)}
.today b{font-size:var(--stufe-1);font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--ink);margin-bottom:2px;background:var(--surface);padding:1px 6px;border-radius:var(--radius-s);border:1px solid var(--line)}
.tmark{position:absolute;top:auto;bottom:0;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;max-width:110px;text-align:center}
.tmark i{display:block;width:8px;height:8px;border-radius:var(--radius-s);background:var(--brand);border:2px solid var(--surface);box-shadow:0 0 0 1px var(--brand)}
.tmark.edge-l{transform:translateX(-5px);align-items:flex-start;text-align:left} .tmark.edge-r{transform:translateX(calc(-100% + 5px));align-items:flex-end;text-align:right}
.tmark b{font-size:var(--stufe-1);font-weight:600;color:var(--muted);line-height:1.2;margin-top:3px}
.empty.soft{padding:22px;font-size:var(--stufe-2);text-align:left}
.top-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
.tcard{display:flex;flex-direction:column;gap:7px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-l);padding:14px 16px;box-shadow:var(--shadow-1);color:var(--ink);transition:.2s var(--ease)}
.tcard:hover{text-decoration:none;box-shadow:none;transform:translateY(-1px)}
.tc-top{display:flex;gap:6px;flex-wrap:wrap}
.tc-title{font-weight:600;font-size:var(--fs-title);letter-spacing:-.01em;line-height:1.3}
.tc-sub{font-size:var(--stufe-2);color:var(--ink-2);line-height:1.4}
.tc-next{font-size:var(--stufe-2);color:var(--ink-2);background:var(--surface-2);border-radius:var(--r-s);padding:7px 9px;line-height:1.4}
.tc-foot{display:flex;justify-content:space-between;gap:8px;font-size:var(--stufe-2);color:var(--muted);margin-top:auto}
.rit-wrap{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:8px}
.rit{display:flex;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:10px 12px;font-size:var(--stufe-2);color:var(--ink-2)}
.rit .rn{width:22px;height:22px;border-radius:var(--radius-s);display:grid;place-items:center;background:var(--chip-bg);color:var(--chip-ink);font-size:var(--stufe-1);font-weight:600;flex:0 0 auto}
.quick{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.qcard{display:flex;flex-direction:column;gap:4px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;color:var(--ink);box-shadow:var(--shadow-1);transition:.2s var(--ease)}
.qcard:hover{text-decoration:none;border-color:var(--brand);box-shadow:none}
.qn{font-weight:600;font-size:var(--stufe-3)}
.qp{font-size:var(--stufe-2);color:var(--ink-2);line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.qh{font-size:var(--stufe-1);color:var(--muted);margin-top:auto}
.sec-h .btn-sm{margin-left:auto}
@media(max-width:880px){ .cycle-head{grid-template-columns:1fr 1fr} .cycle-legend{grid-column:1/-1;flex-direction:row;flex-wrap:wrap;gap:14px;padding-top:0} }
@media(max-width:600px){ .cycle-head{grid-template-columns:1fr} .cm span{display:none} .cm{height:22px} .today i{height:30px} .today{bottom:16px} .tmark{max-width:70px} .tmark b{display:none} .cycle-strip{padding-bottom:16px} .cycle{padding:16px} }

/* ---------- V9 · Ergänzungen zum Design System ---------- */
.gate-card .mark,.brand .mark{background:var(--action);color:var(--on-action);box-shadow:none;border-radius:var(--radius-m)}
.badge-conf{color:var(--text-2);background:var(--fill);letter-spacing:.04em}
.card:hover,.site:hover,.tcard:hover,.next:hover,.qcard:hover,.rec-card:hover{box-shadow:var(--shadow-card)}
.dd-pop,.protocol .btn-finish,.toast{box-shadow:var(--shadow-pop)}
.theme-sw{border-radius:var(--radius-m);padding:3px}
h1,h2,h3{text-wrap:balance}
.stat .v,.sstat .v,.cycle-now .v,.cycle-next .v2,.kpi b,.hab .v{font-variant-numeric:tabular-nums}
.stat .v{font-size:var(--ht-schau-zahl)}
.kindtag,.pill,.rel,.mchip,.ptag,.src-claude,.freqtag,.needs,.ch,.src,.inferred,.linkrow .lt{border-radius:var(--radius-s);font-weight:500}
.sec-h h2{font-size:var(--stufe-4);font-weight:600}
.empty{border-style:solid}
.ht-num{font-variant-numeric:tabular-nums}

/* ===========================================================
   V10 · Startseite Stufe 2: Meilensteine, Jahresleiste, Rituale
   =========================================================== */
.sec-actions{display:flex;gap:6px;flex-wrap:wrap;margin-left:auto}
.sec-h .sec-actions .btn-sm{margin-left:0}
.cycle-next .cap.muted{color:var(--muted);font-size:var(--stufe-2);margin-top:6px;line-height:1.4}
.cycle-yearbar{display:flex;align-items:center;gap:8px;margin:6px 0 2px;font-size:var(--stufe-2);color:var(--muted)}
.cycle-yearbar b{font-size:var(--stufe-3);color:var(--text);min-width:44px;text-align:center;font-variant-numeric:tabular-nums}
.cycle-yearbar .hint{margin-left:6px}
.cycle-strip.has-ms{padding-top:44px}
.msrow{position:absolute;left:0;right:0;top:0;height:40px}
.msmark{position:absolute;bottom:6px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:2px}
.msmark b{font-size:var(--stufe-1);font-weight:600;color:var(--text-2);white-space:nowrap;background:var(--surface-2);border:var(--rahmen) solid var(--border);border-radius:var(--radius-s);padding:1px 5px}
.msmark i{display:block;width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:7px solid var(--accent)}
.msmark.laufend i{border-top-color:var(--warn)} .msmark.erreicht i{border-top-color:var(--pos)} .msmark.verschoben i{border-top-color:var(--crit)}
.ms-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
.ms{background:var(--surface);border:var(--rahmen) solid var(--border);border-radius:var(--radius-l);padding:14px 16px;display:flex;flex-direction:column;gap:6px;min-width:0;transition:box-shadow var(--motion-base) var(--motion-ease)}
.ms:hover{box-shadow:var(--shadow-card)}
.ms.st-erreicht{opacity:.7} .ms.st-abgesagt{opacity:.55} .ms.st-abgesagt .ms-title{text-decoration:line-through}
.ms-top{display:flex;align-items:center;gap:6px}
.ms-top .icon-btn{margin-left:auto}
.pill.strand{background:var(--accent-soft);color:var(--accent-strong)}
.pill.st-geplant{background:var(--fill);color:var(--text-2)} .pill.st-laufend{background:var(--warn-bg);color:var(--warn)} .pill.st-erreicht{background:var(--pos-bg);color:var(--pos)} .pill.st-verschoben{background:var(--crit-bg);color:var(--crit-text)} .pill.st-abgesagt{background:var(--fill);color:var(--muted)}
.ms-date{font-size:var(--stufe-2);color:var(--text-2);font-variant-numeric:tabular-nums}
.ms-date em{font-style:normal;color:var(--muted)}
.ms-title{font-weight:600;font-size:var(--stufe-4);letter-spacing:-.01em;line-height:1.25}
.ms-title a{color:var(--text);text-decoration:none} .ms-title a:hover{color:var(--link)}
.ms-desc{font-size:var(--stufe-2);color:var(--text-2);line-height:1.45}
.ms-foot{display:flex;justify-content:space-between;gap:8px;font-size:var(--stufe-2);color:var(--muted);margin-top:auto}
.ms.editcard{grid-column:1/-1}
.ms.editcard .btn.del{margin-left:auto;color:var(--crit-text)}
#msAll.on-edit,#editMode.on-edit{background:var(--accent-soft);border-color:var(--accent);color:var(--accent-strong)}
/* Rituale abhakbar */
label.rit{cursor:pointer;align-items:flex-start;gap:12px}
label.rit .check{margin-top:1px}
label.rit .rt{flex:1;display:flex;flex-direction:column;gap:2px;color:var(--text)}
label.rit .rt small{font-size:var(--stufe-1);color:var(--muted)}
label.rit .rt small.who{color:var(--pos)}
label.rit.done{opacity:.72} label.rit.done .rt>span,label.rit.done .rt{text-decoration:none}
label.rit .mini.del{color:var(--muted)} label.rit .mini.del:hover{color:var(--crit);border-color:var(--crit)}
.rit-add{display:flex;gap:8px;margin-top:10px;align-items:center}
.rit-add input{flex:1;min-width:200px;border:var(--rahmen) solid var(--border);border-radius:var(--radius-m);padding:9px 11px;background:var(--surface-2);font-size:var(--stufe-3)}
.rit-add input:focus{outline:none;border-color:var(--accent)}
@media(max-width:600px){ .msmark b{display:none} .cycle-strip.has-ms{padding-top:30px} .msrow{height:26px} .sec-actions{width:100%} }


/* ===========================================================
   V11 · Bildwelt, Einklappen, Unternavigation, Bewegung, Board
   =========================================================== */
/* Kopfbild (V12): Grafik unverdeckt in 2,4:1, Titelzeile darunter */
.hero{margin:0 0 18px;display:block;padding:0;background:none;color:inherit;min-height:0}
.hero-pic{margin:0;border:var(--rahmen) solid var(--border);border-radius:var(--radius-l);overflow:hidden;background:var(--photo-bg)}
.hero-pic img{display:block;width:100%;height:auto;aspect-ratio:2.4/1;max-height:460px;object-fit:cover;object-position:center 45%}
.hero.compact .hero-pic img{aspect-ratio:3/1;max-height:380px}
.hero-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;padding:16px 2px 0}
.hero h2{margin:0;font-size:var(--stufe-5);font-weight:600;letter-spacing:-.01em;color:var(--text)}
.hero p{margin:4px 0 0;color:var(--text-2);font-size:var(--stufe-3);max-width:640px}
.hero.compact h2{font-size:var(--stufe-4)}
.hero-aside{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-end;flex:0 0 auto}
@media(max-width:600px){ .hero-pic img,.hero.compact .hero-pic img{aspect-ratio:16/10;max-height:none} .hero-head{flex-direction:column;align-items:flex-start;padding-top:12px} .hero h2{font-size:var(--stufe-4)} }
.empty.pic{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:0;padding:0;text-align:left;color:var(--text);background:var(--surface);border-style:solid}
.empty.pic::before{content:"";display:block;background:var(--photo-bg) var(--hero-img) center/cover no-repeat;aspect-ratio:16/9;min-height:160px}
.empty.pic>div{padding:20px 22px;align-self:center}
@media(max-width:600px){ .empty.pic{grid-template-columns:1fr} }
.empty.pic h3{color:var(--text);margin-top:0} .empty.pic p{color:var(--text-2);margin:0}
/* Einklappen */
.clamp .c-full{display:none} .clamp.open .c-full{display:inline} .clamp.open .c-short{display:none}
.c-more{font:inherit;font-size:var(--stufe-2);font-weight:600;color:var(--link);padding:0 2px;border-radius:var(--radius-s);cursor:pointer}
.c-more:hover{text-decoration:underline}
/* Unternavigation */
.subnav{display:flex;gap:2px;background:var(--surface);border:var(--rahmen) solid var(--border);border-radius:var(--radius-m);padding:3px;width:max-content;margin:0 0 12px}
.subnav a{display:inline-flex;align-items:center;min-height:32px;padding:0 12px;border-radius:var(--radius-s);font-size:var(--stufe-2);font-weight:500;color:var(--text-2);text-decoration:none;transition:background var(--motion-fast) var(--motion-ease)}
.subnav a:hover{background:var(--surface-2);color:var(--text)} .subnav a.on{background:var(--action);color:var(--on-action)}
/* Bewegung nach Design System: nur transform/opacity, 120/200/400, ein Einlauf */
@keyframes ht-rise{from{opacity:0;transform:translateY(var(--motion-rise))}to{opacity:1;transform:none}}
@keyframes ht-puls{0%{box-shadow:0 0 0 0 var(--action)}100%{box-shadow:0 0 0 6px transparent}}
@keyframes ht-check{from{transform:scale(.6)}to{transform:none}}
@media (prefers-reduced-motion:no-preference){
  .ht-rise{animation:ht-rise 240ms var(--motion-ease) both}
  /* V23: Klappabschnitte 200 ms, Board-Panel 240 ms, nur transform und opacity */
  details[open]>:not(summary){animation:ht-rise 200ms var(--motion-ease) both}
  .panel.open .panel-b{animation:ht-rise 240ms var(--motion-ease) both}
  .card,.site,.tcard,.ms,.qcard,.rit,.stat,.sstat,.next,.rec-card,.inbox-item,.editcard,.bcard{transition:transform var(--motion-base) var(--motion-ease),box-shadow var(--motion-base) var(--motion-ease),border-color var(--motion-fast) var(--motion-ease),opacity var(--motion-base)}
  .card:hover,.site:hover,.tcard:hover,.ms:hover,.qcard:hover,.next:hover,.bcard:hover{transform:translateY(-2px)}
  .btn,.seg,.chip,.mini,.icon-btn,.sb-nav a,.subnav a,.check{transition:background var(--motion-fast) var(--motion-ease),border-color var(--motion-fast) var(--motion-ease),color var(--motion-fast),transform var(--motion-fast) var(--motion-ease)}
  .btn:active,.seg:active,.chip:active,.mini:active,.icon-btn:active,.sb-nav a:active,.subnav a:active{transform:scale(.97)}
  .check:checked{animation:ht-check var(--motion-base) var(--motion-ease)}
  .today i{animation:ht-puls 900ms var(--motion-ease) 1}
  .toast{transition:opacity var(--motion-base) var(--motion-ease),transform var(--motion-base) var(--motion-ease)}
  .stat{cursor:default} .stat.link{cursor:pointer}
}
@media (prefers-reduced-motion:reduce){ *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important} }
/* Skelett statt „lädt …" */
.skel{background:var(--surface);border:var(--rahmen) solid var(--border);border-radius:var(--radius-l);padding:16px;display:flex;flex-direction:column;gap:10px;min-height:96px}
.skel i{display:block;height:12px;border-radius:var(--radius-s);background:var(--fill);animation:skel 1.2s ease-in-out infinite alternate}
.skel i.w60{width:60%} .skel i.w80{width:80%}
@keyframes skel{from{opacity:.5}to{opacity:1}}
/* Board */
.board-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 14px}
.board-bar .search{flex:1;min-width:200px}
.board{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(260px,1fr);gap:12px;overflow-x:auto;padding-bottom:12px;align-items:start;scroll-snap-type:x proximity}
.lane{background:var(--surface-2);border:var(--rahmen) solid var(--border);border-radius:var(--radius-l);padding:10px;min-height:220px;display:flex;flex-direction:column;gap:8px;scroll-snap-align:start;transition:border-color var(--motion-fast),background var(--motion-fast)}
.lane.over{border-color:var(--action);background:var(--accent-soft)}
.lane-h{display:flex;align-items:center;gap:8px;padding:2px 4px 6px;font-size:var(--stufe-2);font-weight:600;color:var(--text)}
.lane-h .n{margin-left:auto;background:var(--fill);color:var(--text-2);border-radius:var(--radius-s);padding:1px 8px;font-size:var(--stufe-1);font-variant-numeric:tabular-nums}
.lane-h .bar{width:var(--band);height:16px;border-radius:var(--radius-s);background:var(--c,var(--accent))}
.bcard{background:var(--surface);border:var(--rahmen) solid var(--border);border-radius:var(--radius-m);padding:10px 12px;display:flex;flex-direction:column;gap:6px;cursor:grab;user-select:none}
.bcard:active{cursor:grabbing}
.bcard.dragging{opacity:.45}
.bcard.rec{border-left:var(--band) solid var(--accent)}
.bcard .bt{font-weight:600;font-size:var(--stufe-3);line-height:1.3}
.bcard .bm{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.bcard .bn{font-size:var(--stufe-2);color:var(--text-2);line-height:1.4}
.bcard .bf{display:flex;justify-content:space-between;gap:8px;font-size:var(--stufe-1);color:var(--muted)}
.bcard .age{font-variant-numeric:tabular-nums}
.bcard.stale .age{color:var(--warn)}
.lane .empty-lane{border:var(--rahmen) dashed var(--border);border-radius:var(--radius-m);padding:14px;text-align:center;color:var(--muted);font-size:var(--stufe-2)}
/* Kacheln */
.tiles{display:flex;flex-direction:column;gap:18px}
.tiles .tgroup-h{display:flex;align-items:center;gap:8px;font-size:var(--stufe-2);font-weight:600;color:var(--text);margin:0 2px 8px}
.tiles .tgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px}
/* Detail-Panel */
.panel-back{position:fixed;inset:0;background:var(--backdrop);z-index:60;display:none}
.panel-back.open{display:block}
.panel{position:fixed;top:0;right:0;bottom:0;width:min(480px,100vw);background:var(--surface);border-left:var(--rahmen) solid var(--border);box-shadow:var(--shadow-pop);z-index:61;transform:translateX(100%);transition:transform 240ms var(--motion-ease);display:flex;flex-direction:column}
.panel.open{transform:none}
.panel-h{display:flex;align-items:center;gap:8px;padding:14px 16px;border-bottom:var(--rahmen) solid var(--border)}
.panel-h h3{margin:0;font-size:var(--stufe-4);flex:1;min-width:0}
.panel-b{padding:14px 16px;overflow:auto;flex:1;display:flex;flex-direction:column;gap:12px}
.panel-f{padding:12px 16px;border-top:var(--rahmen) solid var(--border);display:flex;gap:8px;flex-wrap:wrap}
.panel .fld textarea{min-height:64px}
.move-row{display:flex;gap:6px;flex-wrap:wrap}
.undo{display:inline-flex;gap:10px;align-items:center}
.undo button{font:inherit;font-weight:600;color:var(--link);text-decoration:underline;cursor:pointer}
@media(max-width:680px){ .board{grid-auto-columns:minmax(78vw,1fr)} }
.chk{display:inline-flex;gap:6px;align-items:center;font-size:var(--stufe-2);color:var(--text-2);cursor:pointer;user-select:none}
.chk input{width:16px;height:16px;accent-color:var(--action)}
a.stat{color:inherit;text-decoration:none;display:block} a.stat:hover{border-color:var(--action)}
.stat.accent .cap a{color:inherit}

/* ---------- V12: Wichtige Seiten mit Vorschaubild, drei Ansichten ---------- */
.site-pic{display:block;position:relative;background:var(--surface-2);border-bottom:var(--rahmen) solid var(--border);overflow:hidden;aspect-ratio:16/10}
.site-pic img{display:block;width:100%;height:100%;object-fit:cover;object-position:top;transition:transform var(--motion-slow) var(--motion-ease)}
.site:hover .site-pic img{transform:scale(1.02)}
.site-pic.none{display:grid;place-items:center;color:var(--muted);font-size:var(--stufe-2);font-weight:600;letter-spacing:.02em}
.site-pic.none span{padding:0 12px;text-align:center;word-break:break-all}
.sites-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.site-login.compact{padding:6px 8px;gap:3px;margin-top:0}
/* Liste */
.slist{display:flex;flex-direction:column;gap:6px}
.srow{display:grid;grid-template-columns:96px minmax(160px,1.2fr) 120px minmax(160px,1.6fr) minmax(170px,1.2fr) auto;gap:12px;align-items:center;padding:8px 12px 8px 8px;border-radius:var(--radius-m);flex-direction:row;overflow:visible}
.srow.shead{background:none;border:0;box-shadow:none;padding:2px 12px 2px 8px;font-size:var(--stufe-1);font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.srow.shead:hover{transform:none;box-shadow:none}
.srow .site-pic.thumb{aspect-ratio:16/10;width:96px;border:1px solid var(--line);border-radius:var(--radius-s)}
.srow .sname{min-width:0} .srow .sname .site-host{margin-top:2px}
.srow .scat{font-size:var(--stufe-1);color:var(--text-2)}
.srow .spurp{font-size:var(--stufe-2);line-height:1.4;color:var(--ink-2);min-width:0}
.srow .slog{min-width:0}
.srow .sact{display:flex;gap:6px;align-items:center;justify-content:flex-end}
.srow-edit{padding:4px 0}
.srow-edit .site.editcard{grid-column:auto}
@media(max-width:960px){ .srow{grid-template-columns:80px minmax(0,1fr) minmax(0,1fr) auto;grid-template-areas:"pic name log act" "pic purp purp purp"} .srow .site-pic.thumb{grid-area:pic;width:80px} .srow .sname{grid-area:name} .srow .scat{display:none} .srow .spurp{grid-area:purp} .srow .slog{grid-area:log} .srow .sact{grid-area:act} .srow.shead{display:none} }
@media(max-width:600px){ .srow{grid-template-columns:64px minmax(0,1fr);grid-template-areas:"pic name" "pic act" "purp purp" "log log"} .srow .site-pic.thumb{width:64px} .srow .sact{justify-content:flex-start} }
/* Schnellstart */
.quick-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px}
.qtile{cursor:default}
.qtile .site-pic.q{border-bottom:0;aspect-ratio:16/10}
.qtile .qname{display:flex;align-items:center;gap:6px;padding:9px 11px 10px;border-top:var(--rahmen) solid var(--border)}
.qtile .qname .site-name{font-size:var(--stufe-2);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.qlock{font-size:var(--stufe-1);font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--brand-ink);background:var(--brand-soft);padding:2px 6px;border-radius:var(--radius-s);flex:0 0 auto}
@media(max-width:600px){ .quick-grid{grid-template-columns:repeat(2,1fr)} }

/* ---------- V13: Besprechungsmodus, Verschieben-Menü, Text-Modal ---------- */
.bf-r{display:inline-flex;align-items:center;gap:6px}
.mv{width:24px;height:22px;display:grid;place-items:center;border:1px solid var(--line);border-radius:var(--radius-s);background:var(--surface);color:var(--text-2);font-size:var(--stufe-2);line-height:1;opacity:.55;transition:opacity var(--motion-fast),background var(--motion-fast)}
.mv:hover,.bcard:hover .mv,.bcard:focus-within .mv{opacity:1;background:var(--surface-2)}
@media(hover:none){ .mv{opacity:1} }
.pop[hidden]{display:none}
.pop{position:absolute;z-index:70;background:var(--surface);border:var(--rahmen) solid var(--border-strong);border-radius:var(--radius-m);box-shadow:var(--shadow-pop);padding:6px;display:flex;flex-direction:column;gap:2px}
.pop-h{font-size:var(--stufe-1);font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);padding:6px 10px 4px}
.pop-i{text-align:left;padding:9px 10px;border-radius:var(--radius-s);font-size:var(--stufe-2);font-weight:500;color:var(--text);background:none}
.pop-i:hover{background:var(--surface-2)} .pop-i.on{background:var(--action);color:var(--on-action)}
.bcard.is-cur{outline:2px solid var(--action);outline-offset:2px}
.meet{border:var(--rahmen) solid var(--action);border-radius:var(--radius-l);background:var(--surface);margin:0 0 16px;overflow:hidden}
.meet-h{display:flex;align-items:center;gap:14px;padding:10px 14px;background:var(--action);color:var(--on-action);flex-wrap:wrap}
.meet-timer{font-variant-numeric:tabular-nums;font-weight:600;font-size:var(--stufe-4);letter-spacing:.02em;min-width:70px}
.meet-meta{font-size:var(--stufe-2);flex:1;min-width:200px;opacity:.95}
.meet-actions{display:flex;gap:6px}
.meet-h .btn{border-color:var(--on-photo-line);color:var(--on-action);background:var(--on-photo-fill)} .meet-h .btn:hover{background:var(--on-photo-line)}
.meet-h .btn.btn-primary{background:var(--surface);color:var(--text);border-color:var(--surface)} .meet-h .btn.btn-primary:hover{background:var(--surface-2)}
.meet-cur{padding:16px 18px 18px}
.meet-cur-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.meet-pos{font-size:var(--stufe-1);color:var(--muted)}
.meet-title{margin:0 0 6px;font-size:var(--stufe-5);letter-spacing:-.01em}
.meet-desc{margin:0 0 8px;color:var(--text-2);font-size:var(--stufe-3)}
.meet-ctx{font-size:var(--stufe-2);color:var(--text-2);line-height:1.5;border-left:3px solid var(--line);padding-left:10px;margin:0 0 12px;white-space:pre-line}
.meet-form{margin-bottom:12px}
.meet-btns{display:flex;gap:8px;flex-wrap:wrap}
.meet-done{padding:22px 18px} .meet-done h3{margin:0 0 6px} .meet-done p{margin:0;color:var(--text-2)}
.modal-back{position:fixed;inset:0;background:var(--backdrop);z-index:80;display:none;align-items:center;justify-content:center;padding:20px}
.modal-back.open{display:flex}
.modal{width:100%;max-width:760px;max-height:90vh;display:flex;flex-direction:column;background:var(--surface);border:var(--rahmen) solid var(--border-strong);border-radius:var(--radius-l);box-shadow:var(--shadow-pop);animation:ht-rise 200ms var(--motion-ease) both}
.modal-h{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 18px;border-bottom:var(--rahmen) solid var(--border)} .modal-h h3{margin:0;font-size:var(--stufe-4)}
.modal-intro{margin:0;padding:10px 18px 0;color:var(--text-2);font-size:var(--stufe-2)}
.modal-text{flex:1;min-height:260px;margin:12px 18px 0;padding:12px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:var(--stufe-2);line-height:1.5;background:var(--surface-2);border:1px solid var(--line);border-radius:var(--radius-s);color:var(--text);resize:vertical;white-space:pre-wrap}
.modal-f{display:flex;gap:8px;flex-wrap:wrap;padding:14px 18px}
@media(max-width:600px){ .meet-actions{width:100%;justify-content:flex-end} .modal-text{min-height:200px} }

/* Entscheidungslog */
.dlist{display:flex;flex-direction:column;gap:8px}
.drow{display:grid;grid-template-columns:120px minmax(0,1fr) auto;gap:14px;align-items:start;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-m);padding:12px 14px;box-shadow:var(--shadow-1)}
.drow .dd{display:flex;flex-direction:column;gap:2px;font-size:var(--stufe-2);color:var(--text-2)} .drow .dd b{color:var(--text);font-variant-numeric:tabular-nums}
.drow .dt{font-weight:600;font-size:var(--stufe-3);margin-bottom:3px} .drow .dt a{color:inherit}
.drow .dx{font-size:var(--stufe-3);line-height:1.5}
.drow .dn{font-size:var(--stufe-2);color:var(--text-2);margin-top:4px}
.drow .da{display:flex;gap:4px;align-items:center}
@media(max-width:600px){ .drow{grid-template-columns:1fr;gap:6px} .drow .dd{flex-direction:row;gap:8px} .drow .da{justify-content:flex-end} }

/* Marke: Fahne mit Haken (V13) statt GF-Kachel */
.mark.pic{background:none!important;box-shadow:none;border-radius:0;overflow:visible}
.mark.pic img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(var(--schatten-figur))}
.brand .mark.pic{width:38px;height:38px} .gate-card .mark.pic{width:60px;height:60px;margin-bottom:12px}

/* ---------- V14: Easter Eggs ---------- */
.egg-konfetti{position:fixed;inset:0;pointer-events:none;z-index:99;overflow:hidden}
.egg-konfetti i{position:absolute;top:-12px;width:8px;height:14px;border-radius:1px;opacity:.95;animation:egg-fall 3s linear forwards}
@keyframes egg-fall{to{transform:translateY(110vh) rotate(540deg);opacity:.2}}
.egg-pause{animation:ht-puls .6s var(--motion-ease) 2}
.egg-bus{position:fixed;left:-260px;bottom:8px;z-index:98;pointer-events:none;animation:egg-drive 6.5s cubic-bezier(.3,.1,.7,.9) forwards;filter:drop-shadow(0 4px 6px rgba(0,0,0,.3))}
.egg-bus svg{display:block;animation:egg-bob .35s ease-in-out infinite alternate}
@keyframes egg-drive{to{transform:translateX(calc(100vw + 300px))}}
@keyframes egg-bob{from{transform:translateY(0)}to{transform:translateY(-2px)}}
.egg-tuut{position:absolute;left:170px;top:-26px;background:var(--surface);color:var(--text);border:var(--rahmen) solid var(--border-strong);padding:3px 9px;font-size:var(--stufe-2);font-weight:600;border-radius:var(--radius-s);opacity:0;animation:egg-tuut 1.2s 1.6s var(--motion-ease) forwards}
@keyframes egg-tuut{0%{opacity:0;transform:translateY(6px)}20%{opacity:1;transform:none}80%{opacity:1}100%{opacity:0}}
.egg-stars{position:absolute;left:0;top:0;width:57.4%;height:100%;pointer-events:none;z-index:1;overflow:hidden}
.egg-stars i{position:absolute;width:4px;height:4px;border-radius:50%;background:var(--on-photo);box-shadow:0 0 6px 1px var(--on-photo-fill);animation:egg-twinkle 3s ease-in-out infinite alternate}
@keyframes egg-twinkle{from{opacity:.15;transform:scale(.7)}to{opacity:1;transform:scale(1.15)}}
@media(max-width:760px){ .egg-stars{width:100%;height:38vh} }
.mark.pic.egg-carrot{animation:egg-wiggle .5s var(--motion-ease) 2}
@keyframes egg-wiggle{0%,100%{transform:rotate(0)}25%{transform:rotate(-12deg)}75%{transform:rotate(12deg)}}
.egg-badge{display:inline-flex;align-items:center;gap:7px;margin-left:10px;padding:4px 10px 4px 8px;font-size:var(--stufe-1);font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--warn);background:var(--warn-bg);border:1px solid var(--warn);border-radius:var(--radius-s);vertical-align:middle;cursor:default}
.egg-fire{width:10px;height:14px;background:linear-gradient(180deg,var(--warn) 0%,var(--chart-coral) 55%,var(--crit) 100%);clip-path:polygon(50% 0,80% 35%,100% 65%,85% 100%,15% 100%,0 65%,20% 35%);transform-origin:50% 100%}
.egg-badge:hover .egg-fire{animation:egg-flicker .35s ease-in-out infinite alternate}
@keyframes egg-flicker{from{transform:scaleY(1) scaleX(1)}to{transform:scaleY(1.25) scaleX(.85)}}
.mark.pic.egg-fest{position:relative}
.mark.pic.egg-fest::after{content:"";position:absolute;left:-6px;right:-6px;top:-8px;height:8px;background:
  linear-gradient(135deg,var(--crit) 50%,transparent 50%) 0 0/8px 8px no-repeat,
  linear-gradient(135deg,var(--warn) 50%,transparent 50%) 9px 0/8px 8px no-repeat,
  linear-gradient(135deg,var(--pos) 50%,transparent 50%) 18px 0/8px 8px no-repeat,
  linear-gradient(135deg,var(--info) 50%,transparent 50%) 27px 0/8px 8px no-repeat,
  linear-gradient(135deg,var(--accent) 50%,transparent 50%) 36px 0/8px 8px no-repeat,
  linear-gradient(135deg,var(--crit) 50%,transparent 50%) 45px 0/8px 8px no-repeat;
  pointer-events:none}
@media (prefers-reduced-motion:reduce){ .egg-bus,.egg-konfetti{display:none} }

/* ===== V15 · Panel-Autosave, Bereinigen, Vorbereitung ===== */
.pstatus{flex-basis:100%;font-size:var(--stufe-1);color:var(--muted);min-height:14px;line-height:14px}
.pstatus.ok{color:var(--pos)} .pstatus.dirty{color:var(--warn)} .pstatus.err{color:var(--crit)}
@supports(height:100dvh){.panel{bottom:auto;height:100dvh}}
.panel-f{padding-bottom:calc(12px + env(safe-area-inset-bottom,0px))}
.btn.has-hint{box-shadow:inset 0 0 0 1px var(--warn)}
.modal.tidy{max-width:920px}
.tidy-body{flex:1;overflow:auto;padding:6px 18px 12px;display:flex;flex-direction:column;gap:12px}
.tidy-row{display:grid;grid-template-columns:110px 1fr 1fr;gap:10px;align-items:start;border-top:1px solid var(--line);padding-top:10px}
.tidy-k{font-size:var(--stufe-1);font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);padding-top:18px}
.tidy-old label,.tidy-new label{display:block;font-size:var(--stufe-1);text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin-bottom:4px}
.tidy-txt{font-size:var(--stufe-2);line-height:1.45;color:var(--text-2);white-space:pre-wrap;max-height:200px;overflow:auto;background:var(--surface-2);border:1px solid var(--line);border-radius:var(--radius-s);padding:8px 10px}
.tidy-txt i{color:var(--muted)}
.tidy-new textarea{width:100%;font-size:var(--stufe-2);line-height:1.45;border:1px solid var(--accent);border-radius:var(--radius-s);padding:8px 10px;background:var(--surface);color:var(--text);resize:vertical}
.tidy-none{color:var(--muted);padding:20px 0}
.tidy-note{font-size:var(--stufe-2);color:var(--muted);align-self:center}
.tidy-item{display:grid;grid-template-columns:auto 1fr;gap:4px 10px;align-items:center;text-align:left;padding:10px 12px;border:1px solid var(--line);border-radius:var(--radius-m);background:var(--surface-2);color:var(--text);width:100%}
.tidy-item:hover{border-color:var(--accent)}
.tidy-it{font-weight:600;font-size:var(--stufe-2);line-height:1.35} .tidy-found{grid-column:2;font-size:var(--stufe-1);color:var(--muted)}
@media(max-width:700px){.tidy-row{grid-template-columns:1fr}.tidy-k{padding-top:0}}
.btn .nbadge{background:var(--warn);color:var(--on-band);border-radius:var(--radius-s);font-size:var(--stufe-1);font-weight:600;padding:1px 6px;min-width:17px;text-align:center}
.btn .nbadge[hidden]{display:none}
/* Check-in als Vorbereitung (V15) */
.prep-item.link,.ag-item.link{display:block;color:inherit;text-decoration:none}
.prep-item.link:hover{border-color:var(--accent)} .ag-item.link:hover .ag-t{color:var(--accent)}
.prep-grid{grid-template-columns:1fr 1fr}
@media(max-width:880px){.prep-grid{grid-template-columns:1fr 1fr}} @media(max-width:620px){.prep-grid{grid-template-columns:1fr}}
.ag-item .ag-min{display:inline-flex;gap:6px;margin-left:auto}
.sec-h .chk{margin-left:auto} .sec-h .chk+.btn{margin-left:0}
@media(max-width:680px){ .sec-h{flex-wrap:wrap} .sec-h .line{display:none} .sec-h .chk{margin-left:0;width:100%} }

/* ===== Neuigkeiten · gemeinsame Regeln (V16, seit V19 nur noch Zeilen; die Karten-Regeln .tk/.kand/.lage sind entfernt) ===== */
.nw-src .chip{padding:6px 12px;font-size:var(--stufe-2)}
.sec-h .chk{display:inline-flex;align-items:center;gap:6px;font-size:var(--stufe-2);color:var(--text-2);white-space:nowrap}
.sec-h .segs{padding:2px}.sec-h .segs .seg{padding:5px 10px;font-size:var(--stufe-2)}
.tk-dayh .n{background:var(--chip-bg);color:var(--chip-ink);padding:1px 8px;font-size:var(--stufe-1);border-radius:var(--radius-s)}
.tk-title:hover{color:var(--accent-strong)}
.tk-more blockquote{margin:6px 0;padding:6px 12px;border-left:3px solid var(--line);color:var(--text-2);font-style:italic}
.tk-links{display:flex;gap:14px;flex-wrap:wrap;margin-top:6px}
.tk-links a,.linkish{color:var(--accent-strong);font-weight:600;font-size:var(--stufe-2);background:none;border:0;padding:0;cursor:pointer}
.linkish:hover,.tk-links a:hover{text-decoration:underline}

/* ===================== V17 · Habitat-Punkte ===================== */
/* Kopfzeile: Taler-Zähler mit Stufe und Fortschritt, Serienflamme */
.gamebar{display:flex;align-items:center;gap:6px}
.gamebar .taler,.gamebar .flame{display:flex;align-items:center;gap:6px;height:38px;padding:0 10px 0 7px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-m);box-shadow:var(--shadow-1);color:var(--text);font-size:var(--stufe-2);text-decoration:none}
.gamebar .taler:hover{border-color:var(--accent)}
.gamebar img{width:22px;height:22px;display:block;object-fit:contain}
.gamebar b{font-weight:600;font-variant-numeric:tabular-nums;min-width:2ch;text-align:right;display:inline-block;transition:transform .2s var(--ease)}
.gamebar b.pop{transform:scale(1.25);color:var(--accent-strong)}
.gamebar .lvl{display:flex;flex-direction:column;gap:3px;min-width:64px}
.gamebar .lvl span{font-size:var(--stufe-1);color:var(--text-2);text-transform:uppercase;letter-spacing:.04em;line-height:1}
.gamebar .lvl i{display:block;height:3px;background:var(--fill);position:relative;overflow:hidden}
.gamebar .lvl i::after{content:"";position:absolute;inset:0;width:var(--p,0%);background:var(--accent);transition:width .6s var(--ease)}
.gamebar .flame.cold{opacity:.55}
.gamebar .flame.cold img{filter:grayscale(1)}
@media(max-width:760px){ .gamebar .lvl{display:none} .gamebar .taler,.gamebar .flame{padding:0 8px 0 6px} }
@media(max-width:600px){ .gamebar .flame b{display:none} }

/* Aufsteigende Marker rechts oben */
.gmarks{position:fixed;top:64px;right:max(16px,calc((100vw - 1280px)/2 + 16px));z-index:96;display:flex;flex-direction:column;align-items:flex-end;gap:6px;pointer-events:none}
.gmark{display:flex;align-items:center;gap:8px;padding:6px 12px 6px 8px;background:var(--surface-2);border:var(--rahmen) solid var(--border-strong);box-shadow:var(--shadow-3);font-size:var(--stufe-2);color:var(--text);animation:gm-rise 2.6s var(--ease) forwards}
.gmark img{width:26px;height:26px;object-fit:contain}
.gmark b{font-weight:700;color:var(--accent-strong);font-variant-numeric:tabular-nums;font-size:var(--stufe-3)}
.gmark span{color:var(--text-2)}
@keyframes gm-rise{0%{opacity:0;transform:translateY(14px)}12%{opacity:1;transform:none}80%{opacity:1;transform:translateY(-6px)}100%{opacity:0;transform:translateY(-24px)}}
@media(prefers-reduced-motion:reduce){ .gmark{animation:gm-fade 2.2s forwards} @keyframes gm-fade{0%,80%{opacity:1}100%{opacity:0}} }

/* Karten in der Bildmitte: Tageskarte, Abzeichen, Stufe */
.gcard-back{position:fixed;inset:0;z-index:85;display:flex;align-items:center;justify-content:center;padding:20px;background:var(--backdrop)}
.gcard{width:100%;max-width:520px;background:var(--surface);border:var(--rahmen) solid var(--border-strong);box-shadow:var(--shadow-pop);animation:pop .3s var(--ease);display:flex;flex-direction:column}
.gcard.stufe{max-width:720px}
.gc-pic{display:grid;place-items:center;padding:22px 20px 6px}
.gc-pic img{width:132px;height:132px;object-fit:contain;animation:gc-in .5s var(--ease)}
.gc-pic.wide{padding:0;border-bottom:var(--rahmen) solid var(--border)}
.gc-pic.wide img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
@keyframes gc-in{from{transform:scale(.7) rotate(-6deg);opacity:0}to{transform:none;opacity:1}}
.gc-body{padding:10px 22px 18px}
.gc-eye{font-size:var(--stufe-1);text-transform:uppercase;letter-spacing:.05em;color:var(--accent-strong);font-weight:600;margin-bottom:4px}
.gc-body h3{margin:0;font-size:var(--stufe-5);font-weight:600;letter-spacing:-.01em;line-height:1.2}
.gc-body p{margin:8px 0 0;color:var(--text-2);font-size:var(--stufe-3);line-height:1.5}
.gc-rows{display:flex;flex-direction:column;gap:4px;margin-top:14px;border-top:1px solid var(--line-soft);padding-top:10px}
.gc-row{display:flex;align-items:center;gap:10px;font-size:var(--stufe-2);color:var(--text)}
.gc-row img{width:24px;height:24px;object-fit:contain}
.gc-row span{flex:1}
.gc-row b{font-variant-numeric:tabular-nums;color:var(--accent-strong)}
.gc-row.done{color:var(--text-2)} .gc-row.done b{color:var(--pos)}
.gc-f{display:flex;gap:8px;justify-content:flex-end;margin-top:16px}
@media(prefers-reduced-motion:reduce){ .gcard,.gc-pic img{animation:none} }

/* Startseite: Habitat-Bereich unter dem Kopfbild */
.habitat{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:14px;margin:8px 0 0}
.hab{background:var(--surface);border:1px solid var(--line);padding:15px 16px;display:flex;flex-direction:column;gap:6px;min-width:0}
.hab .k{font-size:var(--stufe-1);font-weight:500;letter-spacing:.02em;color:var(--muted);display:flex;align-items:center;gap:6px}
.hab .k img{width:18px;height:18px;object-fit:contain}
.hab .v{display:flex;align-items:center;gap:10px;font-size:var(--stufe-5);font-weight:600;letter-spacing:-.02em;line-height:1.1;font-variant-numeric:tabular-nums}
.hab .v img{width:34px;height:34px;object-fit:contain}
.hab .v small{font-size:var(--stufe-2);font-weight:500;color:var(--text-2);letter-spacing:0}
.hab .cap{font-size:var(--stufe-2);color:var(--ink-2);line-height:1.45}
.hab .bar{height:6px;background:var(--fill);position:relative;overflow:hidden;margin-top:4px}
.hab .bar i{position:absolute;inset:0;width:var(--p,0%);background:var(--accent);transition:width .8s var(--ease)}
.hab .steps{display:flex;justify-content:space-between;font-size:var(--stufe-1);color:var(--text-2);text-transform:uppercase;letter-spacing:.04em}
.hab .steps span.on{color:var(--text);font-weight:600}
.hab .goal{display:flex;align-items:center;gap:8px;font-size:var(--stufe-2);color:var(--text)}
.hab .goal img{width:22px;height:22px;object-fit:contain}
.hab .goal.done{color:var(--text-2);text-decoration:line-through}
.hab .goal b{margin-left:auto;color:var(--accent-strong);font-variant-numeric:tabular-nums}
.hab .goal.done b{color:var(--pos);text-decoration:none}
.hab .badges{display:flex;flex-wrap:wrap;gap:4px;margin-top:2px}
.hab .badges img{width:30px;height:30px;object-fit:contain}
.hab .badges .more{font-size:var(--stufe-1);color:var(--text-2);align-self:center}
@media(max-width:980px){ .habitat{grid-template-columns:1fr 1fr} }
@media(max-width:560px){ .habitat{grid-template-columns:1fr} }

/* Rituale als Schatzbuch: Stempel bei erledigten Ritualen */
.rit .stamp{width:30px;height:30px;object-fit:contain;flex:0 0 auto;animation:ht-check .3s var(--ease)}
.rit:not(.done) .stamp{display:none}

/* Board: Spaltenköpfe mit Bild */
.lane-h img.lane-ico,.tgroup-h img.lane-ico{width:22px;height:22px;object-fit:contain;flex:0 0 auto}

/* Abzeichenleiste (Entscheidungen) */
.badgebar{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.bdg{display:flex;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--line);padding:8px 10px;font-size:var(--stufe-2);color:var(--text)}
.bdg img{width:38px;height:38px;object-fit:contain}
.bdg .bl{display:flex;flex-direction:column;gap:2px;min-width:0}
.bdg .bl small{color:var(--text-2);font-size:var(--stufe-1)}
.bdg.locked{opacity:.45} .bdg.locked img{filter:grayscale(1)}

/* Leerzustände mit Bild */
.empty .zpic{width:96px;height:96px;object-fit:contain;display:block;margin:0 auto 6px;opacity:.9}

/* ===========================================================
   V18 · Das Hohe Haus: Seitenleiste links (offen / schmal / Schublade), Kopfbilder je Seite
   =========================================================== */
:root{ --nav-w:264px; --rail-w:68px; --mbar-h:54px }
.topbar{display:contents}
html[data-nav="open"] body{padding-left:var(--nav-w)}
html[data-nav="rail"] body{padding-left:var(--rail-w)}
html[data-nav="drawer"] body{padding-top:calc(var(--mbar-h) + env(safe-area-inset-top,0px))}
html[data-nav="open"] .app,html[data-nav="rail"] .app{padding-top:22px}
.sidebar{position:fixed;top:0;left:0;bottom:0;width:var(--nav-w);z-index:60;display:flex;flex-direction:column;background:var(--header-bg);border-right:var(--rahmen) solid var(--border);transition:width var(--motion-base) var(--motion-ease),transform var(--motion-base) var(--motion-ease)}
html[data-nav="rail"] .sidebar{width:var(--rail-w)}
.sb-head{display:flex;align-items:center;justify-content:space-between;gap:6px;padding:14px 10px 12px 14px;border-bottom:var(--rahmen) solid var(--border);min-height:74px}
.sidebar .brand{gap:10px;flex:1;min-width:0} .sidebar .brand>div{display:block} .sidebar .brand .brand-txt{min-width:0} .sidebar .brand .mark.pic{width:36px;height:36px}
.sidebar .brand h1{font-size:var(--stufe-3);white-space:normal;line-height:1.15;letter-spacing:-.01em}
.sidebar .brand .meta{display:block;font-size:var(--stufe-1);line-height:1.3;margin-top:3px;color:var(--text-3)}
.sb-toggle,.sb-close{width:32px;height:32px;display:grid;place-items:center;color:var(--text-2);flex:0 0 auto}
.sb-toggle:hover,.sb-close:hover{background:var(--fill);color:var(--text)}
.sb-toggle svg,.sb-close svg{width:18px;height:18px;transition:transform var(--motion-base) var(--motion-ease)}
.sb-close{display:none}
html[data-nav="rail"] .sb-toggle svg{transform:rotate(180deg)}
.sb-nav{display:block;flex:1;overflow-y:auto;overflow-x:hidden;padding:10px 10px 16px;scrollbar-width:thin}
.sb-group{margin:0 0 12px}
.sb-gl{font-size:var(--stufe-1);text-transform:uppercase;letter-spacing:.08em;color:var(--text-3);padding:8px 10px 6px;font-weight:600}
.sb-nav a{display:flex;align-items:center;gap:11px;padding:9px 10px 9px 9px;border:0;border-left:3px solid transparent;margin:0;border-radius:0;color:var(--text-2);font-size:var(--stufe-3);font-weight:500;white-space:nowrap;min-height:40px;position:relative;text-decoration:none}
.sb-nav a:hover{background:var(--fill);color:var(--text)}
.sb-nav a.active,.sb-nav a.active:hover{background:var(--accent-soft);color:var(--text);border-left-color:var(--accent);border-bottom:0}
.sb-nav a .ic{display:grid;place-items:center;width:22px;height:22px;flex:0 0 auto;color:inherit} .sb-nav a .ic svg{width:20px;height:20px;display:block}
.sb-nav a .lbl{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}
.sb-nav a .nbadge{margin-left:auto;display:inline-flex;align-items:center;justify-content:center}
.sb-sub{display:flex;flex-direction:column;margin:2px 0 6px}
.sb-sub a{padding:6px 10px 6px 45px;min-height:32px;font-size:var(--stufe-2);color:var(--text-3);border-left:3px solid transparent}
.sb-sub a::before{content:"";width:5px;height:5px;background:currentColor;opacity:.45;position:absolute;left:31px;top:50%;transform:translateY(-50%)}
.sb-sub a:hover{color:var(--text)}
.sb-sub a.on{color:var(--text);background:var(--fill-soft)} .sb-sub a.on::before{opacity:1;background:var(--accent)}
.sb-foot{padding:12px 10px calc(12px + env(safe-area-inset-bottom,0px));border-top:var(--rahmen) solid var(--border);display:flex;flex-direction:column;gap:8px}
.sb-foot .tb-ctl{display:flex;flex-direction:column;align-items:stretch;gap:8px}
.sb-foot .theme-sw,.sb-foot .whoami{display:flex} .sb-foot .theme-sw button,.sb-foot .whoami button{flex:1}
.sb-foot .whoami span{flex:0 0 auto}
.sb-foot .gamebar{justify-content:stretch} .sb-foot .gamebar .taler{flex:1} .sb-foot .gamebar .lvl{display:flex}
.sb-drawer-only{display:none}
/* Schmale Symbolleiste */
html[data-nav="rail"] .sidebar .brand .brand-txt,html[data-nav="rail"] .sb-gl,html[data-nav="rail"] .sb-nav a .lbl,html[data-nav="rail"] .sb-sub,html[data-nav="rail"] .sb-foot .whoami span,html[data-nav="rail"] .sb-foot .gamebar .lvl{display:none}
html[data-nav="rail"] .sb-head{flex-direction:column;padding:12px 0 10px;gap:8px;justify-content:center;min-height:0}
html[data-nav="rail"] .sidebar .brand{flex:0 0 auto;justify-content:center}
html[data-nav="rail"] .sb-nav{padding:10px 6px}
html[data-nav="rail"] .sb-nav a{justify-content:center;padding:10px 0;border-left:0;border-right:3px solid transparent}
html[data-nav="rail"] .sb-nav a.active{border-right-color:var(--accent)}
html[data-nav="rail"] .sb-nav a .nbadge{position:absolute;top:3px;right:9px;margin:0;font-size:var(--stufe-1);padding:0 4px;min-width:15px;line-height:15px}
html[data-nav="rail"] .sb-group{margin:0 0 8px;padding:0 0 8px;border-bottom:1px solid var(--border)} html[data-nav="rail"] .sb-group:last-child{border-bottom:0}
html[data-nav="rail"] .sb-foot{padding:10px 6px calc(10px + env(safe-area-inset-bottom,0px))}
html[data-nav="rail"] .sb-foot .theme-sw,html[data-nav="rail"] .sb-foot .whoami{flex-direction:column;gap:2px}
html[data-nav="rail"] .sb-foot .theme-sw button,html[data-nav="rail"] .sb-foot .whoami button{min-width:0;width:100%;height:30px;padding:0;font-size:var(--stufe-1)}
html[data-nav="rail"] .sb-foot .gamebar{flex-direction:column;gap:4px}
html[data-nav="rail"] .sb-foot .gamebar .taler,html[data-nav="rail"] .sb-foot .gamebar .flame{padding:0 6px;justify-content:center;height:34px}
/* Schmale Kopfzeile und Schublade (unter 1024 px) */
.mbar,.sb-backdrop{display:none}
html[data-nav="drawer"] .mbar{display:flex;position:fixed;top:0;left:0;right:0;height:calc(var(--mbar-h) + env(safe-area-inset-top,0px));padding:env(safe-area-inset-top,0px) 10px 0 6px;z-index:50;align-items:center;gap:6px;background:var(--header-bg);border-bottom:var(--rahmen) solid var(--border)}
.mb-menu{width:42px;height:42px;display:grid;place-items:center;color:var(--text);flex:0 0 auto} .mb-menu svg{width:22px;height:22px} .mb-menu:hover{background:var(--fill)}
.mb-title{font-weight:600;font-size:1rem;color:var(--text);text-decoration:none;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;letter-spacing:-.01em}
.mb-title:hover{text-decoration:none}
.mb-slot{display:flex;align-items:center;gap:6px;flex:0 0 auto}
.mb-slot .tb-ctl{display:flex;align-items:center;gap:6px}
.mb-slot .theme-sw{display:none}
.mb-slot .whoami span{display:none}
html[data-nav="drawer"] .sidebar{transform:translateX(-100%);width:min(304px,86vw);z-index:70;box-shadow:none;transition:transform var(--motion-base) var(--motion-ease)}
html[data-nav="drawer"][data-drawer="open"] .sidebar{transform:none;box-shadow:var(--shadow-pop)}
html[data-nav="drawer"][data-drawer="open"] .sb-backdrop{display:block;position:fixed;inset:0;background:var(--backdrop);z-index:65}
html[data-nav="drawer"] .sb-toggle{display:none} html[data-nav="drawer"] .sb-close{display:grid}
html[data-nav="drawer"] .sb-drawer-only{display:block} html[data-nav="drawer"] .sb-drawer-only .theme-sw{display:flex} html[data-nav="drawer"] .sb-drawer-only .theme-sw button{flex:1}
html[data-nav="drawer"] .sb-nav a{min-height:44px}
@media(max-width:1023px){ .sidebar .brand .meta{display:block} .sidebar .brand>div{display:block} }
/* Kopfbild: Datum unter dem Motto (Startseite), Bild im Textmodal (Wochenmail) */
.hero-date{display:block;margin-top:4px;color:var(--text-3);font-size:var(--stufe-2)}
.modal-pic{margin:14px 18px 4px;border:var(--rahmen) solid var(--border);overflow:hidden;background:var(--photo-bg)} .modal-pic img{display:block;width:100%;aspect-ratio:4/1;object-fit:cover;object-position:center 40%}
@media (prefers-reduced-motion:reduce){ .sidebar{transition:none} }

/* V18.1 · Strohburg als Marke, Richterhammer als Favicon, Avatare bei Alex und Lea */
.sidebar .brand .mark.pic{width:40px;height:40px} .gate-card .mark.pic{width:64px;height:64px}
.whoami button{display:inline-flex;align-items:center;justify-content:center;gap:6px}
.whoami button .av{width:22px;height:22px;border-radius:50%;object-fit:cover;display:block;flex:0 0 auto}
.whoami button.on .av{box-shadow:0 0 0 2px var(--on-photo-line)}
html[data-nav="rail"] .sb-foot .whoami button span{display:none}
html[data-nav="rail"] .sb-foot .whoami button{height:34px}
html[data-nav="rail"] .sb-foot .whoami button .av{width:24px;height:24px}
.mb-slot .whoami button span{display:none} .mb-slot .whoami button{min-width:40px;padding:0 6px}
.hero-av{width:44px;height:44px;border-radius:50%;object-fit:cover;vertical-align:-12px;margin-right:10px;border:2px solid var(--border-strong);background:var(--surface)}
.hero.compact .hero-av{width:36px;height:36px;vertical-align:-10px}
.av-k{width:18px;height:18px;border-radius:50%;object-fit:cover;vertical-align:-4px;margin-right:6px}
.seg.seg-av{display:inline-flex;align-items:center;gap:6px} .seg.seg-av img{width:20px;height:20px;border-radius:50%;object-fit:cover;display:block}


/* ===========================================================
   V19 (15.09.2026) · Neuigkeiten schlank: Laufband, Zeilen statt Karten, Klappgruppen, Filter hinter einem Knopf
   =========================================================== */
/* Kopfbild schmal (nur Neuigkeiten) */
.hero.slim .hero-pic img{aspect-ratio:5/1;max-height:170px;object-position:center 55%}
.hero.slim .hero-head{padding-top:12px}
.hero.slim p{font-size:var(--stufe-2)}

/* Laufband */
.band{display:flex;align-items:stretch;gap:0;background:var(--surface);border:var(--rahmen) solid var(--line);margin:0 0 14px;min-height:42px;overflow:hidden}
.band-l{display:flex;align-items:center;gap:6px;padding:0 14px;font-size:var(--stufe-1);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--text-2);background:var(--surface-2);border-right:var(--rahmen) solid var(--line);white-space:nowrap;flex:0 0 auto;text-decoration:none}
.band-l b{font-size:var(--stufe-3);letter-spacing:0;color:var(--accent-strong);font-variant-numeric:tabular-nums}
a.band-l:hover{color:var(--text)}
.band-vp{flex:1;min-width:0;overflow:hidden;position:relative;display:flex;align-items:center}
.band-vp::before,.band-vp::after{content:"";position:absolute;top:0;bottom:0;width:22px;z-index:2;pointer-events:none}
.band-vp::before{left:0;background:linear-gradient(90deg,var(--surface),transparent)} .band-vp::after{right:0;background:linear-gradient(-90deg,var(--surface),transparent)}
.band-track{display:flex;width:max-content;animation:band-run var(--dur,40s) linear infinite;will-change:transform}
.band-set{display:flex;align-items:center;gap:0;padding-right:0}
.band.static .band-track{animation:none} .band.static .band-set.dup{display:none}
.band:hover .band-track,.band:focus-within .band-track,.band.paused .band-track{animation-play-state:paused}
@keyframes band-run{to{transform:translateX(-50%)}}
.bi{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 16px 0 12px;border-left:3px solid var(--line);font-size:var(--stufe-2);color:var(--text);white-space:nowrap;background:none;border-top:0;border-right:0;border-bottom:0;cursor:pointer;font:inherit;font-size:var(--stufe-2)}
.bi:hover{background:var(--fill)}
.bi .bt{color:var(--text-2);font-variant-numeric:tabular-nums;flex:0 0 auto}
.bi .bx{max-width:min(52vw,520px);overflow:hidden;text-overflow:ellipsis}
.bi.is-new .bx{font-weight:600}
.bi.src-notiz{border-left-color:var(--accent)} .bi.src-mail{border-left-color:var(--warn)} .bi.src-asana{border-left-color:var(--pos)} .bi.src-kalender{border-left-color:var(--text-3)} .bi.src-entscheidung{border-left-color:var(--brand)}
.av-b{width:18px;height:18px;border-radius:50%;object-fit:cover;display:block;flex:0 0 auto}
.band-p{width:42px;flex:0 0 auto;display:grid;place-items:center;color:var(--text-2);font-size:var(--stufe-1);border-left:var(--rahmen) solid var(--line);background:var(--surface-2)}
.band-p:hover{color:var(--text);background:var(--fill)}
@media(prefers-reduced-motion:reduce){ .band-track{animation:none} .band-set.dup{display:none} .band-vp{overflow-x:auto;scrollbar-width:thin} .band-vp::before,.band-vp::after{display:none} .band-p{display:none} }

/* Personen in Zeilen */
.nw-who{display:inline-flex;align-items:center;gap:3px;flex:0 0 auto}
.nw-who .av-k{margin-right:0;vertical-align:middle;border:1px solid var(--border-strong)}
.nw-who .nw-who-t{font-size:var(--stufe-1);color:var(--text-2);max-width:80px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Oberer Block: drei Zahlen und Steuerung in einer Zeile */
.nw-top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 0 10px}
.nw-kpis{display:flex;gap:6px;flex-wrap:wrap}
.kpi{display:inline-flex;align-items:baseline;gap:7px;padding:7px 12px;background:var(--surface);border:var(--rahmen) solid var(--line);border-radius:var(--radius-m);color:var(--text-2);font-size:var(--stufe-1);letter-spacing:.02em;font-weight:500;text-decoration:none;min-height:var(--ziel-min)}
.kpi b{font-size:var(--stufe-4);color:var(--text);letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:1}
.kpi.hot b{color:var(--warn)} .kpi.crit b{color:var(--crit)}
a.kpi:hover{border-color:var(--accent)}
.nw-ctl{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.nw-ctl .segs .seg{padding:6px 11px}
.nw-fbtn .n{margin-left:2px}
.nw-fbtn.on{border-color:var(--accent);color:var(--text)}
.nw .n{display:inline-flex;align-items:center;justify-content:center;min-width:18px;padding:1px 7px;background:var(--fill);color:var(--text-2);font-size:var(--stufe-1);font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:0;text-transform:none;text-decoration:none}
.nw .n.hot{background:var(--warn);color:var(--on-band)}

/* Filterfeld (zugeklappt per Standard) */
.nw-filter[hidden]{display:none}
.nw-filter{display:flex;flex-direction:column;gap:8px;padding:12px 14px;margin:0 0 14px;background:var(--surface-2);border:var(--rahmen) solid var(--line)}
.nf-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.nf-l{flex:0 0 76px;font-size:var(--stufe-1);text-transform:uppercase;letter-spacing:.06em;font-weight:600;color:var(--text-2)}
.nf-row .segs .seg{padding:5px 10px;font-size:var(--stufe-2)}
.nf-row .chip{padding:5px 11px;font-size:var(--stufe-2)}
.nf-row .search{padding:7px 12px;min-width:180px} .nf-row .search input{font-size:var(--stufe-2)}

/* Abschnitte als Klappen */
.nw-sec{margin:0 0 14px;border:var(--rahmen) solid var(--line);background:var(--surface)}
.nw-sec>summary{display:flex;align-items:center;gap:10px;padding:10px 14px;cursor:pointer;list-style:none;user-select:none;border-bottom:var(--rahmen) solid transparent}
.nw-sec>summary::-webkit-details-marker{display:none}
.nw-sec[open]>summary{border-bottom-color:var(--line)}
.nw-sec>summary:hover{background:var(--fill-soft)}
.nw-sec>summary h2{margin:0;font-size:var(--stufe-3);font-weight:600;letter-spacing:-.01em}
.nw-sec>summary .hint{font-size:var(--stufe-2);color:var(--text-2);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nw-sec:not([open])>summary .hint{color:var(--text-2)}
.nw-body{padding:10px 12px 12px}
.chev{width:8px;height:8px;border-right:2px solid var(--text-3);border-bottom:2px solid var(--text-3);transform:rotate(45deg);flex:0 0 auto;margin:0 4px 3px 0;transition:transform var(--motion-fast) var(--motion-ease)}
details[open]>summary .chev,.tk.open .chev,.kd.open .chev,.lg.open .chev{transform:rotate(-135deg);margin-bottom:-3px}

/* Ticker: Tage als Klappgruppen, Ereignis als Zeile */
.tk-day{margin:0 0 8px;background:none}
.tk-day>summary.tk-dayh{display:flex;align-items:center;gap:8px;padding:6px 6px;margin:0;cursor:pointer;list-style:none;font-size:var(--stufe-1);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--text-3)}
.tk-day>summary::-webkit-details-marker{display:none}
.tk-day>summary:hover{color:var(--text)}
.tk-day .tk-dayh .n{margin-right:auto}
.tk-day .tk-dayh .n.hot{margin-right:0}
.tk-day .tk-next{margin-left:auto;text-transform:none;letter-spacing:0;font-weight:500;color:var(--text-2);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:60%}
.tk-day.soon{border:1px dashed var(--line);padding:2px 4px}
.tk-sub{font-size:var(--stufe-1);text-transform:uppercase;letter-spacing:.06em;color:var(--text-3);padding:8px 8px 2px}
.tk-rows{display:flex;flex-direction:column}
.tk{display:block;padding:0;margin:0;background:none;border:0;border-left:0}
.tk+.tk{border-top:1px solid var(--line-soft)}
.tk-row{display:grid;grid-template-columns:44px auto minmax(0,1fr) auto 14px;align-items:center;gap:10px;width:100%;padding:7px 8px 7px 10px;border:0;border-left:3px solid var(--line);background:none;text-align:left;cursor:pointer;font:inherit;color:var(--text);min-height:36px}
.tk-row:hover{background:var(--fill-soft)}
.tk.src-notiz .tk-row{border-left-color:var(--accent)} .tk.src-mail .tk-row{border-left-color:var(--warn)} .tk.src-asana .tk-row{border-left-color:var(--pos)} .tk.src-kalender .tk-row{border-left-color:var(--text-3)} .tk.src-entscheidung .tk-row{border-left-color:var(--brand)}
.tk.is-new{background:none} .tk.is-new .tk-row{background:var(--surface-2)} .tk.is-new .tk-title{font-weight:600}
.tk-row .tk-t{font-size:var(--stufe-2);color:var(--text-2);font-variant-numeric:tabular-nums;padding:0}
.tk-row .tk-title{font-size:var(--stufe-3);line-height:1.35;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}
.tk.open .tk-row .tk-title{white-space:normal}
.tk-row .tk-strand{font-size:var(--stufe-1);color:var(--text-2);white-space:nowrap}
.tk-more{display:none;padding:2px 12px 12px 67px;font-size:var(--stufe-2);color:var(--text-2);line-height:1.5}
.tk.open .tk-more{display:block}
.tk-more p{margin:4px 0 6px}

/* Sichtungskorb: Gruppen als Klappen, Kandidaten als Zeilen */
.kgroup{margin:0 0 10px}
.kgroup>summary.group-h{display:flex;align-items:center;gap:8px;padding:8px 6px;margin:0;cursor:pointer;list-style:none;text-transform:uppercase}
.kgroup>summary::-webkit-details-marker{display:none}
.kgroup>summary:hover{color:var(--text)}
.kgroup .group-h .n{margin-right:auto} .kgroup .group-h .n.hot{margin-right:0}
.kgroup.rel-hoch>summary{color:var(--crit)} .kgroup.rel-mittel>summary{color:var(--warn)}
.kd-list{display:flex;flex-direction:column}
.kd{background:none;border:0;padding:0;box-shadow:none}
.kd+.kd{border-top:1px solid var(--line-soft)}
.kd-row{display:grid;grid-template-columns:8px minmax(0,1fr) auto auto 14px;align-items:center;gap:10px;width:100%;padding:8px 8px 8px 10px;border:0;background:none;text-align:left;cursor:pointer;font:inherit;color:var(--text);min-height:38px}
.kd-row:hover{background:var(--fill-soft)}
.kd.is-new .kd-row{background:var(--surface-2)}
.kd.done .kd-row{opacity:.6}
.kd-rel{width:8px;height:8px;background:var(--line)} .kd.rel-hoch .kd-rel{background:var(--crit)} .kd.rel-mittel .kd-rel{background:var(--warn)}
.kd-title{font-size:var(--stufe-3);line-height:1.35;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kd.is-new .kd-title{font-weight:600}
.kd.open .kd-title{white-space:normal}
.kd-meta{font-size:var(--stufe-1);color:var(--text-2);white-space:nowrap}
.nw-st{font-size:var(--stufe-1);font-weight:600;padding:2px 7px;background:var(--fill);color:var(--text-2)} .nw-st.st-uebernommen{background:var(--pos-bg);color:var(--pos)} .nw-st.st-verworfen{color:var(--muted)}
.kd-more{display:none;padding:2px 12px 12px 28px;font-size:var(--stufe-2);color:var(--text-2);line-height:1.5}
.kd.open .kd-more{display:block}
.kd-more p{margin:4px 0 6px}
.kd-more blockquote{margin:6px 0;padding:6px 12px;border-left:3px solid var(--line);font-style:italic}
.kd-f{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:10px;padding-top:8px;border-top:1px solid var(--line-soft)}
.kd-f .selectx{padding:6px 8px;border:1px solid var(--line);background:var(--surface);font-size:var(--stufe-2);max-width:220px}

/* Themenlage: eine Zeile je Strang */
.lg{border:0;background:none;padding:0;box-shadow:none}
.lg+.lg{border-top:1px solid var(--line-soft)}
.lg-row{display:grid;grid-template-columns:120px minmax(0,1fr) auto auto 14px;align-items:center;gap:12px;width:100%;padding:9px 8px 9px 10px;border:0;background:none;text-align:left;cursor:pointer;font:inherit;color:var(--text);min-height:40px}
.lg-row:hover{background:var(--fill-soft)}
.lg.is-new .lg-row{background:var(--surface-2)}
.lg-s{font-size:var(--stufe-1);font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--accent-strong);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lg-t{display:flex;flex-direction:column;gap:1px;min-width:0}
.lg-t b{font-weight:600;font-size:var(--stufe-3);line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lg-p{font-size:var(--stufe-2);color:var(--text-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lg.open .lg-t b,.lg.open .lg-p{white-space:normal} .lg.open .lg-p{display:none}
.lg-d{font-size:var(--stufe-1);color:var(--text-2);font-variant-numeric:tabular-nums}
.lg-more{display:none;padding:0 12px 12px 142px;font-size:var(--stufe-2);color:var(--text-2);line-height:1.55}
.lg.open .lg-more{display:block}
.lg-more p{margin:0}

/* Detailfenster */
.nw-modal .nw-mbody{padding:14px 18px;overflow:auto;font-size:var(--stufe-3);line-height:1.55;color:var(--text)}
.nw-mbody p{margin:0 0 10px}
.nw-mbody blockquote{margin:8px 0;padding:6px 12px;border-left:3px solid var(--line);color:var(--text-2);font-style:italic}
.nw-mmeta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:var(--stufe-2);color:var(--text-2);margin:0 0 12px}
.nw-src{padding:2px 8px;border-left:3px solid var(--line);background:var(--fill);font-weight:600;font-size:var(--stufe-1);text-transform:uppercase;letter-spacing:.04em}
.nw-src.src-notiz{border-left-color:var(--accent)} .nw-src.src-mail{border-left-color:var(--warn)} .nw-src.src-asana{border-left-color:var(--pos)} .nw-src.src-entscheidung{border-left-color:var(--brand)}
.nw-rel{font-size:var(--stufe-1);font-weight:600;text-transform:uppercase;letter-spacing:.04em} .nw-rel.rel-hoch{color:var(--crit)} .nw-rel.rel-mittel{color:var(--warn)}
.nw-srct{color:var(--text-3);font-size:var(--stufe-2)}

@media(max-width:760px){
  .hero.slim .hero-pic img{aspect-ratio:3/1;max-height:140px}
  .band-l{padding:0 10px} .band-l .band-lt{display:none}
  .bi .bx{max-width:70vw}
  .nw-top{flex-direction:column;align-items:stretch}
  .nw-ctl{justify-content:space-between}
  .nw-sec>summary .hint{display:none}
  .tk-row{grid-template-columns:40px auto minmax(0,1fr) 14px} .tk-row .tk-strand{display:none}
  .tk-more{padding-left:14px}
  .kd-row{grid-template-columns:8px minmax(0,1fr) 14px} .kd-meta,.kd-row .nw-st{display:none}
  .kd-more{padding-left:14px}
  .lg-row{grid-template-columns:minmax(0,1fr) auto 14px} .lg-s{display:none} .lg-d{display:none}
  .lg-more{padding-left:14px}
  .nf-l{flex-basis:100%}
  .tk-day .tk-next{max-width:100%;flex-basis:100%;margin-left:0}
  .tk-day>summary.tk-dayh{flex-wrap:wrap}
}


/* ===========================================================
   V20 (16.09.2026) · Team, letzte 3 Monate (Startseite): Zeilen mit Monatsbalken, Belegbalken, Gesamtwert und Trend
   =========================================================== */
.tm-sec{margin:0 0 18px}
.tm-sec>summary .tm-hint{font-size:var(--stufe-1);color:var(--warn);white-space:nowrap}
.tm-top{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 8px}
.tm-segs .seg{padding:5px 11px;font-size:var(--stufe-2)}
.tm-legend{display:inline-flex;align-items:center;gap:6px;font-size:var(--stufe-1);color:var(--text-2);margin-left:auto;text-transform:uppercase;letter-spacing:.04em}
.tm-legend i{width:10px;height:10px;display:inline-block;margin-left:6px}
.tm-legend i.s,.tm-seg.s,.tm-stack i.s{background:var(--pos)} .tm-legend i.n,.tm-seg.n,.tm-stack i.n{background:var(--text-3)} .tm-legend i.w,.tm-seg.w,.tm-stack i.w{background:var(--crit)}
.tm-legend i.d{background:none;border:2px dashed var(--warn);box-sizing:border-box}
.tm-list{display:flex;flex-direction:column}
.tm{border:0;background:none;padding:0}
.tm+.tm{border-top:1px solid var(--line-soft)}
.tm-row{display:grid;grid-template-columns:32px minmax(140px,1.3fr) auto minmax(120px,1fr) 92px 92px 14px;align-items:center;gap:14px;width:100%;padding:9px 8px 9px 6px;border:0;background:none;text-align:left;cursor:pointer;font:inherit;color:var(--text);min-height:54px}
.tm-row:hover{background:var(--fill-soft)}
.tm-av{width:32px;height:32px;border-radius:50%;object-fit:cover;display:block;border:1px solid var(--border-strong)}
.tm-ini{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--fill);color:var(--text-2);font-size:var(--stufe-2);font-weight:600;letter-spacing:.02em}
.tm-name{display:flex;flex-direction:column;gap:1px;min-width:0}
.tm-name b{font-weight:600;font-size:var(--stufe-3);line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tm-name small{font-size:var(--stufe-1);color:var(--text-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tm-months{display:inline-flex;align-items:flex-end;gap:6px;height:38px}
.tm-col{display:flex;flex-direction:column;align-items:center;gap:2px;width:20px}
.tm-stack{display:flex;flex-direction:column;justify-content:flex-end;width:14px;height:28px;background:var(--fill-soft)}
.tm-stack i{display:block;width:100%;min-height:0}
.tm-col small{font-size:var(--stufe-1);color:var(--text-2);text-transform:uppercase;letter-spacing:.04em;line-height:1}
.tm-belege{display:flex;align-items:center;gap:8px;min-width:0}
.tm-bar{display:flex;height:8px;flex:1;min-width:60px;background:var(--fill-soft);overflow:hidden}
.tm-bar.empty{background:none;height:auto} .tm-bar.empty small{font-size:var(--stufe-1);color:var(--text-2)}
.tm-seg{display:block;height:100%}
.tm-nums{display:inline-flex;align-items:baseline;gap:6px;font-size:var(--stufe-1);color:var(--text-2);font-variant-numeric:tabular-nums;white-space:nowrap}
.tm-nums b{font-size:var(--stufe-2);color:var(--text)} .tm-nums .s{color:var(--pos)} .tm-nums .w{color:var(--crit)}
.tm-nums .s::before{content:"+"} .tm-nums .w::before{content:"−"}
.tm-trend{display:inline-flex;align-items:center;gap:5px;font-variant-numeric:tabular-nums;white-space:nowrap;justify-self:start}
.tm-trend b{font-size:var(--stufe-4);font-weight:600;letter-spacing:-.02em;color:var(--text)}
.tm-trend.is-draft b{color:var(--text-2)}
.tm-up{color:var(--pos);font-size:var(--stufe-2);font-weight:600} .tm-down{color:var(--crit);font-size:var(--stufe-2);font-weight:600} .tm-flat{color:var(--text-3)}
.tm-dtag{font-style:normal;font-size:var(--stufe-1);text-transform:uppercase;letter-spacing:.05em;color:var(--warn);border:var(--rahmen) dashed var(--warn);border-radius:var(--radius-s);padding:1px 5px}
.tm-none{color:var(--text-2)}
.tm-last{font-size:var(--stufe-1);color:var(--text-2);white-space:nowrap;text-align:right}
.tm-more{display:none;padding:2px 12px 12px 52px;font-size:var(--stufe-2);color:var(--text-2);line-height:1.5}
.tm.open .tm-more{display:block}
.tm-sum{margin:2px 0 8px} .tm-sum span{color:var(--text-2)}
.tm-dims{display:flex;flex-wrap:wrap;gap:6px 14px;margin:0 0 8px}
.tm-dim{font-size:var(--stufe-2);color:var(--text-2);white-space:nowrap} .tm-dim b{color:var(--text);font-variant-numeric:tabular-nums} .tm-dim i{font-style:normal;font-size:var(--stufe-1);margin-left:3px;font-weight:600} .tm-dim.up i{color:var(--pos)} .tm-dim.down i{color:var(--crit)}
.tm.open .tm-name b,.tm.open .tm-name small{white-space:normal}
@media(max-width:980px){
  .tm-row{grid-template-columns:32px minmax(120px,1fr) auto minmax(90px,1fr) 80px 14px} .tm-last{display:none}
}
@media(max-width:640px){
  .tm-row{grid-template-columns:28px minmax(0,1fr) auto auto 14px;gap:10px;row-gap:6px} .tm-av,.tm-ini{width:28px;height:28px}
  .tm-av,.tm-ini{grid-area:1/1} .tm-name{grid-area:1/2} .tm-months{grid-area:1/3} .tm-trend,.tm-none{grid-area:1/4} .tm-row>.chev{grid-area:1/5} .tm-belege{grid-area:2/2/3/5}
  .tm-name small{display:none}
  .tm-trend b{font-size:var(--stufe-3)} .tm-dtag{display:none} .tm-trend.is-draft b{border-bottom:2px dashed var(--warn)}
  .tm-months{height:32px} .tm-col{width:14px} .tm-stack{width:10px;height:24px} .tm-col small{display:none}
  .tm-more{padding-left:14px}
  .tm-legend{margin-left:0;flex-basis:100%}
  .tm-sec>summary .tm-hint,.tm-sec>summary .hint{display:none}
}

/* ===========================================================
   V21 (20.09.2026) · Design-Übernahme Habitat-Tycoon: Radien für die Bausteine aus V16 bis V20, Rahmen 1 px,
   Zustände als Symbol plus Wort (.zst), KPI-Kacheln (.kk), Chip-Reihen und Stepper statt <select>/<input type=number>
   =========================================================== */
.band,.nw-sec,.nw-filter,.hab,.gcard,.modal-pic,.soon-box{border-radius:var(--radius-l)}
.band{overflow:hidden}
.bdg,.gmark,.tk-day.soon,.tidy-item{border-radius:var(--radius-m)}
.nw-st,.kd-rel,.hab .bar,.hab .bar i,.gamebar .lvl i,.tm-bar,.tm-stack,.tm-seg,.nw .n,.nw-src,.lane-h .n,.tm-legend i{border-radius:var(--radius-s)}
.tm-stack,.tm-bar{overflow:hidden}
.gate-card,.modal,.panel{border-radius:var(--radius-l)} .panel{border-radius:var(--radius-l) 0 0 var(--radius-l)}
.hero-pic{border-radius:var(--radius-l)}
.meet-h{border-radius:calc(var(--radius-l) - var(--rahmen)) calc(var(--radius-l) - var(--rahmen)) 0 0}
/* Rahmen: 1 px überall, Farbe wechselt nach Zustand */
.card,.site,.tcard,.qcard,.rit,.stat,.sstat,.rec-card,.inbox-item,.editcard,.agenda,.prep-item,.drow,.add,.cycle,.dsection,.linkrow,.search,.segs,.select,.txt,.fld input,.fld select,.fld textarea,.theme-sw,.whoami,.gamebar .taler,.gamebar .flame,.bdg,.hab,.kpi,.mv,.tidy-item,.tidy-txt,.mini,.icon-btn,.dd-btn,.dd-pop,.chip,.kd-f .selectx,.card-foot .selectx,.modal-text{border-width:var(--rahmen)}
.card:hover,.site:hover,.tcard:hover,.qcard:hover,.rec-card:hover,.prep-item.link:hover,.drow:hover,.bdg:hover,.hab:hover{border-color:var(--border-strong)}
/* Zustand: Symbol + Wort, nie nur Farbe */
.zst{display:inline-flex;align-items:center;gap:5px;font-size:var(--stufe-1);font-weight:600;padding:2px 8px;border-radius:var(--radius-s);background:var(--fill);color:var(--text-2);white-space:nowrap;letter-spacing:.01em}
.zst i{font-style:normal;font-family:var(--font-ui);font-weight:600;line-height:1}
.zst.pos{background:var(--pos-bg);color:var(--pos)} .zst.warn{background:var(--warn-bg);color:var(--warn)} .zst.crit{background:var(--crit-bg);color:var(--crit-text)} .zst.info{background:var(--info-bg);color:var(--info)} .zst.action{background:var(--accent-soft);color:var(--accent-strong)}
/* KPI-Kachel: Icon oben, Zahl unten (tabular), Beschriftung darunter, Trend als Pfeil mit Wort */
.kk-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:8px}
.kk{display:flex;flex-direction:column;gap:4px;min-height:var(--kachel);padding:10px 12px;background:var(--surface-2);border:var(--rahmen) solid var(--border);border-radius:var(--radius-m);color:var(--text);text-decoration:none;min-width:0}
.kk .kk-i{width:var(--icon-kachel);height:var(--icon-kachel);color:var(--text-2);display:grid;place-items:center} .kk .kk-i svg{width:100%;height:100%;display:block}
.kk .kk-v{font-size:var(--stufe-5);font-weight:600;letter-spacing:-.02em;line-height:1;font-variant-numeric:tabular-nums;display:flex;align-items:baseline;gap:6px}
.kk .kk-v small{font-size:var(--stufe-1);font-weight:500;color:var(--text-2);letter-spacing:0}
.kk .kk-l{font-size:var(--stufe-1);color:var(--muted);line-height:1.25}
.kk.warn .kk-v{color:var(--warn)} .kk.crit .kk-v{color:var(--crit)} .kk.pos .kk-v{color:var(--pos)}
.kk.link{cursor:pointer} .kk.link:hover{border-color:var(--border-strong);background:var(--surface)}
.kk-trend{font-size:16px;line-height:1;font-weight:600;color:var(--text-2)}
/* Chip-Reihe als Auswahl (ersetzt <select>): genau ein Chip gewählt; Wert liegt im versteckten Feld */
.fchips{display:flex;flex-wrap:wrap;gap:6px}
.fchips .chip{min-height:32px;padding:5px 11px;font-size:var(--stufe-2);font-weight:500;color:var(--text-2);background:var(--surface);border:var(--rahmen) solid var(--border-strong);border-radius:var(--radius-s)}
.fchips .chip:hover{border-color:var(--accent);color:var(--text)}
.fchips .chip.on,.fchips .chip[aria-pressed="true"]{background:var(--action);border-color:var(--action);color:var(--on-action);font-weight:600}
.fchips .chip.neu{border-style:dashed}
.fchips.compact .chip{min-height:28px;padding:3px 9px;font-size:var(--stufe-1)}
.fld .fchips{padding:2px 0}
/* Stepper (ersetzt <input type=number>): − Zahl +, Grenzen mit Grund im Titel */
.stepper{display:inline-flex;align-items:stretch;border:var(--rahmen) solid var(--border-strong);border-radius:var(--radius-m);background:var(--surface-2);overflow:hidden;height:var(--ziel-min)}
.stepper button{width:var(--ziel-min);display:grid;place-items:center;font-size:var(--stufe-4);font-weight:500;color:var(--text-2);background:none;border:0}
.stepper button:hover{background:var(--fill);color:var(--text)}
.stepper button:disabled{background:var(--disabled);color:var(--disabled-fg);cursor:not-allowed}
.stepper input{width:64px;text-align:center;border:0;border-left:var(--rahmen) solid var(--border);border-right:var(--rahmen) solid var(--border);background:none;font-weight:600;font-size:var(--stufe-3);font-variant-numeric:tabular-nums;color:var(--text);padding:0 4px;-moz-appearance:textfield}
.stepper input::-webkit-outer-spin-button,.stepper input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.stepper input:focus{outline:none;background:var(--fill-soft)}
.stepper:focus-within{outline:2px solid var(--focus);outline-offset:2px}
.stepper small{display:none}
.fld .stepper{margin-top:2px}
/* Knöpfe, Chips und Kacheln: deaktiviert immer mit Grund (title), kein Zeiger.
   V23: eigene Farbe (--disabled/--disabled-fg) statt Deckkraft, damit der Zustand auch auf Bildern und Bändern lesbar bleibt. */
.btn:disabled,.btn[aria-disabled="true"]{background:var(--disabled);color:var(--disabled-fg);border-color:var(--disabled);cursor:not-allowed}
.btn:disabled:hover,.btn[aria-disabled="true"]:hover{background:var(--disabled)}
.chip:disabled,.chip[aria-disabled="true"],.fchips .chip:disabled,.fchips .chip[aria-disabled="true"]{background:var(--disabled);border-color:var(--disabled);color:var(--disabled-fg);cursor:not-allowed}
.chip:disabled:hover,.fchips .chip:disabled:hover{border-color:var(--disabled);color:var(--disabled-fg)}
.kk.is-disabled,.kk[aria-disabled="true"]{background:var(--disabled);border-color:var(--disabled);color:var(--disabled-fg)}
.kk.is-disabled .kk-v,.kk.is-disabled .kk-l,.kk.is-disabled .kk-i,.kk.is-disabled .kk-v small,.kk.is-disabled .kk-trend,
.kk[aria-disabled="true"] .kk-v,.kk[aria-disabled="true"] .kk-l,.kk[aria-disabled="true"] .kk-i,.kk[aria-disabled="true"] .kk-v small,.kk[aria-disabled="true"] .kk-trend{color:var(--disabled-fg)}
.kk.is-disabled:hover,.kk[aria-disabled="true"]:hover,.kk.link.is-disabled:hover,.kk.link[aria-disabled="true"]:hover{background:var(--disabled);border-color:var(--disabled);cursor:not-allowed}
/* Einlauf mit Stagger (höchstens drei Schritte) */
@media (prefers-reduced-motion:no-preference){ .ht-rise-2{animation-delay:var(--motion-stagger)} .ht-rise-3{animation-delay:calc(2 * var(--motion-stagger))} }

/* Quelle „Plattform" (V21): eigene Farbkante im Ticker, Laufband und Detailfenster */
.tk.src-plattform .tk-row,.bi.src-plattform,.nw-src.src-plattform{border-left-color:var(--chart-peach)}
/* Plattform-Block (Startseite) */
.pf-sec{margin:0 0 18px}
.pf-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));gap:12px}
.pf-card .kk-row{grid-template-columns:repeat(3,minmax(0,1fr))}
.pf-card{display:flex;flex-direction:column;gap:12px;background:var(--surface);border:var(--rahmen) solid var(--border);border-radius:var(--radius-l);padding:14px 16px 12px;min-width:0}
.pf-card.skel{min-height:260px}
.pf-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.pf-head h3{margin:0;font-size:var(--stufe-4);font-weight:600;letter-spacing:-.01em;line-height:1.2}
.pf-sub{display:block;font-size:var(--stufe-1);color:var(--text-3);margin-top:2px}
.pf-head .btn{flex:0 0 auto;text-decoration:none}
.pf-lage{background:var(--surface-2);border:var(--rahmen) solid var(--border);border-radius:var(--radius-m);padding:10px 12px;display:flex;flex-direction:column;gap:6px}
.pf-lage p{margin:0;font-size:var(--stufe-2);line-height:1.55;color:var(--text)}
.pf-lage.muted{color:var(--text-2);font-size:var(--stufe-2);margin:0;padding:8px 12px;border:var(--rahmen) dashed var(--border);border-radius:var(--radius-m)}
.pf-lage .lg-d{align-self:flex-end}
.pf-next{display:flex;flex-direction:column;gap:4px}
.pf-next .ht-label{font-size:var(--stufe-1);color:var(--muted);letter-spacing:.02em}
.pf-nx{font-size:var(--stufe-2);color:var(--text-2);display:flex;align-items:center;gap:6px;flex-wrap:wrap;min-width:0} .pf-nx b{color:var(--text);font-weight:600}
.pf-rows{border-top:var(--rahmen) solid var(--line-soft);padding-top:4px}
.pf-rows .tk-row{grid-template-columns:auto auto minmax(0,1fr) auto 14px;padding-left:8px}
.pf-rows .tk-row .tk-t{white-space:nowrap}
.pf-rows .tk-more{padding-left:12px}
.pf-rows .empty.soft{padding:14px;border-style:dashed}
@media(max-width:760px){ .pf-head{flex-direction:column} .pf-rows .tk-row{grid-template-columns:auto minmax(0,1fr) 14px} .pf-rows .tk-row .nw-who,.pf-rows .tk-row .tk-strand{display:none} }

/* ---- V22b · Aufräumen (Pförtner) ---- */
.au-kpis{margin-bottom:12px}
.au-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:8px 0 12px;border-bottom:var(--rahmen) solid var(--line-soft);margin-bottom:10px}
.au-sp{flex:1 1 auto}
.au-list{display:flex;flex-direction:column;gap:8px}
.au-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 18px;align-items:start;padding:12px 14px;background:var(--surface);border:var(--rahmen) solid var(--border);border-radius:var(--radius-m);transition:opacity var(--dauer-2,200ms) ease,border-color var(--dauer-1,120ms) ease}
.au-row.is-prop{border-left:3px dashed var(--border-strong)}
.au-row.is-ok{border-left:3px solid var(--pos)}
.au-main{min-width:0;display:flex;flex-direction:column;gap:4px}
.au-meta{font-size:var(--stufe-1);color:var(--text-3);display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.au-title{font-size:var(--stufe-3);font-weight:600;letter-spacing:-.005em;line-height:1.3;color:var(--text)}
.au-text{font-size:var(--stufe-2);color:var(--text-2);line-height:1.5;max-width:70ch}
.au-note{font-size:var(--stufe-1);color:var(--text-3);font-style:italic}
.au-ctl{display:flex;flex-direction:column;gap:8px;align-items:flex-end}
.au-gate .chip{min-height:28px;padding:3px 9px;font-size:var(--stufe-1)}
.fchips .chip.prop,.fchips .chip.on.prop{background:transparent;color:var(--text);border:var(--rahmen) dashed var(--action);font-weight:600}
.au-frist{display:inline-flex;align-items:center;gap:6px;font-size:var(--stufe-1);color:var(--text-3)}
.au-frist input{font:inherit;font-size:var(--stufe-1);color:var(--text-2);background:var(--surface-2);border:var(--rahmen) solid var(--border);border-radius:var(--radius-s);padding:3px 6px;min-height:28px}
@media(max-width:760px){ .au-row{grid-template-columns:1fr} .au-ctl{align-items:flex-start} .au-bar .au-sp{display:none} .au-bar .btn{margin-left:auto} }

/* ---- V22c · Für dich ---- */
.fd{margin:0 0 18px}
.fd-h{display:flex;align-items:center;gap:10px;margin:0 0 8px}
.fd-h h2{margin:0;font-size:var(--stufe-4);font-weight:600;letter-spacing:-.01em}
.fd-h .line{flex:1 1 auto;height:var(--rahmen);background:var(--line-soft)}
.fd-n{font-size:var(--stufe-1);color:var(--text-3);font-variant-numeric:tabular-nums}
.fd-list{display:flex;flex-direction:column;gap:6px}
.fd-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 14px;align-items:center;padding:10px 14px;background:var(--surface);border:var(--rahmen) solid var(--border);border-radius:var(--radius-m);color:var(--text);text-decoration:none;transition:border-color var(--dauer-1,120ms) ease}
.fd-row:hover{border-color:var(--border-strong)}
.fd-main{min-width:0;display:flex;flex-direction:column;gap:2px}
.fd-title{font-size:var(--stufe-3);font-weight:600;line-height:1.3;letter-spacing:-.005em}
.fd-note{font-size:var(--stufe-2);color:var(--text-2);line-height:1.45;max-width:64ch}
.fd-side{display:flex;flex-direction:column;align-items:flex-end;gap:4px;white-space:nowrap}
.fd-who,.fd-muted{font-size:var(--stufe-1);color:var(--text-3)}
.fd-more{display:inline-block;padding:6px 14px;font-size:var(--stufe-2);color:var(--text-2);text-decoration:none}
.fd-more:hover{color:var(--text)}
.fd-empty{margin:0;padding:12px 14px;font-size:var(--stufe-2);color:var(--text-2);border:var(--rahmen) dashed var(--border);border-radius:var(--radius-m)}
.fd-brief{padding:12px 14px;background:var(--surface);border:var(--rahmen) solid var(--border);border-radius:var(--radius-m);margin-bottom:8px}
.fd-brief p{margin:0 0 6px;font-size:var(--stufe-2);line-height:1.6;color:var(--text)}
.fd-brief .fd-sent b{font-weight:600}
.fd-kk{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:600px){ .fd-row{grid-template-columns:1fr} .fd-side{flex-direction:row;align-items:center;justify-content:space-between} .fd-h .btn{margin-left:auto} }

/* ---- V22d · Besprechung ---- */
.bs-top{margin:0 0 14px}
.bs-line{margin:0;font-size:var(--stufe-3);color:var(--text-2)} .bs-line b{color:var(--text);font-weight:600}
.bs-list{display:flex;flex-direction:column;gap:8px}
.bs-row{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:6px 12px;align-items:start;padding:12px 14px;background:var(--surface);border:var(--rahmen) solid var(--border);border-radius:var(--radius-m)}
.bs-row.is-cur{border-color:var(--action);box-shadow:var(--schatten-1)}
.bs-row.is-done{opacity:.6}
.bs-num{font-size:var(--stufe-4);font-weight:600;color:var(--text-3);font-variant-numeric:tabular-nums;line-height:1.3}
.bs-body{min-width:0}
.bs-q{font-size:var(--stufe-3);font-weight:600;line-height:1.3;margin-bottom:6px}
.bs-dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:3px 12px;margin:0;font-size:var(--stufe-2)}
.bs-dl dt{color:var(--text-3)} .bs-dl dd{margin:0;color:var(--text-2);line-height:1.45}
.bs-fehlt{color:var(--warn);font-weight:600}
.bs-done{margin-top:6px}
.bs-go{align-self:center}
@media(max-width:600px){ .bs-row{grid-template-columns:28px minmax(0,1fr)} .bs-go{grid-column:2} .bs-dl{grid-template-columns:1fr} .bs-dl dt{margin-top:4px} }
.fd-prop{border:var(--rahmen) dashed var(--border);border-radius:var(--radius-m);margin-top:4px}

/* ===========================================================
   V24b (21.09.2026) · Vertretung: Abwesenheiten (.vt-), Übergabe (.ub-), Rückkehr (.rk-).
   Alle Chips, Kacheln und Zustände kommen aus den V21-Bausteinen (gfChips, gfKachel, gfZustand, gfAmpel).
   Farbe trägt hier nie allein: jede Ampel und jeder Quadrant hat Symbol und Wort.
   =========================================================== */
.vt-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 14px}
.vt-top .line{flex:1}
.vt-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:16px;align-items:start}
@media(max-width:900px){ .vt-grid{grid-template-columns:1fr} }
.vt-sec{margin:0 0 18px}
.vt-list{display:flex;flex-direction:column;gap:10px}
.vt-list[hidden],.rk-list[hidden],.ub-list[hidden]{display:none}
.vt-card{background:var(--surface);border:var(--rahmen) solid var(--border);border-radius:var(--radius-l);padding:12px 14px;display:flex;flex-direction:column;gap:8px}
.vt-card.is-aktiv{border-color:var(--action)}
.vt-head{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.vt-head h3{margin:0;font-size:var(--stufe-3);font-weight:600}
.vt-when{color:var(--text-2);font-size:var(--stufe-2);font-variant-numeric:tabular-nums}
.vt-zahlen{display:flex;gap:14px;flex-wrap:wrap;font-size:var(--stufe-2);color:var(--text-2)}
.vt-zahlen b{color:var(--text);font-variant-numeric:tabular-nums}
.vt-akt{display:flex;gap:8px;flex-wrap:wrap;margin-top:2px}
.vt-line{width:100%;border-collapse:collapse;font-size:var(--stufe-2)}
.vt-line th{text-align:left;font-weight:600;color:var(--text-2);font-size:var(--stufe-1);text-transform:uppercase;letter-spacing:.04em;padding:6px 8px 6px 0}
.vt-line td{padding:6px 8px 6px 0;border-top:var(--rahmen) solid var(--border);vertical-align:top}
.vt-line td:last-child{width:34px}
.vt-line input.txt{min-width:160px}
/* Auf schmalen Geraeten stehen die vier Spalten untereinander, sonst laeuft die Tabelle ueber den Schirm
   hinaus: das Vollmachtfeld allein verlangt 160 px (Befund 26 der Pruefung vom 22.09.2026).
   Die Kopfzeile verschwindet, jede Zelle traegt ihre Beschriftung selbst ueber data-sp. */
@media(max-width:560px){
  .vt-line thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .vt-line,.vt-line tbody,.vt-line tr,.vt-line td{display:block;width:100%}
  .vt-line tr{border-top:var(--rahmen) solid var(--border);padding:8px 0}
  .vt-line td{border-top:0;padding:3px 0}
  .vt-line td:last-child{width:auto;text-align:right}
  .vt-line td[data-sp]::before{content:attr(data-sp);display:block;font-size:var(--stufe-1);font-weight:600;
    color:var(--text-2);text-transform:uppercase;letter-spacing:.04em;margin-bottom:2px}
  .vt-line input.txt{min-width:0;width:100%}
}
.vt-stat{display:flex;flex-direction:column;gap:6px}
.vt-stat .bar{height:8px;background:var(--fill);border-radius:var(--radius-s);overflow:hidden}
.vt-stat .bar i{display:block;height:100%;background:var(--accent)}
.vt-stat.warn .bar i{background:var(--warn)}
.vt-modal .fld{margin-bottom:10px}
.vt-modal .fld>label{display:block;font-size:var(--stufe-2);font-weight:600;margin-bottom:4px}

.ub-kopf{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 12px}
.ub-kopf .av{width:38px;height:38px;border-radius:50%}
.ub-kopf h2{margin:0;font-size:var(--stufe-4)}
.ub-kopf .ub-meta{color:var(--text-2);font-size:var(--stufe-2)}
.ub-kopf .ub-akt{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}
.ub-quads{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:0 0 12px}
.ub-quad{display:flex;flex-direction:column;gap:4px;padding:10px 12px;background:var(--surface);border:var(--rahmen) solid var(--border);border-radius:var(--radius-m);text-align:left;min-height:var(--kachel)}
.ub-quad .v{font-size:var(--stufe-5);font-weight:600;line-height:1;font-variant-numeric:tabular-nums}
.ub-quad .l{font-size:var(--stufe-1);color:var(--muted)}
.ub-quad.on{border-color:var(--action);background:var(--accent-soft)}
.ub-quad.crit .v{color:var(--crit)}
.ub-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 12px}
.ub-bar .line{flex:1}
.ub-list{display:flex;flex-direction:column;gap:8px}
.ub-row{background:var(--surface);border:var(--rahmen) solid var(--border);border-radius:var(--radius-m);padding:10px 12px;display:flex;flex-direction:column;gap:8px}
.ub-row.is-luecke{border-left:var(--band) solid var(--warn)}
.ub-r1{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.ub-r1 .t{font-weight:600;font-size:var(--stufe-3);flex:1;min-width:200px}
.ub-r1 .k{font-size:var(--stufe-1);color:var(--text-2);text-transform:uppercase;letter-spacing:.04em}
.ub-achsen{display:inline-flex;gap:3px;font-variant-numeric:tabular-nums;font-size:var(--stufe-1);font-weight:600}
.ub-achsen span{min-width:20px;text-align:center;padding:2px 4px;background:var(--fill);border-radius:var(--radius-s);color:var(--text-2);cursor:help}
.ub-r2{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ub-r2 .fchips{margin:0}
.ub-r3{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ub-r3 label{display:inline-flex;align-items:center;gap:6px;font-size:var(--stufe-2);color:var(--text-2)}
.ub-r3 input[type=date]{background:var(--surface-2);border:var(--rahmen) solid var(--border);border-radius:var(--radius-s);color:var(--text);padding:6px 8px;min-height:36px}
.ub-r3 input.txt{flex:1;min-width:180px}
.ub-doss[hidden]{display:none}
.ub-doss{background:var(--surface-2);border:var(--rahmen) solid var(--border);border-radius:var(--radius-m);padding:10px 12px;font-size:var(--stufe-2);display:flex;flex-direction:column;gap:6px}
.ub-doss dl{display:grid;grid-template-columns:auto 1fr;gap:4px 10px;margin:0}
.ub-doss dt{color:var(--text-2)}
.ub-doss dd{margin:0}
.ub-doss ul{margin:0;padding-left:18px}
.ub-doss .akt{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px}
.ub-wache{display:flex;align-items:center;gap:8px;padding:10px 12px;background:var(--warn-bg);border:var(--rahmen) solid var(--warn);border-radius:var(--radius-m);margin:0 0 12px;font-size:var(--stufe-2)}
.ub-prot{margin-top:18px}
.ub-prot .lg{display:flex;gap:10px;padding:6px 0;border-top:var(--rahmen) solid var(--border);font-size:var(--stufe-2)}
.ub-prot .lg .at{color:var(--text-2);font-variant-numeric:tabular-nums;white-space:nowrap}
.ub-prot .zeile{display:flex;gap:8px;margin-top:10px}

.rk-kopf{margin:0 0 14px}
.rk-kopf h2{margin:0 0 4px;font-size:var(--stufe-5)}
.rk-hinweis{background:var(--accent-soft);border:var(--rahmen) solid var(--accent);border-radius:var(--radius-m);padding:10px 12px;font-size:var(--stufe-2);margin:0 0 14px}
.rk-list{display:flex;flex-direction:column;gap:8px}
.rk-row{background:var(--surface);border:var(--rahmen) solid var(--border);border-radius:var(--radius-m);padding:10px 12px;display:flex;gap:10px;align-items:flex-start;flex-wrap:wrap}
.rk-row .t{font-weight:600;flex:1;min-width:200px}
.rk-row .m{font-size:var(--stufe-2);color:var(--text-2);width:100%}
.rk-sec{margin:0 0 18px}

/* Für dich: Vertretungsblöcke auf der Startseite */
.fd-vt .fd-row{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;padding:8px 0;border-top:var(--rahmen) solid var(--border)}
.fd-vt .fd-row:first-child{border-top:0}
.fd-vt .fd-row .t{flex:1;min-width:180px;font-weight:600}
.fd-vt .fd-more{display:inline-block;margin-top:8px;font-size:var(--stufe-2);font-weight:600;color:var(--link)}
.fd-vt .fd-zahlen{display:flex;gap:16px;flex-wrap:wrap}
.fd-vt .fd-zahlen b{font-size:var(--stufe-4);font-variant-numeric:tabular-nums;display:block}
.fd-vt .fd-zahlen span{font-size:var(--stufe-1);color:var(--muted)}
.rk-row.is-gesehen{opacity:1;border-color:var(--disabled)}
.rk-row.is-gesehen .t{color:var(--text-2)}

/* ===========================================================
   V31 (03.10.2026) · Vorhaben (.vh-): Woche, Board, Liste, Akte, Einwurf, Übergabe.
   Nur Tokens. Zustände tragen Symbol plus Wort (.zst), die Farbe ist Zugabe. Nebentext auf --surface-2 nimmt --text-2.
   =========================================================== */
.vh-kopf{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin:8px 0 14px}
.vh-kopf h2{margin:4px 0 2px;font-size:var(--stufe-5);font-weight:600;letter-spacing:-.01em}
.vh-eyebrow{font-size:var(--stufe-1);letter-spacing:.08em;text-transform:uppercase;color:var(--text-2);font-weight:600}
.vh-lage{font-size:var(--stufe-2);color:var(--text-2)}
.vh-kopf-a{display:flex;gap:8px;flex-wrap:wrap}
.vh-warte{display:flex;align-items:center;gap:10px;flex-wrap:wrap;width:100%;text-align:left;margin:0 0 12px;padding:10px 12px;background:var(--surface);border:var(--rahmen) solid var(--warn);border-radius:var(--radius-m);color:var(--text);font-size:var(--stufe-2)}
.vh-warte:hover{background:var(--surface-2)}
.vh-warte[hidden]{display:none}
.vh-warte.klein{margin:10px 0 0}
.vh-steuer{display:flex;justify-content:space-between;gap:10px 16px;flex-wrap:wrap;margin:0 0 14px}
.vh-reihe{display:flex;gap:6px;flex-wrap:wrap}
.vh-reihe .chip{min-height:var(--ziel-min);padding:6px 14px;font-size:var(--stufe-2);font-weight:500;color:var(--text-2);background:var(--surface);border:var(--rahmen) solid var(--border-strong);border-radius:var(--radius-s);white-space:nowrap}
.vh-reihe .chip.on{background:var(--action);border-color:var(--action-border,var(--action));color:var(--on-action);font-weight:600}
.vh-grid{display:block}
.vh-main{min-width:0}
.vh-nichts{font-size:var(--stufe-2);color:var(--text-2)}

/* Ball: Bild plus Wort */
.vh-ball{display:inline-flex;align-items:center;gap:6px;font-size:var(--stufe-2);color:var(--text);min-width:0}
.vh-ball>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vh-av{width:22px;height:22px;border-radius:50%;object-fit:cover;display:block;flex:0 0 auto}
.vh-av2{display:inline-flex;flex:0 0 auto}
.vh-av2 .vh-av+.vh-av{margin-left:-8px;box-shadow:0 0 0 2px var(--surface)}
.vh-ini{width:22px;height:22px;border-radius:50%;display:inline-grid;place-items:center;flex:0 0 auto;font-size:var(--stufe-1);font-weight:600;background:var(--surface-2);color:var(--text);border:var(--rahmen) solid var(--border-strong)}
.vh-ini.leer{background:transparent;border-style:dashed;border-color:var(--crit);color:var(--crit-text)}

/* Karten (Woche und Board) */
.vh-cards{display:flex;flex-wrap:wrap;gap:8px}
.vh-card{flex:1 1 230px;max-width:340px;display:flex;flex-direction:column;background:var(--surface);border:var(--rahmen) solid var(--border);border-radius:var(--radius-m);transition:border-color var(--motion-fast) var(--motion-ease),box-shadow var(--motion-fast) var(--motion-ease)}
.vh-card:hover{box-shadow:var(--shadow-card)}
.vh-card.warn{border-color:var(--warn)}
.vh-card.crit{border-style:dashed;border-color:var(--crit)}
.vh-card.key{border-color:var(--action-border,var(--action))}
.vh-card.on{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.vh-card.zieht{opacity:.6}
.vh-open{display:flex;flex-direction:column;gap:3px;width:100%;text-align:left;padding:10px 12px;color:var(--text);border-radius:var(--radius-m)}
.vh-c-kopf{display:flex;gap:6px;align-items:center;flex-wrap:wrap;font-size:var(--stufe-2)}
.vh-c-kopf b{font-weight:600;margin-right:auto}
.vh-marke{max-width:100%;overflow:hidden;text-overflow:ellipsis}
.vh-c-t{font-size:var(--stufe-3);font-weight:600;line-height:1.3}
.vh-c-n{font-size:var(--stufe-2);color:var(--text-2)}
.vh-c-n.leer{font-style:italic}
.vh-c-fuss{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:6px}
.vh-c-p{font-size:var(--stufe-1);color:var(--text-2);font-variant-numeric:tabular-nums;white-space:nowrap}
.vh-weiter{align-self:flex-start;margin:0 12px 10px;min-height:36px}

/* Woche */
.vh-woche{border:var(--rahmen) solid var(--border);border-radius:var(--radius-l);overflow:hidden;background:var(--panel)}
.vh-wz{display:flex;flex-wrap:wrap;border-top:var(--rahmen) solid var(--border)}
.vh-wz:first-child{border-top:0}
.vh-wz.jetzt{background:var(--accent-soft)}
.vh-wz.warn .vh-wz-k b{color:var(--warn)}
.vh-wz-k{flex:0 0 150px;padding:14px 16px;display:flex;flex-direction:column;gap:2px}
.vh-wz-k b{font-size:var(--stufe-3);font-weight:600}
.vh-wz-k span{font-size:var(--stufe-2);color:var(--text-2)}
.vh-wz-k em{font-style:normal;font-size:var(--stufe-1);font-weight:600;color:var(--accent-strong);margin-top:4px}
.vh-wz-i{flex:999 1 420px;min-width:0;padding:12px 16px 14px;display:flex;flex-direction:column;gap:8px}
.vh-wz.leer .vh-wz-k{padding-top:8px;padding-bottom:8px}
.vh-wz.leer .vh-wz-i{padding-top:8px;padding-bottom:8px}
.vh-band{padding:8px 12px;border-radius:var(--radius-m);background:var(--warn-bg);border:var(--rahmen) solid var(--warn);font-size:var(--stufe-2);color:var(--text)}

/* Board */
.vh-board-x{overflow-x:auto;padding-bottom:6px}
.vh-board{display:grid;grid-template-columns:repeat(6,minmax(180px,1fr));gap:10px;align-items:start;min-width:1120px}
.vh-col{display:flex;flex-direction:column;gap:8px;padding:12px;border-radius:var(--radius-l);background:var(--panel);border:var(--rahmen) solid var(--border)}
.vh-col.voll{border-color:var(--warn)}
.vh-col.ohne{border-style:dashed;border-color:var(--crit)}
.vh-col.ziel{box-shadow:0 0 0 2px var(--focus)}
.vh-col-k{display:flex;align-items:center;gap:8px;padding-bottom:8px;border-bottom:var(--rahmen) solid var(--border)}
.vh-col-k b{flex:1;font-size:var(--stufe-2);font-weight:600}
.vh-col-k .n{font-size:var(--stufe-3);font-weight:600;font-variant-numeric:tabular-nums}
.vh-col-w .zst{white-space:normal}
.vh-col-i{display:flex;flex-direction:column;gap:8px}
.vh-col .vh-card{max-width:none;flex:0 0 auto}

/* Liste */
.vh-liste-x{overflow-x:auto;border:var(--rahmen) solid var(--border);border-radius:var(--radius-l);background:var(--panel)}
.vh-liste{min-width:860px;padding:4px 6px 10px}
.vh-l-kopf,.vh-l-z{display:grid;grid-template-columns:120px minmax(0,1.5fr) 150px minmax(0,1.1fr) 150px 72px;gap:14px;align-items:center}
.vh-l-kopf{padding:10px 12px;font-size:var(--stufe-1);font-weight:600;color:var(--text-2);text-transform:uppercase;letter-spacing:.06em}
.vh-l-g{display:flex;gap:10px;align-items:baseline;margin:14px 12px 4px;padding-bottom:6px;border-bottom:var(--rahmen) solid var(--border);font-size:var(--stufe-3);font-weight:600}
.vh-l-g span{font-size:var(--stufe-2);color:var(--text-2);font-weight:500}
.vh-l-z{width:100%;text-align:left;padding:10px 12px;border-radius:var(--radius-m);border:var(--rahmen) solid transparent;color:var(--text)}
.vh-l-z:hover{background:var(--surface)}
.vh-l-z.on{border-color:var(--accent);background:var(--accent-soft)}
.vh-l-t{display:flex;flex-direction:column;gap:2px;min-width:0}
.vh-l-t b{font-weight:600}
.vh-l-t small,.vh-l-n{font-size:var(--stufe-2);color:var(--text-2)}
.vh-l-p{font-size:var(--stufe-2);font-variant-numeric:tabular-nums}

/* Akte */
.vh-akte{background:var(--panel);border:var(--rahmen) solid var(--border-strong);border-radius:var(--radius-l);box-shadow:var(--shadow-card);padding:16px 18px 20px;display:flex;flex-direction:column;gap:12px;min-width:0}
.vh-akte[hidden]{display:none}
.vh-a-kopf{display:flex;gap:10px;align-items:flex-start}
.vh-a-tt{flex:1;min-width:0}
.vh-a-tt h2{margin:4px 0 0;font-size:var(--stufe-4);font-weight:600;line-height:1.25}
.vh-a-tt h2:focus{outline:none}
.vh-a-zurueck{display:none}
.vh-a-kacheln{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.vh-k{display:flex;flex-direction:column;gap:3px;padding:8px 10px;border:var(--rahmen) solid var(--border);border-radius:var(--radius-m);background:var(--surface);min-width:0}
.vh-k>span{font-size:var(--stufe-1);color:var(--text-2)}
.vh-k b{font-size:var(--stufe-2);font-weight:600;min-width:0}
.vh-k small{font-size:var(--stufe-1);color:var(--text-2)}
.vh-a-konf{font-size:var(--stufe-2);line-height:var(--leading-text)}
.vh-schritt,.vh-stand{display:flex;flex-direction:column;gap:4px;font-size:var(--stufe-2);font-weight:600}
.vh-schritt{padding:10px 12px;border-radius:var(--radius-m);background:var(--surface);border:var(--rahmen) solid var(--action-border,var(--action))}
.vh-schritt textarea,.vh-stand textarea{width:100%;resize:vertical;min-height:44px;padding:8px 10px;border-radius:var(--radius-s);border:var(--rahmen) solid var(--border-strong);background:var(--surface-2);color:var(--text);font:inherit;font-size:var(--stufe-2);font-weight:400;line-height:var(--leading-text)}
.vh-tabs{display:flex;gap:4px}
.vh-tabs [role=tab]{flex:1;min-height:var(--ziel-min);border-radius:var(--radius-s);border:var(--rahmen) solid var(--border-strong);color:var(--text-2);font-size:var(--stufe-2);display:inline-flex;align-items:center;justify-content:center;gap:6px}
.vh-tabs [role=tab][aria-selected=true]{border-color:var(--accent);background:var(--accent-soft);color:var(--text);font-weight:600}
.vh-tabs .n{font-variant-numeric:tabular-nums}
#vhPanel{display:flex;flex-direction:column;gap:12px}
.vh-sec-h{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-top:6px;border-top:var(--rahmen) solid var(--border)}
.vh-sec-h h3{margin:6px 0 0;font-size:var(--stufe-2);font-weight:600}
.vh-punkte,.vh-verlauf{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.vh-punkt{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:4px 8px;align-items:start;font-size:var(--stufe-2)}
.vh-punkt input[type=checkbox]{width:20px;height:20px;margin:2px 0 0;accent-color:var(--accent)}
.vh-punkt label{display:flex;flex-direction:column;gap:2px;cursor:pointer;min-width:0}
.vh-punkt label .t{color:var(--text)}
.vh-punkt label small{font-size:var(--stufe-1);color:var(--text-2)}
.vh-punkt.fertig label .t{text-decoration:line-through;color:var(--text-2)}
.vh-p-edit{min-height:32px;padding:2px 8px}
.vh-punkt-form{grid-column:1/-1}
.vh-pform{display:flex;flex-direction:column;gap:8px;padding:10px;border:var(--rahmen) solid var(--border-strong);border-radius:var(--radius-m);background:var(--surface)}
.vh-pform-z{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,160px);gap:8px}
.vh-pform-a{display:flex;gap:8px;flex-wrap:wrap}
.vh-fld{display:flex;flex-direction:column;gap:4px;font-size:var(--stufe-2);font-weight:600;color:var(--text)}
.vh-fld input,.vh-fld textarea,.vh-fld select{min-height:var(--ziel-min);padding:8px 10px;border-radius:var(--radius-s);border:var(--rahmen) solid var(--border-strong);background:var(--surface-2);color:var(--text);font:inherit;font-size:var(--stufe-3);font-weight:400}
.vh-fld[hidden]{display:none}
.vh-verkn{display:flex;flex-direction:column;gap:6px}
.vh-vk summary{cursor:pointer;list-style:none;min-height:32px;display:flex;align-items:center}
.vh-vk ul{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:4px}
.vh-vk li{display:flex;gap:8px;align-items:center;justify-content:space-between;font-size:var(--stufe-2)}
.vh-vk li a{min-width:0;overflow:hidden;text-overflow:ellipsis}
.vh-vk li .btn{min-height:32px;padding:2px 8px;flex:0 0 auto}
.vh-ballchips .chip{min-height:var(--ziel-min)}
.vh-sync{margin:0;padding-top:10px;border-top:var(--rahmen) solid var(--border);font-size:var(--stufe-1);color:var(--text-2)}
.vh-vlf{margin-bottom:2px}
.vh-e{padding:8px 10px;border-radius:var(--radius-m);border:var(--rahmen) solid transparent;border-bottom-color:var(--border)}
.vh-e.neu{border-left:3px solid var(--accent)}
.vh-e.vorschlag{border-color:var(--warn);background:var(--surface)}
.vh-e-k{font-size:var(--stufe-1);color:var(--text-2)}
.vh-e-k b{font-weight:600;color:var(--text)}
.vh-e-t{font-size:var(--stufe-2);line-height:var(--leading-text);margin-top:2px}
.vh-e-a{display:flex;gap:8px;margin-top:6px}
.vh-eintragen{min-height:var(--ziel-min);border-radius:var(--radius-m);border:var(--rahmen) dashed var(--border-strong);color:var(--text);font-size:var(--stufe-2)}
.vh-eintragen:hover{border-color:var(--accent)}
.vh-dlg{max-width:560px}
.vh-dlg-b{padding:14px 18px;display:flex;flex-direction:column;gap:12px;overflow:auto}
.vh-dlg-t{margin:0;font-size:var(--stufe-2);color:var(--text-2)}
.vh-dlg-t b{color:var(--text);font-size:var(--stufe-3)}

/* Einwurf als fester Knopf, nur am Handy */
.vh-fab{display:none}

/* Ab 1024 px steht die Akte rechts neben der Ansicht */
@media(min-width:1024px){
  html.vh-akte-offen .vh-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,420px);gap:20px;align-items:start}
  .vh-akte{position:sticky;top:16px;max-height:calc(100vh - 32px);overflow:auto}
}
/* Darunter ist die Akte ein Blatt über der Seite, mit Zurück */
@media(max-width:1023px){
  .vh-akte{position:fixed;inset:0;z-index:70;border-radius:0;border:0;overflow:auto;padding:calc(14px + env(safe-area-inset-top,0px)) 16px calc(96px + env(safe-area-inset-bottom,0px))}
  .vh-a-zurueck{display:inline-flex}
  .vh-a-x{display:none}
  html.vh-akte-offen body{overflow:hidden}
}
@media(max-width:760px){
  #vhEinwurf{display:none}
  .vh-reihe{flex-wrap:nowrap;overflow-x:auto;width:100%;padding-bottom:4px;scrollbar-width:none}
  .vh-reihe::-webkit-scrollbar{display:none}
  .vh-steuer{flex-direction:column;gap:6px}
  .vh-wz-k{flex:1 1 100%;flex-direction:row;align-items:baseline;gap:10px;padding:10px 12px 0}
  .vh-wz-i{padding:8px 12px 12px}
  .vh-card{max-width:none;flex-basis:100%}
  .vh-fab{display:inline-flex;align-items:center;justify-content:center;gap:8px;position:fixed;z-index:75;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));min-height:56px;padding:0 22px;border-radius:var(--radius-l);background:var(--action);color:var(--on-action);border:var(--rahmen) solid var(--action-border,var(--action));font-weight:600;font-size:var(--stufe-3);box-shadow:var(--shadow-pop)}
  .vh-wrap{padding-bottom:120px}
  .vh-a-kacheln{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .vh-pform-z{grid-template-columns:1fr}
}
.vh-akte textarea::placeholder,.vh-fld input::placeholder,.vh-fld textarea::placeholder{color:var(--text-2);opacity:1}
.vh-tab-v{font-weight:600;color:var(--text)}
.vh-tab-v i{font-style:normal}
.vh-marke{white-space:normal;text-align:left}
/* Mit Maus erscheint „Ball weitergeben“ beim Zeigen oder Fokus, am Handy steht der Knopf immer da. */
@media(hover:hover) and (pointer:fine){
  .vh-card .vh-weiter{display:none}
  .vh-card:hover .vh-weiter,.vh-card:focus-within .vh-weiter{display:inline-flex}
}
.vh-marke{display:inline-block;overflow:visible}
.vh-marke i{margin-right:5px}
.vh-fehler{font-size:var(--stufe-2);font-weight:500;color:var(--crit-text)}
.vh-fld input[aria-invalid=true]{border-color:var(--crit)}
.vh-geloest{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;padding:8px 10px;border:var(--rahmen) solid var(--border-strong);border-radius:var(--radius-m);font-size:var(--stufe-2)}

/* V31c · Einwurf */
.vh-ew{max-width:600px}
.vh-ew h3 small{font-size:var(--stufe-2);font-weight:500;color:var(--text-2);margin-left:6px}
.vh-ew-hint{margin:0;font-size:var(--stufe-2);color:var(--text-2)}
.vh-ew-liste{max-height:180px;overflow:auto;padding:2px}
.vh-ew-roh{margin:0;padding:8px 12px;border-left:3px solid var(--border-strong);background:var(--surface-2);font-size:var(--stufe-2);color:var(--text);white-space:pre-wrap;border-radius:var(--radius-s)}
.vh-ew-erkannt{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:var(--stufe-2)}
.vh-ew-erkannt>span{color:var(--text-2)}
.vh-ew-erkannt b{font-size:var(--stufe-3)}
.vh-ew-vorschau{margin:0;padding:10px 12px;border:var(--rahmen) solid var(--border);border-radius:var(--radius-m);font-size:var(--stufe-2);line-height:var(--leading-text)}
.vh-ew-haken{margin:0;padding:10px 12px;border:var(--rahmen) solid var(--border);border-radius:var(--radius-m);display:flex;flex-direction:column;gap:8px}
.vh-ew-haken legend{font-size:var(--stufe-2);font-weight:600;padding:0 4px}
.vh-ew-haken label{display:flex;gap:8px;align-items:flex-start;font-size:var(--stufe-2);min-height:32px}
.vh-ew-haken input{width:20px;height:20px;margin:1px 0 0;accent-color:var(--accent);flex:0 0 auto}
.vh-ew-haken small{color:var(--text-2)}
.vh-ew-warn{display:flex;gap:8px;align-items:flex-start;flex-wrap:wrap;padding:8px 10px;border:var(--rahmen) solid var(--warn);border-radius:var(--radius-m);font-size:var(--stufe-2)}
.vh-ew-fehler{padding:8px 10px;border:var(--rahmen) solid var(--crit);border-radius:var(--radius-m);font-size:var(--stufe-2);color:var(--text)}
.vh-ew-verw summary{cursor:pointer;font-size:var(--stufe-2);color:var(--text-2)}
.vh-ew-verw ul{margin:6px 0 0;padding-left:18px;font-size:var(--stufe-2)}
.vh-ew .modal-f .btn{min-height:var(--ziel-min)}
@media(max-width:760px){
  .vh-ew-back{padding:0;align-items:stretch}
  .vh-ew-back .modal{max-width:none;max-height:none;height:100%;border-radius:0;border:0}
  .vh-ew-back .vh-dlg-b{flex:1;padding-bottom:calc(14px + env(safe-area-inset-bottom,0px))}
}
@media(max-width:760px){ .fd-einwurf{display:none} }
.vh-ew .fchips.compact .chip{min-height:var(--ziel-min);padding:6px 12px;font-size:var(--stufe-2)}

/* V31d · Rückkehr und Für dich */
.rk-vl{margin:0;padding-left:18px;width:100%;font-size:var(--stufe-2);color:var(--text)}
.rk-vl li{margin:2px 0}
/* V31d · Übergabe-Dialog */
.vh-ue{max-width:720px}
.vh-ue-kopf{display:flex;align-items:center;gap:10px}
.vh-ue-kopf .vh-av{width:32px;height:32px}
.vh-ue-kopf h3{margin:0}
.vh-ue-anlass{display:flex;flex-direction:column;gap:8px}
.vh-ue-a{display:flex;flex-direction:column;gap:2px;text-align:left;padding:12px 14px;border:var(--rahmen) solid var(--border-strong);border-radius:var(--radius-m);color:var(--text);min-height:var(--ziel-min)}
.vh-ue-a:hover{border-color:var(--accent);background:var(--surface-2)}
.vh-ue-a b{font-size:var(--stufe-3)}
.vh-ue-a span{font-size:var(--stufe-2);color:var(--text-2)}
.vh-ue-z{display:flex;flex-direction:column;gap:6px;padding:10px 0;border-top:var(--rahmen) solid var(--border)}
.vh-ue-t{display:flex;flex-direction:column;gap:2px}
.vh-ue-t b{font-size:var(--stufe-3)}
.vh-ue-t span{font-size:var(--stufe-2);color:var(--text-2)}
.vh-ue .fchips.compact .chip{min-height:var(--ziel-min);padding:6px 12px;font-size:var(--stufe-2)}
.vh-ue-n{min-height:var(--ziel-min);padding:8px 10px;border-radius:var(--radius-s);border:var(--rahmen) solid var(--border-strong);background:var(--surface-2);color:var(--text);font:inherit;font-size:var(--stufe-2)}
.vh-ue-n::placeholder{color:var(--text-2);opacity:1}
.vh-ue-test{display:flex;gap:8px;align-items:center;font-size:var(--stufe-2);color:var(--text-2)}
.vh-entwurf{font-style:normal;font-weight:500;color:var(--crit-text);margin-left:6px}