/* Project Medusa – Editor im Figma-Aufbau, Formensprache nach Spectrum 2 (Tokens in base.css) */
:root{
  --kopf-h:48px;
  --steuer-h:52px;
  --links-b:248px;
  --rechts-b:268px;
  --ui:13px;
  --schatten-schwebe:0 2px 8px light-dark(rgba(0,0,0,.16), rgba(0,0,0,.48));
}
html,body{height:100%}
body.editor{margin:0;overflow:hidden;user-select:none;-webkit-user-select:none;font-size:var(--ui);line-height:1.45;background:var(--bg)}
body.editor button{font:inherit;color:inherit}
body.editor .knopf{color:var(--akz-auf)}
body.editor .knopf--stumm{color:var(--g800)}
body.editor .knopf--stumm[aria-pressed="true"]{color:var(--neutral-auf)}
body.editor input,body.editor select,body.editor textarea{font-family:var(--f-ui)}
.nur-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.arbeitsplatz{display:grid;height:100%;grid-template-rows:var(--kopf-h) var(--steuer-h) minmax(0,1fr);
  grid-template-columns:var(--links-b) minmax(0,1fr) var(--rechts-b)}
.arbeitsplatz[data-steuer="zu"]{--steuer-h:0px}
.arbeitsplatz[data-steuer="zu"] .steuerleiste{display:none}

/* ── Kopfzeile ─────────────────────────────────────────────────────────── */
.kopf{grid-column:1 / -1;display:flex;align-items:center;gap:var(--a2);padding:0 var(--a2) 0 var(--a2);
  background:var(--flaeche);border-bottom:1px solid var(--linie);min-width:0}
.kopf__logo{display:flex;align-items:center;gap:2px;height:36px;padding:0 6px 0 8px;border-radius:var(--r-klein);
  border:0;background:transparent;cursor:pointer;color:var(--tx)}
.kopf__logo:hover,.kopf__logo[aria-expanded="true"]{background:var(--g200)}
.kopf__logo svg:first-child{color:var(--tx)}
.kopf__titel{display:flex;align-items:center;gap:var(--a2);min-width:0;flex:0 1 auto}
.kopf__titel input{font-size:15px;font-weight:700;border:1px solid transparent;background:transparent;border-radius:var(--r-klein);
  padding:5px 8px;min-width:80px;width:clamp(120px,24vw,320px);color:var(--tx)}
.kopf__titel input:hover{background:var(--g100);border-color:transparent}
.kopf__titel input:focus{border-color:var(--g800);background:var(--g25);outline:0}
.ortsangabe{color:var(--tx-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kopf .luecke{flex:1}
.syncstatus{display:inline-flex;align-items:center;gap:6px;color:var(--tx-3);white-space:nowrap;padding:0 var(--a2)}
.syncstatus::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--tx-3)}
.syncstatus[data-art="gut"]::before{background:var(--gut)}
.syncstatus[data-art="aktiv"]::before{background:var(--auswahl)}
.syncstatus[data-art="warnung"]::before{background:var(--warn)}
.pruefknopf{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 12px;border-radius:var(--r-pille);border:0;
  background:var(--g100);color:var(--g800);cursor:pointer;white-space:nowrap;font-size:13px;font-weight:600}
.pruefknopf::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--gut)}
.pruefknopf[data-art="warnung"]::before{background:var(--warn)}
.pruefknopf[data-art="kritisch"]::before{background:var(--schlecht)}
.pruefknopf:hover{background:var(--g200)}
.suchleiste{position:absolute;top:30px;right:12px;z-index:7;width:min(380px,calc(100% - 48px));background:var(--flaeche);border:1px solid var(--linie-stark);
  border-radius:var(--r-klein);box-shadow:var(--schatten-schwebe);padding:6px;display:flex;flex-direction:column;gap:6px}
