/* Kalk-App — Stylesheet (Spec Auftrag 3, 8.7).
   Tokens unverändert aus scripts/build-report.py CSS_TOKENS (report/DESIGN.md,
   Punkte 1–3): keine neue Farbwelt. Der Abschnitt zwischen KOPF-START und
   KOPF-ENDE wird von scripts/build-report.py --app in die statischen Kopien
   (Dossier, Review) eingebettet — dort nur .kk-Klassen, keine Elementregeln. */

:root{
  color-scheme: light;
  --paper:#f7f6f4; --surface:#fffefc; --surface-2:#f0eeea; --surface-3:#e7e4de;
  --ink:#191714; --ink-2:#4a463f; --ink-3:#736d63;
  --rule:#d8d4cc; --rule-strong:#b8b2a6;
  --accent:#9c1f35; --accent-ink:#7c1628; --accent-wash:#f6e7e9;
  --gold:#7d5f00; --gold-wash:#f6efdb;
  --s1:#b4243f; --s2:#1f6fc4; --s3:#c08a00; --s4:#0f8a6a;
  --ok:#0f6b4f; --warn:#8a5a00; --bad:#9c1f35;
  --shadow:0 1px 0 rgba(25,23,20,.05);
  --sans:"IBM Plex Sans","Segoe UI",system-ui,-apple-system,Helvetica,Arial,sans-serif;
  --serif:"Spectral",Georgia,"Times New Roman",serif;
  --mono:"IBM Plex Mono","SFMono-Regular",Menlo,Consolas,monospace;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    color-scheme: dark;
    --paper:#141413; --surface:#1c1b19; --surface-2:#252320; --surface-3:#302d29;
    --ink:#f1efea; --ink-2:#c5c0b6; --ink-3:#928c81;
    --rule:#3a3733; --rule-strong:#57524b;
    --accent:#e6798c; --accent-ink:#f0a0ae; --accent-wash:#3a2129;
    --gold:#d9b25e; --gold-wash:#332b17;
    --s1:#d24a63; --s2:#3f8ce0; --s3:#b08213; --s4:#14a077;
    --ok:#4bbd93; --warn:#d9a441; --bad:#e6798c;
    --shadow:0 1px 0 rgba(0,0,0,.35);
  }
}
:root[data-theme="dark"]{
  color-scheme: dark;
  --paper:#141413; --surface:#1c1b19; --surface-2:#252320; --surface-3:#302d29;
  --ink:#f1efea; --ink-2:#c5c0b6; --ink-3:#928c81;
  --rule:#3a3733; --rule-strong:#57524b;
  --accent:#e6798c; --accent-ink:#f0a0ae; --accent-wash:#3a2129;
  --gold:#d9b25e; --gold-wash:#332b17;
  --s1:#d24a63; --s2:#3f8ce0; --s3:#b08213; --s4:#14a077;
  --ok:#4bbd93; --warn:#d9a441; --bad:#e6798c;
  --shadow:0 1px 0 rgba(0,0,0,.35);
}


*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans);
  font-size:16px; line-height:1.6; font-feature-settings:"kern" 1; overflow-wrap:break-word}
h1,h2,h3{font-family:var(--serif); font-weight:600; line-height:1.2; margin:0 0 .5em}
h1{font-size:clamp(1.6rem,1.2rem + 1.6vw,2.4rem); letter-spacing:-.01em}
p{margin:0 0 1rem; max-width:74ch}
a{color:var(--accent); text-underline-offset:2px}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{
  outline:2px solid var(--accent); outline-offset:2px; border-radius:2px}
