/* Art.1 Gallery Dokumentation – Erweiterung von site.css: Notizbücher, Editor, Dialoge, Offene Punkte, Druck.
   Farben, Schrift und Abstände kommen aus tokens.css. Die Marke ist eckig: radius-0, außer Buttons und Felder (radius-s). */

.hint { font: var(--text-small); color: var(--ink-muted); margin: 0 0 14px; max-width: 70ch; }
.laden { padding: 56px; color: var(--ink-muted); }
.btn:disabled { opacity: .55; cursor: wait; }
.btn.gefahr { background: var(--surface-raised); color: var(--rot-text); border-color: var(--rot-text); }
.btn.gefahr:hover { background: var(--surface); filter: none; }
.btn.ghost.hell { color: var(--weiss); border-color: var(--weiss); }
.btn.ghost.hell:hover { background: rgba(255,255,255,.08); }
.mini.gefahr { color: var(--rot-text); }
kbd { font: 600 12px/1 var(--font-sans); border: 1px solid var(--linie); border-bottom-width: 2px; padding: 3px 7px; border-radius: 2px; background: var(--surface); white-space: nowrap; }
.leer-hinweis { font: var(--text-small); color: var(--ink-muted); list-style: none; }
.mehr { font: var(--text-label); font-size: 13px; color: var(--rot-text); text-underline-offset: 3px; }