.suchleiste__zeile{display:flex;align-items:center;gap:4px}
.suchleiste__zeile .textfeld{flex:1;min-width:0}
.suchleiste__optionen{padding:0 4px;gap:var(--a3)}
.suchleiste__optionen .luecke{flex:1}
.suchleiste .haken{font-size:12px}
.leute{display:flex;align-items:center;padding:0 var(--a1)}
.leute button{border:0;padding:0;background:0;cursor:pointer;border-radius:50%}
.leute button + button{margin-left:-6px}
.avatarpunkt{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:600;
  font-size:12px;background:var(--farbe,#888);box-shadow:0 0 0 2px var(--flaeche);position:relative}
.leute button[aria-pressed="true"] .avatarpunkt{box-shadow:0 0 0 2px var(--flaeche),0 0 0 4px var(--farbe)}
.rollenmarke{font-size:12px;padding:2px 8px;border-radius:var(--r-pille);background:var(--flaeche-3);color:var(--tx-2);white-space:nowrap}
.kopfknopf{height:32px;display:inline-flex;align-items:center;gap:6px;padding:0 10px;border-radius:var(--r-klein);
  border:1px solid transparent;background:transparent;cursor:pointer;color:var(--tx-2);white-space:nowrap;font-variant-numeric:tabular-nums}
.kopfknopf:hover{background:var(--g200);color:var(--tx)}
.knopf--klein{font-size:13px;height:32px;padding:0 14px;min-width:0}
.knopf--gefahr,body.editor .knopf--gefahr{background:var(--schlecht);border-color:var(--schlecht);color:#fff}

/* ── Seitenleisten ─────────────────────────────────────────────────────── */
.dock{background:var(--flaeche);min-height:0;display:flex;flex-direction:row;overflow:hidden;grid-row:3;position:relative}
.dockspalte{flex:1 1 0;min-width:0;min-height:0;display:flex;flex-direction:column;overflow:hidden}
.dockspalte + .dockspalte{border-left:1px solid var(--linie)}
.dockspalte__ende{flex:0 0 auto;min-height:8px}
.dockspalte[data-ziel]{box-shadow:inset 0 0 0 2px var(--auswahl)}
.dock__breite{position:absolute;top:0;bottom:0;width:6px;cursor:col-resize;z-index:2}
.dock--links .dock__breite{right:-3px}
.dock--rechts .dock__breite{left:-3px}
.dock__breite:hover{background:var(--auswahl);opacity:.35}
.dock--links{border-right:1px solid var(--linie);grid-column:1}
.dock--rechts{border-left:1px solid var(--linie);grid-column:3}
.dock[data-ziel]{box-shadow:inset 0 0 0 2px var(--auswahl)}
.flaeche{grid-row:3;grid-column:2}
.palette{display:flex;flex-direction:column;min-height:0;flex:1 1 0}
.palette + .palette{border-top:1px solid var(--linie)}
.palette__koerper{flex:1;min-height:0;display:flex;flex-direction:column}
.palette__koerper > .leistenkoerper{flex:1}
.leistenreiter__griff{flex:1;min-width:8px}
.palette--schwebend .leistenreiter__griff{cursor:move}
.palette__knopf{width:22px;height:22px;align-self:center}
.leistenreiter[data-ziel]{box-shadow:inset 0 0 0 2px var(--auswahl)}
.leistenreiter button[data-tab]{cursor:default}
.schwebepaletten{position:fixed;inset:0;pointer-events:none;z-index:30}
.palette--schwebend{position:absolute;pointer-events:auto;background:var(--flaeche);border:1px solid var(--linie);border-radius:var(--r-gross);
  box-shadow:0 4px 16px light-dark(rgba(0,0,0,.16), rgba(0,0,0,.5));overflow:hidden;flex:none;min-width:220px}
.palette__groesse{position:absolute;right:0;bottom:0;width:14px;height:14px;cursor:nwse-resize;
  background:linear-gradient(135deg,transparent 50%,var(--linie-stark) 50% 60%,transparent 60% 72%,var(--linie-stark) 72% 82%,transparent 82%)}
.palette-geist{position:fixed;z-index:100;pointer-events:none;background:var(--g800);color:var(--g50);padding:4px 12px;border-radius:var(--r-pille);font-size:13px;font-weight:700;box-shadow:var(--schwebe)}
body[data-andocken="links"]::before,body[data-andocken="rechts"]::before{content:"";position:fixed;top:0;bottom:0;width:6px;background:var(--auswahl);z-index:99}
body[data-andocken="links"]::before{left:0}
body[data-andocken="rechts"]::before{right:0}
/* Tabs nach Spectrum 2: Text, darunter ein 2-px-Balken für den aktiven Reiter */
.leistenreiter{display:flex;gap:16px;padding:0 12px;border-bottom:1px solid var(--g200);flex:none;height:40px;align-items:stretch}
.leistenreiter button{border:0;background:0;padding:0;cursor:pointer;color:var(--g700);font-size:14px;font-weight:400;position:relative;
  display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.leistenreiter button:hover{color:var(--g900)}
.leistenreiter button[aria-selected="true"]{color:var(--g900);font-weight:600}
.leistenreiter button[aria-selected="true"]::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;border-radius:1px;background:var(--g800)}
.leistenkoerper{flex:1;overflow-y:auto;overflow-x:hidden;min-height:0}
.leer-hinweis{padding:var(--a4);color:var(--tx-3)}

.abschnittfeld{padding:var(--a3) var(--a3) var(--a4);border-bottom:1px solid var(--g200)}
.abschnittfeld:last-child{border-bottom:0}
.abschnittfeld__kopf{display:flex;align-items:center;justify-content:space-between;min-height:24px;margin-bottom:var(--a2)}
.abschnittfeld__kopf h3{font-size:14px;font-weight:700;margin:0;letter-spacing:0;color:var(--g900)}
.abschnittfeld__aktionen{display:flex;gap:2px}
.abschnittfeld__titel{display:flex;align-items:center;gap:6px;flex:1;min-width:0;background:none;border:0;padding:0;color:inherit;font:inherit;cursor:grab;text-align:left;touch-action:none}
.abschnittfeld__titel:active{cursor:grabbing}
.abschnittfeld__pfeil{color:var(--g500);font-size:10px;width:10px}
.abschnittfeld.ist-zu{padding-bottom:var(--a3)}
.abschnittfeld.ist-in-bewegung{opacity:.6;background:var(--g100)}
.leistenkoerper{display:flex;flex-direction:column}
.zeile{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--a2);margin-bottom:var(--a2)}
.zeile:last-child{margin-bottom:0}
.zeile--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.zeile--1{grid-template-columns:minmax(0,1fr)}
.zeile--voll{display:flex;gap:var(--a2);align-items:center;margin-bottom:var(--a2)}
.zeile--voll > *{flex:1;min-width:0}
.feldlabel{font-size:12px;color:var(--g700);margin:0 0 4px}

/* Zahlenfeld */
/* Felder in Paletten: Spectrum-2-Picker-Fläche (gray-100), beim Bearbeiten Rand gray-800 */
.zahl{display:flex;align-items:center;height:32px;border:1px solid transparent;border-radius:var(--r-klein);background:var(--g100);
  min-width:0;transition:background var(--tempo),border-color var(--tempo)}
.zahl:hover{background:var(--g200)}
.zahl:focus-within{border-color:var(--g800);background:var(--g25)}
.zahl__label{flex:none;min-width:22px;padding:0 2px 0 10px;color:var(--g700);cursor:ew-resize;user-select:none;white-space:nowrap}
.zahl__eingabe{flex:1;min-width:0;width:100%;border:0!important;background:transparent!important;box-shadow:none!important;
  padding:0 4px!important;font-size:13px!important;color:var(--tx)!important;font-variant-numeric:tabular-nums;height:30px;outline:0}
.zahl__einheit{flex:none;padding-right:10px;color:var(--g600)}
.zahl.ist-aus{opacity:.55}
.auswahlfeld{width:100%;height:32px;font-size:13px!important;padding:0 28px 0 10px!important;border-radius:var(--r-klein)!important;
  background-color:var(--g100)!important;border:1px solid transparent!important}
.auswahlfeld:hover{background-color:var(--g200)!important}
.textfeld{width:100%;height:32px;font-size:13px!important;padding:0 10px!important;border-radius:var(--r-klein)!important;border:1px solid var(--g500)!important;background:var(--g25)!important}
.textfeld:hover{border-color:var(--g600)!important}
.textfeld:focus{border-color:var(--g800)!important}

.symknopf{width:32px;height:32px;display:inline-grid;place-items:center;border:0;background:transparent;border-radius:var(--r-klein);
  color:var(--g800);cursor:pointer;flex:none;transition:background var(--tempo) var(--kurve),color var(--tempo) var(--kurve)}
.symknopf:hover{background:var(--g200);color:var(--g900)}
.symknopf[aria-pressed="true"]{background:var(--neutral);color:var(--neutral-auf)}
.symknopf:disabled{color:var(--g400);background:transparent;cursor:default}
.symknopf--leise{opacity:.0}
*:hover > .symknopf--leise,.symknopf--leise:focus-visible,.symknopf--leise[aria-pressed="true"]{opacity:1}
.segmentleiste{display:flex;background:var(--g100);border-radius:var(--r-klein);padding:0;gap:0;min-width:0}
.segmentleiste button{flex:1;min-width:0;height:32px;border:0;background:transparent;border-radius:var(--r-klein);cursor:pointer;color:var(--g800);
  display:grid;place-items:center;padding:0 4px;white-space:nowrap}
.segmentleiste button:hover{background:var(--g200)}
.segmentleiste button[aria-pressed="true"]{background:var(--neutral);color:var(--neutral-auf)}
.ausrichtleiste{display:flex;justify-content:space-between;gap:2px}

/* Farbwahl */
.farbwahl{display:flex;align-items:center;gap:var(--a2);height:32px;border-radius:var(--r-klein);background:var(--g100);padding:0 6px 0 8px;
  border:0;min-width:0;cursor:pointer;width:100%;text-align:left}
.farbwahl:hover{background:var(--g200)}
.farbwahl__chip{width:18px;height:18px;border-radius:50%;flex:none;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}
.farbwahl__chip[data-keine="true"]{background:linear-gradient(135deg,transparent 45%,var(--schlecht) 45% 55%,transparent 55%),var(--flaeche)!important}
.farbwahl__name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--tx)}
.farbwahl__ton{width:64px;flex:none!important}
.farbwahl__ton .zahl__label{min-width:6px;padding-left:4px}
.farbliste{display:flex;flex-direction:column;max-height:320px;overflow:auto;min-width:240px;padding:4px}
.farbliste button{display:flex;align-items:center;gap:var(--a2);border:0;background:0;padding:0 10px;min-height:32px;border-radius:var(--r-klein);cursor:pointer;text-align:left;font-size:14px}
.farbliste button:hover{background:var(--g100)}
.farbliste button[aria-pressed="true"]{background:var(--g200);font-weight:600}
.farbliste .mono{color:var(--tx-3);margin-left:auto;font-size:12px}

/* ── Arbeitsfläche ─────────────────────────────────────────────────────── */
body.editor input,body.editor textarea,body.editor [contenteditable]{user-select:text;-webkit-user-select:text}
.flaeche{position:relative;overflow:hidden;min-width:0;min-height:0;background:var(--g100)}
.flaeche canvas{position:absolute;inset:0;display:block;touch-action:none;outline:0}
.texteingabe{position:absolute;width:1px;height:20px;opacity:0;padding:0;border:0;resize:none;overflow:hidden;
  pointer-events:none;left:0;top:0;font-size:16px;z-index:1;caret-color:transparent}
.werkzeugleiste-schwebend{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);display:flex;align-items:center;gap:2px;
  padding:6px;background:var(--flaeche);border:0;border-radius:var(--r-gross);box-shadow:var(--schatten-schwebe);z-index:5}
.werkzeugleiste-schwebend .trennstrich{width:1px;height:24px;background:var(--linie);margin:0 4px}
.wz{position:relative;width:40px;height:40px;display:grid;place-items:center;border:0;border-radius:var(--r);background:transparent;color:var(--g800);cursor:pointer}
.wz:hover{background:var(--g200);color:var(--g900)}
.wz[aria-pressed="true"]{background:var(--neutral);color:var(--neutral-auf)}
.wz:disabled{opacity:.35;cursor:default}
.folgebalken{position:absolute;inset:0;border:2px solid var(--farbe);pointer-events:none;z-index:4}
.folgebalken span{position:absolute;top:0;left:50%;transform:translateX(-50%);background:var(--farbe);color:#fff;font-weight:600;
  padding:3px 10px;border-radius:0 0 8px 8px;pointer-events:auto;cursor:pointer}