.skip{position:absolute; left:-9999px; top:0; background:var(--accent); color:#fff; padding:.6rem 1rem; z-index:99}
.skip:focus{left:.5rem; top:.5rem}
.eyebrow{font-family:var(--mono); font-size:.72rem; letter-spacing:.13em; text-transform:uppercase;
  color:var(--ink-3); margin:0 0 .5rem}
.leise{color:var(--ink-3); font-size:.86rem}
.btn{font:inherit; font-size:.9rem; background:var(--surface-2); color:var(--ink); border:1px solid var(--rule-strong);
  border-radius:3px; padding:.5rem 1rem; cursor:pointer; min-height:40px}
.btn:hover{background:var(--surface-3)}
.btn-accent{background:var(--accent); border-color:var(--accent); color:#fff}
.btn-accent:hover{background:var(--accent-ink)}
.kk-main{max-width:1500px; margin:0 auto; padding:2rem 1rem 3rem}

/* ------------------------------------------------ Platzhalter (Phase 18) */
.platzhalter{background:var(--surface); border:1px solid var(--rule); padding:1.5rem 1.5rem 1rem; max-width:62rem}

/* ------------------------------------------------------------- Login --- */
body.login .kk-main{display:flex; justify-content:center; padding-top:clamp(2rem,8vh,5rem)}
.login-karte{width:100%; max-width:26rem; background:var(--surface); border:1px solid var(--rule-strong);
  padding:1.75rem 1.5rem 1.25rem; box-shadow:var(--shadow)}
.login-karte h1{font-size:1.9rem; margin-bottom:1rem}
.login-karte form{display:flex; flex-direction:column; gap:.35rem; margin-bottom:1rem}
.login-karte label{font-size:.84rem; font-weight:500; color:var(--ink-2); margin-top:.5rem}
.login-karte input{font:inherit; font-size:1rem; padding:.55rem .7rem; min-height:44px; background:var(--paper);
  color:var(--ink); border:1px solid var(--rule-strong); border-radius:3px}
.login-karte input:focus{border-color:var(--accent)}
.login-karte .btn{margin-top:1rem; align-self:flex-start}
.login-fehler{border-left:3px solid var(--bad); background:var(--accent-wash); color:var(--accent-ink);
  padding:.5rem .75rem; font-size:.9rem}

/* KOPF-START ----------------------------------------------- App-Kopf ---
   Fester dunkler Streifen aus den Dark-Mode-Tokens von report/DESIGN.md —
   in hellem und dunklem Thema gleich, damit er auch über dem Review (eigene
   Farbwelt, kein Dark Mode) ohne Theme-Logik trägt. Aktive Ansicht in
   Opernrot (#9c1f35, Weiß darauf 7,9:1). */
.kk{--kk-bg:#141413; --kk-fl:#1c1b19; --kk-fl2:#252320; --kk-tx:#f1efea; --kk-tx2:#c5c0b6; --kk-tx3:#928c81;
  --kk-rule:#3a3733; --kk-rule2:#57524b; --kk-akz:#9c1f35; --kk-akz2:#e6798c; --kk-gold:#d9b25e;
  background:var(--kk-bg); color:var(--kk-tx); border-bottom:1px solid var(--kk-rule);
  font-family:"IBM Plex Sans","Segoe UI",system-ui,-apple-system,Helvetica,Arial,sans-serif;
  font-size:14px; line-height:1.4; position:relative; z-index:30}
.kk *,.kk *::before,.kk *::after{box-sizing:border-box}
.kk-in{max-width:1500px; margin:0 auto; padding:.5rem 1rem; display:flex; flex-wrap:wrap;
  align-items:center; gap:.5rem 1rem}
.kk a{color:inherit}
.kk-marke{display:inline-flex; align-items:center; gap:.5rem; text-decoration:none; color:var(--kk-tx);
  margin-right:.25rem; min-height:40px}
.kk-r{display:inline-grid; place-items:center; width:26px; height:26px; background:var(--kk-akz); color:#fff;
  font-family:"Spectral",Georgia,serif; font-weight:700; font-size:17px; border-radius:2px}
.kk-mt{font-family:"Spectral",Georgia,serif; font-weight:600; font-size:17px; letter-spacing:.005em}
.kk-intern{font-family:"IBM Plex Mono",Menlo,Consolas,monospace; font-size:10px; letter-spacing:.12em;
  text-transform:uppercase; color:var(--kk-gold); border:1px solid #57524b; border-radius:2px; padding:0 .3rem}
.kk-nav{display:inline-flex; border:1px solid var(--kk-rule2); border-radius:3px; overflow:hidden}
.kk-nav a{display:inline-flex; align-items:center; min-height:34px; padding:.3rem .8rem; text-decoration:none;
  color:var(--kk-tx); background:var(--kk-fl); font-size:13.5px; white-space:nowrap}
.kk-nav a+a{border-left:1px solid var(--kk-rule2)}
.kk-nav a:hover{background:var(--kk-fl2)}
.kk-nav a[aria-current="page"]{background:var(--kk-akz); color:#fff; font-weight:600; cursor:default}
.kk-wahl{display:none; position:relative}
.kk-wahl summary{list-style:none; cursor:pointer; min-height:40px; display:inline-flex; align-items:center; gap:.45rem;
  padding:.3rem 2rem .3rem .75rem; border:1px solid var(--kk-rule2); border-radius:3px; background:var(--kk-fl);
  font-weight:600; position:relative}
.kk-wahl summary::-webkit-details-marker{display:none}
.kk-wahl summary::after{content:""; position:absolute; right:.75rem; top:50%; width:7px; height:7px; margin-top:-5px;
  border-right:2px solid var(--kk-tx2); border-bottom:2px solid var(--kk-tx2); transform:rotate(45deg)}
.kk-wahl[open] summary::after{transform:rotate(-135deg); margin-top:-1px}
.kk-wahl-l{font-weight:400; color:var(--kk-tx3); font-size:12px; text-transform:uppercase; letter-spacing:.08em}
.kk-wahl-m{position:absolute; left:0; top:calc(100% + 4px); min-width:15rem; display:flex; flex-direction:column;
  background:var(--kk-fl); border:1px solid var(--kk-rule2); border-radius:3px; box-shadow:0 6px 18px rgba(0,0,0,.35)}
.kk-wahl-m a{padding:.65rem .9rem; min-height:44px; text-decoration:none; color:var(--kk-tx)}
.kk-wahl-m a+a{border-top:1px solid var(--kk-rule)}
.kk-wahl-m a:hover{background:var(--kk-fl2)}
.kk-wahl-m a[aria-current="page"]{border-left:3px solid var(--kk-akz2); font-weight:600}
.kk-akt{display:flex; flex-wrap:wrap; align-items:center; gap:.4rem .5rem; margin-left:auto}
.kk-btn{font:inherit; font-size:13px; display:inline-flex; align-items:center; min-height:34px; padding:.3rem .7rem;
  color:var(--kk-tx); background:var(--kk-fl2); border:1px solid var(--kk-rule2); border-radius:3px;
  cursor:pointer; text-decoration:none; white-space:nowrap}
.kk-btn:hover{background:#302d29}
.kk-btn:focus-visible,.kk a:focus-visible,.kk summary:focus-visible{outline:2px solid var(--kk-akz2); outline-offset:2px}
.kk-wer{color:var(--kk-tx2); font-size:13px; padding:0 .15rem; max-width:14rem; overflow:hidden;
  text-overflow:ellipsis; white-space:nowrap}
.kk-ab{margin:0; display:inline}
@media (max-width:1100px){ .kk-intern{display:none} }
@media (max-width:760px){
  .kk-nav{display:none}
  .kk-wahl{display:block}
  .kk-mt{display:none}
  .kk-btn{min-height:40px}
}
@media (max-width:420px){ .kk-wer{display:none} .kk-akt{margin-left:0; width:100%} }
@media print{ .kk{display:none !important} }
/* KOPF-ENDE */

@media (prefers-reduced-motion: reduce){*{animation:none !important; transition:none !important}}

/* =================================================== Kalkulation (Phase 21) ===
   report/DESIGN.md Punkte 11–20 in die App übertragen. Neu nur: Serienkante
   DH Electronics = --s2 (blau), lemon42 = --s1 (rot) — dieselbe Zuordnung in
   Spaltenköpfen, Summenkarte, Kacheln, Summenleiste und Diagramm (dataviz-
   Validator: hell und dunkel alle Prüfungen PASS). */
body.kalk .kk-main{padding-top:1.25rem}
.kalk code{font-family:var(--mono); font-size:.86em; background:var(--surface-2); padding:.05em .3em; border-radius:2px}
.sr{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
.kalk .btn{min-height:36px; padding:.35rem .8rem; font-size:.84rem}
.btn-k{min-height:32px !important; padding:.2rem .6rem !important; font-size:.8rem !important}
.btn-gefahr{background:var(--bad); border-color:var(--bad); color:#fff}
.btn-gefahr:hover{background:var(--accent-ink)}
:root[data-theme="dark"] .btn-gefahr{color:#141413}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .btn-gefahr{color:#141413} }

/* Kopf */
.k-kopf{display:flex; flex-wrap:wrap; gap:1rem 2.5rem; align-items:flex-end; justify-content:space-between;
  border-bottom:1px solid var(--rule-strong); padding-bottom:1rem; margin-bottom:1.1rem}
.k-kopf h1{margin:0 0 .35rem}
.k-kopf .sub{color:var(--ink-2); max-width:70ch; margin:0; font-size:.95rem}
.legend{display:flex; flex-wrap:wrap; gap:.4rem .5rem; align-items:center; font-size:.8rem}
.leg-t{color:var(--ink-3); font-size:.8rem; margin-right:.2rem}
.mk{font-family:var(--mono); font-size:.72rem; padding:.1rem .4rem .1rem .45rem; border-radius:2px; white-space:nowrap; display:inline-block}
.mk-fact{border-left:3px solid var(--ink); background:var(--surface-2); color:var(--ink-2)}
.mk-l42{border-left:3px dashed var(--accent); background:var(--accent-wash); color:var(--accent-ink)}
.mk-open{border-left:3px dotted var(--gold); background:var(--gold-wash); color:var(--gold)}
.mk-ext{border-left:3px double var(--s2); background:color-mix(in srgb, var(--s2) 12%, var(--surface)); color:var(--s2)}
.mk-hol{border-left:3px solid var(--accent); background:var(--accent-wash); color:var(--accent-ink)}
.legend .mk{cursor:help}

/* Fortschritt (DESIGN 11) */
.prog{border:1px solid var(--rule); background:var(--surface); padding:.75rem 1rem .8rem; margin:0 0 1rem}
.prog-h{display:flex; flex-wrap:wrap; gap:.3rem 1rem; align-items:baseline; margin-bottom:.5rem}
.prog-h b{font-family:var(--serif); font-size:1.02rem; font-weight:600}
.prog-h span{font-size:.84rem; color:var(--ink-2)}
.bar{display:flex; height:12px; border:1px solid var(--rule-strong); background:var(--surface-2); overflow:hidden}
.bar i{display:block; height:100%}
.b-belegt{background:var(--ink)} .b-annahme{background:var(--gold)} .b-holen{background:var(--accent)}
.prog-k{display:flex; flex-wrap:wrap; gap:.3rem 1.3rem; margin:.5rem 0 0; font-size:.84rem; color:var(--ink-2)}
.prog-k div{display:flex; gap:.4rem; align-items:center}
.prog-k b{font-family:var(--mono); font-variant-numeric:tabular-nums; color:var(--ink); font-weight:600}
.sw{width:10px; height:10px; display:inline-block; border:1px solid var(--rule-strong); flex:none}
.sw-belegt{background:var(--ink)} .sw-annahme{background:var(--gold)} .sw-holen{background:var(--accent)} .sw-leer{background:var(--surface-2)}
.sw-dh{background:var(--s2); border-color:var(--s2)} .sw-l42{background:var(--s1); border-color:var(--s1)} .sw-sum{background:transparent; border-color:transparent}

/* Werkzeugleiste (sticky, DESIGN 17) */
.tools{display:flex; flex-wrap:wrap; gap:.45rem .6rem; align-items:center; padding:.5rem .7rem; background:var(--surface-2);
  border:1px solid var(--rule); margin:0 0 1.1rem; position:sticky; top:0; z-index:20}
.tools .sep{width:1px; height:22px; background:var(--rule-strong)}
.chk{display:flex; gap:.35rem; align-items:center; font-size:.82rem; color:var(--ink-2); min-height:36px; cursor:pointer}
.chk input{width:18px; height:18px; accent-color:var(--accent); margin:0}
.sprung{display:flex; flex-wrap:wrap; gap:2px}
.sprung a{font-family:var(--mono); font-size:.78rem; font-weight:600; min-width:28px; min-height:30px; display:inline-grid;
  place-items:center; text-decoration:none; color:var(--ink-2); border:1px solid var(--rule); background:var(--surface); border-radius:2px}
.sprung a:hover{border-color:var(--accent); color:var(--accent)}
.status{margin-left:auto; display:flex; align-items:center; gap:.5rem; font-family:var(--mono); font-size:.76rem; color:var(--ink-3)}
.status.st-err #status-txt{color:var(--bad)}
.online{display:inline-flex; gap:3px}

/* Presence-Badge (Initialen) */
.pb{font-family:var(--mono); font-size:.62rem; font-weight:600; line-height:1; letter-spacing:.02em; display:inline-grid; place-items:center;
  min-width:22px; height:18px; padding:0 .25rem; border-radius:9px; color:#fff; background:var(--s1)}
.pb-dh{background:var(--s2)}
:root[data-theme="dark"] .pb{color:#141413}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .pb{color:#141413} }
.pb-feld{position:absolute; top:-9px; right:-4px; z-index:3; box-shadow:0 0 0 2px var(--surface)}
.fw{position:relative; display:inline-flex; align-items:center; gap:.25rem; max-width:100%}
.pr-slot{position:relative; display:inline-block}
.c-id .pr-slot .pb-feld{position:static; margin-left:.25rem; box-shadow:none}
summary .pr-slot .pb-feld{position:static; margin-right:.3rem; box-shadow:none}

/* Parameter */
.pgrid{display:grid; gap:1px; background:var(--rule); border:1px solid var(--rule);
  grid-template-columns:repeat(auto-fill,minmax(min(320px,100%),1fr))}
.pcell{background:var(--surface); padding:.5rem .7rem; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:.15rem .6rem; align-items:baseline}
.pcell .pk{font-family:var(--mono); font-size:.78rem; font-weight:600; color:var(--accent-ink)}
.pcell .pn{grid-column:1/-1; font-size:.8rem; color:var(--ink-2); line-height:1.4}
.pcell .pbel{grid-column:1/-1; font-size:.74rem; color:var(--ink-3); line-height:1.45}
.pcell .pv{display:flex; gap:.35rem; align-items:baseline; justify-self:end}
.pcell .pu{font-size:.76rem; color:var(--ink-3); white-space:nowrap}
.pcell.fremd,.fremd{background:var(--gold-wash) !important; box-shadow:0 0 0 2px var(--gold); transition:background .3s ease-out, box-shadow .3s ease-out}
input.swx{width:20px; height:20px; accent-color:var(--accent); cursor:pointer; margin:0}

/* Blöcke */
.blk-sec{margin:0 0 .55rem}
details.blk{border:1px solid var(--rule); border-left:3px solid var(--rule-strong); background:var(--surface)}
details.blk[data-blk="K"]{border-left-color:var(--gold)}
details.blk[data-blk="L"]{border-left-color:var(--s2)}
details.blk > summary{cursor:pointer; padding:.55rem .8rem; list-style:none; display:flex; flex-wrap:wrap; gap:.25rem .8rem; align-items:baseline;
  position:sticky; top:var(--tools-h,52px); z-index:6; background:var(--surface)}
details.blk:not([open]) > summary{position:static}
details.blk > summary::-webkit-details-marker{display:none}
details.blk > summary::before{content:"+"; font-family:var(--mono); color:var(--accent); width:1rem}
details.blk[open] > summary::before{content:"–"}
details.blk > summary:hover{background:var(--surface-2)}
summary .bl{font-family:var(--mono); font-weight:600; font-size:.95rem}
summary .bt{font-family:var(--serif); font-size:1.05rem; font-weight:600}
summary .bc{font-size:.76rem; color:var(--ink-3); font-family:var(--mono)}
.bsum{margin-left:auto; display:flex; flex-wrap:wrap; gap:.2rem .9rem; align-items:baseline; font-family:var(--mono); font-variant-numeric:tabular-nums}
.bs-dh,.bs-l42{font-size:.76rem; color:var(--ink-2); padding-left:.4rem}
.bs-dh{border-left:3px solid var(--s2)} .bs-l42{border-left:3px solid var(--s1)}
.bsum .bs{font-size:.95rem}
details.params > summary{position:static}
.blk-in{padding:0 .8rem .8rem}
.blk-note{font-size:.84rem; color:var(--ink-2); margin:.1rem 0 .6rem; max-width:90ch}
.blk-note p{margin:0 0 .4rem; max-width:none}
.add-end{margin-top:.6rem}
.laden{color:var(--ink-3); font-family:var(--mono); font-size:.85rem; padding:1rem 0}

/* Raster (DESIGN 17; Spec 8.7: eigener Scroll-Container, kein Querscroll der Seite) */
.scrollhint{font-size:.74rem; color:var(--ink-3); font-family:var(--mono); margin:.1rem 0 .25rem; text-align:right}
.rw{overflow-x:auto; border:1px solid var(--rule); -webkit-overflow-scrolling:touch; position:relative}
.rw:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
@media (min-width:1280px){ .scrollhint{display:none} .rw{overflow:visible; border:0}
  table.raster thead th{position:sticky; top:calc(var(--tools-h,52px) + var(--sum-h,42px)); z-index:5} }
table.raster{border-collapse:collapse; width:100%; min-width:1150px; font-size:.84rem; table-layout:fixed}
col.k-id{width:3.6rem} col.k-art{width:8.4rem} col.k-mng{width:9.6rem} col.k-dh,col.k-l42{width:9rem}
col.k-sum{width:8.4rem} col.k-hk{width:7.4rem} col.k-akt{width:7rem}
table.raster th{background:var(--surface-2); box-shadow:inset 0 -1px 0 var(--rule-strong); font-size:.68rem; font-weight:600;
  letter-spacing:.03em; color:var(--ink-2); padding:.35rem .45rem; text-align:left; white-space:nowrap}
table.raster th.n,table.raster td.n{text-align:right}
.th-dh{box-shadow:inset 0 -3px 0 var(--s2) !important} .th-l42{box-shadow:inset 0 -3px 0 var(--s1) !important}
table.raster td{padding:.35rem .45rem; vertical-align:top}
tbody.zeile{border-bottom:1px solid var(--rule)}
tbody.zeile:hover > tr > td{background:color-mix(in srgb, var(--surface-2) 55%, transparent)}
tbody.zeile.is-hinweis > tr > td{background:var(--gold-wash)}
tbody.zeile.is-sw0 tr.r td{opacity:.62}
tbody.zeile.is-fehler tr.r td:first-child{box-shadow:inset 3px 0 0 var(--bad)}
.c-id{font-family:var(--mono); font-size:.8rem; white-space:nowrap}
.v-id{color:var(--ink); text-decoration:none; font-weight:600}
.v-id:hover{color:var(--accent)}
td.c-pos{line-height:1.45}
.titel{display:block}
.v-tags{display:flex; flex-wrap:wrap; gap:.25rem; margin-top:.2rem}
.v-tags:empty{display:none}
.tag{font-family:var(--mono); font-size:.64rem; letter-spacing:.03em; color:var(--ink-3); border:1px solid var(--rule-strong); padding:0 .3rem; border-radius:2px}
.tag-prov{color:var(--gold); border-color:var(--gold)}
.tag-err{color:var(--bad); border-color:var(--bad); background:var(--accent-wash); white-space:normal}
.unit{color:var(--ink-3); font-size:.78rem}
.u{display:block; color:var(--ink-3); font-size:.66rem; font-family:var(--mono); margin-top:.1rem}
.amt{font-family:var(--mono); font-variant-numeric:tabular-nums; font-weight:600; font-size:.82rem; white-space:nowrap; margin-bottom:.2rem; min-height:1.2em}
.amt.grau{color:var(--ink-3); font-weight:400}
.amt.offen,.amt-off.offen{color:var(--gold); font-weight:400; font-style:italic}
.amt-off{font-family:var(--mono); font-size:.72rem}
.none{color:var(--ink-3)}
.dv{font-family:var(--mono); font-size:.76rem; font-variant-numeric:tabular-nums; color:var(--ink-2)}
.v-sum{font-family:var(--mono); font-variant-numeric:tabular-nums; font-weight:600; white-space:nowrap}
.v-sum.none{color:var(--ink-3); font-weight:400}
.v-sum.prov{color:var(--gold)}
.mng{display:flex; flex-wrap:wrap; gap:.3rem .35rem; align-items:center}
.chip{font-family:var(--mono); font-size:.72rem; color:var(--accent-ink); background:var(--surface-2); border:1px solid var(--rule);
  padding:.05rem .35rem; border-radius:2px; text-decoration:none; cursor:help}
.fx{font-family:var(--mono); font-size:.72rem; color:var(--ink-2); background:var(--surface-2); padding:.1rem .3rem; border-radius:2px;
  display:inline-block; max-width:100%; overflow-wrap:anywhere; white-space:normal}
.fx a,.pref{color:var(--accent-ink); text-decoration:none; border-bottom:1px dotted currentColor}
.ref{font-family:var(--mono); color:var(--accent-ink)}
.ref-del{font-family:var(--mono); color:var(--bad)}

/* Eingabefelder (DESIGN 13) */
.in{font:inherit; font-size:.82rem; width:100%; padding:.24rem .4rem; border:1px solid var(--rule-strong); background:var(--paper); color:var(--ink);
  border-radius:2px; min-height:32px}
.in:hover{border-color:var(--ink-3)}
.in:focus{border-color:var(--accent); background:var(--surface)}
.in.num{font-family:var(--mono); font-variant-numeric:tabular-nums; text-align:right}
.in::placeholder{color:var(--ink-3); font-style:italic; opacity:1}
.pcell .in.num{width:7.2rem}
textarea.tx{resize:vertical; line-height:1.4; field-sizing:content; min-height:32px; max-height:12rem}
.w-titel{display:flex; width:100%}
.w-einh .in{width:5.2rem}
.w-formel{width:100%} .w-formel .in{font-family:var(--mono); font-size:.74rem}
.c-dh .fw,.c-l42 .fw{width:100%}
.c-mng .fw:not(.w-einh){flex:1 1 4.5rem}
.sel{font:inherit; font-size:.8rem; width:100%; min-height:32px; padding:.15rem .3rem; border:1px solid var(--rule-strong);
  background:var(--paper); color:var(--ink); border-radius:2px; cursor:pointer}
.c-art .fw,.c-hk .fw{width:100%}
.sel.hk{font-family:var(--mono); font-size:.74rem; border-left-width:3px}
.sel.mk-fact{border-left:3px solid var(--ink)} .sel.mk-l42{border-left:3px dashed var(--accent)}
.sel.mk-open{border-left:3px dotted var(--gold)} .sel.mk-ext{border-left:3px double var(--s2)} .sel.mk-hol{border-left:3px solid var(--accent)}
.ro{font-family:var(--mono); font-size:.8rem}
.art-ro{font-size:.8rem; color:var(--ink-2)}
.fhint{display:block; font-size:.72rem; line-height:1.35; margin-top:.2rem; color:var(--ink-2); text-align:left; font-family:var(--sans)}
.fhint-err{color:var(--bad)}

/* Aktionen */
.akt{display:flex; gap:.25rem; align-items:center; justify-content:flex-end}
.pfeile{display:flex; flex-direction:column; gap:2px}
.ib{display:inline-grid; place-items:center; width:32px; height:32px; padding:0; border:1px solid var(--rule-strong); border-radius:3px;
  background:var(--surface); color:var(--ink-2); cursor:pointer}
.ib svg{width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
.ib:hover:not(:disabled){border-color:var(--accent); color:var(--accent)}
.ib:disabled{opacity:.35; cursor:default}
.ib-sm{width:32px; height:15px; border-radius:2px} .ib-sm svg{width:13px; height:13px}
.ib-del:hover:not(:disabled){border-color:var(--bad); color:var(--bad); background:var(--accent-wash)}

/* Beleg-Zeile (DESIGN 12) */
tr.bel td{padding:0 .45rem .45rem; font-size:.78rem; color:var(--ink-3); line-height:1.5}
.bel-txt{max-width:120ch}
.lb{font-family:var(--mono); font-size:.66rem; letter-spacing:.09em; text-transform:uppercase; color:var(--ink-3); margin-right:.35rem}
.v-beleg.leer{font-style:italic}
.hw{display:block; margin-top:.1rem}
.qlinks{display:inline-flex; flex-wrap:wrap; gap:.2rem .6rem; margin-left:.5rem}
.qlink{font-family:var(--mono); font-size:.72rem; white-space:nowrap}
.bel-meta{display:flex; flex-wrap:wrap; gap:.3rem .5rem; align-items:center; margin-top:.25rem}
.meta-btn{font:inherit; font-size:.74rem; display:inline-flex; align-items:center; gap:.3rem; min-height:28px; padding:.1rem .45rem;
  border:1px solid var(--rule); border-radius:3px; background:transparent; color:var(--ink-2); cursor:pointer}
.meta-btn svg{width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linejoin:round}
.meta-btn:hover{border-color:var(--ink-3); color:var(--ink)}
.blase .k-n{font-family:var(--mono); font-weight:600}
.blase.hat{border-color:var(--accent); color:var(--accent-ink); background:var(--accent-wash)}
.bel-edit{display:grid; gap:.5rem; margin-top:.5rem; max-width:90ch}
.bel-edit label{display:grid; gap:.2rem; font-size:.76rem; color:var(--ink-2)}
.bel-edit .fw{width:100%}
.hist{margin-top:.4rem; max-width:90ch; border:1px solid var(--rule); background:var(--surface); padding:.35rem .5rem}
.t-hist{border-collapse:collapse; width:100%; font-size:.74rem}
.t-hist th,.t-hist td{padding:.2rem .4rem; border-bottom:1px solid var(--rule); text-align:left; vertical-align:top}
.t-hist th{font-size:.66rem; color:var(--ink-3)}
.t-id{font-family:var(--mono); font-size:.76rem; white-space:nowrap}
body.nobel tr.bel{display:none}

/* Kommentare (E11) */
details.kom[open]{flex:0 0 100%}
details.kom .kom-list,details.kom .kom-neu{max-width:90ch}
.kalk [hidden]{display:none !important}
details.kom > summary{cursor:pointer; font-size:.74rem; color:var(--ink-2); display:inline-flex; align-items:center; min-height:26px; list-style:none}
details.kom > summary::-webkit-details-marker{display:none}
details.kom > summary::before{content:"+"; font-family:var(--mono); color:var(--accent); margin-right:.35rem}
details.kom[open] > summary::before{content:"–"}
.kom-list{display:grid; gap:.35rem; margin:.3rem 0}
.kmt{border-left:2px solid var(--rule-strong); padding:.15rem 0 .15rem .55rem; color:var(--ink)}
.kmt header{display:flex; flex-wrap:wrap; gap:.15rem .5rem; align-items:baseline; font-size:.74rem}
.kmt .org,.kmt time{color:var(--ink-3); font-family:var(--mono); font-size:.68rem}
.kmt-k{margin-left:auto; display:inline-flex; gap:.4rem; align-items:baseline}
.kmt-t{white-space:pre-wrap; font-size:.82rem; line-height:1.45; overflow-wrap:anywhere}
.lk{font:inherit; font-size:.72rem; background:none; border:0; padding:.1rem .15rem; color:var(--accent); cursor:pointer; text-decoration:underline; text-underline-offset:2px}
.lk-gefahr{color:var(--bad); font-weight:600}
.frage{font-size:.72rem; color:var(--ink-2)}
.kom-neu{display:flex; flex-wrap:wrap; gap:.4rem; align-items:flex-end}
.kom-in{font:inherit; font-size:.82rem; flex:1 1 20rem; min-height:44px; padding:.35rem .5rem; border:1px solid var(--rule-strong);
  background:var(--paper); color:var(--ink); border-radius:2px; resize:vertical; field-sizing:content; max-height:14rem; width:100%}
.kom-in:focus{border-color:var(--accent)}

/* Lösch-Bestätigung inline (kein confirm()) */
tr.bestaetigen td{padding:0 .45rem .5rem}
.best{border:1px solid var(--bad); border-left-width:3px; background:var(--accent-wash); color:var(--ink); padding:.5rem .7rem; font-size:.84rem; max-width:90ch}
.best p{margin:0 0 .4rem}
.best ul{margin:0 0 .5rem; padding-left:1.2rem; font-size:.8rem}
.best-k{display:flex; flex-wrap:wrap; gap:.4rem; margin-top:.3rem}
tbody.del tr td{background:var(--surface-2); color:var(--ink-3); font-size:.8rem}
tr.del-kopf td{font-family:var(--mono); font-size:.7rem !important; letter-spacing:.06em; color:var(--ink-2) !important}
tr.geloescht td:first-child{text-decoration:line-through}

/* Summen (Spec 8.3) */
.summen{margin:2.2rem 0 1rem}
.hd{display:flex; flex-wrap:wrap; align-items:baseline; gap:.4rem .9rem; margin:1.6rem 0 .6rem}
.hd h2,.hd h3{margin:0}
.hd .hint{font-size:.84rem; color:var(--ink-3); max-width:80ch}
.kacheln{display:grid; grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr)); gap:.75rem; margin:.4rem 0 .5rem}
.kachel{background:var(--surface); border:1px solid var(--rule); border-left:4px solid var(--rule-strong); padding:.7rem 1rem; display:grid; gap:.1rem}
.kachel.k-dh{border-left-color:var(--s2)} .kachel.k-l42{border-left-color:var(--s1)}
.k-t{font-size:.82rem; color:var(--ink-2)}
.kachel b{font-family:var(--mono); font-variant-numeric:tabular-nums; font-size:1.45rem; font-weight:600; color:var(--ink)}
.k-p{font-family:var(--mono); font-size:.8rem; color:var(--ink-3)}
.invariante{font-family:var(--mono); font-size:.76rem; color:var(--ok); margin:0 0 .6rem}
.invariante[data-ok="0"]{color:var(--bad)}
.tw{overflow-x:auto; border:1px solid var(--rule); background:var(--surface); max-width:100%; position:relative}
table.tot{width:100%; border-collapse:collapse; font-size:.86rem}
table.tot th,table.tot td{padding:.38rem .6rem; border-bottom:1px solid var(--rule); text-align:left; vertical-align:top}
table.tot thead th{font-size:.7rem; color:var(--ink-2); background:var(--surface-2); font-weight:600; white-space:nowrap}
table.tot .n{text-align:right; font-family:var(--mono); font-variant-numeric:tabular-nums; white-space:nowrap}
table.tot tbody th a{font-family:var(--mono); font-weight:600; text-decoration:none}
table.tot tr.tot th{font-weight:600}
table.tot tr.tot:first-of-type th, table.sumkarte tr.tot:nth-child(13) th, table.sumkarte tr.tot:nth-child(13) td{border-top:2px solid var(--rule-strong)}
table.tot tr.big th,table.tot tr.big td{font-size:.98rem; border-top:2px solid var(--rule-strong); border-bottom:0}
table.tot tr.big td.n b{color:var(--accent)}
.st{font-family:var(--mono); font-size:.68rem; white-space:nowrap; padding:.05rem .35rem; border-radius:2px}
.st-ok{color:var(--ok); border:1px solid var(--ok)}
.st-offen{color:var(--gold); border:1px dotted var(--gold)}
.t-aw td{font-size:.8rem}

/* Diagramm (dataviz: gestapelt, 2 px Fuge, gerundet nur am Datenende) */
.chart-box{border:1px solid var(--rule); background:var(--surface); padding:.9rem 1rem; margin:1.2rem 0; position:relative}
.fig-t{font-family:var(--serif); font-size:1.02rem; font-weight:600; margin:0 0 .3rem}
.chart-leg{display:flex; gap:1.2rem; font-size:.8rem; color:var(--ink-2); margin:0 0 .5rem}
.chart-leg span{display:inline-flex; gap:.4rem; align-items:center}
#chart svg{display:block; width:100%; height:auto}
#chart text{font-family:var(--sans)}
#chart .lbl{fill:var(--ink-2); font-size:12px}
#chart .val{fill:var(--ink); font-size:12px; font-weight:600; font-family:var(--mono)}
#chart g.bar{cursor:default; outline:none}
#chart g.bar:focus .hit,#chart g.bar:hover .hit{fill:var(--surface-2)}
.chart-empty{font-size:.9rem; color:var(--ink-2); margin:0}
.chart-tip{position:absolute; z-index:5; background:var(--surface); border:1px solid var(--rule-strong); box-shadow:0 4px 14px rgba(0,0,0,.14);
  padding:.4rem .6rem; font-size:.78rem; display:grid; gap:.1rem; pointer-events:none; min-width:12rem}
.chart-tip span{display:flex; gap:.4rem; align-items:center; font-family:var(--mono); font-size:.74rem}
figcaption{font-size:.8rem; color:var(--ink-3); margin-top:.5rem; max-width:80ch}

/* Summenleiste unten (DESIGN 14) */
.sumbar{position:fixed; left:0; right:0; bottom:0; z-index:25; background:var(--surface); border-top:1px solid var(--rule-strong); box-shadow:0 -2px 8px rgba(0,0,0,.08)}
.sumbar-in{max-width:1500px; margin:0 auto; padding:.45rem 1rem; display:flex; flex-wrap:wrap; gap:.15rem 1.5rem; align-items:baseline}
.sumbar .it{display:flex; gap:.4rem; align-items:baseline}
.sumbar .k{font-size:.76rem; color:var(--ink-3)}
.sumbar .v{font-family:var(--mono); font-variant-numeric:tabular-nums; font-size:.92rem; font-weight:600}
.sumbar .p{font-family:var(--mono); font-size:.72rem; color:var(--ink-3)}
.sumbar .it-dh{border-left:3px solid var(--s2); padding-left:.4rem} .sumbar .it-l42{border-left:3px solid var(--s1); padding-left:.4rem}
.sumbar .it.tot{margin-left:auto}
.sumbar .it.tot .v{font-size:1.1rem; color:var(--accent)}
.sumbar .warn{font-size:.72rem; color:var(--gold); font-family:var(--mono); flex-basis:100%}

/* Meldung / Rückgängig-Leiste */
.meldung{position:fixed; left:50%; transform:translateX(-50%); bottom:calc(var(--sb-h, 5rem) + .75rem); z-index:26; background:var(--ink); color:var(--paper);
  padding:.5rem .6rem .5rem .9rem; border-radius:3px; display:flex; gap:.7rem; align-items:center; font-size:.85rem; max-width:calc(100vw - 2rem);
  box-shadow:0 6px 18px rgba(0,0,0,.25); overflow:hidden}
.meldung[hidden]{display:none}
.meldung .btn{background:var(--paper); color:var(--ink); border-color:var(--paper)}
.undo-bar{position:absolute; left:0; bottom:0; height:3px; width:100%; background:var(--gold); transform-origin:left; animation:undo linear forwards}
@keyframes undo{from{transform:scaleX(1)} to{transform:scaleX(0)}}

/* Tooltip Herkunft (Mouseover und Fokus) */
.tip{position:absolute; z-index:60; background:var(--ink); color:var(--paper); font-size:.78rem; line-height:1.4; padding:.4rem .6rem;
  border-radius:3px; box-shadow:0 4px 14px rgba(0,0,0,.2); pointer-events:none}
.tip[hidden]{display:none}

@media (max-width:760px){
  .status{margin-left:0; flex-basis:100%}
  .sumbar .it.tot{margin-left:0}
  .sumbar-in{gap:.1rem 1rem; padding:.4rem 1rem}
  .bsum{margin-left:0; flex-basis:100%}
  .tools{position:static}
  details.blk > summary{position:static}
}
@media (max-width:420px){
  .kachel b{font-size:1.2rem}
  .sprung a{min-width:26px}
  .sumbar .warn{display:none}
}
@media (prefers-reduced-motion: reduce){ .fremd{transition:none} .undo-bar{animation:none} }
@media print{
  @page{size:A4; margin:14mm 12mm}
  :root,:root[data-theme="dark"],:root[data-theme="light"]{color-scheme:light !important}
  .tools,.sumbar,.meldung,.tip,.akt,.bel-meta,.kom-neu,.add-end,.scrollhint,.prog{display:none !important}
  body{padding-bottom:0 !important}
  .rw{overflow:visible; border:0} table.raster{min-width:0; font-size:7.5pt}
  .in,.sel{border:0; background:transparent; padding:0; min-height:0; color:#000}
  tr.bel{display:table-row !important}
  details.blk > summary{position:static}
}

/* ------------------------------------------ Quellen-Links (Phase 22, Spec 8.5) */
.mk-sm{font-size:.66rem; padding:0 .35rem 0 .4rem}
tbody.zeile.sprungziel > tr{background:var(--gold-wash); transition:background .6s ease-out}
tbody.zeile.sprungziel > tr:first-child{box-shadow:inset 3px 0 0 var(--gold)}
@media (prefers-reduced-motion: reduce){ tbody.zeile.sprungziel > tr{transition:none} }

/* ------------------------------------------ Ausschreibung (Phase 22, Spec 8.5) */
.aus{max-width:78rem; margin:0 auto}
.aus-kopf{margin:0 0 1.25rem}
.aus-kopf .sub{color:var(--ink-2); max-width:70ch}
.aus-such{display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; margin:.25rem 0 .75rem}
.aus-such label{font-size:.86rem; color:var(--ink-2)}
.aus-such input{font:inherit; font-size:.92rem; min-height:40px; padding:.4rem .6rem; min-width:0; flex:1 1 16rem; max-width:28rem;
  background:var(--surface); color:var(--ink); border:1px solid var(--rule-strong); border-radius:3px}
.q-status{border:1px solid var(--rule); border-left:3px solid var(--ink-3); background:var(--surface); padding:.55rem .8rem;
  font-size:.9rem; color:var(--ink-2); position:sticky; top:0; z-index:10; margin:0 0 1rem; box-shadow:0 2px 6px rgba(25,23,20,.08)}
.q-status.q-ok{border-left-color:var(--ok)}
.q-status.q-kein{border-left-color:var(--warn); background:var(--gold-wash)}
.q-zurueck{margin-left:.5rem; white-space:nowrap}
.aus-grid{display:grid; grid-template-columns:17.5rem minmax(0,1fr); gap:1.75rem; align-items:start}
.aus-toc{position:sticky; top:calc(var(--qh,0px) + .75rem); max-height:calc(100vh - var(--qh,0px) - 1.5rem); overflow:auto; background:var(--surface);
  border:1px solid var(--rule); padding:.6rem .75rem .75rem; font-size:.84rem}
.toc > summary{font-family:var(--serif); font-weight:600; font-size:1.05rem; cursor:pointer; list-style:none}
.toc > summary::-webkit-details-marker{display:none}
.toc-l{font-family:var(--mono); font-size:.66rem; letter-spacing:.11em; text-transform:uppercase; color:var(--ink-3); margin:.7rem 0 .3rem}
.toc-seiten{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(8,1fr); gap:3px}
.toc-seiten a{display:block; text-align:center; font-family:var(--mono); font-size:.72rem; padding:.2rem 0; border:1px solid var(--rule);
  border-radius:2px; text-decoration:none; color:var(--ink-2)}
.toc-seiten a:hover{border-color:var(--accent); color:var(--accent)}
.toc-ab{list-style:none; margin:0; padding:0}
.toc-ab li a{display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:.4rem; padding:.18rem 0; text-decoration:none; color:var(--ink-2); line-height:1.35}
.toc-ab li a:hover .toc-ti{color:var(--accent); text-decoration:underline}
.toc-ab li.t0{margin-top:.55rem} .toc-ab li.t0 a{color:var(--ink); font-weight:600; grid-template-columns:minmax(0,1fr) auto}
.toc-ab li.t0 .toc-nr{display:none}
.toc-ab li.t3 a,.toc-ab li.t4 a{padding-left:.9rem; font-size:.8rem}
.toc-nr{font-family:var(--mono); font-size:.72rem; color:var(--ink-3); min-width:2.6rem}
.toc-s{font-family:var(--mono); font-size:.68rem; color:var(--ink-3); white-space:nowrap}
.seite{background:var(--surface); border:1px solid var(--rule); margin:0 0 1.25rem; scroll-margin-top:calc(var(--qh,0px) + .75rem); box-shadow:var(--shadow)}
.seite:target{border-color:var(--rule-strong); box-shadow:inset 3px 0 0 var(--accent)}
.seite-kopf{display:flex; flex-wrap:wrap; align-items:baseline; gap:.3rem 1rem; padding:.55rem 1rem; border-bottom:1px solid var(--rule); background:var(--surface-2)}
.seite-kopf h2{font-size:1.05rem; margin:0}
.seite-von{font-family:var(--sans); font-weight:400; font-size:.8rem; color:var(--ink-3)}
.seite-ab{display:inline-flex; flex-wrap:wrap; gap:.15rem .55rem; font-family:var(--mono); font-size:.72rem}
.seite-ab a{color:var(--ink-2); text-decoration:none} .seite-ab a:hover{color:var(--accent); text-decoration:underline}
.seite-pdf{margin-left:auto; font-size:.84rem; white-space:nowrap}
/* Seitentext nur innerhalb .seite — `.st` ist sonst der Status-Chip der Summenkarte (Phase 26, V-02) */
.seite .st{font-family:var(--serif); font-weight:400; font-size:1rem; line-height:1.55; white-space:pre-wrap; overflow-wrap:anywhere; padding:.9rem 1.1rem 1.1rem; margin:0; color:var(--ink); tab-size:4}
.seite .st .ab{font-weight:700; scroll-margin-top:calc(var(--qh,0px) + .75rem)}
.seite .st .ab-t0,.seite .st .ab-t1{font-size:1.12rem}
.seite .st mark.treffer{background:color-mix(in srgb, var(--gold) 28%, var(--surface)); color:var(--ink); padding:.05em 0;
  box-shadow:0 0 0 2px color-mix(in srgb, var(--gold) 55%, transparent); border-radius:1px}
.seite .st mark.treffer.aktiv{box-shadow:0 0 0 3px var(--accent)}
.q-nav{display:inline-flex; gap:.35rem; margin-left:.5rem; vertical-align:middle}
.seite .st{border-radius:0}
@media (max-width:1100px){ .aus-grid{grid-template-columns:15rem minmax(0,1fr); gap:1.25rem} }
@media (max-width:760px){
  .aus-grid{grid-template-columns:minmax(0,1fr); gap:.9rem}
  .aus-toc{position:static; max-height:none}
  .seite .st{font-size:.95rem; padding:.75rem .8rem .9rem}
  .seite-pdf{margin-left:0}
}
@media print{ .aus-toc,.aus-such,.q-status{display:none !important} .aus-grid{display:block} .seite{break-inside:auto; box-shadow:none} }