/* ---------- Anmelden und Einrichten ---------- */
.tor-body { background: var(--nachtblau); }
.tor-body main.tor { margin-left: 0; flex-direction: row; }
.tor { position: relative; min-height: 100vh; overflow: hidden; background: var(--nachtblau); color: var(--weiss); display: flex; align-items: center; padding: 48px 8vw; }
.tor-diag { position: absolute; top: 0; right: 0; height: 100%; width: auto; min-width: 46%; }
.tor-diag polygon { transform-origin: right; }
.tor-inhalt { position: relative; z-index: 1; width: min(440px, 100%); }
.tor-logo { width: 150px; display: block; margin-bottom: 48px; }
.tor .eyebrow { color: var(--leuchtrot); }
.tor-titel { font: var(--text-headline-xl); font-size: clamp(48px, 6vw, 72px); letter-spacing: -0.01em; margin: 0; }
.tor-titel .p, .tor-claim .p, .tor-claim .e { color: var(--leuchtrot); }
.tor-text { font: var(--text-body-l); color: #d6dde6; margin: 16px 0 28px; }
.tor-fehler { background: var(--weiss); color: var(--one-rot); border-left: 4px solid var(--signalrot); padding: 10px 14px; font: var(--text-label); margin: 0 0 20px; }
.tor-form { display: grid; gap: 16px; }
.tor-form label { display: grid; gap: 6px; font: var(--text-label); font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: #b7c0cc; }
.tor-form input[type="text"], .tor-form input[type="password"] { font: var(--text-body); font-size: 16px; text-transform: none; letter-spacing: 0; background: rgba(255,255,255,.07); border: 1px solid #3a4656; color: var(--weiss); padding: 12px 14px; border-radius: var(--radius-s); }
.tor-form input:focus { outline: none; border-color: var(--leuchtrot); }
.tor-form .tor-check { display: flex; align-items: center; gap: 10px; text-transform: none; letter-spacing: 0; font: var(--text-body); font-size: 14px; color: #d6dde6; }
.tor-form .tor-check input { width: 18px; height: 18px; accent-color: var(--signalrot); }
.tor-form .btn { justify-content: center; padding: 13px 18px; font-size: 15px; margin-top: 4px; }
.tor-form :focus-visible { outline: 2px solid var(--leuchtrot); outline-offset: 2px; box-shadow: none; }
.tor-claim { margin: 56px 0 0; font: var(--text-headline-s); font-size: 18px; color: #b7c0cc; }

/* ---------- Seitenleiste ---------- */
.side-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.side-actions a.theme-toggle { text-decoration: none; }
.side-meta a { color: var(--side-muted); }
.side-meta a:hover { color: var(--side-ink); }
.nav-zahl { margin-left: auto; font-style: normal; font: 600 11px/18px var(--font-sans); min-width: 22px; padding: 0 6px; text-align: center; background: var(--signalrot); color: var(--weiss); }
.nav-group a { align-items: center; }
.nb-mini { display: inline-block; width: 10px; height: 12.5px; background: var(--galeriepapier); position: relative; vertical-align: -1px; overflow: hidden; }
.nb-mini.dunkel { background: #3a4656; box-shadow: inset 0 0 0 1px #4a5868; }
.nb-mini.dunkel::after { content: ""; position: absolute; top: -2px; bottom: -2px; right: 2px; width: 2px; background: var(--signalrot); transform: skewX(-8deg); }
.nb-mini.hell::after { content: ""; position: absolute; width: 4px; height: 4px; border-radius: 50%; right: 1.5px; top: 2px; background: var(--one-rot); }
.nav-seiten { margin: 2px 0 8px 22px !important; border-left: 1px solid var(--side-line); }
.nav-seiten a { font-size: 13px; padding-top: 5px; padding-bottom: 5px; }
.nav-seiten .n { width: 18px; }
.nav-gruppe { font: 600 10px/14px var(--font-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--side-muted); padding: 10px 0 2px 12px; }
.nav-neu { color: var(--side-muted) !important; background: transparent; border: 0; border-left: 3px solid transparent; width: 100%; text-align: left; cursor: pointer; display: flex; align-items: center; gap: 10px; padding: 7px 8px 7px 9px; font: inherit; font-size: 14px; line-height: 20px; }
.nav-neu:hover { color: var(--side-ink) !important; background: rgba(255,255,255,.06); }
.nav-neu .n { font-size: 14px; color: var(--leuchtrot); width: 16px; }
.nav-ds > summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; }
.nav-ds > summary::-webkit-details-marker { display: none; }
.nav-ds > summary::after { content: "+"; color: var(--side-muted); font-weight: 600; margin-right: 8px; }
.nav-ds[open] > summary::after { content: "–"; }
.nav-ds > summary h2 { margin-bottom: 6px; }

/* ---------- Start ---------- */
.hero.hero-kompakt { min-height: 0; padding: 64px 56px 52px; }
.hero-kompakt .hero-claim { font-size: clamp(40px, 5.2vw, 72px); }
.hero-acts { margin-top: 28px; }
.wand { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 36px 28px; margin: 0 0 56px; }
.nb-werk { display: block; text-decoration: none; color: inherit; background: none; border: 0; padding: 0; text-align: left; cursor: pointer; font: inherit; }
.nb-werk .nb-cover { transition: transform .18s; }
.nb-werk:hover .nb-cover { transform: translateY(-3px); }
.nb-werk:focus-visible { outline: none; box-shadow: none; }
.nb-werk:focus-visible .nb-cover { outline: 2px solid var(--focus-ring); outline-offset: 4px; }
.nb-cap { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-top: 12px; font: var(--text-small); color: var(--ink-muted); }
.nb-cap2 { font: var(--text-small); font-size: 12px; color: var(--ink-muted); margin-top: 2px; }

/* Cover: wie ein Post 1080 × 1350 – dunkel mit Doppel-Diagonale, hell mit rotem Punkt; Logo unten links */
.nb-cover { position: relative; display: flex; flex-direction: column; aspect-ratio: 4 / 5; overflow: hidden; padding: 9% 8% 8%; container-type: inline-size; }
.nb-cover.dunkel { background: var(--nachtblau); color: var(--weiss); box-shadow: inset 0 0 0 1px var(--linie); }
.nb-cover.hell { background: var(--galeriepapier); color: var(--nachtblau); box-shadow: inset 0 0 0 1px var(--linie); }
.nb-diag { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; }
.nb-diag .d1 { fill: var(--signalrot); }
.nb-diag .d2 { fill: var(--bordeaux); }
.nb-dot { position: absolute; right: 11%; top: 9%; width: 30%; aspect-ratio: 1; border-radius: var(--radius-full); background: var(--one-rot); z-index: 0; }
.nb-cover > *:not(.nb-diag):not(.nb-dot) { position: relative; z-index: 1; }
.nb-art { font: var(--text-eyebrow); letter-spacing: .16em; text-transform: uppercase; margin: 14% 0 0; font-size: max(10px, 4.6cqw); }
.nb-cover.dunkel .nb-art { color: var(--leuchtrot); }
.nb-cover.hell .nb-art { color: var(--one-rot); }
/* Schriftgröße passt sich dem längsten Wort an (--lw, Zeichen), damit kein Wort mitten durchbricht */
.nb-titel { --tb: 66cqw; font-weight: 600; line-height: .95; font-family: var(--font-sans); font-size: min(12cqw, calc(var(--tb) / (var(--lw, 10) * 0.6))); letter-spacing: -0.01em; margin: 4% 0 0; max-width: var(--tb); overflow-wrap: normal; }
.nb-cover.hell .nb-titel { --tb: 82cqw; margin-top: 30%; }
.nb-cover.dunkel .nb-titel .p { color: var(--leuchtrot); }
.nb-cover.hell .nb-titel .p { color: var(--signalrot); }
.nb-text { font: 400 5cqw/1.45 var(--font-sans); margin: 6% 0 0; max-width: 60%; opacity: .86; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.nb-cover.hell .nb-text { max-width: 80%; color: #3c4756; opacity: 1; }
.nb-logo { width: 26%; margin-top: auto; display: block; }
.nb-cover.leer { background: transparent; border: 1px dashed var(--ink-muted); color: var(--ink-muted); align-items: flex-start; justify-content: flex-end; box-shadow: none; }
.nb-cover.leer b { font: 300 64px/1 var(--font-sans); color: var(--rot-text); margin-bottom: auto; }
.nb-cover.leer > span { font: var(--text-headline-s); font-size: 20px; color: var(--ink); }
.nb-cover.leer small { font: var(--text-small); margin-top: 6px; max-width: 90%; }
.nb-leer:hover .nb-cover.leer { border-color: var(--ink); border-style: solid; }

.start-spalten { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; margin-bottom: 48px; }
.liste { list-style: none; margin: 0 0 12px; padding: 0; border-top: 1px solid var(--linie); }
.liste li { display: flex; align-items: center; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--linie); }
.liste li > a, .liste li > div { flex: 1; min-width: 0; text-decoration: none; display: block; }
.liste b { display: block; font: var(--text-label); font-size: 15px; overflow: hidden; text-overflow: ellipsis; }
.liste b p { margin: 0; }
.liste span { display: block; font: var(--text-small); color: var(--ink-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.liste a:hover b { color: var(--rot-text); }
.liste time { font: var(--text-small); color: var(--ink-muted); white-space: nowrap; flex: none; }
.liste.archiv b { font-weight: 400; }

/* ---------- Notizbuch ---------- */
.nb-kopf { position: relative; overflow: hidden; padding: 64px 56px 48px; min-height: 340px; display: flex; align-items: flex-end; }
.nb-kopf.dunkel { background: var(--nachtblau); color: var(--weiss); }
.nb-kopf.hell { background: var(--galeriepapier); color: var(--nachtblau); border-bottom: 1px solid var(--linie); }
.nb-kopf .nb-diag { left: auto; width: min(52%, 560px); }
.nb-kopf .nb-dot { width: 150px; right: 9%; top: 48px; }
.nb-kopf-in { position: relative; z-index: 1; max-width: min(720px, 64%); }
.nb-kopf.dunkel .eyebrow { color: var(--leuchtrot); }
.nb-kopf.hell .eyebrow { color: var(--one-rot); }
.nb-kopf-titel { font: var(--text-headline-xl); font-size: min(clamp(40px, 5vw, 72px), calc(min(720px, (100vw - 280px) * .6) / (var(--lw, 10) * 0.6))); letter-spacing: -0.01em; margin: 0; }
.nb-kopf.dunkel .nb-kopf-titel .p { color: var(--leuchtrot); }
.nb-kopf.hell .nb-kopf-titel .p { color: var(--signalrot); }
.nb-kopf-text { font: var(--text-body-l); margin: 16px 0 0; max-width: 60ch; }
.nb-kopf.dunkel .nb-kopf-text { color: #d6dde6; }
.nb-kopf.hell .nb-kopf-text { color: #3c4756; }
.nb-kopf-meta { display: flex; flex-wrap: wrap; gap: 6px 18px; align-items: center; margin: 20px 0 24px; font: var(--text-small); }
.nb-kopf.dunkel .nb-kopf-meta { color: #b7c0cc; }
.nb-kopf.hell .nb-kopf-meta { color: #5b6573; }
.nb-kopf.dunkel .status { border-color: var(--weiss); color: var(--weiss); }
.nb-kopf.dunkel .status-ok { background: var(--weiss); color: var(--nachtblau); }
.nb-kopf.hell .status { border-color: var(--nachtblau); color: var(--nachtblau); }
.nb-kopf.hell .status-ok { background: var(--nachtblau); color: var(--weiss); }
.nb-kopf.dunkel .btn.ghost { color: var(--weiss); border-color: var(--weiss); }
.nb-kopf.dunkel .btn.ghost:hover { background: rgba(255,255,255,.08); }
.nb-kopf.hell .btn.ghost { color: var(--nachtblau); border-color: var(--nachtblau); }
.nb-kopf.hell .btn.ghost:hover { background: rgba(32,42,54,.06); }
.card { display: flex; flex-direction: column; }
.card .card-fuss { display: flex; gap: 10px; align-items: center; margin-top: auto; padding-top: 14px; }
.card .card-fuss em { font-style: normal; font: var(--text-small); font-size: 12px; color: var(--rot-text); }
.card .card-fuss:empty { display: none; }
.card .card-fuss .status { display: inline-block; margin: 0; font: var(--text-label); font-size: 11px; line-height: 16px; letter-spacing: .08em; }
.card .card-fuss .status-ok { color: var(--surface); }
.card .card-fuss .status-soft { color: var(--ink); }
.card .card-fuss .status-open { color: var(--ink-muted); }
.leer-flaeche { border: 1px dashed var(--ink-muted); padding: 32px; margin: 0 0 40px; max-width: 760px; }
.leer-flaeche h2 { font: var(--text-headline-m); font-size: 26px; margin: 0 0 8px; }
.leer-flaeche h2 .p { color: var(--punkt); }
.leer-flaeche p { color: var(--ink-muted); margin: 0 0 16px; }

.medien { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 16px; margin-bottom: 48px; }
.medium { background: var(--surface-raised); border: 1px solid var(--linie); display: flex; flex-direction: column; }
.medium-bild { display: flex; align-items: center; justify-content: center; height: 120px; background: var(--surface); border: 0; padding: 8px; cursor: zoom-in; text-decoration: none; }
.medium-bild img { max-height: 100%; max-width: 100%; object-fit: contain; }
.medium-bild.pdf { cursor: pointer; font: var(--text-headline-s); color: var(--rot-text); }
.medium-info { padding: 10px 12px; display: grid; gap: 2px; }
.medium-info b { font: var(--text-label); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.medium-info > span { font: var(--text-small); font-size: 12px; color: var(--ink-muted); }
.medium-acts { display: flex; gap: 6px; margin-top: 6px; }

/* ---------- Seite ---------- */
.brotkrumen { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: -24px 0 28px; font: var(--text-small); color: var(--ink-muted); max-width: 1036px; }
.brotkrumen a { color: var(--ink-muted); text-decoration: none; }
.brotkrumen a:hover { color: var(--ink); }
.brotkrumen > span:not(.bk-acts)::before { content: "›"; margin-right: 10px; }
.bk-acts { margin-left: auto; display: flex; gap: 8px; }
.bk-acts .btn { color: var(--ink); }
.seiten-meta { display: flex; flex-wrap: wrap; gap: 6px 16px; align-items: center; margin: 16px 0 0; font: var(--text-small); color: var(--ink-muted); }

/* Aufgaben */
.md ul.tasks { list-style: none; padding-left: 0; }
.md li.task { position: relative; padding-left: 30px; }
.md li.task > input[type="checkbox"], .md li.task > p > input[type="checkbox"] { position: absolute; left: 0; top: 4px; margin: 0; width: 18px; height: 18px; accent-color: var(--nachtblau); cursor: pointer; }
[data-theme="dark"] .md li.task > input[type="checkbox"] { accent-color: var(--leuchtrot); }
.md li.task > input:disabled { cursor: default; }
.md li.task.done { color: var(--ink-muted); }
.md li.task.done > :not(input):not(ul):not(ol) { text-decoration: line-through; text-decoration-color: var(--ink-muted); }
.faellig { display: inline-block; font: var(--text-label); font-size: 12px; line-height: 18px; padding: 0 6px; border: 1px solid var(--ink-muted); color: var(--ink-muted); white-space: nowrap; text-decoration: none; }
.faellig.bald { border-color: var(--ink); color: var(--ink); }
.faellig.ueber { background: var(--rot-flaeche); border-color: var(--rot-flaeche); color: var(--on-rot); }
.person { font: var(--text-label); font-size: 13px; color: var(--rot-text); white-space: nowrap; }

/* Planung: Rechnung, Zeitplan, SWOT, Balken */
.md table.rechnung td.num, .md table.rechnung th.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.md table.rechnung td:first-child { font-weight: 400; }
.md table.rechnung tr.r-summe td { font-weight: 600; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--linie); background: var(--surface); }
.md table.rechnung tr.r-gesamt td { font-weight: 600; font-size: 15px; border-top: 3px double var(--ink); background: var(--surface); }
.md table.rechnung tr:last-child td { border-bottom: 0; }

.zeitplan { list-style: none; padding: 0 !important; margin: 20px 0 24px; position: relative; }
.zeitplan li { display: grid; grid-template-columns: 120px 24px minmax(0, 1fr); gap: 0 12px; margin: 0 !important; padding: 0 0 22px; position: relative; }
.zeitplan li::marker { content: none; }
.zeitplan li::before { content: ""; position: absolute; left: 143px; top: 14px; bottom: -6px; width: 2px; background: var(--linie); }
.zeitplan li:last-child::before { display: none; }
.zp-wann { font: var(--text-label); font-size: 13px; color: var(--rot-text); text-align: right; padding-top: 2px; }
.zp-punkt { width: 14px; height: 14px; border-radius: 50%; border: 2px solid var(--ink); background: var(--surface); margin: 4px auto 0; position: relative; z-index: 1; }
.zp-ok .zp-punkt { background: var(--ink); }
.zp-new .zp-punkt { background: var(--rot-flaeche); border-color: var(--rot-flaeche); }
.zp-open .zp-punkt { border-style: dashed; border-color: var(--ink-muted); }
.zp-was b { display: block; font: var(--text-label); font-size: 16px; line-height: 22px; }
.zp-was > span:not(.status) { display: block; font: var(--text-small); color: var(--ink-muted); margin-top: 2px; }
.zp-was .status { margin-top: 6px; }

.swot { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--linie); background: var(--surface-raised); margin: 20px 0 24px; }
.swot > div { padding: 18px 20px; border-bottom: 1px solid var(--linie); }
.swot > div:nth-child(odd) { border-right: 1px solid var(--linie); }
.swot > div:nth-child(n+3) { border-bottom: 0; }
.swot .swot-titel { font: var(--text-eyebrow); letter-spacing: .16em; text-transform: uppercase; margin: 0 0 10px; color: var(--ink); }
.swot .sw-w .swot-titel, .swot .sw-t .swot-titel { color: var(--rot-text); }
.swot ul { margin: 0; padding-left: 18px; }
.swot li { font-size: 15px !important; line-height: 22px !important; margin-bottom: 6px !important; }

.balken { display: grid; gap: 10px; margin: 20px 0 24px; padding: 20px; background: var(--surface-raised); border: 1px solid var(--linie); }
.bk-zeile { display: grid; grid-template-columns: minmax(80px, 160px) minmax(0, 1fr) auto; gap: 14px; align-items: center; }
.bk-label { font: var(--text-label); font-size: 13px; }
.bk-spur { height: 18px; background: var(--surface); position: relative; }
.bk-spur i { position: absolute; left: 0; top: 0; bottom: 0; background: var(--ink); }
.bk-spur i.hl { background: var(--rot-flaeche); }
.bk-wert { font: var(--text-label); font-size: 13px; font-variant-numeric: tabular-nums; min-width: 84px; text-align: right; }

.md a.datei { display: inline-flex; align-items: center; gap: 8px; font: var(--text-label); text-decoration: none; border: 1px solid var(--ink); color: var(--ink); padding: 8px 12px; }
.md a.datei::before { content: "PDF"; font-size: 10px; letter-spacing: .1em; background: var(--rot-flaeche); color: var(--on-rot); padding: 2px 5px; }

.callout-entscheidung { border-left-color: var(--nachtblau); }
[data-theme="dark"] .callout-entscheidung { border-left-color: var(--galeriepapier); }
.callout-entscheidung .callout-t { color: var(--ink); }
.callout-entscheidung .callout-t::before { content: ""; display: inline-block; width: 8px; height: 8px; background: var(--ink); margin-right: 8px; vertical-align: 1px; }
.callout-frage { border-left-color: var(--ink-muted); border-left-style: dashed; }
.callout-frage .callout-t { color: var(--rot-text); }
.callout-idee { border-left-color: var(--bordeaux); background: var(--surface); }
[data-theme="dark"] .callout-idee { border-left-color: var(--leuchtrot); }
.callout-idee .callout-t { color: var(--ink-muted); }

/* ---------- Editor ---------- */
body.im-editor .site-foot { display: none; }
.editor { padding: 32px 40px 24px; display: flex; flex-direction: column; min-height: 100vh; }
.ed-kopf { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; margin-bottom: 18px; flex-wrap: wrap; }
.ed-kopf-l { flex: 1; min-width: 260px; }
.ed-kopf-l .eyebrow { margin-bottom: 6px; }
input.ed-titel { width: 100%; font: var(--text-headline-l); font-size: 40px; letter-spacing: -0.01em; background: transparent; border: 0; border-bottom: 2px solid var(--linie); padding: 4px 0 8px; color: var(--ink); border-radius: 0; }
input.ed-titel:focus { outline: none; border-color: transparent; border-bottom-color: var(--signalrot); }
input.ed-titel::placeholder { color: var(--ink-muted); opacity: .6; }
.ed-kopf-r { display: flex; gap: 10px; }
.ed-hinweis { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; background: var(--surface-raised); border: 1px solid var(--linie); border-left: 4px solid var(--signalrot); padding: 10px 14px; margin-bottom: 16px; font: var(--text-small); }
.ed-hinweis span { flex: 1; min-width: 200px; }
.ed-meta { display: grid; grid-template-columns: 80px minmax(160px, 220px) 160px minmax(0, 1fr); gap: 12px; margin-bottom: 14px; }
.ed-meta input, .ed-meta select { width: 100%; }
.ed-leiste { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding: 8px; background: var(--surface-raised); border: 1px solid var(--linie); border-bottom: 0; position: sticky; top: 0; z-index: 5; }
.ed-gruppe { display: flex; gap: 2px; align-items: center; padding-right: 8px; border-right: 1px solid var(--linie); }
.ed-gruppe:last-child, .ed-gruppe.ed-rechts { border-right: 0; }
.ed-rechts { margin-left: auto; }
.ed-gruppe > button { background: transparent; border: 1px solid transparent; padding: 6px 7px; cursor: pointer; font: var(--text-label); font-size: 13px; color: var(--ink); border-radius: var(--radius-s); min-width: 32px; }
.ed-gruppe > button:hover { border-color: var(--linie); background: var(--surface); }
.ed-gruppe select { padding: 6px 10px; font-size: 13px; max-width: 170px; }
.ed-leiste .seg button { padding: 6px 10px; font-size: 12px; }
.ed-flaeche { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); border: 1px solid var(--linie); flex: 1; min-height: 560px; }
.ed-flaeche.schreiben { grid-template-columns: minmax(0, 1fr); }
.ed-flaeche.schreiben .ed-vorschau { display: none; }
.ed-flaeche.vorschau { grid-template-columns: minmax(0, 1fr); }
.ed-flaeche.vorschau textarea { display: none; }
.ed-flaeche textarea { border: 0; border-right: 1px solid var(--linie); border-radius: 0; resize: none; min-height: 560px; height: 100%; font: 14px/22px ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; padding: 20px 22px; background: var(--surface-raised); tab-size: 2; }
.ed-flaeche.schreiben textarea { border-right: 0; padding-left: max(22px, calc((100% - 760px) / 2)); padding-right: max(22px, calc((100% - 760px) / 2)); }
.ed-flaeche textarea:focus { outline: none; box-shadow: inset 0 0 0 2px var(--focus-ring); }
.ed-flaeche textarea.drop { box-shadow: inset 0 0 0 3px var(--signalrot); }
.ed-vorschau { padding: 28px 32px 48px; background: var(--surface); overflow: auto; max-height: calc(100vh - 120px); position: sticky; top: 52px; }
.ed-flaeche.vorschau .ed-vorschau { max-height: none; position: static; padding-left: max(32px, calc((100% - 760px) / 2)); }
.ed-vorschau .md { max-width: 760px; }
.ed-vt { font-size: 36px !important; }
.ed-vabstand { height: 28px; }
.ed-fuss { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; align-items: center; padding: 10px 2px 0; font: var(--text-small); color: var(--ink-muted); }
.ed-fuss-r { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.ed-tipp { margin-left: 8px; }

/* ---------- Dialoge ---------- */
.dlg { overflow: auto; border: 0; padding: 32px; width: min(520px, calc(100vw - 32px)); max-height: calc(100vh - 48px); background: var(--surface-raised); color: var(--ink); border-top: 4px solid var(--signalrot); box-shadow: 0 24px 64px rgba(10, 8, 9, .35); }
.dlg::backdrop { background: rgba(10, 8, 9, .55); }
.dlg.dlg-breit { width: min(880px, calc(100vw - 32px)); }
.dlg h2 { font: var(--text-headline-m); font-size: 28px; margin: 0 0 12px; padding-right: 32px; }
.dlg h2 .p { color: var(--punkt); }
.dlg p { margin: 0 0 12px; }
.dlg-x { position: absolute; top: 12px; right: 12px; width: 36px; height: 36px; border: 0; background: transparent; font-size: 24px; cursor: pointer; color: var(--ink-muted); }
.dlg-x:hover { color: var(--ink); }
.dlg-acts { display: flex; justify-content: flex-end; gap: 10px; flex-wrap: wrap; margin-top: 24px; }
.dlg-acts .links { margin-right: auto; }
.dlg .field { margin-bottom: 14px; }
.dlg .field input, .dlg .field select, .dlg .field textarea { width: 100%; }
.dlg textarea { resize: vertical; font: var(--text-body); }
.nbd { display: grid; grid-template-columns: minmax(0, 1fr) 220px; gap: 28px; align-items: start; }
.nbd-zeile { display: grid; grid-template-columns: 1fr 120px; gap: 12px; }
.nbd-cover { border: 0; padding: 0; margin: 0 0 4px; display: flex; flex-wrap: wrap; gap: 8px 20px; }
.nbd-cover legend { margin-bottom: 8px; }
.dlg .nbd-cover label { display: flex; gap: 8px; align-items: center; font: var(--text-body); font-size: 14px; text-transform: none; letter-spacing: 0; color: var(--ink); cursor: pointer; }
.dlg .nbd-cover input { width: 18px !important; height: 18px; margin: 0; accent-color: var(--signalrot); }
.nbd-vorschau { position: sticky; top: 0; }
.nbd .hint { margin: 6px 0 0; }
.vw-liste { list-style: none; margin: 12px 0 0; padding: 0; max-height: 50vh; overflow: auto; border-top: 1px solid var(--linie); }
.vw-liste button { display: flex; justify-content: space-between; gap: 12px; width: 100%; text-align: left; background: transparent; border: 0; border-bottom: 1px solid var(--linie); padding: 10px 6px; cursor: pointer; }
.vw-liste button:hover, .vw-liste button:focus-visible { background: var(--surface); }
.vw-liste b { font: var(--text-label); }
.vw-liste span { font: var(--text-small); color: var(--ink-muted); }
.vs { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 20px; min-height: 360px; }
.vs-liste { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--linie); max-height: 60vh; overflow: auto; }
.vs-liste button { display: block; width: 100%; text-align: left; background: transparent; border: 0; border-bottom: 1px solid var(--linie); padding: 10px 8px; cursor: pointer; border-left: 3px solid transparent; }
.vs-liste button[aria-current="true"] { border-left-color: var(--signalrot); background: var(--surface); }
.vs-liste b { display: block; font: var(--text-label); font-size: 13px; }
.vs-liste span { font: var(--text-small); font-size: 12px; color: var(--ink-muted); }
.vs-detail { min-width: 0; }
.vs-inhalt { margin-top: 14px; max-height: 50vh; overflow: auto; border: 1px solid var(--linie); padding: 14px; background: var(--surface); }
.vs-inhalt .md h2 { font-size: 22px; margin-top: 24px; }
.diff { font: 12px/19px ui-monospace, Menlo, Consolas, monospace; }
.df { white-space: pre-wrap; word-break: break-word; padding: 0 6px; display: grid; grid-template-columns: 14px 1fr; }
.df span { color: var(--ink-muted); }
.df-neu { background: rgba(32, 42, 54, .08); }
.df-neu span { color: var(--ink); font-weight: 600; }
.df-alt { background: rgba(228, 29, 60, .09); text-decoration: line-through; text-decoration-color: rgba(167, 36, 44, .5); }
.df-alt span { color: var(--rot-text); text-decoration: none; }
[data-theme="dark"] .df-neu { background: rgba(255, 255, 255, .08); }
[data-theme="dark"] .df-alt { background: rgba(255, 90, 110, .14); }
.df-skip { color: var(--ink-muted); padding: 4px 6px; font-style: italic; }

/* ---------- Offene Punkte ---------- */
.offen-stats { margin: 0 0 32px; }
.offen-stats .warn { border-top-color: var(--signalrot); }
.offen-stats .warn b { color: var(--rot-text); }
.offen-filter { display: grid; gap: 4px; margin-bottom: 28px; }
.offen-filter .chips { margin-bottom: 6px; align-items: center; }
.chip-check { display: inline-flex; align-items: center; gap: 8px; font: var(--text-label); font-size: 13px; margin-left: 8px; cursor: pointer; }
.chip-check input { accent-color: var(--nachtblau); width: 16px; height: 16px; }
.of-block { margin-bottom: 40px; max-width: 900px; }
.of-h { font: var(--text-headline-m); font-size: 26px; margin: 0 0 12px; }
.of-h a { text-decoration: none; }
.of-h a:hover { color: var(--rot-text); }
.of-h .p { color: var(--punkt); }
.of-seite { font: var(--text-label); font-size: 13px; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-muted); margin: 20px 0 6px; }
.of-seite a { text-decoration: none; }
.of-seite a:hover { color: var(--ink); }
.of-liste { list-style: none; margin: 0; padding: 0; background: var(--surface-raised); border: 1px solid var(--linie); }
.of-liste li { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 12px; align-items: start; padding: 12px 16px; border-bottom: 1px solid var(--linie); }
.of-liste li:last-child { border-bottom: 0; }
.of-liste li.of-aufgabe { grid-template-columns: 22px minmax(0, 1fr); }
.of-liste input[type="checkbox"] { width: 18px; height: 18px; margin: 3px 0 0; accent-color: var(--nachtblau); cursor: pointer; }
[data-theme="dark"] .of-liste input[type="checkbox"] { accent-color: var(--leuchtrot); }
.of-art { font: var(--text-label); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-muted); border: 1px dashed var(--ink-muted); padding: 1px 6px; justify-self: start; margin-top: 2px; }
.of-frage .of-art { color: var(--rot-text); border-color: var(--rot-text); }
.of-text { font-size: 15px; line-height: 23px; min-width: 0; }
.of-text p { margin: 0; }
.of-wo { display: block; font: var(--text-small); font-size: 12px; color: var(--ink-muted); text-decoration: none; margin-top: 2px; }
.of-wo:hover { color: var(--rot-text); }
.of-liste li.done .of-text { color: var(--ink-muted); text-decoration: line-through; }

/* ---------- Einstellungen ---------- */
.einst { max-width: 860px; }
.einst-form { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 18px; }
.einst-form .field input { width: 100%; }
table.kurz { border-collapse: collapse; width: 100%; font-size: 14px; }
table.kurz td { padding: 10px 14px; border-bottom: 1px solid var(--linie); vertical-align: top; }
table.kurz tr:last-child td { border-bottom: 0; }
table.kurz td:first-child { font-weight: 600; white-space: nowrap; width: 1%; }
.einst .liste li { flex-wrap: wrap; }

/* ---------- Druck und PDF ---------- */
body.druckmodus .sidebar, body.druckmodus .topbar, body.druckmodus .site-foot { display: none; }
body.druckmodus main { margin-left: 0; background: var(--linie); }
body.druckmodus .dr-cover.hell { box-shadow: inset 0 0 0 1px var(--linie); }
.druck-leiste { position: sticky; top: 0; z-index: 20; display: flex; gap: 16px; align-items: center; flex-wrap: wrap; padding: 12px 24px; background: var(--surface-raised); border-bottom: 1px solid var(--linie); }
.druck-opt { display: flex; gap: 16px; flex-wrap: wrap; flex: 1; font: var(--text-small); }
.druck-opt label { display: flex; gap: 6px; align-items: center; cursor: pointer; }
.druck-opt input { accent-color: var(--nachtblau); }
.druck { max-width: 210mm; margin: 32px auto 64px; }
.dr-cover { position: relative; overflow: hidden; aspect-ratio: 210 / 297; display: flex; flex-direction: column; padding: 14% 11% 10%; margin-bottom: 32px; }
.dr-cover.dunkel { background: var(--nachtblau); color: var(--weiss); }
.dr-cover.hell { background: var(--galeriepapier); color: var(--nachtblau); }
.dr-cover .nb-dot { width: 26%; }
.dr-cover-in { position: relative; z-index: 1; margin-top: auto; max-width: 66%; }
.dr-cover.dunkel .eyebrow { color: var(--leuchtrot); }
.dr-cover.hell .eyebrow { color: var(--one-rot); }
.dr-cover { container-type: inline-size; }
.dr-cover h1 { font-weight: 600; line-height: .95; font-family: var(--font-sans); font-size: min(10cqw, calc(60cqw / (var(--lw, 10) * 0.6))); letter-spacing: -0.01em; margin: 0; }
.dr-cover.dunkel h1 .p { color: var(--leuchtrot); }
.dr-cover.hell h1 .p { color: var(--signalrot); }
.dr-text { font: var(--text-body-l); margin: 20px 0 0; opacity: .88; }
.dr-stand { font: var(--text-small); margin: 32px 0 0; opacity: .8; }
.dr-logo { position: relative; z-index: 1; width: 30%; margin-top: 18%; }
.dr-inhalt, .dr-seite { background: var(--surface-raised); padding: 18mm 18mm 20mm; margin-bottom: 32px; border: 1px solid var(--linie); }
.dr-inhalt h2 { font: var(--text-headline-l); margin: 0 0 24px; }
.dr-inhalt h2 .p { color: var(--punkt); }
.dr-inhalt ol { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--linie); }
.dr-inhalt li { display: grid; grid-template-columns: 40px 1fr auto; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--linie); font-size: 15px; }
.dr-nr { color: var(--rot-text); font-weight: 600; font-variant-numeric: tabular-nums; }
.dr-gr { color: var(--ink-muted); font-size: 13px; }
.dr-seite .page-title { font-size: 40px; margin-bottom: 8px; }
.dr-seite .lead { margin-bottom: 28px; }
.dr-seite .md { max-width: none; }
.dr-seite.ohne-offen .tbd, .dr-seite.ohne-offen .callout-frage { display: none; }

/* Seitenränder für alle Seiten gleich (Chrome setzt sonst alle Seiten in der Breite der ersten) */
@page {
  size: A4; margin: 18mm 16mm 20mm;
  @bottom-left { content: "Art.1 Gallery"; font: 400 8pt Poppins, Arial, sans-serif; color: #5b6573; }
  @bottom-right { content: counter(page); font: 600 8pt Poppins, Arial, sans-serif; color: #5b6573; }
}
@page :first { @bottom-left { content: none; } @bottom-right { content: none; } }
@media print {
  html, body { background: #fff !important; }
  [data-theme="dark"] { --surface: #f7f4ef; --surface-raised: #ffffff; --ink: #202a36; --ink-muted: #5b6573; --rot-text: #a7242c; --punkt: #e41d3c; --eins: #a7242c; --linie: #e2dcd2; }
  * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .druck-leiste, .bk-acts, .brotkrumen, .ed-leiste { display: none !important; }
  .druck { max-width: none; margin: 0; }
  body.druckmodus main { background: none; }
  /* Deckblatt wie ein Werk im Passepartout: füllt den Satzspiegel der ersten Seite, ringsum bleibt Weiß */
  .dr-cover { margin: 0 !important; width: auto; height: 258mm; aspect-ratio: auto; break-after: page; padding: 26mm 18mm 18mm; }
  .dr-cover.hell { box-shadow: inset 0 0 0 0.3mm #e2dcd2 !important; }
  .dr-inhalt, .dr-seite { border: 0; padding: 0; margin: 0; background: none; break-before: page; }
  .dr-cover + .dr-inhalt, .druck > .dr-seite:first-child, .druck > .dr-inhalt:first-child { break-before: auto; }
  .md h2, .md h3 { break-after: avoid; }
  .md table, .callout, .zeitplan li, .swot, .balken, .stats, .bild, .swatch { break-inside: avoid; }
  .md a { color: inherit; text-decoration: none; }
  .page { max-width: none; }
  .doc-layout { display: block; }
}

/* ---------- Responsiv ---------- */
@media (max-width: 1180px) {
  .ed-meta { grid-template-columns: 80px 1fr 160px; }
  .ed-meta .ed-einl { grid-column: 1 / -1; }
}
@media (max-width: 980px) {
  .ed-flaeche.geteilt { grid-template-columns: minmax(0, 1fr); }
  .ed-flaeche.geteilt .ed-vorschau { display: none; }
  .start-spalten { grid-template-columns: 1fr; }
  .nbd { grid-template-columns: 1fr; }
  .nbd-vorschau { display: none; }
  .vs { grid-template-columns: 1fr; }
  .vs-liste { max-height: 180px; }
}
@media (max-width: 860px) {
  .hero.hero-kompakt { padding: 36px 16px 32px; }
  .wand { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 14px; }
  .nb-kopf { padding: 40px 16px 32px; min-height: 0; }
  .nb-kopf .nb-diag { width: 40%; opacity: .9; }
  .nb-kopf-in { max-width: 72%; }
  .nb-kopf-titel { font-size: min(40px, calc(70vw / (var(--lw, 10) * 0.6))); }
  .nb-kopf.hell .nb-dot { width: 90px; top: 24px; right: 16px; }
  .nb-kopf.hell .nb-kopf-in { max-width: 100%; padding-top: 60px; }
  .editor { padding: 20px 12px; }
  .ed-titel { font-size: 28px; }
  .ed-meta { grid-template-columns: 70px 1fr; }
  .ed-meta .field:nth-child(3) { grid-column: 1 / -1; }
  .ed-tipp { display: none; }
  .ed-gruppe { border-right: 0; padding-right: 0; }
  .ed-leiste { position: static; }
  .ed-rechts { margin-left: 0; }
  .ed-flaeche textarea { min-height: 60vh; padding: 14px; }
  .brotkrumen { margin-top: -8px; }
  .einst-form { grid-template-columns: 1fr; }
  .of-liste li { grid-template-columns: 1fr; }
  .of-liste li.of-aufgabe { grid-template-columns: 22px minmax(0, 1fr); }
  .zeitplan li { grid-template-columns: 76px 20px minmax(0, 1fr); gap: 0 8px; }
  .zeitplan li::before { left: 93px; }
  .swot { grid-template-columns: 1fr; }
  .swot > div { border-right: 0 !important; border-bottom: 1px solid var(--linie) !important; }
  .bk-zeile { grid-template-columns: 70px minmax(0, 1fr) auto; }
  .dlg { padding: 24px 18px; }
  .tor { padding: 40px 24px; align-items: flex-start; }
  .tor-diag { opacity: .35; }
  .druck-leiste { padding: 10px 12px; }
  .dr-inhalt, .dr-seite { padding: 24px 16px; }
}
@media (max-width: 420px) {
  .wand { grid-template-columns: 1fr 1fr; }
  .nb-cap { flex-direction: column; align-items: flex-start; gap: 4px; }
}
@media (prefers-reduced-motion: reduce) {
  .nb-werk .nb-cover, .card, .toast { transition: none; }
}

/* Passwortfelder wie Textfelder */
input[type="password"] { background: var(--surface); border: 1px solid var(--linie); border-radius: var(--radius-s); padding: 10px 12px; color: var(--ink); min-width: 0; }
input[type="password"]:focus { border-color: var(--ink); outline: none; }

/* ---------- Design System als Seiten ---------- */
.ed-werkzeug { border-left-color: var(--nachtblau); }
[data-theme="dark"] .ed-werkzeug { border-left-color: var(--galeriepapier); }
.ed-werkzeug code { font-size: 12px; }
.ds-notizen { margin-top: 40px; padding-top: 28px; border-top: 1px solid var(--linie); }
.ds-notizen .md { max-width: 760px; }

/* ---------- Baustein Ablauf ---------- */
.doc-layout.ohne-toc .md .ablauf { margin-right: -276px; }
@media (max-width: 1180px) { .doc-layout.ohne-toc .md .ablauf { margin-right: 0; } }
.ablauf { margin: 20px 0 28px; overflow-x: auto; padding: 4px 0 8px; }
.ablauf svg { display: block; max-width: none; height: auto; font-family: var(--font-sans); }
.ablauf-auto .pf-laengs, .ablauf-auto.eng .pf-quer { display: none; }
.ablauf-auto.eng .pf-laengs { display: block; }
.pf-k rect { fill: var(--surface-raised); stroke: var(--linie); stroke-width: 1; }
.pf-eb { font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; fill: var(--rot-text); }
.pf-titel { font-size: 14px; font-weight: 600; fill: var(--ink); }
.pf-text { font-size: 12px; fill: var(--ink-muted); }
.pf-start rect { fill: var(--nachtblau); stroke: var(--nachtblau); }
[data-theme="dark"] .pf-start rect { fill: #161d26; stroke: var(--weiss); }
.pf-start .pf-titel { fill: var(--weiss); }
.pf-start .pf-text { fill: #c9d1db; }
.pf-start .pf-eb { fill: var(--leuchtrot); }
.pf-ende rect { stroke: var(--ink); stroke-width: 1.5; }
.pf-dot { fill: var(--punkt); }
.pf-frage rect { stroke: var(--ink); }
.pf-frage rect.pf-akzent { fill: var(--rot-flaeche); stroke: none; }
.pf-kante { fill: none; stroke: var(--ink-muted); stroke-width: 1.5; }
.pf-zurueck { stroke-dasharray: 5 4; }
.pf-pfeil { fill: var(--ink-muted); }
.pf-label rect { fill: var(--surface); stroke: var(--ink-muted); stroke-width: 1; }
.pf-label text { font-size: 11px; font-weight: 600; fill: var(--ink); text-anchor: middle; }
@media print { .ablauf { overflow: visible; } .ablauf svg { max-width: 100%; } }

/* ---------- Direkt bearbeiten (WYSIWYG) ---------- */
.wy-schalter { display: inline-flex; align-items: center; gap: 8px; background: transparent; border: 1px solid var(--linie); border-radius: var(--radius-s); padding: 6px 10px; font: var(--text-label); font-size: 12px; color: var(--ink); cursor: pointer; margin-right: 8px; }
.wy-schalter::before { content: ""; width: 26px; height: 14px; border-radius: 9999px; background: var(--linie); box-shadow: inset 0 0 0 1px var(--ink-muted); transition: background .15s; }
.wy-schalter[aria-pressed="true"] { border-color: var(--ink); }
.wy-schalter[aria-pressed="true"]::before { background: var(--rot-flaeche); box-shadow: inset 14px 0 0 0 var(--rot-flaeche), inset -12px 0 0 2px var(--weiss); }
.wy-schalter[aria-pressed="false"]::before { box-shadow: inset 12px 0 0 2px var(--weiss), inset 0 0 0 1px var(--ink-muted); }
.ed-flaeche.wy-an .ed-vorschau { background: var(--surface-raised); }
.ed-flaeche.wy-an.vorschau .ed-vorschau { box-shadow: inset 0 3px 0 var(--rot-flaeche); }
.wy .wy-space { display: none; }
.wy .wy-block { position: relative; outline: none; }
.wy .wy-block > :first-child { margin-top: 0; }
.wy .wy-block > h2 { margin-top: 44px; }
.wy .wy-block:first-child > h2 { margin-top: 0; }
.wy .wy-block[contenteditable="true"] { cursor: text; caret-color: var(--punkt); }
.wy .wy-block[contenteditable="true"]::before { content: ""; position: absolute; left: -16px; top: 2px; bottom: 2px; width: 3px; background: transparent; transition: background .12s; }
.wy .wy-block[contenteditable="true"]:hover::before { background: var(--linie); }
.wy .wy-block[contenteditable="true"]:focus::before, .wy .wy-block[contenteditable="true"]:focus-within::before { background: var(--rot-flaeche); }
.wy .wy-block.leer > p:first-child::before { content: "Hier weiterschreiben …"; color: var(--ink-muted); pointer-events: none; }
.wy .wy-block.leer > p:first-child { margin-bottom: 0; }
.wy .wy-block [data-md], .wy .wy-block .status, .wy .wy-block code.tok, .wy .wy-block .bild { cursor: default; user-select: all; }
.wy .wy-raster, .wy .wy-quelle-box { user-select: text; }
.wy .wy-fest { cursor: pointer; outline: 1px dashed transparent; outline-offset: 6px; }
.wy .wy-fest:hover { outline-color: var(--ink-muted); }
.wy .wy-offen { outline: 2px solid var(--ink); outline-offset: 6px; cursor: auto; }
.wy .wy-quelle { width: 100%; min-height: 120px; font: 13px/20px ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; background: var(--surface); border: 1px solid var(--linie); padding: 12px; resize: vertical; }
.wy .wy-quelle-acts { display: flex; gap: 8px; margin-top: 8px; flex-wrap: wrap; }
.wy .wy-hinweis { font: var(--text-small); color: var(--ink-muted); border-left: 3px solid var(--ink-muted); padding: 6px 12px; }
.wy .wy-block li.task > input[type="checkbox"] { cursor: pointer; }
.wy .tbd-wrap, .wy .status { border-radius: 0; }
@media (max-width: 860px) { .wy-schalter { margin-right: 0; } }
@media (max-width: 980px) {
  /* Auf schmalen Bildschirmen zeigt „Geteilt“ mit Direkt-bearbeiten die bearbeitbare Vorschau */
  .ed-flaeche.geteilt.wy-an textarea { display: none; }
  .ed-flaeche.geteilt.wy-an .ed-vorschau { display: block; max-height: none; position: static; }
}

/* ---------- Blöcke verschieben, kopieren, löschen ---------- */
.ed-flaeche.wy-an .ed-vorschau { padding-left: 68px; }
.wy .wy-zeile { position: relative; }
.wy .wy-griff { position: absolute; left: -54px; top: 0; display: flex; gap: 1px; opacity: 0; transition: opacity .12s; }
.wy .wy-zeile:hover > .wy-griff, .wy .wy-zeile:focus-within > .wy-griff { opacity: 1; }
.wy .wy-griff button { width: 24px; height: 26px; display: inline-flex; align-items: center; justify-content: center; background: transparent; border: 0; padding: 0; color: var(--ink-muted); cursor: pointer; border-radius: var(--radius-s); }
.wy .wy-griff button:hover, .wy .wy-griff button:focus-visible { background: var(--surface); color: var(--ink); }
.wy .wy-ziehen { cursor: grab; }
.wy .wy-ziehen:active { cursor: grabbing; }
.wy .wy-leiste { position: absolute; right: 0; top: -32px; z-index: 5; display: none; align-items: center; gap: 1px; background: var(--ink); color: var(--surface); padding: 3px; border-radius: var(--radius-s); box-shadow: 0 6px 18px rgba(10, 8, 9, .2); }
.wy .wy-zeile:hover > .wy-leiste, .wy .wy-zeile:focus-within > .wy-leiste { display: flex; }
.wy .wy-leiste button { background: transparent; border: 0; color: inherit; height: 24px; min-width: 26px; padding: 0 6px; display: inline-flex; align-items: center; justify-content: center; gap: 5px; font: var(--text-label); font-size: 11px; cursor: pointer; border-radius: var(--radius-s); }
.wy .wy-leiste button:hover, .wy .wy-leiste button:focus-visible { background: rgba(127, 127, 127, .28); }
.wy .wy-leiste button[data-aktion="weg"]:hover { background: var(--rot-flaeche); color: var(--on-rot); }
.wy .wy-art { font: var(--text-label); font-size: 10px; line-height: 24px; letter-spacing: .12em; text-transform: uppercase; opacity: .7; padding: 0 8px 0 6px; }
.wy .wy-fest { outline: 1px dashed transparent; outline-offset: 6px; }
.wy .wy-fest:hover, .wy .wy-fest:focus { outline-color: var(--ink-muted); }
.wy .wy-zeile.drop-vor { box-shadow: 0 -4px 0 -1px var(--rot-flaeche); }
.wy .wy-zeile.drop-nach { box-shadow: 0 4px 0 -1px var(--rot-flaeche); }
.wy .wy-zeile.wy-zieht { opacity: .35; }
.wy .wy-zeile.wy-markiert > .wy-block { animation: wy-blink .9s ease-out; }
@keyframes wy-blink { from { background: rgba(228, 29, 60, .12); } to { background: transparent; } }
.wy-meldung { position: sticky; bottom: 14px; z-index: 6; display: none; align-items: center; gap: 14px; width: max-content; max-width: 100%; margin: 20px auto 0; background: var(--ink); color: var(--surface); padding: 8px 8px 8px 14px; font: var(--text-label); font-size: 13px; box-shadow: 0 8px 24px rgba(10, 8, 9, .25); }
.wy-meldung.an { display: flex; }
.wy-meldung button { background: transparent; color: inherit; border: 1px solid currentColor; padding: 4px 10px; font: inherit; font-size: 12px; cursor: pointer; border-radius: var(--radius-s); }

/* Tabellen direkt bearbeiten */
.wy .wy-tab-leiste { position: absolute; left: 0; z-index: 6; display: flex; flex-wrap: wrap; gap: 1px; align-items: center; background: var(--surface-raised); border: 1px solid var(--ink); padding: 3px; box-shadow: 0 6px 18px rgba(10, 8, 9, .15); }
.wy .wy-tab-leiste[hidden] { display: none; }
.wy .wy-tab-leiste .wy-art { color: var(--ink-muted); opacity: 1; }
.wy .wy-tab-leiste button { background: transparent; border: 0; font: var(--text-label); font-size: 11px; padding: 4px 8px; cursor: pointer; color: var(--ink); display: inline-flex; align-items: center; border-radius: var(--radius-s); }
.wy .wy-tab-leiste button:hover:not(:disabled) { background: var(--surface); }
.wy .wy-tab-leiste button:disabled { opacity: .35; cursor: default; }
.wy .wy-block[contenteditable="true"] td:focus-within, .wy .wy-block[contenteditable="true"] th:focus-within { box-shadow: inset 0 0 0 2px var(--rot-flaeche); }

/* Bausteine als Tabelle bearbeiten, mit Vorschau */
.wy .wy-raster, .wy .wy-quelle-box { border: 1px solid var(--ink); background: var(--surface-raised); padding: 14px; cursor: auto; }
.wy .wy-raster-kopf { display: flex; flex-direction: column; gap: 2px; margin-bottom: 10px; }
.wy .wy-raster-kopf b { font: var(--text-label); font-size: 14px; }
.wy .wy-raster-kopf span { font: var(--text-small); color: var(--ink-muted); }
.wy .wy-raster-tab .table-wrap { margin: 0 0 10px; }
.wy .wy-raster-tab table { font-size: 13px; }
.wy .wy-raster-tab td { padding: 4px; vertical-align: middle; font-weight: 400 !important; }
.wy .wy-raster-tab th { padding: 6px 8px; }
.wy .wy-raster-tab input, .wy .wy-raster-tab select { width: 100%; min-width: 90px; padding: 6px 8px; font-size: 13px; }
.wy .wy-r-zug { width: 1%; white-space: nowrap; }
.wy .wy-r-zug button { background: transparent; border: 0; color: var(--ink-muted); cursor: pointer; padding: 4px; display: inline-flex; }
.wy .wy-r-zug button:hover:not(:disabled) { color: var(--ink); }
.wy .wy-r-zug button:disabled { opacity: .3; cursor: default; }
.wy .wy-quelle-acts .btn { gap: 6px; }
.wy .wy-sp { flex: 1; }
.wy .wy-vorschau { margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--linie); }
.wy .wy-vorschau-t { font: var(--text-eyebrow); letter-spacing: .16em; text-transform: uppercase; color: var(--ink-muted); margin: 0 0 8px; }
.wy .wy-vorschau .md { max-width: none; }

/* Baustein-Auswahl mit Vorschau */
.dlg.dlg-bausteine { width: min(1100px, calc(100vw - 32px)); }
.bw-kopf { display: grid; gap: 10px; margin-bottom: 14px; }
.bw-kopf input { width: 100%; }
.bw-kopf .chips { margin: 0; }
.bw { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 20px; }
.bw-raster { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; align-content: start; max-height: 58vh; overflow: auto; padding: 2px; }
.bw-karte { display: flex; flex-direction: column; text-align: left; background: var(--surface-raised); border: 1px solid var(--linie); padding: 0; cursor: pointer; color: var(--ink); font: inherit; }
.bw-karte:hover { border-color: var(--ink-muted); }
.bw-karte[aria-selected="true"] { border-color: var(--ink); box-shadow: inset 0 -3px 0 var(--rot-flaeche); }
.bw-mini { display: block; height: 100px; overflow: hidden; background: var(--surface); border-bottom: 1px solid var(--linie); pointer-events: none; }
.bw-mini-in { display: block; width: 300%; transform: scale(.3333); transform-origin: top left; padding: 28px; }
.bw-mini-in .md { max-width: none; }
.bw-mini-in .md > :first-child { margin-top: 0 !important; }
.bw-karte > b { font: var(--text-label); font-size: 13px; padding: 8px 10px 0; }
.bw-gruppe { font: var(--text-small); font-size: 11px; color: var(--ink-muted); padding: 0 10px 8px; }
.bw-detail { border-left: 1px solid var(--linie); padding-left: 20px; max-height: 58vh; overflow: auto; }
.bw-detail h3 { font: var(--text-headline-s); margin: 0 0 6px; }
.bw-detail h3 .p { color: var(--punkt); }
.bw-wann { font: var(--text-small); color: var(--ink-muted); margin: 0 0 12px; }
.bw-gross { border: 1px solid var(--linie); background: var(--surface); padding: 16px; overflow: auto; }
.bw-gross .md { max-width: none; }
.bw-gross .md > :first-child { margin-top: 0 !important; }
.bw-gross .md > :last-child { margin-bottom: 0 !important; }
.bw-detail .dlg-acts { align-items: center; justify-content: space-between; margin-top: 14px; }
.bw-detail .dlg-acts .hint { margin: 0; }
.bw-absatz { color: var(--ink-muted); font-size: 18px; }
.ed-baustein { font-weight: 600; }
@media (max-width: 860px) {
  .bw { grid-template-columns: 1fr; }
  .bw-detail { border-left: 0; padding-left: 0; border-top: 1px solid var(--linie); padding-top: 14px; max-height: none; }
  .bw-raster { max-height: 40vh; }
  .ed-flaeche.wy-an .ed-vorschau { padding-left: 52px; }
}

/* ---------- Seitenleiste einklappen ---------- */
.side-zu-btn { position: absolute; top: 20px; right: 12px; width: 32px; height: 32px; display: inline-flex; align-items: center; justify-content: center; background: transparent; border: 1px solid transparent; color: var(--side-muted); cursor: pointer; border-radius: var(--radius-s); z-index: 2; }
.side-zu-btn:hover, .side-zu-btn:focus-visible { color: var(--side-ink); border-color: var(--side-line); background: rgba(255, 255, 255, .06); }
.rail { display: none; }
@media (min-width: 861px) {
  .sidebar, main { transition: width .18s ease, margin-left .18s ease; }
  html.side-zu { --side-w: 60px; }
  html.side-zu .sidebar { padding: 14px 0 12px; overflow-x: hidden; }
  html.side-zu .sidebar > :not(.rail) { display: none !important; }
  html.side-zu .rail { display: flex; flex-direction: column; align-items: center; gap: 2px; min-height: 100%; }
  html.side-zu.side-schwebt .sidebar { width: 280px; padding: 28px 20px 16px; box-shadow: 12px 0 40px rgba(10, 8, 9, .35); z-index: 60; }
  html.side-zu.side-schwebt .sidebar > :not(.rail):not(.search-results) { display: block !important; }
  html.side-zu.side-schwebt .sidebar > .search { display: flex !important; }
  html.side-zu.side-schwebt .sidebar > .side-zu-btn { display: none !important; }
  html.side-zu.side-schwebt .rail { display: none; }
  html.side-zu .site-foot { padding-left: 32px; }
}
.rail a, .rail button { width: 44px; height: 40px; display: flex; align-items: center; justify-content: center; color: var(--side-ink); background: transparent; border: 0; border-left: 3px solid transparent; position: relative; cursor: pointer; text-decoration: none; padding: 0; }
.rail a:hover, .rail button:hover, .rail a:focus-visible, .rail button:focus-visible { background: rgba(255, 255, 255, .08); }
.rail [aria-current="page"] { border-left-color: var(--signalrot); background: rgba(255, 255, 255, .08); }
.rail-zahl { position: absolute; top: 4px; right: 2px; font: 600 9px/14px var(--font-sans); background: var(--signalrot); color: var(--weiss); min-width: 16px; padding: 0 3px; text-align: center; }
.rail-trenner { width: 26px; height: 1px; background: var(--side-line); margin: 6px 0; flex: none; }
.rail .nb-mini { width: 15px; height: 19px; }
.rail .nb-mini.dunkel::after { right: 3px; width: 3px; }
.rail .nb-mini.hell::after { width: 6px; height: 6px; right: 2px; top: 3px; }
.rail-fuss { margin-top: auto; display: flex; flex-direction: column; align-items: center; gap: 2px; padding-top: 10px; }
@media (prefers-reduced-motion: reduce) { .sidebar, main { transition: none !important; } }
@media (max-width: 860px) { .side-zu-btn { display: none; } }

/* ---------- Kommentare an Abschnitten ---------- */
.md h2 .kb-knopf { position: absolute; right: -44px; top: 50%; transform: translateY(-50%); width: 32px; height: 28px; border: 1px solid transparent; background: transparent; color: var(--ink-muted); cursor: pointer; opacity: 0; border-radius: var(--radius-s); font: var(--text-label); font-size: 11px; display: inline-flex; align-items: center; justify-content: center; padding: 0; }
.md h2 .kb-knopf::before { content: ""; width: 16px; height: 13px; border: 1.6px solid currentColor; border-radius: 2px; box-sizing: border-box; position: relative; }
.md h2 .kb-knopf::after { content: ""; position: absolute; left: 11px; bottom: 5px; width: 5px; height: 5px; border-left: 1.6px solid currentColor; border-bottom: 1.6px solid currentColor; background: var(--surface); transform: skewY(-35deg); }
.md h2:hover .kb-knopf, .md h2 .kb-knopf:focus-visible, .md h2 .kb-knopf.hat, .md h2 .kb-knopf.aktiv { opacity: 1; }
.md h2 .kb-knopf:hover, .md h2 .kb-knopf.aktiv { color: var(--ink); border-color: var(--linie); }
.md h2 .kb-knopf[data-zahl]:not([data-zahl=""])::before { content: attr(data-zahl); border: 0; width: auto; height: auto; min-width: 20px; padding: 2px 5px; line-height: 14px; background: var(--rot-flaeche); color: var(--on-rot); font-size: 11px; text-align: center; border-radius: 0; }
.md h2 .kb-knopf[data-zahl]:not([data-zahl=""])::after { display: none; }
.kmt-zahl { font-style: normal; margin-left: 6px; background: var(--rot-flaeche); color: var(--on-rot); padding: 0 5px; font-size: 11px; }
.kmt-zahl:empty { display: none; }
.kmt { position: fixed; top: 0; right: 0; bottom: 0; width: min(400px, 100vw); z-index: 70; background: var(--surface-raised); border-left: 1px solid var(--linie); box-shadow: -12px 0 40px rgba(10, 8, 9, .18); display: flex; flex-direction: column; animation: kmt-rein .18s ease-out; }
@keyframes kmt-rein { from { transform: translateX(24px); opacity: 0; } to { transform: none; opacity: 1; } }
.kmt-kopf { display: flex; justify-content: space-between; gap: 12px; padding: 22px 20px 10px; border-top: 4px solid var(--rot-flaeche); }
.kmt-kopf h2 { font: var(--text-headline-s); font-size: 20px; margin: 0; }
.kmt-kopf h2 .p { color: var(--punkt); }
.kmt-kopf .dlg-x { position: static; }
.kmt-filter { padding: 0 20px; margin: 0 0 8px; }
.kmt-liste { flex: 1; overflow: auto; padding: 4px 20px 16px; }
.kmt-faden { border: 1px solid var(--linie); background: var(--surface); padding: 12px 14px; margin-bottom: 10px; }
.kmt-faden.erledigt { opacity: .7; }
.kmt-faden.erledigt > .kmt-text { text-decoration: line-through; text-decoration-color: var(--ink-muted); }
.kmt-wo { display: block; font: var(--text-label); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--rot-text); text-decoration: none; margin-bottom: 6px; }
.kmt-text .md { max-width: none; }
.kmt-text .md p, .kmt-text .md li { font-size: 14px; line-height: 21px; margin-bottom: 6px; }
.kmt-meta { font: var(--text-small); font-size: 12px; color: var(--ink-muted); margin: 2px 0 0; }
.kmt-acts { display: flex; gap: 14px; align-items: center; margin-top: 8px; flex-wrap: wrap; }
.kmt-erl { display: inline-flex; gap: 6px; align-items: center; font: var(--text-label); font-size: 12px; cursor: pointer; }
.kmt-erl input { accent-color: var(--nachtblau); width: 16px; height: 16px; }
[data-theme="dark"] .kmt-erl input { accent-color: var(--leuchtrot); }
.kmt-link { background: none; border: 0; padding: 0; font: var(--text-label); font-size: 12px; color: var(--ink-muted); cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.kmt-link:hover { color: var(--ink); }
.kmt-antworten { list-style: none; margin: 10px 0 0; padding: 0 0 0 12px; border-left: 2px solid var(--linie); }
.kmt-antworten li { margin-bottom: 8px; }
.kmt-antwort { margin-top: 8px; display: grid; gap: 6px; justify-items: end; }
.kmt-antwort textarea, .kmt-neu textarea { width: 100%; resize: vertical; font: var(--text-body); font-size: 14px; }
.kmt-neu { border-top: 1px solid var(--linie); padding: 14px 20px 18px; display: grid; gap: 8px; background: var(--surface-raised); }
.kmt-neu select { width: 100%; }
.kmt-neu-acts { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.kmt-neu-acts .hint { margin: 0; }
.of-kmt { font: var(--text-label); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--rot-text); }
@media (max-width: 1180px) { .md h2 .kb-knopf { right: 0; top: -26px; transform: none; } }

/* ---------- Seiten sortieren ---------- */
.sortier { max-width: 860px; }
.sortier-kopf { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; flex-wrap: wrap; margin-bottom: 24px; }
.sortier-kopf h2 { font: var(--text-headline-m); font-size: 28px; margin: 0 0 6px; }
.sortier-kopf h2 .p { color: var(--punkt); }
.sortier-kopf .hint { margin: 0; }
.sortier-gruppe { margin-bottom: 24px; }
.sortier-liste { list-style: none; margin: 0; padding: 0; border: 1px solid var(--linie); background: var(--surface-raised); min-height: 46px; }
.sortier-liste li { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-bottom: 1px solid var(--linie); cursor: grab; background: var(--surface-raised); }
.sortier-liste li:last-child { border-bottom: 0; }
.sortier-liste li:active { cursor: grabbing; }
.sortier-liste li b { flex: 1; font: var(--text-label); font-size: 15px; }
.sortier-griff { color: var(--ink-muted); font-size: 16px; }
.sortier-nr { font: var(--text-label); font-size: 13px; color: var(--rot-text); font-variant-numeric: tabular-nums; min-width: 22px; }
.sortier-acts { display: flex; gap: 2px; }
.sortier-acts button { width: 30px; height: 28px; background: transparent; border: 1px solid var(--linie); cursor: pointer; color: var(--ink); border-radius: var(--radius-s); }
.sortier-acts button:disabled { opacity: .3; cursor: default; }
.sortier-liste .sortier-leer { color: var(--ink-muted); font: var(--text-small); justify-content: center; cursor: default; }
.sortier-liste li.drop-vor { box-shadow: inset 0 3px 0 var(--rot-flaeche); }
.sortier-liste li.drop-nach, .sortier-liste.drop-nach { box-shadow: inset 0 -3px 0 var(--rot-flaeche); }
.sortier-liste li.wy-zieht { opacity: .35; }
.sortier-liste li.wy-markiert { animation: wy-blink .9s ease-out; }

/* ---------- Einbetten ---------- */
.einbettung { margin: 20px 0 24px; border: 1px solid var(--linie); border-left: 4px solid var(--nachtblau); background: var(--surface-raised); padding: 0; }
[data-theme="dark"] .einbettung { border-left-color: var(--galeriepapier); }
.einbettung .eb-kopf { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 0; padding: 8px 14px; border-bottom: 1px solid var(--linie); font: var(--text-small); background: var(--surface); }
.einbettung .eb-label { font: var(--text-eyebrow); letter-spacing: .14em; text-transform: uppercase; color: var(--ink-muted); }
.einbettung .eb-kopf a { color: var(--rot-text); text-decoration: none; font: var(--text-label); font-size: 13px; }
.einbettung .eb-kopf a:hover { text-decoration: underline; }
.einbettung .eb-inhalt { padding: 6px 18px 4px; }
.einbettung .eb-inhalt > :first-child { margin-top: 12px; }
.einbettung .eb-inhalt h2 { font-size: 22px; margin-top: 24px; }
.einbettung-fehler { border-left-color: var(--rot-flaeche); }
.einbettung-fehler .eb-kopf { border-bottom: 0; color: var(--ink-muted); }
.eb-liste { max-height: 56vh; margin: 0; }
.eb-liste .eb-abschnitt { padding-left: 22px; }
.eb-liste button[aria-current="true"] { background: var(--surface); box-shadow: inset 3px 0 0 var(--rot-flaeche); }
.eb-liste button { flex-direction: column; align-items: flex-start; gap: 2px; }
@media print { .einbettung { break-inside: avoid; } .md h2 .kb-knopf, .kmt { display: none !important; } }

/* ---------- Ablauf mit Bahnen ---------- */
.pf-bahn { stroke: none; }
.pf-bahn-0 { fill: var(--surface); }
.pf-bahn-1 { fill: var(--surface-raised); }
.pf-bahn-kopf { fill: var(--nachtblau); }
[data-theme="dark"] .pf-bahn-kopf { fill: #161d26; }
.pf-bahn-name { font-size: 12px; font-weight: 600; letter-spacing: .06em; fill: var(--weiss); }
.pf-bahnen .pf-k rect { stroke: var(--ink-muted); }
.pf-bahnen .pf-start rect { stroke: var(--nachtblau); }
.sortier-liste, .sortier .section-label { user-select: none; }

/* ---------- Bausteine aus der Seite bearbeiten ---------- */
.bs { position: relative; }
.bs-bearbeiten { position: absolute; top: -12px; right: 0; z-index: 3; display: none; font: var(--text-label); font-size: 11px; background: var(--ink); color: var(--surface); border: 0; padding: 4px 10px; cursor: pointer; border-radius: var(--radius-s); }
#doc .bs:hover > .bs-bearbeiten, #doc .bs-bearbeiten:focus-visible { display: block; }
.wy .bs-bearbeiten, .einbettung .bs-bearbeiten { display: none !important; }
@media (hover: none) { #doc .bs > .bs-bearbeiten { display: block; position: static; margin: 0 0 6px auto; } }
@media print { .bs-bearbeiten { display: none !important; } }

/* ---------- Abläufe bearbeiten ---------- */
.wy .ab-optionen { display: flex; gap: 16px; flex-wrap: wrap; margin-bottom: 12px; }
.wy .ab-optionen label { display: flex; flex-direction: column; gap: 4px; font: var(--text-label); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-muted); }
.wy .ab-optionen .ab-bahnen { flex: 1; min-width: 220px; }
.wy .ab-optionen select, .wy .ab-optionen input { font-size: 13px; padding: 6px 8px; text-transform: none; letter-spacing: 0; }
.wy .ab-liste { list-style: none; margin: 0 0 12px; padding: 0; border: 1px solid var(--linie); }
.wy .ab-liste > li { margin: 0; }
.wy .ab-zeile { display: grid; grid-template-columns: auto 110px minmax(0, 1fr) auto; gap: 8px; align-items: start; padding: 8px 10px; border-bottom: 1px solid var(--linie); background: var(--surface-raised); border-left: 4px solid var(--linie); }
.wy .ab-zeile:last-child { border-bottom: 0; }
.wy .ab-start { border-left-color: var(--nachtblau); }
[data-theme="dark"] .wy .ab-start { border-left-color: var(--weiss); }
.wy .ab-frage { border-left-color: var(--rot-flaeche); }
.wy .ab-ende { border-left-color: var(--ink); }
.wy .ab-verbindung { border-left-style: dashed; border-left-color: var(--ink-muted); background: var(--surface); }
.wy .ab-felder { display: flex; gap: 6px; flex-wrap: wrap; min-width: 0; align-items: center; }
.wy .ab-felder input[data-f="titel"] { flex: 2 1 180px; font-weight: 600; }
.wy .ab-felder input[data-f="text"] { flex: 2 1 160px; }
.wy .ab-felder input[data-f="rolle"] { flex: 1 1 110px; }
.wy .ab-felder input[data-f="label"] { flex: 1 1 140px; }
.wy .ab-zeile input, .wy .ab-zeile select { padding: 6px 8px; font-size: 13px; min-width: 0; }
.wy .ab-art { font: var(--text-label); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-muted); align-self: center; }
.wy .ab-pfeil { color: var(--ink-muted); }
.wy .ab-weg { background: transparent; border: 0; color: var(--ink-muted); cursor: pointer; padding: 6px; }
.wy .ab-weg:hover { color: var(--rot-text); }
.wy .ab-zweige { grid-column: 2 / -1; list-style: none; margin: 2px 0 0; padding: 0 0 0 4px; display: grid; gap: 6px; }
.wy .ab-zweige li { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin: 0; }
.wy .ab-zweig-pfeil { color: var(--rot-text); font-weight: 600; }
.wy .ab-zweige .ab-label { width: 90px; flex: none; }
.wy .ab-zweige input[data-zf="titel"] { flex: 2 1 170px; }
.wy .ab-zweige input[data-zf="text"] { flex: 1 1 130px; }
.wy .ab-zweige input[data-zf="rolle"] { flex: 1 1 100px; }
.wy .ab-zweig-neu button { background: transparent; border: 1px dashed var(--ink-muted); color: var(--ink); font: var(--text-label); font-size: 12px; padding: 4px 10px; cursor: pointer; display: inline-flex; gap: 4px; align-items: center; border-radius: var(--radius-s); }
.wy .ab-leer { padding: 14px; color: var(--ink-muted); font: var(--text-small); }
@media (max-width: 860px) { .wy .ab-zeile { grid-template-columns: auto minmax(0, 1fr) auto; } .wy .ab-zeile > select[data-f="typ"] { grid-column: 2; } .wy .ab-felder { grid-column: 1 / -1; } }

/* ---------- Instagram-Posts (js/posts.js) ---------- */
.post-vorschau { margin: 24px 0; border: 1px solid var(--linie); background: var(--surface-raised); padding: 14px; }
/* nur das äußere SVG skalieren; das Logo darin ist ein eigenes <svg> mit festen Maßen */
.pv-svg > svg, .pe-gross > svg, .pe-mini-svg > svg, .pb-svg > svg { display: block; width: 100%; height: auto; }
.pv-laden { margin: 0; color: var(--ink-muted); font: var(--text-small); }
.pv-kopf { display: flex; gap: 10px; align-items: center; justify-content: space-between; flex-wrap: wrap; margin-bottom: 12px; }
.pv-meta { font: var(--text-small); color: var(--ink-muted); }
.pv-meta b { color: var(--ink); font-weight: 600; }
.pv-folien { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 14px; }
.pv-folien.pv-9-16 { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }
.pv-folien.pv-einzeln { grid-template-columns: minmax(0, 340px); }
.pv-folien.pv-einzeln.pv-9-16 { grid-template-columns: minmax(0, 280px); }
.pv-folie { margin: 0; display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.pv-svg { cursor: zoom-in; box-shadow: 0 1px 0 var(--linie), 0 6px 18px rgba(10, 8, 9, .10); background: var(--surface); }
.pv-folie figcaption { display: flex; justify-content: space-between; align-items: center; gap: 6px; font: var(--text-small); font-size: 12px; color: var(--ink-muted); }
.pv-folie figcaption .mini + .mini { margin-left: 4px; }
.pv-lightbox { padding: 24px 72px; }
.pv-gross { height: calc(100vh - 64px); aspect-ratio: auto; display: flex; align-items: center; justify-content: center; }
.pv-gross > svg { display: block; width: auto; height: 100%; max-width: 100%; max-height: 100%; }
.lightbox .pv-zurueck, .lightbox .pv-weiter { top: 50%; transform: translateY(-50%); right: auto; left: 16px; font-size: 30px; line-height: 1; }
.lightbox .pv-weiter { left: auto; right: 16px; }

/* Editor */
.pe { display: flex; flex-direction: column; gap: 14px; }
.pe .pe-kopf { display: flex; gap: 12px; align-items: flex-end; flex-wrap: wrap; }
.pe .pe-kopf > b { font: var(--text-label); font-size: 14px; margin-right: auto; align-self: center; }
.pe .pe-kopf label { display: flex; flex-direction: column; gap: 4px; font: var(--text-label); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-muted); }
.pe .pe-kopf input, .pe .pe-kopf select { padding: 6px 8px; font: var(--text-small); font-size: 13px; text-transform: none; letter-spacing: 0; color: var(--ink); }
.pe .pe-kopf input[data-m="kennung"] { width: 80px; }
.pe .pe-termin input { width: 190px; }
.pe-folien { display: flex; gap: 8px; overflow-x: auto; padding: 2px 2px 6px; align-items: flex-end; }
.pe-mini { position: relative; flex: none; width: 64px; padding: 0; border: 2px solid transparent; background: none; cursor: pointer; }
.pe-mini.aktiv { border-color: var(--rot-flaeche); }
.pe-mini-svg { display: block; min-height: 40px; background: var(--surface); box-shadow: 0 0 0 1px var(--linie); }
.pe-mini-nr { position: absolute; left: 0; bottom: 0; background: var(--ink); color: var(--surface); font: 600 10px/1 var(--font-sans); padding: 3px 5px; }
.pe-folie-neu { flex: none; height: 80px; padding: 0 12px; border: 1px dashed var(--ink-muted); background: transparent; color: var(--ink); font: var(--text-label); font-size: 12px; cursor: pointer; border-radius: var(--radius-s); }
.pe-haupt { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, 400px); gap: 24px; align-items: start; }
.pe-form { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.pe-zeile { display: flex; gap: 14px; align-items: flex-end; flex-wrap: wrap; }
.pe-zeile .pe-feld:first-child { flex: 1 1 200px; }
.pe-feld { display: flex; flex-direction: column; gap: 5px; min-width: 0; position: relative; }
.pe-lab { font: var(--text-label); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-muted); }
.pe-hilfe { font: var(--text-small); font-size: 12px; letter-spacing: 0; text-transform: none; color: var(--ink-muted); opacity: .85; }
.pe-feld input, .pe-feld select, .pe-feld textarea { width: 100%; padding: 8px 10px; font: var(--text-body); font-size: 14px; }
.pe-feld textarea { resize: vertical; min-height: 64px; }
.pe .seg button { padding: 7px 12px; font-size: 12px; }
.pe-check { display: inline-flex; gap: 6px; align-items: center; font: var(--text-label); font-size: 13px; padding-bottom: 8px; cursor: pointer; }
.pe .pe-info, .wy .pe .pe-info { margin: -4px 0 0; font: var(--text-small); color: var(--ink-muted); max-width: none; }
.wy .pe p, .wy .pe label { max-width: none; }
.pe-bildliste { display: flex; gap: 8px; flex-wrap: wrap; }
.pe-bild { position: relative; width: 92px; height: 92px; background: var(--surface); border: 1px solid var(--linie); display: flex; align-items: center; justify-content: center; }
.pe-bild img { max-width: 100%; max-height: 100%; object-fit: contain; }
.pe-bild-acts { position: absolute; left: 0; right: 0; bottom: 0; display: flex; justify-content: flex-end; gap: 2px; padding: 2px; background: linear-gradient(transparent, rgba(10, 8, 9, .55)); }
.pe-bild-acts button { background: var(--weiss); color: var(--nachtblau); border: 0; width: 22px; height: 22px; font-size: 14px; line-height: 1; cursor: pointer; padding: 0; }
.pe-bild-acts button:disabled { opacity: .35; cursor: default; }
.pe-bild-neu, .pe-plus { border: 1px dashed var(--ink-muted); background: transparent; color: var(--ink); font: var(--text-label); font-size: 12px; cursor: pointer; border-radius: var(--radius-s); }
.pe-bild-neu { width: 92px; height: 92px; }
.pe-plus { align-self: flex-start; padding: 6px 12px; }
.pe-punkt { display: flex; gap: 4px; align-items: center; }
.pe-punkt input { flex: 1; }
.pe-punkt button { background: transparent; border: 1px solid var(--linie); color: var(--ink); width: 30px; height: 34px; cursor: pointer; border-radius: var(--radius-s); flex: none; }
.pe-punkt button:disabled { opacity: .35; cursor: default; }
.pe-punkte { gap: 6px; }
.pe-folie-acts { display: flex; gap: 6px; flex-wrap: wrap; padding-top: 6px; border-top: 1px solid var(--linie); }
.pe-vorschau { position: sticky; top: 16px; display: flex; flex-direction: column; gap: 8px; }
.pe-gross { box-shadow: 0 1px 0 var(--linie), 0 10px 28px rgba(10, 8, 9, .14); background: var(--surface); }
.pe-gross.pe-9-16 { max-width: 300px; margin: 0 auto; width: 100%; }
.pe-dl { display: flex; gap: 6px; align-items: center; justify-content: flex-end; flex-wrap: wrap; }
.pe-dl .pe-hilfe { margin-right: auto; }
.pe-acts { margin-top: 0 !important; }
.pe-picker { position: absolute; z-index: 30; top: 100%; left: 0; margin-top: 6px; width: min(520px, 86vw); max-height: 440px; overflow: auto; background: var(--surface-raised); border: 1px solid var(--ink); padding: 12px; box-shadow: 0 16px 40px rgba(10, 8, 9, .22); display: flex; flex-direction: column; gap: 8px; }
.pe-picker-kopf { display: flex; justify-content: space-between; align-items: center; }
.pe-picker-kopf .dlg-x { position: static; }
.pe-upload { align-self: flex-start; cursor: pointer; }
.pe-picker .pe-hilfe { margin: 0; }
.pe-picker .pe-lab { margin: 6px 0 0; }
.pe-picker-raster { display: grid; grid-template-columns: repeat(auto-fill, minmax(84px, 1fr)); gap: 6px; }
.pe-picker-raster button { aspect-ratio: 1; padding: 4px; background: var(--surface); border: 1px solid var(--linie); cursor: pointer; display: flex; align-items: center; justify-content: center; }
.pe-picker-raster button:hover { border-color: var(--ink); }
.pe-picker-raster img { max-width: 100%; max-height: 100%; object-fit: contain; }
.wy .wy-post { padding: 16px; }
@media (max-width: 900px) {
  .pe-haupt { grid-template-columns: minmax(0, 1fr); }
  .pe-vorschau { position: static; order: -1; max-width: 360px; }
}

/* Werkzeug Post-Baukasten */
.pb-galerie { display: grid; grid-template-columns: repeat(auto-fill, minmax(168px, 1fr)); gap: 14px; }
.pb-karte { display: flex; flex-direction: column; gap: 4px; text-align: left; padding: 0 0 10px; background: var(--surface); border: 1px solid var(--linie); cursor: pointer; color: var(--ink); font: inherit; }
.pb-karte:hover { border-color: var(--ink); }
.pb-karte .pb-svg { display: block; aspect-ratio: 4 / 5; background: var(--surface-raised); border-bottom: 1px solid var(--linie); margin-bottom: 6px; }
.pb-karte b { font: var(--text-label); font-size: 13px; padding: 0 10px; }
.pb-karte > span:last-child { font: var(--text-small); font-size: 12px; color: var(--ink-muted); padding: 0 10px; }
.pb-caption { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--linie); }
.pb-caption .field:first-child, .pb-caption .field:nth-child(2) { grid-column: 1 / -1; }
.pb-caption input, .pb-caption textarea { width: 100%; }
.pb-acts { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 18px; }
@media (max-width: 700px) {
  .pb-caption { grid-template-columns: minmax(0, 1fr); }
  .pb-galerie { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .pb-karte > span:last-child { display: none; }
  .pe .pe-kopf > b { flex-basis: 100%; }
  .pe .pe-termin { flex: 1; } .pe .pe-termin input { width: 100%; }
}
@media print { .pv-kopf .pv-acts, .pv-folie figcaption .mini { display: none !important; } .post-vorschau { break-inside: avoid; } .pv-svg { box-shadow: none; border: 1px solid #ccc; } }