.inline-hinweis{position:absolute;left:50%;top:32px;transform:translateX(-50%);background:var(--tx);color:var(--bg);padding:3px 10px;border-radius:6px;z-index:6;font-variant-numeric:tabular-nums}

/* ── Menüs und Popover ─────────────────────────────────────────────────── */
.schwebe{position:fixed;z-index:80;background:var(--flaeche);border:1px solid var(--g200);border-radius:var(--r);
  box-shadow:var(--schatten-schwebe);font-size:14px;color:var(--tx)}
.schwebe--menue{padding:0;background:transparent;border:0;box-shadow:none}
.menue{position:relative;background:var(--flaeche);border:1px solid var(--g200);border-radius:var(--r);
  box-shadow:var(--schatten-schwebe);padding:6px;min-width:230px}
.menue__unter{position:absolute;left:100%;margin-left:2px}
.menue__eintrag{display:flex;align-items:center;width:100%;gap:8px;border:0;background:0;padding:0 10px;min-height:32px;font-size:14px;border-radius:var(--r-klein);cursor:pointer;
  text-align:left;color:var(--tx);white-space:nowrap}
.menue__eintrag:hover:not(:disabled),.menue__eintrag:focus-visible{background:var(--g100);color:var(--g900);outline:0}
.menue__eintrag:hover:not(:disabled) kbd{color:inherit;background:transparent;border-color:transparent}
.menue__eintrag:disabled{color:var(--g400);cursor:default}
.menue__haken{width:12px;flex:none}
.menue__text{flex:1}
.menue__taste{font-family:var(--f-ui);font-size:12px;padding:0;background:0;border:0;color:var(--tx-3)}
.menue__pfeil{color:inherit}
.menue__trenner{height:1px;background:var(--g200);margin:4px 10px}

/* ── Seiten ────────────────────────────────────────────────────────────── */
.listenkopf{display:flex;align-items:center;justify-content:space-between;padding:var(--a3) var(--a3) var(--a2)}
.listenkopf h3{font-size:14px;margin:0;font-weight:700}
.musterliste{display:flex;flex-direction:column;padding:0 var(--a2) var(--a3);gap:2px;border-bottom:1px solid var(--linie)}
.eintrag{display:flex;align-items:center;gap:var(--a2);padding:0 8px;border-radius:var(--r-klein);cursor:pointer;min-height:32px;color:var(--g800)}
.eintrag:hover{background:var(--g100)}
.eintrag[aria-current="true"]{background:var(--g200);color:var(--g900);font-weight:600}
.eintrag__name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.eintrag__marke{font-weight:600;min-width:18px;height:18px;border-radius:4px;display:grid;place-items:center;background:var(--flaeche-3);color:var(--tx-2);font-size:12px;padding:0 4px}
.boegen{display:flex;flex-direction:column;gap:var(--a3);padding:var(--a3)}
.bogen{display:flex;justify-content:center;gap:0;align-items:flex-end}
.bogen[data-solo="R"]{padding-left:50%;justify-content:flex-start}
.seitenbild{display:flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer;border:0;background:0;padding:0;color:var(--tx-2)}
.seitenbild canvas{display:block;background:#fff;box-shadow:0 0 0 1px var(--g300);border-radius:2px}
.seitenbild[aria-current="true"] canvas{box-shadow:0 0 0 2px var(--auswahl)}
.seitenbild[data-ziel="true"] canvas{box-shadow:-3px 0 0 0 var(--auswahl),0 0 0 1px var(--linie)}
.seitenbild__nr{font-size:12px;font-variant-numeric:tabular-nums;display:flex;gap:4px;align-items:center}
.seitenbild__muster{color:var(--tx-3)}

/* ── Ebenen ────────────────────────────────────────────────────────────── */
.ebenenliste{padding:var(--a2)}
.ebene{border-radius:6px}
.ebene__kopf{display:flex;align-items:center;gap:4px;padding:0 4px;border-radius:var(--r-klein);min-height:32px}
.ebene__kopf:hover{background:var(--g100)}
.ebene__kopf[aria-current="true"]{background:var(--g200)}
.ebene__farbe{width:8px;height:8px;border-radius:2px;flex:none}
.ebene__name{flex:1;min-width:0;border:0;background:transparent;color:var(--tx);padding:3px 4px;border-radius:4px;font-weight:600;overflow:hidden;text-overflow:ellipsis}
.ebene__name:focus{background:var(--flaeche-2);outline:1px solid var(--ring-farbe)}
.objektliste{display:flex;flex-direction:column;padding:0 0 4px 14px}
.objekt{display:flex;align-items:center;gap:6px;padding:0 8px;border-radius:var(--r-klein);cursor:pointer;color:var(--g800);min-height:28px}
.objekt:hover{background:var(--g100)}
.objekt[aria-selected="true"]{background:var(--g200);color:var(--g900);font-weight:600}
.objekt__name{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.objekt .sym{display:inline-grid;color:var(--tx-3)}

/* ── Formate ───────────────────────────────────────────────────────────── */
.formatliste{display:flex;flex-direction:column;gap:1px}
.format{display:flex;align-items:center;gap:var(--a2);padding:0 8px;border-radius:var(--r-klein);cursor:pointer;min-height:32px;color:var(--g800)}
.format:hover{background:var(--g100)}
.format[aria-pressed="true"]{background:var(--g200);color:var(--g900);font-weight:600}
.format__vorschau{width:22px;height:22px;border-radius:4px;display:grid;place-items:center;background:var(--flaeche-2);color:var(--tx-2);font-size:12px;flex:none;font-weight:600}
.format__name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.format__info{color:var(--tx-3);white-space:nowrap}

/* ── Kommentare ────────────────────────────────────────────────────────── */
.faeden{display:flex;flex-direction:column;gap:var(--a2);padding:var(--a3)}
.faden{border:1px solid var(--g200);border-radius:var(--r);padding:var(--a3);background:var(--flaeche);cursor:pointer}
.faden:hover{border-color:var(--linie-stark)}
.faden[data-aktiv="true"]{border-color:var(--auswahl)}
.faden[data-erledigt="true"] .faden__text{color:var(--tx-3)}
.faden__kopf{display:flex;align-items:center;gap:var(--a2)}
.faden__name{font-weight:600;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.faden__zeit{color:var(--tx-3);white-space:nowrap}
.faden__text{margin:6px 0 0;white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px;line-height:1.5}
.faden__antworten{margin-top:var(--a2);padding-left:var(--a3);border-left:1px solid var(--linie);display:flex;flex-direction:column;gap:var(--a2)}
.faden__aktionen{display:flex;gap:2px;margin-top:6px;flex-wrap:wrap}
.textknopf{border:0;background:0;color:var(--g800);padding:4px 8px;border-radius:var(--r-klein);cursor:pointer;font-size:13px;font-weight:600}
.textknopf:hover{background:var(--g200)}
.verfassen{display:flex;flex-direction:column;gap:6px;margin-top:6px}
.verfassen textarea{width:100%;min-height:60px;resize:vertical;font-size:12px;padding:6px 8px;border-radius:6px}
.verfassen .knopfreihe{justify-content:flex-end}
.kleinavatar{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:600;font-size:12px;background:var(--farbe,#888);flex:none}

/* ── Dialoge ───────────────────────────────────────────────────────────── */
dialog.fenster{margin:auto;font-size:13px}
dialog.fenster--breit{max-width:min(760px,94vw)}
dialog.fenster--breit:has(.satzdialog){max-width:min(1080px,96vw);width:1080px}
.fenster__koerper{max-height:70vh;overflow:auto}
.dialograster{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--a3) var(--a4)}
.dialograster--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.dialogfeld{display:flex;flex-direction:column;gap:4px;min-width:0}
.dialogfeld > label,.dialogfeld > .feldlabel{font-size:12px;color:var(--tx-2);margin:0}
.dialogfeld input[type=text],.dialogfeld input[type=number],.dialogfeld select{width:100%}
.dialogtrenner{grid-column:1/-1;border-top:1px solid var(--linie);margin:var(--a2) 0 0;padding-top:var(--a3);font-weight:600;font-size:12px}
.linkzeile{display:flex;gap:var(--a2);align-items:center;margin-bottom:var(--a3)}
.linkzeile input{flex:1;min-width:0;font-family:var(--f-mono);font-size:12px}
.farbregler{display:grid;grid-template-columns:18px minmax(0,1fr) 54px;gap:var(--a2);align-items:center;margin-bottom:var(--a2)}
.farbregler input[type=range]{margin:0}
.farbvorschau{height:56px;border-radius:var(--r-klein);box-shadow:inset 0 0 0 1px rgba(0,0,0,.1);margin-bottom:var(--a3)}

.meldungen{z-index:90}
.meldung .textknopf{padding-left:0;color:var(--g50);text-decoration:underline}

/* ── Startseite ────────────────────────────────────────────────────────── */
body.start{min-height:100%;background:var(--bg)}
.start__huelle{max-width:1080px;margin:0 auto;padding:var(--a7) var(--a5) var(--a9)}
.start__kopf{display:flex;align-items:center;gap:var(--a3);margin-bottom:var(--a7)}
.anmeldung .start__kopf{margin-bottom:24px}
.start__kopf svg{color:var(--tx)}
.start__marke{font-weight:800;font-size:18px}
.vorlagen{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:var(--a4);margin-bottom:var(--a7)}
.vorlage{display:flex;flex-direction:column;gap:var(--a2);border:0;background:0;padding:0;cursor:pointer;text-align:left;color:var(--tx);font:inherit}
.vorlage__blatt{height:190px;background:var(--flaeche);border:1px solid var(--g200);border-radius:var(--r-gross);display:flex;align-items:center;justify-content:center;
  color:var(--tx-3);transition:border-color var(--tempo) var(--kurve);gap:0}
.vorlage:hover .vorlage__blatt{border-color:var(--g400);box-shadow:var(--schwebe)}
.vorlage:focus-visible{outline:0}
.vorlage:focus-visible .vorlage__blatt{box-shadow:var(--ring)}
.vorlage__seite{height:140px;max-width:45%;background:#fff;box-shadow:0 1px 3px rgba(13,13,18,.25);display:grid;place-items:center;color:#6a6a78;font-size:12px}
.vorlage__seite + .vorlage__seite{box-shadow:0 1px 3px rgba(13,13,18,.25),-1px 0 0 rgba(13,13,18,.12)}
.vorlage__plus{font-size:34px;font-weight:300;color:var(--tx-3)}
.vorlage__titel{font-weight:700;font-size:15px}
.vorlage__info{font-size:13px;color:var(--g700)}
.zuletzt{display:flex;flex-direction:column}
.zuletzt a{display:flex;justify-content:space-between;gap:var(--a3);padding:var(--a3) 0;border-top:1px solid var(--linie);color:var(--tx);text-decoration:none;font-size:14px}
.zuletzt a:hover .zuletzt__titel{text-decoration:underline}
.zuletzt__zeit{color:var(--tx-3);font-size:12px;white-space:nowrap}

@media (max-width:900px){
  :root{--links-b:0px;--rechts-b:240px}
  .dock--links{display:none}
  .ortsangabe,.syncstatus{display:none}
}
@media (max-width:640px){
  .arbeitsplatz{grid-template-columns:minmax(0,1fr)!important}
  .dock--rechts{display:none}
  .werkzeugleiste-schwebend{bottom:10px;max-width:calc(100% - 20px);overflow-x:auto}
}

/* ── Steuerungsleiste ──────────────────────────────────────────────────── */
.steuerleiste{grid-column:1 / -1;grid-row:2;display:flex;align-items:center;gap:var(--a2);padding:0 var(--a3);min-width:0;
  background:var(--flaeche);border-bottom:1px solid var(--linie);overflow-x:auto;overflow-y:hidden;scrollbar-width:none;white-space:nowrap}
.steuerleiste::-webkit-scrollbar{display:none}
.steuerleiste .trennstrich{flex:none;width:1px;align-self:stretch;margin:8px 2px;background:var(--linie)}
.steuergruppe{display:flex;align-items:center;gap:6px;flex:none}
.steuerstapel{display:flex;flex-direction:column;gap:2px;justify-content:center}
/* Kompakte Grösse (Spectrum component-height-50/75) */
.steuerleiste .zahl{height:22px;width:96px;border-radius:6px;font-size:12px}
.steuerleiste .zahl__eingabe{height:20px;font-size:12px!important}
.steuerleiste .zahl__label{min-width:18px;padding-left:6px;display:inline-flex;align-items:center}
.steuerleiste .zahl__label .sym svg{width:14px;height:14px}
.steuerleiste .zahl__einheit{padding-right:6px;font-size:11px}
.steuerleiste .auswahlfeld{height:22px!important;font-size:12px!important;border-radius:6px!important;padding:0 22px 0 8px!important;background-position:calc(100% - 13px) 52%, calc(100% - 9px) 52%!important;width:150px}
.steuerleiste .steuerwahl--schrift{width:132px}
.steuerleiste .segmentleiste{border-radius:6px}
.steuerleiste .segmentleiste button{height:22px;min-width:24px;font-size:12px;border-radius:6px;padding:0 5px}
.steuerleiste .segmentleiste svg{width:14px;height:14px}
.steuerleiste .symknopf{width:32px;height:32px}
.steuerleiste .farbwahl{height:22px;width:136px;border-radius:6px;font-size:12px}
.steuerleiste .farbwahl__chip{width:14px;height:14px}
.steuerfarbe{display:flex;align-items:center;gap:4px}
.steuerlabel{font-size:11px;color:var(--tx-3)}
.steuertext{font-size:12px}
.steuerleiste .haken{font-size:12px;gap:5px}
.steuerleiste .haken input{width:13px;height:13px}
.steuerleiste .knopf--klein{height:28px;font-size:12px}
.refpunkt{width:26px;height:26px;display:grid;place-items:center;border:0;background:transparent;border-radius:4px;cursor:pointer;padding:0}
.refpunkt:hover{background:var(--flaeche-2)}
.refpunkt__raster{display:grid;grid-template-columns:repeat(3,5px);gap:3px;padding:2px;border:1px solid var(--linie-stark);border-radius:2px}
.refpunkt__raster i{width:5px;height:5px;border-radius:50%;background:var(--linie-stark)}
.refpunkt__raster i[data-an="true"]{background:var(--tx)}
.refpunkt__raster--gross{grid-template-columns:repeat(3,14px);gap:10px;padding:10px;cursor:pointer}
.refpunkt__raster--gross i{width:14px;height:14px}
.refpunkt__raster--gross i:hover{background:var(--auswahl)}
.refpunkt__pop,.steuerpop{padding:8px}

/* ── Anmeldung (PHP-Version) ───────────────────────────────────────────── */
.anmeldung{min-height:100vh;display:grid;place-items:center;padding:var(--a5)}
.anmeldung__karte{width:min(400px,100%);background:var(--flaeche);border:0;border-radius:var(--r-gross);padding:var(--a6);box-shadow:var(--schwebe)}
.anmeldung h1{font-size:24px!important;font-weight:800}
.anmeldung__karte input{width:100%}
.anmeldung .knopf{width:100%;margin-top:var(--a2)}
.fehlertext{font-size:13px;color:var(--schlecht);margin:0 0 var(--a3)}
.start__kopf .luecke{flex:1}

/* Erweiterte Absatzeinstellungen */
.aufklapp{border-top:1px solid var(--g200);padding:6px 0}
.aufklapp summary{cursor:pointer;font-size:13px;font-weight:600;color:var(--g800);padding:4px 0;list-style:none;display:flex;align-items:center;gap:6px}
.aufklapp summary::before{content:"";width:0;height:0;border:4px solid transparent;border-left:5px solid currentColor;transition:transform .12s}
.aufklapp[open] summary::before{transform:rotate(90deg) translateX(2px)}
.aufklapp summary::-webkit-details-marker{display:none}
.aufklapp__inhalt{padding:6px 0 4px;display:grid;gap:var(--a2)}
.aufklapp__inhalt .zeile{margin:0}
.zeile--tab{display:flex;flex-wrap:wrap;align-items:center}
.zeile--tab > .zahl{flex:1 1 92px;min-width:0}
.zeile--tab > select{flex:1 1 84px;width:auto;min-width:0}
.zeile--tab > input.feld--text{flex:0 0 44px;width:44px;text-align:center}
.zeile--tab > input.feld--code{flex:1 1 130px;text-align:left}
.feld--text{padding:0 8px!important;background-image:none!important;cursor:text}
.feld--code{font-family:"Source Code Pro",ui-monospace,monospace}
.haken{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--g800)}
.haken.ist-gemischt{opacity:.7}
.unterfeld{display:grid;gap:var(--a2)}
.hinweis{margin:0;font-size:12px;color:var(--g600)}
.tablineal{position:relative;height:28px;border-radius:6px;background:var(--g100);border:1px solid var(--g300);cursor:copy;overflow:visible;touch-action:none}
.tablineal.ist-aus{cursor:default;opacity:.6}
.tablineal__strich{position:absolute;bottom:0;width:1px;height:5px;background:var(--g400);pointer-events:none}
.tablineal__strich--lang{height:9px;background:var(--g500)}
.tablineal__stopp{position:absolute;top:3px;width:12px;height:14px;margin-left:-6px;cursor:ew-resize;background:var(--akz);clip-path:polygon(50% 0,100% 100%,0 100%)}
.tablineal__stopp--left{clip-path:polygon(40% 0,55% 0,55% 70%,100% 70%,100% 100%,40% 100%);margin-left:-5px}
.tablineal__stopp--right{clip-path:polygon(45% 0,60% 0,60% 100%,0 100%,0 70%,45% 70%);margin-left:-7px}
.tablineal__stopp--center{clip-path:polygon(43% 0,57% 0,57% 70%,100% 70%,100% 100%,0 100%,0 70%,43% 70%)}
.tablineal__stopp--decimal{clip-path:polygon(43% 0,57% 0,57% 70%,100% 70%,100% 100%,0 100%,0 70%,43% 70%,43% 40%,80% 40%,80% 55%,43% 55%)}
.tablineal__stopp.ist-weg{opacity:.3}

/* Satz-Einstellungen */
.satzdialog{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--a4);align-items:start}
@media (max-width:760px){.satzdialog{grid-template-columns:1fr}}
.satzdialog__felder{display:grid;gap:var(--a4)}
.satzblock{display:grid;gap:var(--a3)}
.satztabelle{width:100%;border-collapse:collapse;font-size:13px}
.satztabelle th{font-weight:600;text-align:left;color:var(--g700);padding:2px 6px 2px 0;white-space:nowrap}
.satztabelle thead th{font-size:12px;color:var(--g600);font-weight:500}
.satztabelle td{padding:2px 4px}
.satztabelle input{width:100%;min-width:56px}
.regler{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center;font-size:12px;color:var(--g700)}
.satzvorschau{position:sticky;top:0;display:grid;gap:8px}
.satzvorschau__kopf{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;font-size:12px;color:var(--g700)}
.satzvorschau__kopf > span{font-weight:600;color:var(--g800);margin-right:auto}
.satzvorschau__breite input{width:64px}
.satzvorschau__rahmen{background:var(--g100);border:1px solid var(--g300);border-radius:8px;padding:10px;max-height:52vh;overflow:auto}
.satzvorschau__bild{display:block;box-shadow:0 1px 3px rgba(0,0,0,.12)}
.satzvorschau__werte{font-size:12px;color:var(--g700);font-variant-numeric:tabular-nums}

/* OpenType-Palette */
.otpalette{padding:var(--a3);display:grid;gap:var(--a3)}
.otpalette__kopf{font-size:13px;color:var(--g700)}
.otpalette__kopf strong{color:var(--g900)}
.otgruppe{display:grid;gap:4px}
.otgruppe h3{margin:6px 0 2px;font-size:12px;font-weight:600;color:var(--g600);text-transform:none}
.otvorschau{display:grid;gap:2px;text-align:left;padding:6px 8px;border-radius:8px;border:1px solid transparent;background:var(--g75);color:var(--g900);cursor:pointer}
.otvorschau:hover{background:var(--g200)}
.otvorschau[aria-pressed=true]{border-color:var(--akz);background:color-mix(in srgb,var(--akz) 10%,var(--g50))}
.otvorschau__name{display:flex;justify-content:space-between;gap:8px;font-size:12px;font-weight:600}
.otvorschau__name code{font-weight:400;color:var(--g600);font-size:11px}
.otvorschau canvas{width:100%;height:30px;display:block}
.otvorschau.ist-ohne-wirkung .otvorschau__name{color:var(--g600)}

/* Lange Dokumente */
.fussnotentext{width:100%;min-height:120px;font:inherit;padding:8px;border-radius:8px;border:1px solid var(--g300);background:var(--g50);color:var(--g900)}
.verweis{display:grid;gap:var(--a3)}
.verweisliste{width:100%;height:auto;min-height:240px;padding:4px;border-radius:8px}
.tocliste{display:grid;gap:6px;max-height:320px;overflow:auto;padding-right:4px}
.tocreihe{display:grid;grid-template-columns:1fr 110px;gap:8px;align-items:center}

/* Variable Schriften */
.variabel{display:grid;gap:var(--a2)}
.achse{display:grid;gap:2px;padding:4px 0}
.achse__kopf{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--g800)}
.achse__kopf > span{margin-right:auto}
.achse__kopf code{color:var(--g600);font-size:11px}
.achse.ist-geaendert .achse__kopf > span{font-weight:600}
.achse__auto{font-size:12px}
.achse__regler{display:grid;grid-template-columns:1fr 64px;gap:8px;align-items:center}
.achse__regler input[type=range]{width:100%;accent-color:var(--akz)}
.achse__zahl{width:100%;height:28px;font-size:12px}
.verlauf{display:grid;gap:8px;margin-top:8px}
.verlauf__stopp{display:grid;grid-template-columns:1fr 64px 14px 1fr auto;gap:8px;align-items:center}
/* Ausgabe-Automatik */
dialog.fenster--breit:has(.ausgabe){max-width:min(1080px,96vw);width:1080px}
.ausgabe{display:grid;grid-template-columns:200px minmax(0,1fr);gap:var(--a4);max-height:70vh}
.ausgabe__liste{display:flex;flex-direction:column;gap:2px;overflow:auto;border-right:1px solid var(--linie);padding-right:var(--a3)}
.ausgabe__eintrag{text-align:left;border:0;background:0;padding:6px 8px;border-radius:var(--r-klein);cursor:pointer;color:var(--g800);font:inherit}
.ausgabe__eintrag:hover{background:var(--g200)}
.ausgabe__eintrag[aria-pressed="true"]{background:var(--neutral);color:var(--neutral-auf)}
.ausgabe__knoepfe{display:flex;flex-direction:column;align-items:flex-start;margin-top:var(--a3)}
.ausgabe__haupt{display:flex;flex-direction:column;gap:var(--a3);overflow:auto;padding-right:4px}
.ausgabe__karte{border:1px solid var(--linie);border-radius:var(--r-klein);padding:var(--a3);display:flex;flex-direction:column;gap:var(--a3)}
.ausgabe__kartenkopf{display:flex;justify-content:space-between;align-items:center}
.ausgabe__haken{display:flex;flex-wrap:wrap;gap:var(--a2) var(--a4)}
.ausgabe__variablen{display:flex;flex-wrap:wrap;gap:4px}
.ausgabe__variable{border:1px solid var(--linie);background:var(--g100);border-radius:999px;padding:2px 8px;font:12px/1.4 ui-monospace,monospace;cursor:pointer;color:var(--g800)}
.ausgabe__variable:hover{background:var(--g200)}
.ausgabe__beispiel{font-size:12px;color:var(--tx-2);margin:0;word-break:break-all}
.ausgabe__status{grid-column:1/-1;font-size:12px;color:var(--tx-2);min-height:16px}
.ausgabe__verlauf{display:flex;flex-direction:column;gap:6px;max-height:60vh;overflow:auto}
.ausgabe__verlauf ul{margin:4px 0 0;padding-left:18px;font-size:12px}
.ausgabe__verlauf .ist-fehler{color:var(--fehler,#c0392b)}
.stapelausgabe{display:flex;flex-direction:column;gap:var(--a3)}
.stapelausgabe__docs{display:flex;flex-direction:column;gap:4px;max-height:40vh;overflow:auto}
.stapelausgabe__rahmen{position:fixed;left:-20000px;top:0;width:1280px;height:800px;border:0;visibility:hidden}
/* Zeitleiste */
.zeitleiste{position:absolute;left:0;right:0;bottom:0;height:230px;max-height:70vh;z-index:5;display:flex;flex-direction:column;background:var(--bg);border-top:1px solid var(--linie);font-size:12px}
.flaeche[data-zeitleiste] .werkzeugleiste-schwebend{bottom:246px}
.zeitleiste__leiste{display:flex;align-items:center;gap:8px;padding:6px 10px;border-bottom:1px solid var(--linie)}
.zeitleiste__leiste .luecke{flex:1}
.zeitleiste__zeit{font-variant-numeric:tabular-nums;color:var(--tx-2);min-width:110px}
.zeitleiste__feld{display:flex;align-items:center;gap:6px;color:var(--tx-2)}
.zeitleiste__feld input{width:64px}
.zeitleiste__koerper{position:relative;flex:1;overflow:auto}
.zeitleiste__lineal,.zeitleiste__spur{display:grid;grid-template-columns:180px minmax(0,1fr);min-height:26px}
.zeitleiste__lineal{position:sticky;top:0;z-index:2;background:var(--bg);border-bottom:1px solid var(--linie)}
.zeitleiste__name{display:block;text-align:left;border:0;background:0;font:inherit;color:var(--g800);padding:4px 10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer}
.zeitleiste__skala{position:relative;cursor:ew-resize;margin-right:12px}
.zeitleiste__skala span{position:absolute;top:6px;font-size:10px;color:var(--tx-2);transform:translateX(-50%);pointer-events:none}
.zeitleiste__skala span:first-child{transform:none}
.zeitleiste__spur{border-bottom:1px solid var(--linie)}
.zeitleiste__spur.ist-ausgewaehlt{background:var(--g100)}
.zeitleiste__bahn{position:relative;margin-right:12px}
.zeitleiste__clip{position:absolute;top:3px;bottom:3px;border-radius:5px;background:#4c7cf3;color:#fff;font-size:11px;padding:0 8px;display:flex;align-items:center;overflow:hidden;white-space:nowrap;cursor:grab;touch-action:none;min-width:8px}
.zeitleiste__clip--out{background:#d4006e}
.zeitleiste__clip--loop{background:#2d9d78}
.zeitleiste__clip.ist-aktiv{outline:2px solid var(--tx);outline-offset:1px}
.zeitleiste__griff{position:absolute;right:0;top:0;bottom:0;width:8px;cursor:ew-resize;background:rgba(255,255,255,.35)}
.zeitleiste__kopfzeiger{position:absolute;top:0;bottom:0;width:2px;margin-left:-1px;background:#e34850;pointer-events:none;z-index:3}
.zeitleiste__leer{padding:12px;color:var(--tx-2);margin:0}
.zeitleiste.ist-keyframes{height:400px}
.zeitleiste__eigenschaften{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:6px 10px;border-top:1px solid var(--linie)}
.zeitleiste input[type=number],.zeitleiste select{height:26px;font-size:12px;padding-top:0;padding-bottom:0}
.zeitleiste__skala span:last-child{transform:translateX(-100%)}
.start__logo{width:40px;height:40px;flex-shrink:0}
.logo__akzent{fill:#89adb3}
.kopf__marke{width:20px;height:20px;flex-shrink:0;margin-right:2px}
.start__version{margin-top:48px;font-size:11px;color:var(--tx-2)}
.datenzusammen__raster{display:grid;grid-template-columns:minmax(0,1fr) 240px;gap:var(--a4);margin-top:var(--a3)}
.datenzusammen__vorschau{display:block;max-width:100%;max-height:340px;margin-top:8px;box-shadow:0 1px 4px rgba(0,0,0,.2);background:#fff}
.datenzusammen__werte{font-size:12px;color:var(--tx-2);margin-top:6px;word-break:break-word}

/* Startseite: Bühne, Abschnitte, Dokumentkarten */
.startbuehne{--buehne-bg:#12120d;--buehne-tx:#f2f1ea;--akzent:#89adb3;background:var(--buehne-bg);color:var(--buehne-tx);overflow:hidden;position:relative}
.startbuehne .start__huelle{padding-bottom:var(--a8)}
.startbuehne .start__kopf svg,.startbuehne .start__marke{color:var(--buehne-tx)}
.startbuehne .start__konto .knopf{background:rgba(255,255,255,.1);color:var(--buehne-tx)}
.startbuehne .start__konto .knopf:hover{background:rgba(255,255,255,.18)}
.startbuehne__raster{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);align-items:center;gap:var(--a6)}
.startbuehne__zeile{margin:0 0 var(--a4);font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--akzent);font-weight:700}
.startbuehne h1{font-size:clamp(40px,6.4vw,84px);line-height:.98;font-weight:900;letter-spacing:-.025em;margin:0 0 var(--a5);text-wrap:balance}
.startbuehne .lede{font-size:clamp(16px,1.6vw,19px);line-height:1.5;max-width:52ch;margin:0 0 var(--a6);color:rgba(242,241,234,.82)}
.startbuehne__aktionen{display:flex;flex-wrap:wrap;gap:var(--a3)}
.startbuehne__medaillon{justify-self:end;width:min(100%,420px);aspect-ratio:1;border-radius:50%;background:var(--buehne-tx);display:grid;place-items:center;box-shadow:0 40px 80px rgba(0,0,0,.5),0 0 0 14px rgba(137,173,179,.25)}
.startbuehne__logo{width:74%;height:74%;color:#12120d}
.knopf--gross{height:48px;padding:0 24px;font-size:16px;border-radius:999px}
.knopf--akzent{background:var(--akzent,#89adb3);color:#12120d}
.knopf--akzent:hover{background:#a3c3c8}
.knopf--hell{background:transparent;color:var(--buehne-tx,#fff);box-shadow:inset 0 0 0 2px rgba(242,241,234,.55)}
.knopf--hell:hover{background:rgba(255,255,255,.1)}
.start__abschnitt{font-size:clamp(22px,2.6vw,32px);font-weight:900;letter-spacing:-.01em;margin:var(--a8) 0 var(--a5)}
.start__abschnittkopf{display:flex;align-items:baseline;justify-content:space-between;gap:var(--a4);flex-wrap:wrap}
.start__listenaktionen{display:flex;gap:var(--a2)}
.dokumente{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:var(--a6) var(--a5)}
.dokumente > p{grid-column:1/-1}
.dokkarte{display:flex;flex-direction:column;gap:6px;color:var(--tx);text-decoration:none;min-width:0}
.dokkarte__bild{position:relative;aspect-ratio:4/5;border-radius:var(--r-gross);background:linear-gradient(145deg,var(--g100),var(--g200));display:grid;place-items:center;overflow:hidden;transition:transform .18s ease,box-shadow .18s ease}
.dokkarte__bild img{position:absolute;inset:10%;width:80%;height:80%;object-fit:contain;filter:drop-shadow(0 6px 14px rgba(13,13,18,.22))}
.dokkarte__initiale{font-size:84px;font-weight:900;color:var(--g400);line-height:1}
.dokkarte__bild.hat-bild .dokkarte__initiale{visibility:hidden}
.dokkarte:hover .dokkarte__bild{transform:translateY(-4px);box-shadow:var(--schwebe)}
.dokkarte:focus-visible{outline:0}
.dokkarte:focus-visible .dokkarte__bild{box-shadow:var(--ring)}
.dokkarte__titel{font-weight:800;font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dokkarte__meta{font-size:12px;color:var(--tx-3)}
@media (max-width:760px){
  .startbuehne__raster{grid-template-columns:1fr}
  .startbuehne__medaillon{width:180px;justify-self:start;order:-1}
}
/* Druckvorstufe */
.pruefknopf{white-space:nowrap}
dialog.fenster--breit:has(.dv){max-width:min(1180px,96vw);width:1180px}
.dv{display:flex;flex-direction:column;gap:var(--a3);min-height:60vh}
.dv__reiter{display:flex;flex-wrap:wrap;gap:4px;border-bottom:1px solid var(--linie);padding-bottom:6px}
.dv__reiter button{border:0;background:0;font:inherit;font-weight:600;color:var(--g800);padding:6px 10px;border-radius:var(--r-klein);cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.dv__reiter button:hover{background:var(--g200)}
.dv__reiter button[aria-selected="true"]{background:var(--neutral);color:var(--neutral-auf)}
.dv__zahl{font-size:11px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--warn);color:#fff;display:inline-grid;place-items:center}
.dv__inhalt{max-height:62vh;overflow:auto}
.dv__ampel{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:var(--r);background:var(--g100);border-left:6px solid var(--gut)}
.dv__ampel strong{font-size:18px}
.dv__ampel[data-art="warnung"]{border-left-color:var(--warn)}
.dv__ampel[data-art="kritisch"]{border-left-color:var(--schlecht)}
.dv__kacheln{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:var(--a3)}
.dv__kachel{display:flex;flex-direction:column;gap:2px;padding:12px;border-radius:var(--r);background:var(--flaeche);border:1px solid var(--linie);border-top:4px solid var(--g300)}
.dv__kachel[data-art="gut"]{border-top-color:var(--gut)}
.dv__kachel[data-art="warnung"],.dv__kachel[data-art="hinweis"]{border-top-color:var(--warn)}
.dv__kachel[data-art="kritisch"]{border-top-color:var(--schlecht)}
.dv__kachelwert{font-size:24px;font-weight:800}
.dv__kacheltitel{font-weight:600}
.dv__kachelspur{font-size:12px;color:var(--tx-2)}
.dv__tabellenhuelle{overflow:auto;border:1px solid var(--linie);border-radius:var(--r)}
.dv__tabelle{width:100%;border-collapse:collapse;font-size:12px}
.dv__tabelle th{position:sticky;top:0;background:var(--g100);text-align:left;font-weight:600;padding:6px 8px;white-space:nowrap}
.dv__tabelle td{padding:6px 8px;border-top:1px solid var(--linie);vertical-align:middle}
.dv__tabelle tr.ist-klickbar,.liste > li.ist-klickbar{cursor:pointer}
.dv__tabelle tr.ist-klickbar:hover td{background:var(--g100)}
.dv__vorschau{width:44px;height:44px;object-fit:contain;background:repeating-conic-gradient(var(--g200) 0 25%,transparent 0 50%) 0 0/10px 10px;border-radius:4px;display:block}
.dv__name{display:inline-block;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle}
.dv__wert{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.dv__wert::before,.dv__farbraum[data-art]::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--g400)}
.dv__wert[data-art="gut"]::before{background:var(--gut)}
.dv__wert[data-art="warnung"]::before,.dv__wert[data-art="hinweis"]::before,.dv__farbraum[data-art="hinweis"]::before{background:var(--warn)}
.dv__wert[data-art="kritisch"]::before{background:var(--schlecht)}
.dv__farbraum{display:inline-flex;align-items:center;gap:6px}
.dv__farbraum[data-art=""]::before{display:none}
.dv__farbraum[data-art="gut"]::before{background:var(--gut)}
.dv__farbe{display:inline-flex;align-items:center;gap:6px}
.dv__farbfeld{width:14px;height:14px;border-radius:3px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.2)}
.registerliste{max-height:46vh;overflow:auto}
/* Glyphen */
.glyphen__kopf{display:flex;flex-direction:column;gap:6px;padding:var(--a3)}
.glyphen__kopf .zeile{display:flex;gap:6px}
.glyphen__kopf select{min-width:0;flex:1}
.glyphen__raster{display:grid;grid-template-columns:repeat(auto-fill,minmax(36px,1fr));gap:2px;padding:0 var(--a3);max-height:calc(100vh - 330px);overflow:auto}
.glyphen__zelle{border:1px solid var(--linie);background:var(--flaeche);border-radius:4px;padding:0;display:grid;place-items:center;cursor:pointer;color:var(--tx)}
.glyphen__zelle:hover:not(:disabled){background:var(--g200);border-color:var(--g400)}
.glyphen__zelle:disabled{cursor:default;opacity:.85}
.glyphen__fuss{display:flex;align-items:center;gap:8px;padding:6px var(--a3);font-size:12px;color:var(--tx-2);flex-wrap:wrap}
.glyphen__tipp{font-style:italic}
.sepanzeige{position:absolute;right:16px;top:16px;z-index:6;background:#12120d;color:#fff;font-size:12px;font-weight:600;padding:4px 10px;border-radius:999px;pointer-events:none}
/* Bibliothek */
.bibliothek__kopf{display:flex;flex-direction:column;gap:6px;padding:var(--a3)}
.bibliothek__kopf .zeile{display:flex;gap:6px;align-items:center}
.bibliothek__kopf .zeile .knopf:first-child{flex:1}
.bibliothek__kopf .zeile .auswahlfeld{flex:1;min-width:0}
/* Keyframes in der Zeitleiste */
.zeitleiste__clip--keys{background:light-dark(#dbe6ff,#26375f);color:var(--tx);overflow:visible}
.zeitleiste__clip--keys>span:first-child{pointer-events:none}
.zeitleiste__raute{position:absolute;z-index:3;top:50%;width:9px;height:9px;margin:-5px 0 0 -5px;background:var(--akz);border:1px solid var(--g25);transform:rotate(45deg);cursor:ew-resize}
.zeitleiste__raute.ist-aktiv{background:var(--g25);border-color:var(--akz);box-shadow:0 0 0 2px var(--akz)}
.zeitleiste__keys{grid-column:1/-1;display:flex;flex-direction:column;gap:6px;align-items:flex-start;max-width:100%;max-height:150px;overflow:auto}
.zeitleiste__keytabelle{border-collapse:collapse;font-size:12px}
.zeitleiste__keytabelle th,.zeitleiste__keytabelle td{padding:1px 3px;font-weight:400;color:var(--g700)}
.zeitleiste__keytabelle thead th{font-size:11px}
.zeitleiste__keytabelle input{width:64px;height:24px;border:1px solid var(--linie);border-radius:6px;background:var(--g25);color:inherit;font:inherit;font-size:12px;padding:0 4px}
.zeitleiste__keytabelle tr.ist-aktiv input{border-color:var(--akz)}

.liste__zeile{display:flex;align-items:center;gap:6px;width:100%;background:none;border:0;color:inherit;font:inherit;padding:2px 0;cursor:pointer;text-align:left}
.liste__zeile:hover{color:var(--akz)}
.freigabe__rahmen{margin-top:4px}
.medusa__blick{position:absolute;inset:0;z-index:40;pointer-events:none}
.medusa__blicksprite{position:absolute;image-rendering:pixelated;animation:medusaAuftritt .18s ease-out;filter:drop-shadow(0 4px 10px rgba(0,0,0,.3))}
.medusa__blicksprite svg{width:100%;height:auto;display:block}
@keyframes medusaAuftritt{from{opacity:0;transform:scale(.6)}to{opacity:1}}
.medusa__strahlen{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.medusa__strahlen line{stroke:#ffe9a8;stroke-width:3;stroke-linecap:round;filter:drop-shadow(0 0 6px #ffd24a);animation:medusaStrahl .5s ease-out}
.medusa__strahlen.ist-aus{opacity:0;transition:opacity .2s}
@keyframes medusaStrahl{from{stroke-width:0;opacity:0}40%{stroke-width:6;opacity:1}to{stroke-width:3}}
.medusa__stein{position:absolute;border-radius:2px;background:linear-gradient(135deg,#9a968f,#6f6b65 40%,#8d8981 70%,#5f5b56);opacity:0;transition:opacity .45s ease-in;box-shadow:inset 0 0 0 2px rgba(0,0,0,.25)}
.medusa__stein.ist-stein{opacity:.92}
.medusa__stein.zerfaellt{animation:medusaZerfall .34s ease-in forwards}
@keyframes medusaZerfall{to{opacity:0;transform:translateY(14px) scale(.94) rotate(1.5deg);filter:blur(1px)}}
@media (prefers-reduced-motion: reduce){.medusa__blicksprite,.medusa__strahlen line,.medusa__stein{animation:none}}
.medusa__rahmen{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center}
.medusa{width:230px;max-width:60vw;cursor:pointer}
.medusa svg{width:100%;height:auto;display:block}
.medusa__blase{position:relative;margin:2px 0 0;padding:10px 16px;border:1px solid var(--linie);border-radius:14px;background:var(--flaeche);font-size:15px;max-width:34ch}
.neuigkeiten{display:flex;flex-direction:column;gap:18px;max-height:60vh;overflow:auto}
.neuigkeiten__fassung h3{display:flex;align-items:baseline;gap:10px;font-size:16px;margin:0 0 8px}
.neuigkeiten__datum{font-size:12px;font-weight:400;color:var(--g700)}
.neuigkeiten__gruppe h4{font-size:13px;margin:10px 0 4px;color:var(--g800)}
.neuigkeiten__gruppe ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:3px}
.neuigkeiten__gruppe li{font-size:13px;line-height:1.45}
.farbfeldwahl{width:100%;height:28px;padding:2px;border:1px solid var(--linie);border-radius:6px;background:var(--g25);cursor:pointer}
.anzeige__block{padding:var(--a3);border-top:1px solid var(--linie);display:flex;flex-direction:column;gap:6px}
.anzeige__block:first-child{border-top:0}
.feld__zeile{display:flex;flex-direction:column;gap:3px}
.feld__mini{font-size:11px;color:var(--g700)}

/* Brandkits */
.kit{padding:var(--a3);border-top:1px solid var(--linie);display:flex;flex-direction:column;gap:6px}
.kit:first-of-type{border-top:0}
.kit__kopf{display:flex;align-items:center;gap:6px}
.kit__name{flex:1;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kit__farben{display:flex;flex-wrap:wrap;gap:4px}
.kit__farbe{width:18px;height:18px;border-radius:4px;border:1px solid var(--linie)}
.kit__logos{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:6px}
.kit__logo{aspect-ratio:1;border-radius:8px;border:1px solid var(--linie);background:var(--flaeche);display:grid;place-items:center;overflow:hidden;cursor:pointer;padding:2px;font-size:11px}
.kit__logo img{max-width:100%;max-height:100%}
.kit__logo:hover:not(:disabled){border-color:var(--g400);box-shadow:var(--schwebe)}
.bibliothek__raster{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px;padding:0 var(--a3) var(--a3)}
.bibliothek__eintrag{display:flex;flex-direction:column;gap:4px;cursor:pointer;min-width:0}
.bibliothek__bild{aspect-ratio:1;border-radius:8px;border:1px solid var(--linie);background:repeating-conic-gradient(var(--g100) 0 25%,var(--flaeche) 0 50%) 0 0/12px 12px;display:grid;place-items:center;overflow:hidden}
.bibliothek__bild img{max-width:100%;max-height:100%}
.bibliothek__eintrag:hover .bibliothek__bild{border-color:var(--g400);box-shadow:var(--schwebe)}
.bibliothek__bild--format{background:var(--flaeche)}
.bibliothek__farbe{width:100%;height:100%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}
.bibliothek__stil{display:flex;flex-direction:column;align-items:center;gap:2px;color:var(--g700)}
.bibliothek__stil b{font-size:20px;font-weight:600;color:var(--tx)}
.bibliothek__stil small{font-size:10px}
.bibliothek__name{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Inspect-Modus */
.inspektknopf::before{background:var(--g500)}
.inspektknopf[aria-pressed="true"]{background:#12120d;color:#fff}
.inspektknopf[aria-pressed="true"]::before{background:#89adb3}
.flaeche[data-inspect]{box-shadow:inset 0 0 0 3px #e34850}
.inspektanzeige{position:absolute;left:50%;top:12px;transform:translateX(-50%);z-index:6;display:flex;align-items:center;gap:10px;background:#12120d;color:#fff;font-size:12px;font-weight:600;padding:4px 6px 4px 12px;border-radius:999px}
.inspektanzeige button{border:0;border-radius:999px;background:#e34850;color:#fff;font:inherit;padding:3px 10px;cursor:pointer}
.inspekt__kopf{display:flex;align-items:center;justify-content:space-between;gap:6px;padding:var(--a3)}
.inspekt__filter{display:flex;flex-wrap:wrap;gap:4px;padding:0 var(--a3) var(--a3)}
.inspekt__chip{display:inline-flex;align-items:center;gap:4px;font-size:11px;padding:2px 8px;border-radius:999px;background:var(--g100);cursor:pointer;color:var(--g800)}
.inspekt__chip input{margin:0;width:12px;height:12px}
.inspekt__chip[data-an="true"]{background:var(--g200);color:var(--tx)}
.inspekt__block{display:flex;flex-direction:column;gap:4px}
.inspekt__zeile{display:grid;grid-template-columns:96px minmax(0,1fr);gap:8px;font-size:12px;align-items:baseline}
.inspekt__schluessel{color:var(--tx-2);overflow:hidden;text-overflow:ellipsis}
.inspekt__wert{font-variant-numeric:tabular-nums;word-break:break-word;display:inline-flex;flex-wrap:wrap;align-items:center;gap:4px}
.inspekt__wert[data-art]:not([data-art=""])::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--g400);flex-shrink:0}
.inspekt__wert[data-art="gut"]::before{background:var(--gut)}
.inspekt__wert[data-art="warnung"]::before,.inspekt__wert[data-art="hinweis"]::before{background:var(--warn)}
.inspekt__wert[data-art="kritisch"]::before{background:var(--schlecht)}
.inspekt__unter{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--tx-3);margin-top:6px}
.inspekt__gut{font-size:12px;color:var(--tx-2);margin:0}
.inspekt__fuss{padding:var(--a3)}
/* Viele Reiter: waagrecht scrollen statt abschneiden */
.leistenreiter{overflow-x:auto;overflow-y:hidden;scrollbar-width:none;gap:14px}
.leistenreiter::-webkit-scrollbar{display:none}
.leistenreiter button[data-tab]{flex:none;white-space:nowrap}
.anzeige__pruefung:empty{display:none}
.vorlage__anzeige{background:#fff;box-shadow:0 1px 3px rgba(13,13,18,.25);display:grid;place-items:center;color:#6a6a78;font-size:11px;max-width:86%;max-height:84%;overflow:hidden}
/* Freigabe */
.freigabeleiste{position:absolute;left:50%;top:12px;transform:translateX(-50%);z-index:6;display:flex;align-items:center;gap:10px;background:#12120d;color:#fff;font-size:13px;padding:6px 8px 6px 14px;border-radius:999px;box-shadow:var(--schwebe);max-width:min(92%,760px)}
.freigabeleiste__text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.freigabe__kopf{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:var(--a3)}
.freigabe__status{font-weight:700;padding:3px 10px;border-radius:999px;background:var(--g200);color:var(--g800)}
.freigabe__status[data-status="pruefung"]{background:var(--warn);color:#fff}
.freigabe__status[data-status="freigegeben"]{background:var(--gut);color:#fff}
.freigabe__status[data-status="aenderungen"]{background:var(--schlecht);color:#fff}
.freigabe__block{padding:0 var(--a3) var(--a3)}
.freigabe__diffs{display:flex;flex-direction:column;gap:8px;max-height:40vh;overflow:auto}
.freigabe__diff{margin:0;font-size:12px;line-height:1.5;background:var(--flaeche);border:1px solid var(--linie);border-radius:var(--r-klein);padding:6px 8px;white-space:pre-wrap}
.freigabe__diff .ist-neu{background:rgba(45,157,120,.22);border-radius:2px}
.freigabe__diff .ist-weg{background:rgba(227,72,80,.18);text-decoration:line-through;border-radius:2px}
