/* Büro-Dashboard — Kommandozentrum. Aufbau nach dem Vorbild eines Agenten-Leitstands
   (Netz, Leuchten, Live-Gefühl), Farben ausschließlich aus tokens.css (Sunntech-Design).
   In dieser Datei steht keine einzige Farbe als Zahl — der Wächter prüft das. */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;min-height:100vh;color:var(--ink);font:15px/1.55 var(--font-text);-webkit-font-smoothing:antialiased;
  background:radial-gradient(1200px 620px at 50% -140px,var(--buehne-a),transparent 70%),var(--bg);background-attachment:fixed;
  transition:background .55s ease,color .35s ease}
/* feines Raster über der ganzen Fläche, zur Mitte hin ausgeblendet */
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background-image:linear-gradient(var(--raster) 1px,transparent 1px),linear-gradient(90deg,var(--raster) 1px,transparent 1px);background-size:44px 44px;
  -webkit-mask-image:radial-gradient(ellipse 90% 80% at 50% 30%,black 30%,transparent 85%);mask-image:radial-gradient(ellipse 90% 80% at 50% 30%,black 30%,transparent 85%)}
h1,h2,h3{font-family:var(--font-titel);letter-spacing:-.02em;margin:0;font-weight:700}
button{font:inherit;color:inherit;cursor:pointer}
button:focus-visible,[tabindex]:focus-visible,input:focus-visible{outline:2px solid var(--sun);outline-offset:2px}
[hidden]{display:none!important}
svg.u{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums;letter-spacing:.02em}
.klein{font-size:11px}
.raum{flex:1}

/* Glas-Paneele */
.glas{position:relative;background:var(--glas);border:1px solid var(--glas-rand);border-radius:20px;box-shadow:var(--card-shadow),inset 0 1px 0 var(--glas-licht);
  backdrop-filter:blur(16px) saturate(1.2);-webkit-backdrop-filter:blur(16px) saturate(1.2);transition:background .55s,border-color .55s}

/* Kopfzeile */
.kopf{position:sticky;top:0;z-index:20;background:var(--glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line-2);transition:background .55s}
.kopf-in{max-width:1560px;margin:0 auto;padding:10px 24px;display:flex;align-items:center;gap:10px;position:relative;z-index:1}
.marke{display:flex;align-items:center;gap:10px;font-family:var(--font-titel);font-weight:700;font-size:17px;white-space:nowrap}
.brand-mark{width:28px;height:28px;border-radius:50%;background:radial-gradient(circle at 40% 35%,var(--sun-hell),var(--sun) 58%,var(--sun-tief));box-shadow:0 0 14px var(--glow-sun-stark);flex:none;display:inline-block}
.live{width:8px;height:8px;border-radius:50%;background:var(--ink-3)}
.live.an{background:var(--gruen);box-shadow:0 0 8px var(--glow-gruen);animation:atmenP 2.4s ease-in-out infinite}
.live.aus{background:var(--ton)}
.pille{border-radius:999px;padding:5px 12px;font-size:12.5px;font-weight:600;border:1px solid var(--line);background:var(--surface-2);white-space:nowrap}
.pille.gruen{background:var(--gruen);color:var(--badge-ink);border-color:transparent}
.pille.sonnig{background:var(--sun-soft);color:var(--sun);border-color:var(--sun-line)}
html[data-theme=light] .pille.sonnig{color:var(--sun-tief)}
.schalter{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);background:var(--surface-2);border-radius:999px;padding:4px 10px 4px 5px;font-size:12.5px;font-weight:600}
.schalter .bahn{width:30px;height:18px;border-radius:999px;background:var(--line);position:relative;transition:background .3s}
.schalter .bahn::after{content:"";position:absolute;left:2px;top:2px;width:14px;height:14px;border-radius:50%;background:var(--ink-2);transition:transform .3s,background .3s}
.schalter[aria-pressed="true"] .bahn{background:var(--sun);box-shadow:0 0 10px var(--glow-sun)}
.schalter[aria-pressed="true"] .bahn::after{transform:translateX(12px);background:var(--badge-sun-ink)}
.schalter:disabled{opacity:.6;cursor:default}
.rund{width:38px;height:38px;border-radius:12px;border:1px solid var(--line);background:var(--surface-2);display:grid;place-items:center;flex:none}
.ansicht{display:inline-flex;border:1px solid var(--line);border-radius:999px;padding:3px;background:var(--surface-2)}
.ansicht button{display:inline-flex;gap:6px;align-items:center;border:0;background:transparent;border-radius:999px;padding:5px 12px;font-size:12.5px;font-weight:700;color:var(--ink-2);transition:background .25s,color .25s}
.ansicht button svg{width:15px;height:15px}
.ansicht button[aria-pressed="true"]{background:var(--sun);color:var(--badge-sun-ink);box-shadow:0 0 14px var(--glow-sun)}

main{position:relative;z-index:1;max-width:1560px;margin:0 auto;padding:18px 24px 70px}

/* Meldungen: Fehler immer sichtbar */
.meldung{display:flex;gap:12px;align-items:flex-start;background:var(--ton-soft);color:var(--ton);border:1px solid var(--ton);border-radius:16px;padding:12px 14px;margin-bottom:16px;font-weight:600}
.meldung p{margin:0;flex:1;color:var(--ink)}
.meldung .knopf{flex:none}
.vorfuehr-band{display:flex;gap:10px;align-items:center;background:var(--sun-soft);border:1px solid var(--sun-line);color:var(--hero-ink);border-radius:14px;padding:8px 14px;margin-bottom:14px;font-size:13px}
.vorfuehr-band svg{color:var(--sun)}

/* HUD: Urteil und Kennzahlen */
.hud{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:22px;align-items:center;padding:18px 22px;overflow:hidden}
.hud::after{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,var(--sun),transparent);opacity:.7}
.hud small{color:var(--hero-sub);font-weight:600;letter-spacing:.02em}
.hud h1{font-size:clamp(26px,3.1vw,38px);line-height:1.08;margin:4px 0 8px}
.hud h1 em{font-style:normal;color:var(--sun);text-shadow:0 0 24px var(--glow-sun)}
html[data-theme=light] .hud h1 em{color:var(--sun-tief);text-shadow:none}
.hud-zeile{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-family:var(--font-mono);font-size:11.5px;letter-spacing:.08em;color:var(--ink-2);font-variant-numeric:tabular-nums}
.hud-trenn{width:1px;height:11px;background:var(--line)}
.hud-punkt{width:7px;height:7px;border-radius:50%;background:var(--gruen);box-shadow:0 0 10px var(--glow-gruen);animation:atmenP 2s ease-in-out infinite;flex:none;display:inline-block}
.hud-punkt.aus{background:var(--ton);box-shadow:0 0 10px var(--glow-ton)}
.kennzahlen{display:grid;grid-template-columns:repeat(5,minmax(96px,1fr));gap:8px}
.kz{display:flex;flex-direction:column;gap:6px;text-align:left;border:1px solid var(--line);background:var(--surface-2);border-radius:14px;padding:10px 13px;color:inherit;transition:transform .2s,border-color .3s,box-shadow .3s;position:relative;overflow:hidden}
.kz::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--line)}
button.kz:hover{transform:translateY(-2px);border-color:var(--sun-line)}
.kz .zahl{font-family:var(--font-mono);font-weight:600;font-size:28px;line-height:1;font-variant-numeric:tabular-nums}
.kz .was{font-size:10.5px;color:var(--ink-2);font-weight:700;text-transform:uppercase;letter-spacing:.1em;font-family:var(--font-mono)}
.kz.sun .zahl{color:var(--sun);text-shadow:0 0 18px var(--glow-sun)} .kz.sun::before{background:var(--sun);box-shadow:0 0 10px var(--glow-sun-stark)}
.kz.ton .zahl{color:var(--ton);text-shadow:0 0 18px var(--glow-ton)} .kz.ton::before{background:var(--ton)}
.kz.gruen .zahl{color:var(--chip-stroke)} .kz.gruen::before{background:var(--gruen)}
html[data-theme=light] .kz.sun .zahl{color:var(--sun-tief);text-shadow:none}
html[data-theme=light] .kz.gruen .zahl{color:var(--gruen)}
html[data-theme=light] .kz.ton .zahl{text-shadow:none}

/* Kommando-Raster: Netz links, Pult rechts */
.kommando{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:16px;margin-top:16px;align-items:start}
.kommando-links{position:sticky;top:72px;display:flex;flex-direction:column;gap:16px}
.pult{display:flex;flex-direction:column;gap:16px;min-width:0}
.pult-kopf{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.pult-kopf h2{font-size:15px;letter-spacing:0}
.pult .abschnitt{margin:0}
.unten{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:16px}
.unten .lieferliste{margin:0}

/* Bühne mit dem Netz */
.buehne{padding:14px 16px 12px;overflow:hidden;background:radial-gradient(820px 520px at 50% 52%,var(--sun-soft),transparent 70%),var(--glas)}
.buehne::before{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;
  background-image:linear-gradient(var(--raster-stark) 1px,transparent 1px),linear-gradient(90deg,var(--raster-stark) 1px,transparent 1px);background-size:32px 32px;
  -webkit-mask-image:radial-gradient(ellipse at center,black 20%,transparent 75%);mask-image:radial-gradient(ellipse at center,black 20%,transparent 75%)}
.buehne-kopf{position:relative;display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:4px}
.buehne-kopf small{display:block;font-size:10.5px;color:var(--sun);letter-spacing:.18em;font-weight:700}
html[data-theme=light] .buehne-kopf small{color:var(--sun-tief)}
.buehne-kopf h2{font-size:17px}
.legende-netz{display:flex;gap:6px;flex-wrap:wrap}
.lg{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--surface-2);border-radius:999px;padding:4px 10px;font-size:12px;font-weight:600;color:var(--ink-2);transition:border-color .2s,background .2s}
.lg i{width:8px;height:8px;border-radius:50%;background:var(--ink-3)}
.lg.z-laeuft i{background:var(--sun);box-shadow:0 0 8px var(--glow-sun-stark)} .lg.z-wartet i{background:var(--sun-tief)} .lg.z-fehler i{background:var(--ton);box-shadow:0 0 8px var(--glow-ton)} .lg.z-fertig i{background:var(--gruen)} .lg.z-geplant i{background:transparent;border:1.5px dashed var(--ink-3)}
.lg[aria-pressed="true"]{border-color:var(--sun);background:var(--sun-soft);color:var(--ink)}
.lg .mono{color:var(--ink);font-weight:700}
.knopf.zoom{display:none}
.netz-rahmen{position:relative;margin:0 -6px}
.buehne-fuss{position:relative;display:flex;flex-wrap:wrap;gap:14px;align-items:center;font-size:11.5px;color:var(--ink-2);padding:2px 4px 0}
.buehne-fuss span{display:inline-flex;gap:6px;align-items:center}
.fl{width:18px;height:2px;border-radius:2px;display:inline-block}
.fl-sun{background:var(--sun);box-shadow:0 0 8px var(--glow-sun-stark)} .fl-ton{background:var(--ton)} .fl-ruhig{background:var(--linie-fluss)}
.buehne-tipp{margin-left:auto;font-family:var(--font-mono);letter-spacing:.06em;text-transform:uppercase;font-size:10.5px}

.netz-flaeche{position:relative;width:100%;aspect-ratio:1400/900}
.netz-canvas,.netz-svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.netz-svg{overflow:visible}
.bahn{fill:none;stroke:var(--line);stroke-width:1}
.bahn.b1,.bahn.b2{stroke-dasharray:2 7}
.bahn.b0{stroke:var(--sun-line);stroke-dasharray:1 9}
.bahn.b3{stroke:var(--line-2)}
.bereich-bogen{fill:none;stroke:var(--chip-stroke);stroke-width:2.2;stroke-linecap:round;opacity:.35}
html[data-theme=light] .bereich-bogen{stroke:var(--gruen);opacity:.3}
.bereich-name{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.2em;fill:var(--ink-3);font-weight:700}
.inst-bogen{fill:none;stroke:var(--gruen);stroke-width:3;stroke-linecap:round;opacity:.8}
.inst-glow{fill:none;stroke:var(--glow-gruen);stroke-width:12;stroke-linecap:round}
.inst.bereit .inst-bogen{stroke:var(--sun);opacity:1}
.inst.bereit .inst-glow{stroke:var(--glow-sun);animation:atmenO 2.8s ease-in-out infinite}
.inst-pfad{fill:none;stroke:none}
.inst-name{font-family:var(--font-mono);font-size:11px;letter-spacing:.16em;font-weight:700;fill:var(--chip-stroke)}
html[data-theme=light] .inst-name{fill:var(--gruen)}
.inst.bereit .inst-name{fill:var(--sun)}
html[data-theme=light] .inst.bereit .inst-name{fill:var(--sun-tief)}
.inst.fehlt .inst-bogen{stroke-dasharray:4 5}

/* Knoten */
.nk{cursor:pointer;outline:none}
.nk-hit{fill:transparent}
.nk-glow{fill:url(#nz-glow-sun);opacity:0;transition:opacity .3s}
.nk-puls{fill:none;stroke:var(--sun);stroke-width:1.5;opacity:0;transform-box:fill-box;transform-origin:center}
.nk-kreis{fill:var(--surface);stroke:var(--ink-3);stroke-width:1.8;transition:stroke-width .2s,fill .3s}
.nk-bogen{fill:none;stroke:var(--sun);stroke-width:1.6;stroke-dasharray:9 40;stroke-linecap:round;opacity:0;transform-box:fill-box;transform-origin:center}
.nk-sym{fill:none;stroke:var(--chip-stroke);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.nk-kern{fill:var(--ink-3)}
.nk-name{font-family:var(--font-text);font-size:11px;font-weight:600;fill:var(--ink-2);transition:fill .2s,opacity .25s}
.nk-r2 .nk-name{font-size:10.5px;font-weight:500;fill:var(--ink-3)}
.gs.o1{stop-color:var(--sun);stop-opacity:.55}.gs.o2{stop-color:var(--sun);stop-opacity:.16}.gs.o0{stop-color:var(--sun);stop-opacity:0}
.gt.o1{stop-color:var(--ton);stop-opacity:.6}.gt.o2{stop-color:var(--ton);stop-opacity:.18}.gt.o0{stop-color:var(--ton);stop-opacity:0}
.gg.o1{stop-color:var(--chip-stroke);stop-opacity:.35}.gg.o2{stop-color:var(--chip-stroke);stop-opacity:.1}.gg.o0{stop-color:var(--chip-stroke);stop-opacity:0}
.gk.o1{stop-color:var(--sun);stop-opacity:.5}.gk.o2{stop-color:var(--sun);stop-opacity:.18}.gk.o0{stop-color:var(--sun);stop-opacity:0}
.kern-a{stop-color:var(--sun-hell)}.kern-b{stop-color:var(--sun)}.kern-c{stop-color:var(--sun-tief)}

.nk.z-laeuft .nk-kreis{stroke:var(--sun);fill:var(--surface)}
.nk.z-laeuft .nk-glow{opacity:1;animation:atmenO 2.2s ease-in-out infinite}
.nk.z-laeuft .nk-puls{animation:puls 2s ease-out infinite}
.nk.z-laeuft .nk-bogen{opacity:1;animation:drehen 1.6s linear infinite}
.nk.z-laeuft .nk-sym{stroke:var(--sun)}
.nk.z-laeuft .nk-kern{fill:var(--sun)}
.nk.z-laeuft .nk-name{fill:var(--ink)}
.nk.z-wartet .nk-kreis{fill:var(--badge-sun);stroke:var(--sun-tief);stroke-width:2}
.nk.z-wartet .nk-glow{opacity:.85;animation:atmenO 3s ease-in-out infinite}
.nk.z-wartet .nk-sym{stroke:var(--badge-sun-ink)}
.nk.z-wartet .nk-kern{fill:var(--badge-sun-ink)}
.nk.z-wartet .nk-name{fill:var(--ink)}
.nk.z-fehler .nk-kreis{fill:var(--ton-soft);stroke:var(--ton);stroke-width:2.2}
.nk.z-fehler .nk-glow{fill:url(#nz-glow-ton);opacity:1;animation:atmenO 1.2s ease-in-out infinite}
.nk.z-fehler .nk-puls{stroke:var(--ton);animation:puls 1.3s ease-out infinite}
.nk.z-fehler .nk-sym{stroke:var(--ton)}
.nk.z-fehler .nk-kern{fill:var(--ton)}
.nk.z-fehler .nk-name{fill:var(--ton);font-weight:700}
.nk.z-fertig .nk-kreis{stroke:var(--gruen);fill:var(--gruen-soft)}
.nk.z-fertig .nk-kern{fill:var(--gruen)}
.nk.z-geplant .nk-kreis{stroke-dasharray:2.5 3;fill:var(--surface-2)}
.nk.z-geplant .nk-sym{opacity:.5}
.nk.z-geplant .nk-name{opacity:.75}
.nk.orange .nk-kreis{stroke:var(--orange-ink)}
.nk.orange .nk-sym{stroke:var(--orange-ink)}
.nk:hover .nk-kreis,.nk:focus .nk-kreis{stroke-width:3}
.nk:focus-visible .nk-hit{stroke:var(--sun);stroke-width:1.5;stroke-dasharray:3 3}
.netz-svg.fokus .nk:not(.hell),.netz-svg.fokus .inst:not(.hell){opacity:.28}
.netz-svg.fokus .nk.hell .nk-name{fill:var(--ink)}
.netz-svg.gefiltert .nk:not(.treffer){opacity:.22}
.netz-svg.gefiltert .nk.treffer .nk-glow{opacity:1}
.nk,.inst{transition:opacity .25s}

/* Kern: CEO B */
.kern{cursor:pointer;outline:none}
.kern-glow{fill:url(#nz-kern-glow);animation:atmenO 5s ease-in-out infinite}
.kern-skala{fill:none;stroke:var(--sun-line);stroke-width:5;stroke-dasharray:1 7;transform-box:fill-box;transform-origin:center;animation:drehen 60s linear infinite reverse}
.kern-ring{fill:none;stroke:var(--sun);stroke-width:1.3;stroke-dasharray:40 18 4 18;opacity:.7;transform-box:fill-box;transform-origin:center;animation:drehen 24s linear infinite}
.kern-puls{fill:none;stroke:var(--sun);stroke-width:1.5;opacity:0;transform-box:fill-box;transform-origin:center;animation:puls 3.2s ease-out infinite}
.kern-scheibe{fill:url(#nz-kern)}
.kern:hover .kern-ring,.kern:focus-visible .kern-ring{opacity:1;stroke-width:2}
.kern-titel{font-family:var(--font-titel);font-weight:800;font-size:21px;fill:var(--kern-ink);letter-spacing:-.01em}
.kern-zahl{font-family:var(--font-mono);font-size:8.5px;font-weight:700;letter-spacing:.12em;fill:var(--kern-ink);opacity:.75}

/* Tooltip */
.netz-tipp{position:absolute;z-index:3;pointer-events:none;transform:translate(0,-50%) scale(.96);opacity:0;transition:opacity .15s,transform .15s;
  min-width:170px;max-width:240px;padding:10px 12px;border-radius:12px;background:var(--glass);border:1px solid var(--sun-line);box-shadow:var(--lift-shadow);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);display:flex;flex-direction:column;gap:3px;font-size:12.5px}
.netz-tipp.links{transform:translate(-100%,-50%) scale(.96)}
.netz-tipp.da{opacity:1;transform:translate(0,-50%) scale(1)}
.netz-tipp.links.da{transform:translate(-100%,-50%) scale(1)}
.netz-tipp small{font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.netz-tipp b{font-family:var(--font-titel);font-size:14.5px}
.tipp-z{align-self:flex-start;font-size:11px;font-weight:700;border-radius:999px;padding:1px 8px;margin:2px 0}
.tipp-zeile{display:flex;justify-content:space-between;gap:10px;font-family:var(--font-mono);font-size:11.5px;color:var(--ink)}
.tipp-zeile i{font-style:normal;color:var(--ink-3)}

/* Auftritt beim ersten Laden */
.auftritt .nk{animation:auftauchen .6s ease both}
.auftritt .netz-bereiche,.auftritt .netz-instanzen,.auftritt .netz-ringe{animation:auftauchen .9s ease both}
@keyframes auftauchen{from{opacity:0}}

/* Terminal: CEO B */
.terminal{display:flex;flex-direction:column;overflow:hidden;padding:0}
.terminal::before{content:"";position:absolute;inset:0 0 auto 0;height:1px;background:linear-gradient(90deg,transparent,var(--sun),transparent)}
.term-kopf{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--line);background:linear-gradient(160deg,var(--hero-a),transparent)}
.term-kopf b{font-family:var(--font-titel);font-size:15px;display:block;line-height:1.1}
.term-kopf small{color:var(--hero-sub);font-size:12px;font-weight:600}
.term-marke{width:34px;height:34px;border-radius:11px;border:1px solid var(--sun-line);background:var(--surface);display:grid;place-items:center;flex:none;padding:0}
.term-marke .brand-mark{width:20px;height:20px}
.term-uhr{font-family:var(--font-mono);font-size:12px;color:var(--sun);letter-spacing:.06em;font-variant-numeric:tabular-nums}
html[data-theme=light] .term-uhr{color:var(--sun-tief)}
.term-log{padding:10px 14px;max-height:280px;overflow:auto;display:flex;flex-direction:column;gap:6px;font-size:13.5px}
.term-z{margin:0;display:grid;grid-template-columns:38px 36px 1fr;gap:4px;align-items:baseline;animation:rein .35s ease both}
.term-zeit{font-family:var(--font-mono);font-size:11px;color:var(--ink-3)}
.term-prompt{font-family:var(--font-mono);font-size:11px;color:var(--sun);font-weight:700}
html[data-theme=light] .term-prompt{color:var(--sun-tief)}
.term-z.ich .term-prompt{color:var(--chip-stroke)}
html[data-theme=light] .term-z.ich .term-prompt{color:var(--gruen)}
.term-z.ich .term-text{color:var(--ink-2);font-style:italic}
.term-text.tippt::after{content:"";display:inline-block;width:7px;height:13px;margin-left:2px;vertical-align:-2px;background:var(--sun);animation:blinken .9s steps(2) infinite}
.term-fragen{display:flex;gap:6px;flex-wrap:wrap;padding:10px 14px 14px;border-top:1px solid var(--line-2)}
.term-frage{border:1px solid var(--sun-line);background:var(--sun-soft);color:var(--ink);border-radius:999px;padding:5px 11px;font-size:12px;font-weight:600;transition:border-color .2s,box-shadow .2s}
.term-frage:hover{border-color:var(--sun);box-shadow:0 0 12px var(--glow-sun)}

/* Wartet auf dich (im Pult kompakt) */
.abschnitt{margin-bottom:26px;scroll-margin-top:80px}
.abschnitt-kopf{display:flex;align-items:center;gap:10px;margin:0 0 12px;flex-wrap:wrap}
.abschnitt-kopf h2{font-size:19px}
.pult .abschnitt-kopf h2{font-size:15px}
.anz{font-family:var(--font-mono);font-size:12px;font-weight:700;border-radius:999px;padding:2px 9px;background:var(--badge-sun);color:var(--badge-sun-ink);box-shadow:0 0 12px var(--glow-sun)}
.anz.gruen{background:var(--badge-gruen);color:var(--badge-ink);box-shadow:none}
.icon{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:var(--chip-bg);color:var(--chip-stroke);flex:none;transition:background .55s,color .55s}
.icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.95;stroke-linecap:round;stroke-linejoin:round}
.icon.klein{width:30px;height:30px;border-radius:10px}.icon.klein svg{width:18px;height:18px}
.pult .icon{width:30px;height:30px;border-radius:10px}.pult .icon svg{width:18px;height:18px}
.icon.orange{background:var(--orange-soft);color:var(--orange-ink)}
.warten{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:12px}
.pult .warten{grid-template-columns:1fr;gap:10px}
.aufgabe{background:var(--glas);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--sun-line);border-radius:18px;padding:14px 14px 14px 18px;box-shadow:var(--card-shadow);position:relative;transition:transform .35s ease,opacity .35s ease,border-color .3s;display:flex;flex-direction:column;overflow:hidden}
.aufgabe::before{content:"";position:absolute;left:0;top:14px;bottom:14px;width:3px;border-radius:3px;background:var(--sun);box-shadow:0 0 12px var(--glow-sun-stark)}
.aufgabe:hover{border-color:var(--sun)}
.aufgabe.dringend::before{background:var(--ton);box-shadow:0 0 12px var(--glow-ton)}
.aufgabe.dringend{border-color:var(--ton)}
.aufgabe.weg{opacity:0;transform:scale(.96) translateY(-6px)}
.aufgabe .art{font-family:var(--font-mono);font-size:10.5px;font-weight:700;color:var(--sun);text-transform:uppercase;letter-spacing:.1em}
html[data-theme=light] .aufgabe .art{color:var(--sun-tief)}
.aufgabe h3{font-size:15.5px;margin:4px 0 6px;line-height:1.3}
.aufgabe p{margin:0 0 10px;color:var(--ink-2);font-size:13.5px}
.aufgabe dl{display:grid;grid-template-columns:auto 1fr;gap:2px 12px;font-size:12.5px;margin:0 0 12px}
.aufgabe dt{color:var(--ink-3)}.aufgabe dd{margin:0;font-weight:600;overflow-wrap:anywhere;font-family:var(--font-mono);font-size:12px}
.aufgabe .zeit{font-family:var(--font-mono);font-size:11px;color:var(--ink-3);margin-bottom:10px}
.aufgabe.geschuetzt{border-color:var(--orange-line)}
.telegram-code{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:12px;color:var(--ink-2);background:var(--surface-2);border:1px solid var(--line);border-radius:10px;padding:5px 6px 5px 9px;margin:0 0 10px;max-width:100%}
.telegram-code svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.telegram-code .tg-was{color:var(--ink-3)}
.telegram-code .tg-befehl{font-family:var(--font-mono);font-size:12px;font-weight:700;color:var(--ink);letter-spacing:.04em}
.telegram-code .tg-kopieren{margin-left:auto;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--ink-2);font-size:11.5px;font-weight:600;padding:3px 10px}
.telegram-code .tg-kopieren:hover{border-color:var(--sun-line);color:var(--ink)}
.telegram-code.nur-dashboard{color:var(--orange-ink);background:var(--orange-soft);border-color:var(--orange-line);padding-right:9px}
.aufgabe.geschuetzt::before{background:var(--orange-ink);box-shadow:none}
.knoepfe{display:flex;gap:6px;flex-wrap:wrap;margin-top:auto}
.knopf{border-radius:999px;padding:7px 13px;border:1px solid var(--line);background:var(--surface-2);font-weight:600;font-size:13px;display:inline-flex;gap:6px;align-items:center;transition:transform .15s,background .3s,opacity .2s,box-shadow .2s,border-color .2s}
.knopf:hover:not(:disabled){transform:translateY(-1px);border-color:var(--sun-line)}
.knopf:disabled{opacity:.55;cursor:progress}
.knopf svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.knopf.haupt{background:var(--sun);border-color:transparent;color:var(--badge-sun-ink);box-shadow:0 0 16px var(--glow-sun)}
.knopf.haupt:hover:not(:disabled){box-shadow:0 0 24px var(--glow-sun-stark)}
.knopf.warn{background:var(--ton);border-color:transparent;color:var(--badge-ink)}
.bestaetigen{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:auto;background:var(--sun-soft);border:1px solid var(--sun-line);border-radius:14px;padding:8px 10px;font-size:13px;font-weight:600}
.leer{border:1.5px dashed var(--line);border-radius:16px;padding:18px;color:var(--ink-2);font-size:14px;text-align:center}
.leer b{color:var(--gruen)}

/* Live-Protokoll */
.ticker{padding:14px}
.ticker-liste{list-style:none;margin:0;padding:0;max-height:360px;overflow:auto}
.tk{display:grid;grid-template-columns:56px 10px 1fr;gap:8px;align-items:start;padding:7px 0;border-top:1px solid var(--line-2);font-size:13px}
.tk:first-child{border-top:0}
.tk.rein{animation:rein .45s ease both}
.tk.neu{animation:neu 1.6s ease both}
.tk-zeit{font-family:var(--font-mono);font-size:11.5px;color:var(--ink-3);font-variant-numeric:tabular-nums;padding-top:1px}
.tk-zeit.laufend{color:var(--sun)}
html[data-theme=light] .tk-zeit.laufend{color:var(--sun-tief)}
.tk-zeit i{font-style:normal;font-size:9.5px;letter-spacing:.06em;opacity:.8}
.tk-punkt{width:8px;height:8px;border-radius:50%;margin-top:5px;background:var(--ink-3);display:inline-block;flex:none}
.tk-punkt.z-laeuft{background:var(--sun);box-shadow:0 0 10px var(--glow-sun-stark);animation:atmenP 1.4s ease-in-out infinite}
.tk-punkt.z-wartet{background:var(--sun-tief)}
.tk-punkt.z-fehler{background:var(--ton);box-shadow:0 0 8px var(--glow-ton)}
.tk-punkt.z-fertig{background:var(--gruen)}
.tk-punkt.z-geplant{background:transparent;border:1.5px dashed var(--ink-3)}
.tk-inhalt{min-width:0}
.tk-wer{border:0;background:none;padding:0;font-weight:700;font-size:13px;color:var(--ink);margin-right:6px}
.tk-wer:hover{color:var(--sun)}
.tk-text{color:var(--ink-2)}
.tk-lieferung .tk-text{font-family:var(--font-mono);font-size:11.5px}

/* Agentenliste (nur am Handy) */
.agentenliste{display:none;padding:14px}
.al-zeile{display:grid;grid-template-columns:10px 1fr auto;gap:10px;align-items:center;width:100%;text-align:left;border:0;border-top:1px solid var(--line-2);background:none;padding:9px 0;font-size:14px}
.al-zeile .tk-punkt{margin-top:0}
.al-name{font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.al-info{font-size:10.5px;color:var(--ink-3);letter-spacing:.06em;white-space:nowrap}
.al-apps{font-size:11px;color:var(--ink-2);padding-top:10px;border-top:1px solid var(--line-2);letter-spacing:.04em}

/* Filter (Karten-Ansicht) */
.filter{display:flex;gap:6px;flex-wrap:wrap;margin-left:auto}
.filter button{border:1px solid var(--line);background:var(--surface-2);border-radius:999px;padding:4px 11px;font-size:12.5px;font-weight:600;color:var(--ink-2)}
.filter button[aria-pressed="true"]{background:var(--sun);color:var(--badge-sun-ink);border-color:transparent;box-shadow:0 0 12px var(--glow-sun)}

/* Agenten-Karten */
.bereich{margin-bottom:18px}
.bereich-kopf{display:flex;align-items:center;gap:10px;margin:0 0 10px;color:var(--ink-2);font-weight:700;font-size:11.5px;text-transform:uppercase;letter-spacing:.14em;font-family:var(--font-mono)}
.bereich-kopf svg{width:18px;height:18px;fill:none;stroke:var(--chip-stroke);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.bereich-kopf .strich{flex:1;height:1px;background:linear-gradient(90deg,var(--line),transparent)}
.karten{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}
.karte{text-align:left;background:var(--glas);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--glas-rand);border-radius:18px;padding:14px;box-shadow:var(--card-shadow),inset 0 1px 0 var(--glas-licht);transition:transform .25s ease,box-shadow .25s ease,border-color .4s,background .55s;position:relative;overflow:hidden;display:flex;flex-direction:column;width:100%}
.erstes .karte,.erstes .aufgabe,.erstes .glas{animation:rein .5s ease both}
.karte:hover{transform:translateY(-2px);box-shadow:var(--lift-shadow);border-color:var(--sun-line)}
.karte.hervor{animation:hervor 1.4s ease}
.karte-kopf{display:flex;gap:10px;align-items:center;margin-bottom:10px}
.karte-kopf h3{font-size:15px;line-height:1.25}
.pillen-zeile{margin:0 0 10px;display:flex;gap:6px;flex-wrap:wrap}
.zustand{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;border-radius:999px;padding:3px 9px 3px 7px}
.punkt{width:8px;height:8px;border-radius:50%;background:currentColor;position:relative;flex:none}
/* Zustands-Pillen (Karten, Detail, Tooltip) */
.zustand.z-laeuft,.tipp-z.z-laeuft{background:var(--sun-soft);color:var(--sun)}
html[data-theme=light] .zustand.z-laeuft,html[data-theme=light] .tipp-z.z-laeuft{color:var(--sun-tief)}
.zustand.z-laeuft .punkt::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;animation:drehen 1.1s linear infinite}
.zustand.z-fertig,.tipp-z.z-fertig{background:var(--gruen-soft);color:var(--chip-stroke)}
html[data-theme=light] .zustand.z-fertig,html[data-theme=light] .tipp-z.z-fertig{color:var(--gruen)}
.zustand.z-wartet,.tipp-z.z-wartet{background:var(--badge-sun);color:var(--badge-sun-ink)}
.zustand.z-wartet .punkt{animation:atmenP 1.8s ease-in-out infinite}
.zustand.z-fehler,.tipp-z.z-fehler{background:var(--ton-soft);color:var(--ton)}
.zustand.z-fehler .punkt{animation:atmenP 1.2s ease-in-out infinite}
.zustand.z-geplant,.tipp-z.z-geplant{background:var(--line-2);color:var(--ink-2)}
.stufe-pille{font-size:11px;font-weight:700;border-radius:999px;padding:3px 8px;background:var(--orange-soft);color:var(--orange-ink);border:1px solid var(--orange-line)}
.karte.laeuft{border-color:var(--sun-line)}
.karte.laeuft::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:linear-gradient(90deg,transparent,var(--sun),transparent);background-size:50% 100%;background-repeat:no-repeat;animation:band 1.8s linear infinite}
.karte.fehler{border-color:var(--ton);box-shadow:var(--card-shadow),0 0 22px var(--glow-ton)}
.karte.wartet{border-color:var(--sun-line)}
.zeilen{display:grid;grid-template-columns:auto 1fr;gap:2px 10px;font-size:12.5px;color:var(--ink-2)}
.zeilen b{color:var(--ink);font-weight:600;font-family:var(--font-mono);font-size:12px}
.zaehler{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.zaehler span{font-size:12px;background:var(--surface-2);border:1px solid var(--line);border-radius:999px;padding:2px 9px}
.zaehler b{font-family:var(--font-mono)}
.takt{display:flex;gap:5px;align-items:center;margin-top:12px;padding-top:10px;border-top:1px solid var(--line-2);font-size:10.5px;color:var(--ink-3);font-family:var(--font-mono);letter-spacing:.06em}
.takt .tage{display:flex;gap:4px;margin-left:auto}
.tupf{width:9px;height:9px;border-radius:50%;background:var(--line);display:inline-block}
.t-ok{background:var(--gruen)}.t-teilweise{background:var(--sun)}.t-fehler{background:var(--ton)}.t-laeuft{background:var(--sun);box-shadow:0 0 8px var(--glow-sun-stark);animation:atmenP 1.6s infinite}
.orange-hinweis{font-size:12.5px;color:var(--orange-ink);background:var(--orange-soft);border:1px solid var(--orange-line);border-radius:10px;padding:6px 9px;display:flex;gap:6px;align-items:center;margin-top:10px}
.orange-hinweis svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* Skelett beim Laden */
.skelett{height:130px;border-radius:18px;background:linear-gradient(90deg,var(--surface-2),var(--line),var(--surface-2));background-size:200% 100%;animation:schimmer 1.4s linear infinite;border:1px solid var(--line);margin-bottom:16px}

/* Karten-Ansicht: Raster und Seitenleiste */
.layout{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:20px;margin-top:18px;align-items:start}
.seite{display:flex;flex-direction:column;gap:16px;position:sticky;top:76px}
.panel{background:var(--glas);border:1px solid var(--glas-rand);border-radius:18px;padding:16px;box-shadow:var(--card-shadow),inset 0 1px 0 var(--glas-licht);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);scroll-margin-top:80px}
.panel h2{font-size:15.5px}
.panel .abschnitt-kopf{margin-bottom:10px}
.todo{display:flex;gap:10px;align-items:flex-start;padding:8px 0;border-top:1px solid var(--line-2);font-size:13.5px}
.todo:first-of-type{border-top:0}
.haken{width:18px;height:18px;border-radius:6px;border:1.6px solid var(--gruen-line);flex:none;margin-top:1px}
.todo small{display:block;color:var(--ink-3);font-size:11.5px;font-family:var(--font-mono)}
.topf{margin:10px 0}
.topf-kopf{display:flex;justify-content:space-between;gap:10px;font-size:13px}
.topf-kopf b{font-family:var(--font-mono);font-variant-numeric:tabular-nums}
.balken{height:6px;border-radius:6px;background:var(--line);overflow:hidden;margin-top:5px}
.balken i{display:block;height:100%;width:0;border-radius:6px;background:linear-gradient(90deg,var(--sun-tief),var(--sun));box-shadow:0 0 12px var(--sun-glow);transition:width 1.1s cubic-bezier(.2,.8,.2,1)}
.balken.ueber i{background:var(--ton);box-shadow:0 0 10px var(--glow-ton)}
.balken.gruen i{background:var(--gruen);box-shadow:none}
.frei-neg{color:var(--ton)}
.umzug{display:flex;gap:8px;align-items:center;font-size:13px;padding:6px 0;border-top:1px solid var(--line-2)}
.umzug .ziel{margin-left:auto;color:var(--ink-2);font-size:12px;text-align:right}
.stufe{width:9px;height:9px;border-radius:50%;flex:none;display:inline-block}
.st-umgezogen{background:var(--gruen)}.st-unterwegs{background:var(--sun)}.st-geplant{background:var(--ink-3)}.st-bleibt{background:transparent;border:1.6px solid var(--ink-3)}.st-fehler{background:var(--ton)}
/* Einkauf: Monatsüberblick je Topf (Ausgangsbetrag · verbraucht · davon) */
.topf-zahlen{display:flex;flex-wrap:wrap;gap:2px 10px;font-size:11.5px;color:var(--ink-2);margin-top:4px;font-variant-numeric:tabular-nums}
.topf-zahlen .davon{flex-basis:100%}
.topf-kopf.ueberblick{flex-wrap:wrap}
/* Einkauf: Vorschau der nächsten Monate — nur die Tabelle scrollt waagrecht, nie die Seite */
#einkauf{min-width:0}
.vorschau{margin-top:14px;padding-top:10px;border-top:1px solid var(--line-2);min-width:0}
.vorschau h3{font-size:13px;font-weight:600;margin:0 0 6px}
.vorschau-rollen{overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch}
.vorschau-tabelle{border-collapse:collapse;font-size:12px;font-variant-numeric:tabular-nums;white-space:nowrap;width:100%}
.vorschau-tabelle th,.vorschau-tabelle td{padding:4px 6px;text-align:right;border-bottom:1px solid var(--line-2)}
.vorschau-tabelle th[scope=row]{text-align:left;font-weight:500;position:sticky;left:0;background:var(--surface)}
.vorschau-tabelle thead th{color:var(--ink-2);font-weight:500}
.vorschau-tabelle thead th:first-child{text-align:left}
.vorschau-tabelle td{font-family:var(--font-mono)}
.vorschau-tabelle .jetzt{background:var(--line-2)}
.vorschau-tabelle thead th.jetzt{color:var(--ink);font-weight:600}
.vorschau-tabelle tr.zusammen th,.vorschau-tabelle tr.zusammen td{font-weight:600;border-bottom:none}
.vorschau-hinweis{font-size:12px;margin-top:6px}
/* Wo die Agenten laufen: Stufe in Worten, Punkt nur als Zusatz */
.umzug-name{display:flex;flex-direction:column;min-width:0}
.umzug-name small{color:var(--ink-2);font-size:11.5px}
.ort-cloud{background:var(--gruen)}.ort-mac{background:var(--sun)}.ort-offen{background:transparent;border:1.6px solid var(--ink-3)}
.umzug .ort-text-cloud{color:var(--ink)}.umzug .ort-text-offen{color:var(--ink-3)}
@media (max-width:420px){.umzug{flex-wrap:wrap}.umzug .ziel{margin-left:17px;text-align:left;flex-basis:100%}}
.legende{display:flex;gap:10px;flex-wrap:wrap;font-size:11.5px;color:var(--ink-2);margin-top:10px}
.legende span{display:inline-flex;gap:5px;align-items:center}
.platzhalter{border:1.5px dashed var(--line);border-radius:14px;padding:14px;color:var(--ink-2);font-size:13px;text-align:center}
.mehr{background:none;border:0;color:var(--sun);font-weight:700;font-size:13px;padding:8px 0 0}
html[data-theme=light] .mehr{color:var(--sun-tief)}

/* Detail-Lade */
.schleier{position:fixed;inset:0;background:var(--schleier);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);opacity:0;pointer-events:none;transition:opacity .3s;z-index:40}
.schleier.offen{opacity:1;pointer-events:auto}
.lade{position:fixed;top:0;right:0;bottom:0;width:min(480px,100%);background:var(--surface);border-left:1px solid var(--sun-line);z-index:41;transform:translateX(102%);transition:transform .4s cubic-bezier(.2,.8,.2,1),visibility .4s;visibility:hidden;overflow:auto;padding:20px 22px 40px;box-shadow:var(--lift-shadow)}
.lade.offen{transform:none;visibility:visible}
.lade-kopf{display:flex;gap:12px;align-items:center}
.lade-kopf small{color:var(--ink-2);font-weight:600;font-family:var(--font-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase}
.lade h2{font-size:25px;margin:12px 0 6px}
.lade h4{margin:20px 0 8px;font-size:11px;text-transform:uppercase;letter-spacing:.14em;color:var(--sun);font-family:var(--font-mono)}
html[data-theme=light] .lade h4{color:var(--sun-tief)}
.lade p{margin:8px 0}
.fakten{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.fakt{background:var(--surface-2);border:1px solid var(--line);border-radius:12px;padding:9px 12px}
.fakt small{display:block;color:var(--ink-3);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.12em;font-family:var(--font-mono)}
.fakt b{font-size:13.5px;font-weight:600}
.recht{list-style:none;margin:0;padding:0}
.recht li{display:flex;gap:8px;align-items:flex-start;padding:5px 0;font-size:14px}
.recht li svg{margin-top:2px}
.recht.darf svg{color:var(--gruen)}
.recht.frei svg{color:var(--sun)}
.lauf{display:grid;grid-template-columns:12px 1fr auto;gap:10px;align-items:start;padding:10px 0;border-top:1px solid var(--line-2);font-size:13.5px}
.lauf .stufe{margin-top:6px}
.lauf small{color:var(--ink-3);white-space:nowrap;font-family:var(--font-mono);font-size:11px}
.lauf ul{margin:4px 0 0;padding-left:16px;color:var(--ink-2);font-size:13px}

/* Anmeldung */
.anmeldung{max-width:420px;margin:8vh auto 0;background:var(--glas);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--sun-line);border-radius:24px;padding:28px;box-shadow:var(--card-shadow),0 0 60px var(--glow-sun);position:relative;overflow:hidden}
.anmeldung::before{content:"";position:absolute;right:-40px;top:-40px;width:140px;height:140px;border-radius:50%;background:radial-gradient(circle,var(--glow-sun-stark),transparent 70%)}
.anmeldung h1{font-size:28px;margin:14px 0 6px}
.anmeldung p{color:var(--ink-2);margin:0 0 18px}
.anmeldung label{display:block;font-size:11px;font-weight:700;margin:12px 0 5px;font-family:var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2)}
.anmeldung input{width:100%;border-radius:12px;border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:11px 13px;font:inherit}
.anmeldung input:focus{border-color:var(--sun);box-shadow:0 0 0 3px var(--sun-soft)}
.anmeldung .knopf{margin-top:18px;width:100%;justify-content:center;padding:11px}
.anmeldung .fehlertext{color:var(--ton);font-weight:600;font-size:14px;margin-top:12px}
.anmeldung .klein{font-size:12.5px;color:var(--ink-3);margin-top:14px}

.toast{position:fixed;left:50%;bottom:22px;transform:translate(-50%,40px);opacity:0;background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:999px;font-weight:600;transition:all .35s;z-index:60;pointer-events:none;max-width:calc(100% - 32px);text-align:center;box-shadow:0 0 30px var(--glow-sun)}
.toast.da{opacity:1;transform:translate(-50%,0)}
.fuss{position:relative;z-index:1;max-width:1560px;margin:0 auto;padding:0 24px 30px;color:var(--ink-3);font-size:11px;text-align:center;font-family:var(--font-mono);letter-spacing:.06em}

/* Fluss: Projekt-Agenten → App-Agenten → Apps (Karten-Ansicht) */
.fluss-zahlen{display:flex;gap:6px;flex-wrap:wrap;margin-left:auto}
.fluss-zahlen span{font-size:12px;border-radius:999px;padding:3px 10px;background:var(--surface-2);border:1px solid var(--line);color:var(--ink-2);font-weight:600}
.fluss-zahlen b{font-family:var(--font-mono);color:var(--ink)}
.fluss-zahlen .sun{background:var(--sun-soft);border-color:var(--sun-line);color:var(--sun)}.fluss-zahlen .sun b{color:var(--sun)}
.fluss-zahlen .ton{background:var(--ton-soft);border-color:transparent;color:var(--ton)}.fluss-zahlen .ton b{color:var(--ton)}
.fluss-satz{margin:-4px 0 14px;color:var(--ink-2);font-size:14px;max-width:70ch}
.fluss{position:relative;display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.15fr) minmax(0,.9fr);gap:0 64px;padding:18px;border-radius:20px;border:1px solid var(--glas-rand);background:radial-gradient(600px 300px at 50% 0%,var(--sun-soft),transparent 70%),var(--glas);box-shadow:var(--card-shadow)}
.fluss-linien{position:absolute;left:0;top:0;pointer-events:none;overflow:visible}
.fluss-spalte{position:relative;z-index:1;display:flex;flex-direction:column;gap:6px;justify-content:center}
.fluss-spalte h3{font-family:var(--font-mono);font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);margin:0 0 6px}
.f-knoten{display:flex;align-items:center;gap:8px;text-align:left;width:100%;border:1px solid var(--line);background:var(--surface-2);border-radius:12px;padding:6px 9px;font-size:13px;font-weight:600;transition:opacity .25s,border-color .25s,transform .2s,background .55s}
.f-knoten:hover{transform:translateX(2px);border-color:var(--sun-line)}
.f-app.fehler{border-color:var(--ton)}
.f-app.laeuft{border-color:var(--sun-line)}
.f-name{flex:1;min-width:0;line-height:1.25}
.f-mobil{display:none;font-weight:500;color:var(--ink-3);font-size:11.5px;margin-top:2px}
.f-punkt{width:9px;height:9px;border-radius:50%;flex:none;background:var(--ink-3)}
.f-punkt.z-fertig{background:var(--gruen)}.f-punkt.z-laeuft{background:var(--sun);box-shadow:0 0 8px var(--glow-sun-stark);animation:atmenP 1.6s infinite}.f-punkt.z-wartet{background:var(--badge-sun)}.f-punkt.z-fehler{background:var(--ton)}.f-punkt.z-geplant{background:transparent;border:1.6px solid var(--ink-3)}
.f-zahl{min-width:20px;height:20px;border-radius:999px;display:inline-grid;place-items:center;font-size:11px;font-weight:800;padding:0 6px;font-family:var(--font-mono)}
.f-zahl.sun{background:var(--badge-sun);color:var(--badge-sun-ink)}
.f-zahl.ton{background:var(--badge-ton);color:var(--badge-ink)}
.f-art{font-size:11px;font-weight:700;color:var(--ink-3);border:1px dashed var(--ink-3);border-radius:999px;padding:0 6px}
.f-instanz{border:1px solid var(--gruen-line);background:var(--gruen-soft);border-radius:14px;padding:10px 12px;transition:opacity .25s,border-color .25s}
.f-instanz-kopf{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:13.5px;color:var(--gruen-tief)}
html[data-theme=dark] .f-instanz-kopf{color:var(--chip-stroke)}
.f-apps{font-size:12px;color:var(--ink-2);margin-top:3px;line-height:1.4}
.f-hinweis{font-size:11.5px;color:var(--ton);font-weight:600;margin-top:4px}
.f-linie{fill:none;stroke:var(--linie-fluss);stroke-width:1.6;transition:stroke .25s,opacity .25s,stroke-width .25s}
.f-linie.aktiv{stroke:var(--sun);stroke-width:2.4;stroke-dasharray:6 9;animation:fluss 1.3s linear infinite}
.f-linie.zurueck{stroke:var(--ton);stroke-width:1.8;stroke-dasharray:3 5}
.fluss.fokus .f-knoten:not(.hell),.fluss.fokus .f-instanz:not(.hell){opacity:.35}
.fluss.fokus .f-linie:not(.hell){opacity:.12}
.fluss.fokus .f-linie.hell{stroke-width:2.6;opacity:1}
.fluss.fokus .f-linie.hell:not(.aktiv):not(.zurueck){stroke:var(--gruen)}
.lieferliste{margin-top:14px;padding:14px 16px}
.lieferliste h3{font-size:15px;margin-bottom:4px}
.lieferung{display:flex;gap:10px;align-items:flex-start;padding:8px 0;border-top:1px solid var(--line-2);font-size:13.5px}
.lieferliste h3+.lieferung,.lade h4+.lieferung{border-top:0}
.lieferung small{display:block;color:var(--ink-3);font-size:11.5px;font-family:var(--font-mono)}
.f-stand{flex:none;font-size:10.5px;font-weight:700;border-radius:999px;padding:2px 8px;margin-top:1px;white-space:nowrap;background:var(--line-2);color:var(--ink-2)}
.f-stand.sun{background:var(--sun-soft);color:var(--sun)}.f-stand.ton{background:var(--ton-soft);color:var(--ton)}.f-stand.gruen{background:var(--gruen-soft);color:var(--gruen)}
html[data-theme=light] .f-stand.sun{color:var(--sun-tief)}
.zaehler .art-da{border-color:var(--gruen-line);color:var(--gruen)}
.zaehler .art-fehlt{border-style:dashed;color:var(--ink-2)}

/* Bewegungen */
@keyframes atmenP{50%{transform:scale(1.45);opacity:.6}}
@keyframes atmenO{50%{opacity:.45}}
@keyframes puls{0%{opacity:.75;transform:scale(1)}100%{opacity:0;transform:scale(2.1)}}
@keyframes drehen{to{transform:rotate(360deg)}}
@keyframes rein{from{opacity:0;transform:translateY(8px)}}
@keyframes neu{0%{background:var(--sun-soft)}100%{background:transparent}}
@keyframes blinken{50%{opacity:0}}
@keyframes band{from{background-position:-50% 0}to{background-position:150% 0}}
@keyframes hervor{0%,100%{box-shadow:var(--card-shadow)}30%{box-shadow:0 0 0 3px var(--sun),0 0 30px var(--glow-sun-stark)}}
@keyframes schimmer{to{background-position:-200% 0}}
@keyframes fluss{to{stroke-dashoffset:-32}}

/* Breiten */
/* B4 echter Modus: Hinweise, Überfällig, Einkaufsstand, Anmeldelink, Ablage */
.hinweis-klein{display:flex;gap:7px;align-items:center;font-size:12.5px;color:var(--ink-2);background:var(--surface-2);border:1px solid var(--line);border-radius:10px;padding:6px 10px;margin:0 0 10px}
.hinweis-klein.warn{color:var(--ton);background:var(--ton-soft);border-color:var(--ton)}
.hinweis-klein svg,.ueberfaellig svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.ueberfaellig{display:flex;gap:6px;align-items:center;font-size:12px;font-weight:600;color:var(--ton);margin:0 0 10px}
.platzhalter.warn{border-color:var(--ton);color:var(--ink)}
.topf-kopf.summe{padding-bottom:6px;border-bottom:1px solid var(--line-2);margin-bottom:4px}
.panel-text{font-size:13px;color:var(--ink-2);margin:0 0 10px}
.panel .knopf svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.meldungen{font-size:11px;color:var(--ink-3);margin-top:4px}
.anmeldung .infotext{color:var(--chip-stroke);font-weight:600;font-size:14px;margin-top:12px}
.anmeldung .infotext:empty,.anmeldung .fehlertext:empty{display:none}
.anmeldung .mehr{display:block;margin-top:10px}
.ab-hinweis{font-size:13px;color:var(--ink-2)}
.ab-skelett{height:180px}
.ab-liste{display:flex;flex-direction:column;gap:6px}
.ab-block{border:1px solid var(--line);border-radius:12px;background:var(--surface-2);overflow:hidden}
.ab-block .ab-block{border-radius:10px;margin:4px 0}
.ab-ordner{display:flex;gap:10px;align-items:center;width:100%;border:0;background:transparent;color:inherit;padding:9px 12px;text-align:left;font:inherit}
.ab-ordner svg{width:17px;height:17px;fill:none;stroke:var(--chip-stroke);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none;transition:transform .2s}
.ab-ordner[aria-expanded="true"] svg{stroke:var(--sun)}
.ab-name{flex:1;min-width:0;font-size:13.5px;font-weight:600;overflow-wrap:anywhere}
.ab-name small{display:block;font-weight:500;color:var(--ink-3);font-size:11.5px}
.ab-inhalt{padding:0 10px 8px 14px;border-top:1px solid var(--line-2)}
.ab-datei,.ab-zugriff{display:flex;gap:10px;align-items:center;padding:8px 0;border-top:1px solid var(--line-2)}
.ab-datei:first-child{border-top:0}
.ab-zugriff{border:1px solid var(--line-2);border-radius:10px;padding:8px 10px;background:var(--surface-2)}
.ab-zugriff .stufe{margin-top:2px}
.ab-zugriff > small{color:var(--ink-3);white-space:nowrap;font-size:11px}
.ab-zugriff.abgewiesen .ab-name{color:var(--ton)}
.ab-leer{font-size:12.5px;color:var(--ink-3);padding:8px 0}
.ab-stufe{font-size:10.5px;font-weight:700;border-radius:999px;padding:2px 8px;border:1px solid var(--line);white-space:nowrap;font-family:var(--font-mono);letter-spacing:.04em}
.ab-gruen{background:var(--gruen-soft);color:var(--chip-stroke);border-color:var(--gruen-line)}
.ab-gelb{background:var(--sun-soft);color:var(--sun-tief);border-color:var(--sun-line)}
html[data-theme=dark] .ab-gelb{color:var(--sun)}
.ab-stufe.ab-orange{background:var(--orange-soft);color:var(--orange-ink);border-color:var(--orange-line)}
.ab-keine{color:var(--ink-3)}
.ab-orange-box{margin-top:18px}
.klein-knopf{padding:5px 10px;font-size:12px;flex:none}

@media (max-width:1280px){.kommando{grid-template-columns:minmax(0,1fr) 360px}.kennzahlen{grid-template-columns:repeat(5,minmax(84px,1fr))}.unten{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:1100px){
  .hud{grid-template-columns:1fr}
  .kommando{grid-template-columns:1fr}
  .kommando-links{position:static}
  .layout{grid-template-columns:1fr}.seite{position:static}
}
@media (max-width:860px){
  .fluss{grid-template-columns:1fr;padding:12px}
  .fluss-linien,.fluss .fluss-spalte:first-of-type,.fluss .fluss-spalte:last-child{display:none}
  .f-mobil{display:block}
  .fluss-zahlen{margin-left:0}
  .agentenliste{display:block}
  .unten{grid-template-columns:1fr}
}
/* kleines Netz: nur Punkte und Licht, Namen erst beim Vergrößern */
.netz-flaeche.klein .nk-name,.netz-flaeche.klein .bereich-name{display:none}
.netz-flaeche.klein .inst-name{font-size:18px;letter-spacing:.08em}
.netz-flaeche.klein .inst-extra{display:none}
.netz-flaeche.klein .kern-zahl{display:none}
.netz-flaeche.klein .kern-titel{font-size:26px}
@media (max-width:720px){
  main{padding:12px 16px 60px}.kopf-in{padding:8px 16px;gap:6px}
  .marke .wort{display:none}
  .kopf .pille{display:none}
  .schalter .text{display:none}
  .ansicht button{padding:5px 9px}
  .ansicht button span{display:none}
  .hud{padding:16px}
  .kennzahlen{grid-template-columns:repeat(3,1fr)}
  .kennzahlen .kz:first-child{display:none}
  .kz{padding:8px 10px}.kz .zahl{font-size:22px}.kz .was{font-size:9.5px;letter-spacing:.06em}
  .buehne{padding:12px 10px 10px}
  .legende-netz{display:none}
  .knopf.zoom{display:inline-flex;padding:5px 11px;font-size:12px}
  .netz-rahmen{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
  .netz-rahmen.gross .netz-flaeche{width:1120px}
  .buehne-tipp{display:none}
  .karten,.warten{grid-template-columns:1fr}
  .filter{margin-left:0}
  .fakten{grid-template-columns:1fr 1fr}
  .term-log{max-height:240px}
  .lade{top:auto;height:90vh;width:100%;border-radius:22px 22px 0 0;transform:translateY(102%);border-left:0;border-top:1px solid var(--sun-line)}
}

/* ---------- „Frag CEO B“ (ceo-chat.js, 0021) ---------- */
.chat .abschnitt-kopf{display:flex;align-items:center;gap:8px}
.chat .raum{flex:1}
.chat-log{position:relative;height:100%;overflow:auto;overscroll-behavior:contain;display:flex;flex-direction:column;gap:8px;padding:12px 14px 16px}
.chat-z{max-width:92%;border-radius:14px;padding:8px 11px;border:1px solid var(--line);background:var(--surface-2);display:grid;grid-template-columns:1fr auto;column-gap:10px;row-gap:2px}
.chat-z .chat-wer{font-size:11px;font-weight:700;letter-spacing:.04em;color:var(--ink-3)}
.chat-z .chat-zeit{font-size:11px;color:var(--ink-3);grid-column:2;grid-row:1}
.chat-z .chat-text{grid-column:1 / -1;margin:0;white-space:pre-wrap;overflow-wrap:anywhere;font-size:14px}
.chat-ich{align-self:flex-end;background:var(--sun-soft);border-color:var(--sun-line)}
.chat-ceo{align-self:flex-start}
.chat-ceo .chat-wer{color:var(--sun)}
html[data-theme=light] .chat-ceo .chat-wer{color:var(--sun-tief)}
.chat-hinweis{align-self:center;background:var(--ton-soft);border-color:var(--ton)}
/* 12.10.2026: Hinweis von ceo-frage an Andreas Nachricht (z. B. Rückfrage schon abgelaufen — ging an CEO B), dauerhaft */
.chat-z .chat-eingang-hinweis{grid-column:1 / -1;margin:4px 0 0;padding-top:4px;border-top:1px solid var(--sun-line);color:var(--ink-2)}
.chat-wartet{margin:0;font-size:13px;color:var(--ink-2);font-style:italic}
.chat-form{display:flex;flex-direction:column;gap:8px}
.chat-form label{font-weight:700;font-size:13px}
.chat-feld{width:100%;box-sizing:border-box;border-radius:12px;border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:9px 12px;font:inherit;resize:none;min-height:48px;max-height:30vh}
.chat-feld:focus{outline:none;border-color:var(--sun);box-shadow:0 0 0 3px var(--sun-soft)}
.chat-knoepfe{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.chat-zaehler{font-size:11px;color:var(--ink-3)}
.chat-mikro.an{border-color:var(--sun);box-shadow:0 0 14px var(--glow-sun);animation:atmenP 1.6s ease-in-out infinite}
.chat-klein{margin:0;font-size:12px;color:var(--ink-3)}
.chat-status{font-size:13px;color:var(--ink-2);min-height:1em}
.chat-fehler{font-size:13px;color:var(--ton);font-weight:600}
.chat-fehler:empty,.chat-status:empty{display:none}
.chat-datenschutz{border:1px solid var(--sun-line);background:var(--sun-soft);border-radius:14px;padding:10px 12px;font-size:13px}
.chat-datenschutz p{margin:6px 0}
@media (prefers-reduced-motion: reduce){.chat-mikro.an{animation:none}}

/* Jetzt laufen lassen (0025) */
.start-platz{margin:12px 0 4px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.start-meldung{margin:0;font-size:13px;color:var(--muted, inherit);flex:1 1 200px;min-width:0}

/* Rueckfragen der Agenten (0026): im Chat als Nachricht von CEO B, unter „Wartet auf dich“ nur lesbar */
.chat-z .chat-fragen{grid-column:1 / -1;margin:4px 0 2px;padding-left:1.4em;font-size:14px;overflow-wrap:anywhere}
.chat-z .chat-fragen li{margin:2px 0}
.chat-z.chat-rueckfrage .chat-klein{grid-column:1 / -1;margin:2px 0 0}
.chat-rueckfrage.offen{border-color:var(--sun)}
.aufgabe ol.punkte{margin:6px 0 4px;padding-left:1.4em;overflow-wrap:anywhere}
.aufgabe ol.punkte li{margin:3px 0}
.aufgabe ol.punkte .punkt-mehr{color:var(--ink-3)}

/* =====================================================================
   „Aufgaben zuerst“ (Umbau 29.09.2026): Kopfleiste · Für dich | CEO B · Büro & Agenten
   ===================================================================== */
:root{--kopf-h:59px;--luft:14px;--tabs-h:0px}

/* Kopfleiste schlank */
.hud-platz{margin-bottom:var(--luft)}
.hud{padding:12px 18px;gap:18px}
.hud h1{font-size:clamp(19px,1.9vw,25px);margin:2px 0 6px}
.hud small{font-size:12px}
.kennzahlen{grid-template-columns:repeat(6,minmax(84px,1fr));gap:6px}
.kz{padding:8px 11px;gap:4px;border-radius:12px}
.kz .zahl{font-size:22px}
.kz .was{font-size:9.5px;letter-spacing:.08em}
.kz[aria-pressed="true"]{border-color:var(--sun);background:var(--sun-soft);box-shadow:0 0 0 1px var(--sun),0 0 16px var(--glow-sun)}

/* Arbeitsfläche: Für dich links, CEO B rechts in voller Höhe */
.arbeit{display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,440px);gap:16px;align-items:start}
.spalte-fuer-dich{min-width:0;scroll-margin-top:calc(var(--kopf-h) + 10px)}
.spalte-ceo{position:sticky;top:calc(var(--kopf-h) + var(--luft));height:calc(100vh - var(--kopf-h) - 2 * var(--luft));height:calc(100dvh - var(--kopf-h) - 2 * var(--luft));min-height:420px;min-width:0}

/* Für dich */
.fuer-dich .abschnitt-kopf{margin-bottom:10px}
.chips{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 12px}
.chip{border:1px solid var(--line);background:var(--surface-2);border-radius:999px;padding:6px 12px;font-size:13px;font-weight:600;color:var(--ink-2);display:inline-flex;gap:4px;align-items:center;transition:background .2s,border-color .2s}
.chip b{color:var(--ink);font-weight:700}
.chip:hover:not(:disabled){border-color:var(--sun-line)}
.chip:disabled{opacity:.45;cursor:default}
.chip[aria-pressed="true"]{background:var(--sun);color:var(--badge-sun-ink);border-color:transparent;box-shadow:0 0 12px var(--glow-sun)}
.chip[aria-pressed="true"] b{color:var(--badge-sun-ink)}
.chip.ton:not([aria-pressed="true"]) b{color:var(--ton)}
.aufgaben{display:flex;flex-direction:column;gap:10px}
.aufgabe{padding:12px 14px 12px 18px;gap:6px}
.aufgabe.a-todo{border-color:var(--line)}
.aufgabe.a-todo::before{background:var(--gruen);box-shadow:none}
.aufgabe.a-fehler{border-color:var(--ton)}
.aufgabe.a-fehler::before{background:var(--ton);box-shadow:0 0 12px var(--glow-ton)}
.aufgabe.a-rueckfrage{border-color:var(--sun)}
.aufgabe.hervor{animation:hervor 1.4s ease}
.a-kopf{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}
.a-art{font-family:var(--font-mono);font-size:10.5px;font-weight:700;color:var(--sun);text-transform:uppercase;letter-spacing:.1em}
html[data-theme=light] .a-art{color:var(--sun-tief)}
.a-todo .a-art{color:var(--chip-stroke)}
html[data-theme=light] .a-todo .a-art{color:var(--gruen)}
.a-fehler .a-art{color:var(--ton)}
.a-dringend{font-size:10.5px;font-weight:700;border-radius:999px;padding:1px 8px;background:var(--ton-soft);color:var(--ton)}
.a-rueckfrage .a-dringend{background:var(--badge-sun);color:var(--badge-sun-ink)}
.a-meta{margin-left:auto;font-family:var(--font-mono);font-size:11px;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.aufgabe h3.a-titel{font-size:15.5px;margin:0;line-height:1.3}
.a-auf{all:unset;cursor:pointer;display:flex;gap:8px;align-items:flex-start;width:100%;box-sizing:border-box}
.a-auf:focus-visible{outline:2px solid var(--sun);outline-offset:3px;border-radius:6px}
.a-auf span{flex:1;min-width:0}
.a-pfeil{flex:none;width:8px;height:8px;margin:6px 4px 0 0;border-right:2px solid var(--ink-3);border-bottom:2px solid var(--ink-3);transform:rotate(45deg);transition:transform .2s}
.a-auf[aria-expanded="true"] .a-pfeil,details[open] > summary .a-pfeil{transform:rotate(-135deg);margin-top:9px}
.aufgabe .a-kurz{margin:0;color:var(--ink-2);font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.a-details{padding-top:4px}
.a-details > :last-child{margin-bottom:4px}
.aufgabe .knoepfe{margin-top:4px}
.aufgabe .bestaetigen{margin-top:4px}
.a-antwort{display:flex;flex-direction:column;gap:6px;margin-top:6px}
.a-antwort label{font-size:12.5px;font-weight:700}
.a-feld{width:100%;box-sizing:border-box;border-radius:12px;border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:9px 12px;font:inherit;resize:vertical;min-height:64px}
.a-feld:focus{outline:none;border-color:var(--sun);box-shadow:0 0 0 3px var(--sun-soft)}
/* 0048: Antwort an den Agenten, Antwort je Punkt, „Frage dazu“ und der Verlauf unter der Karte */
.a-feld.klein{min-height:40px}
.a-punkte{display:flex;flex-direction:column;gap:12px}
/* 12.10.2026: die ganze Frage steht ÜBER ihrem Antwortfeld (am Handy gut lesbar, bricht um) */
.a-punkt-zeile{display:flex;flex-direction:column;align-items:stretch;gap:4px}
.a-punkt-zeile label.a-punkt-frage{font-size:14px;font-weight:400;line-height:1.4;text-align:left;color:var(--ink);overflow-wrap:anywhere}
.a-punkt-zeile label.a-punkt-frage b{font-weight:700;color:var(--ink-2)}
.a-punkt{width:100%;box-sizing:border-box;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:6px 10px;font:inherit;min-width:0}
.a-punkt:focus{outline:none;border-color:var(--sun);box-shadow:0 0 0 3px var(--sun-soft)}
.a-frage{margin-top:10px}
.antwort-verlauf{list-style:none;margin:8px 0 4px;padding:0;display:flex;flex-direction:column;gap:6px;overflow-wrap:anywhere}
.antwort-verlauf li{border:1px solid var(--line);border-radius:10px;padding:6px 10px;background:var(--surface-2);font-size:13px}
.antwort-verlauf .av-zeit{color:var(--ink-3);font-size:12px}
.antwort-verlauf .av-text,.antwort-verlauf .av-ceo,.antwort-verlauf .av-warten{margin:3px 0 0;white-space:pre-wrap}
.antwort-verlauf .av-ceo{color:var(--ink)}
.antwort-verlauf .av-warten{color:var(--ink-3);font-style:italic}
.lauf .lauf-text{white-space:pre-line}
.a-antwort .hinweis-klein{margin:0}
.aufgabe .a-meldung{margin:0;font-size:13px;color:var(--ink);font-weight:600}
.a-meldung:empty{display:none}
.leer.gross{display:flex;flex-direction:column;gap:6px;padding:34px 18px}
.leer.gross b{font-size:20px;font-family:var(--font-titel)}
.leer .mehr{padding:0}

/* Beitragsvorschlag: alles sichtbar, was rausgeht */
.aufgabe.beitrag{border-color:var(--sun)}
.aufgabe .beitrag-felder{grid-template-columns:minmax(110px,auto) 1fr;gap:6px 14px;font-size:13.5px;margin:4px 0 10px}
.beitrag-felder dt{color:var(--ink-3);font-size:12px;font-weight:600;padding-top:1px}
.aufgabe .beitrag-felder dd{font-family:var(--font-text);font-size:13.5px;font-weight:500;color:var(--ink)}
.aufgabe .beitrag-felder .bf-text{white-space:pre-wrap;background:var(--surface-2);border:1px solid var(--line);border-radius:10px;padding:8px 10px;font-size:14px}
.aufgabe .beitrag-felder .bf-titel{font-weight:700}
.beitrag-felder .bf-medien{grid-column:1 / -1}
.bf-warn,.aufgabe .beitrag-felder dd.bf-warn{color:var(--ton);font-weight:700}
.beitrag-medien{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px}
.bm{display:flex;flex-direction:column;gap:6px;min-width:0}
.bm-bild{position:relative;aspect-ratio:4/5;border-radius:12px;border:1px solid var(--line);background:var(--surface-2);overflow:hidden;display:grid;place-items:center}
.bm-bild img{width:100%;height:100%;object-fit:cover;display:block}
.bm-nr{position:absolute;left:6px;top:6px;z-index:1;min-width:22px;height:22px;border-radius:999px;display:grid;place-items:center;font-family:var(--font-mono);font-size:11px;font-weight:800;background:var(--badge-sun);color:var(--badge-sun-ink)}
.bm-video{font-family:var(--font-mono);font-size:12px;color:var(--ink-2)}
.bm-text{display:flex;flex-direction:column;gap:2px;min-width:0;font-size:12.5px}
.bm-text b{overflow-wrap:anywhere}
.bm-text small{color:var(--ink-3);font-size:11px;overflow-wrap:anywhere}
.bm-text .knopf{align-self:flex-start;margin-top:2px}
.bm-meldung:empty{display:none}
.bm-text .bm-meldung{color:var(--ton)}
.bm-text .bm-meldung.bm-ok{color:var(--gruen)}
.beitrag-unerwartet{border:1.5px solid var(--ton);background:var(--ton-soft);border-radius:12px;padding:10px 12px;margin:0 0 10px;font-size:13px}
.beitrag-unerwartet b{color:var(--ton);display:block;margin-bottom:6px}
/* 0041: Termin eines Beitrags aendern (nur Datum + Uhrzeit) */
.beitrag-termin{border:1px solid var(--line);background:var(--surface-2);border-radius:12px;padding:10px 12px;margin:10px 0 0;display:grid;gap:6px;font-size:13px}
.beitrag-termin small{color:var(--ink-3)}
.beitrag-termin .bt-zeile{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.beitrag-termin input{font:inherit;padding:6px 8px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);min-width:0}
/* 0042: Text ändern auf der offenen Beitragskarte */
.beitrag-textfeld .bx-offen{display:grid;gap:6px}
.beitrag-textfeld .bx-offen[hidden]{display:none}
.beitrag-textfeld textarea{font:inherit;width:100%;box-sizing:border-box;min-height:9em;resize:vertical;padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);line-height:1.45}
.beitrag-textfeld .bx-hinweise{margin:0;padding-left:18px;display:grid;gap:2px}
.aufgabe .beitrag-unerwartet dl{margin:0}
.aufgabe .beitrag-unerwartet dt{color:var(--ton);font-weight:700}

/* Zuletzt erledigt */
.erledigt{margin-top:16px;border:1px solid var(--line);border-radius:16px;background:var(--surface-2);padding:0 14px}
.erledigt > summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:8px;padding:11px 0;font-weight:700;font-size:14px}
.erledigt > summary::-webkit-details-marker{display:none}
.erledigt > summary::after{content:"";width:7px;height:7px;border-right:2px solid var(--ink-3);border-bottom:2px solid var(--ink-3);transform:rotate(45deg);margin-left:auto;transition:transform .2s}
.erledigt[open] > summary::after{transform:rotate(-135deg)}
.erledigt-liste{list-style:none;margin:0 0 10px;padding:0}
.erledigt-liste li{display:flex;gap:10px;align-items:flex-start;padding:8px 0;border-top:1px solid var(--line-2);font-size:13.5px}
.erledigt-liste li > div{flex:1;min-width:0}
.erledigt-liste small{display:block;color:var(--ink-3);font-size:11.5px;font-family:var(--font-mono)}
.erledigt-liste .haken{background:var(--gruen-soft)}
.erledigt-liste .knoepfe-klein{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.aelter .erledigt-liste .haken{background:var(--line-2)}
.erledigt-liste .mehr{padding:0;white-space:nowrap}

/* CEO B: ein Fenster, Eingabe unten fest */
.chat{display:flex;flex-direction:column;height:100%;padding:0;overflow:hidden}
.chat::before{content:"";position:absolute;inset:0 0 auto 0;height:1px;background:linear-gradient(90deg,transparent,var(--sun),transparent);z-index:1}
.chat-kopf{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--line);background:linear-gradient(160deg,var(--hero-a),transparent);flex:none}
.chat-kopf h2{font-size:16px;line-height:1.1}
.chat-kopf small{color:var(--hero-sub);font-size:11.5px;font-weight:600}
.chat-kopf .mehr{padding:0;font-size:12px}
.chat-log-rahmen{position:relative;flex:1;min-height:0}
.chat-tag{align-self:center;margin:6px 0 0;font-family:var(--font-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
/* Aufräumen (12.10.2026): Hinweis + „Alles anzeigen“ oben im Verlauf */
.chat-aufgeraeumt{align-self:center;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px 10px;margin:2px 0 4px;text-align:center}
.chat-aufgeraeumt .chat-klein{font-size:11.5px}
.chat-trenn{display:flex;align-items:center;gap:10px;margin:4px 0;font-size:11.5px;font-weight:700;color:var(--ton);letter-spacing:.02em}
.chat-trenn::before,.chat-trenn::after{content:"";flex:1;height:1px;background:var(--ton)}
.chat-bericht{border-color:var(--sun-line);background:var(--sun-soft);max-width:100%}
.chat-z .chat-text p{margin:0 0 6px}
.chat-z .chat-text p:last-child{margin-bottom:0}
/* 0056: gegliederte Antworten von CEO B (Karten im Gespräch) */
.chat-gegliedert{white-space:normal}
.chat-gegliedert p{white-space:pre-wrap}
.chat-gegliedert .chat-h{font-family:var(--font-titel);font-size:15px;font-weight:700;margin:10px 0 4px;line-height:1.3}
.chat-gegliedert .chat-h:first-child{margin-top:0}
.chat-gegliedert .chat-liste{margin:0 0 6px;padding-left:22px}
.chat-gegliedert .chat-liste li{margin:2px 0;white-space:pre-wrap}
.chat-tabelle{max-width:100%;overflow-x:auto;margin:2px 0 8px;border:1px solid var(--line);border-radius:10px}
.chat-tabelle table{border-collapse:collapse;font-size:13px;min-width:100%}
.chat-tabelle th,.chat-tabelle td{padding:4px 8px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line);white-space:normal}
.chat-tabelle th{background:var(--surface-2);font-weight:700}
.chat-tabelle tr:last-child td{border-bottom:0}
/* 0056: „Gehen wir die Karten durch“ oben auf „Für dich“ */
.karten-gang{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:12px 14px;margin:0 0 12px}
.karten-gang .kg-text{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1 1 220px}
.karten-gang .kg-text b{font-size:15px}
.karten-gang .kg-text span{font-size:13px;color:var(--ink-2)}
.karten-gang .knopf{flex:none}
.chat-z .chat-verweis{grid-column:1 / -1;justify-self:start;padding:2px 0 0;font-size:12.5px}
.chat-lokal .chat-wer{color:var(--chip-stroke)}
html[data-theme=light] .chat-lokal .chat-wer{color:var(--gruen)}
.chat-neu{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);z-index:2;border:0;border-radius:999px;padding:7px 14px;font-size:13px;font-weight:700;background:var(--sun);color:var(--badge-sun-ink);box-shadow:0 0 18px var(--glow-sun-stark),var(--lift-shadow)}
.chat-unten{flex:none;border-top:1px solid var(--line);padding:10px 14px 12px;display:flex;flex-direction:column;gap:8px;background:var(--glas)}
.chat-schnell{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding-bottom:2px}
.chat-schnell::-webkit-scrollbar{display:none}
.chat-schnell .term-frage{flex:none;white-space:nowrap}
.chat-form{gap:6px}
.chat-unten .chat-klein{font-size:11.5px}

/* Büro & Agenten: unten, zugeklappt */
.buero{margin-top:22px;padding:0;overflow:visible;scroll-margin-top:calc(var(--kopf-h) + 10px)}
.buero > summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:12px;padding:14px 18px}
.buero > summary::-webkit-details-marker{display:none}
.buero > summary .a-pfeil{margin-left:auto}
.buero-titel{display:flex;flex-direction:column;min-width:0}
.buero-titel h2{font-size:17px}
.buero-text{color:var(--ink-2);font-size:12.5px}
.buero-inhalt{padding:0 16px 16px}
.buero-leiste{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 12px;color:var(--ink-2)}
.buero-oben{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:16px;align-items:start}
.buero-agenten{display:flex;flex-direction:column;gap:16px;min-width:0}
.buero-seite{display:flex;flex-direction:column;gap:16px;min-width:0}
.buero .abschnitt{margin-bottom:0}

/* Reiter am Handy */
.tabs{display:none}
.toast{display:flex;gap:12px;align-items:center}
.toast.mit-knopf{pointer-events:auto}
.toast-knopf{border:0;background:transparent;color:var(--sun);font-weight:800;padding:0;text-decoration:underline}

@media (max-width:1280px){.kennzahlen{grid-template-columns:repeat(3,minmax(84px,1fr))}.buero-oben{grid-template-columns:minmax(0,1fr) 340px}}
@media (max-width:1100px){.buero-oben{grid-template-columns:1fr}.arbeit{grid-template-columns:minmax(0,1fr) 360px}.hud{grid-template-columns:1fr}}
@media (max-width:899px){
  :root{--tabs-h:62px}
  body{padding-bottom:calc(var(--tabs-h) + env(safe-area-inset-bottom))}
  main{padding-bottom:20px}
  .arbeit{grid-template-columns:1fr}
  .spalte-ceo{position:static;height:calc(100vh - var(--kopf-h) - var(--tabs-h) - 24px);height:calc(100dvh - var(--kopf-h) - var(--tabs-h) - 24px - env(safe-area-inset-bottom));min-height:360px}
  body[data-tab="fuer-dich"] .spalte-ceo,body[data-tab="fuer-dich"] #buero{display:none}
  body[data-tab="ceo"] .spalte-fuer-dich,body[data-tab="ceo"] #buero,body[data-tab="ceo"] .hud-platz,body[data-tab="ceo"] .fuss,body[data-tab="ceo"] .vorfuehr-band{display:none}
  body[data-tab="buero"] .arbeit{display:none}
  body[data-tab="buero"] .buero{margin-top:0}
  .kennzahlen .kz-buero{display:none}
  .kennzahlen{grid-template-columns:repeat(4,minmax(0,1fr))}
  .tabs:not([hidden]){display:flex;position:fixed;left:0;right:0;bottom:0;z-index:30;height:calc(var(--tabs-h) + env(safe-area-inset-bottom));padding:6px 8px env(safe-area-inset-bottom);gap:6px;background:var(--glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-top:1px solid var(--line)}
  .tab{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border:0;background:transparent;border-radius:14px;font-size:11.5px;font-weight:700;color:var(--ink-2);position:relative;min-width:0}
  .tab svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
  .tab[aria-pressed="true"]{color:var(--ink);background:var(--sun-soft)}
  .tab[aria-pressed="true"] svg{color:var(--sun)}
  .tab-zahl{position:absolute;top:3px;left:calc(50% + 8px);min-width:18px;height:18px;border-radius:999px;background:var(--badge-sun);color:var(--badge-sun-ink);font-size:10.5px;display:grid;place-items:center;padding:0 5px}
  .toast{bottom:calc(var(--tabs-h) + 12px + env(safe-area-inset-bottom))}
  .a-meta{margin-left:0;flex-basis:100%}
  .buero > summary{padding:12px 14px}
  .buero-inhalt{padding:0 10px 12px}
}
@media (max-width:720px){
  .hud{padding:12px 14px}
  .hud h1{font-size:19px}
  .hud-zeile{display:none}
  .kz{padding:7px 8px}.kz .zahl{font-size:19px}.kz .was{font-size:8.5px;letter-spacing:.04em}
  .kennzahlen .kz:first-child{display:flex}
  .aufgabe .beitrag-felder{grid-template-columns:1fr;gap:2px}
  .beitrag-felder dd{margin-bottom:6px}
  .beitrag-medien{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* 0049: Prüfkarte einer Wareneingangsdatei (wareneingang-karte.js) — Tabelle ab 50 Zeilen scrollbar, nie die Seite. */
.we-kopf{display:grid;grid-template-columns:auto 1fr;gap:2px 12px;margin:0 0 10px;font-size:13px}
.we-kopf dt{color:var(--ink-2)}.we-kopf dd{margin:0;overflow-wrap:anywhere}
.we-warn{display:flex;gap:6px;align-items:center;font-size:13px;font-weight:600;color:var(--ton);margin:0 0 10px}
.we-abgleich{font-size:13px;font-weight:600;padding:8px 10px;border-radius:var(--r-feld);margin:0 0 10px;background:var(--line-2)}
.we-abgleich.we-stimmt{background:var(--gruen-soft);color:var(--gruen)}
.we-abgleich.we-abweichung{background:var(--ton-soft);color:var(--ton)}
.we-abschnitt{margin:0 0 12px}.we-abschnitt h4{margin:0 0 6px;font-size:13px}
.we-tab{border-collapse:collapse;font-size:12px;width:100%}
.we-tab th,.we-tab td{text-align:left;padding:3px 8px 3px 0;border-bottom:1px solid var(--line-2);vertical-align:top}
.we-tab thead th{position:sticky;top:0;background:var(--bg);font-weight:700}
.we-tab .we-gesamt th,.we-tab .we-gesamt td{font-weight:700}
.we-summen td,.we-summen th{font-variant-numeric:tabular-nums}
.we-tabelle{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.we-tabelle.scroll{max-height:420px;overflow-y:auto;border:1px solid var(--line-2);border-radius:var(--r-feld)}
.we-tabelle:focus-visible{outline:2px solid var(--sun);outline-offset:2px}
.we-tabelle td:nth-child(3){min-width:180px}
.we-warnungen{margin:0;padding-left:18px;font-size:12px}
/* 0051: Karte „Waagenliste + Etiketten senden“ */
.wv-kopf{display:grid;grid-template-columns:max-content 1fr;gap:4px 12px;margin:0 0 10px}
.wv-kopf dt{color:var(--ink-2)}
.wv-kopf dd{margin:0;overflow-wrap:anywhere}
.wv-text{white-space:pre-wrap;font:inherit;font-size:13.5px;background:var(--surface-2);border:1px solid var(--line);border-radius:10px;padding:8px 10px;margin:0 0 10px;max-width:100%;overflow-wrap:anywhere}
.wv-anhaenge{margin:0 0 10px;padding-left:18px}
.wv-anhaenge code{overflow-wrap:anywhere}

/* „Für dich“ verständlich (Andrea 01.10.2026): Gruppen „Du entscheidest“ / „Du machst“ / „Zur Info“ (eingeklappt),
   To-do-Karte mit Warum, Herkunft und Technik nur in den Details, große Freigabe-Karten mit gruppierten Punkten. */
.gruppe{margin:0 0 16px}
.gruppe-kopf{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-family:var(--font-titel);font-size:15.5px;font-weight:700;margin:2px 0 2px;color:var(--ink)}
.gruppe-kopf .anz{font-size:11.5px;padding:1px 8px}
.anz.still{background:var(--surface-2);color:var(--ink-2);border:1px solid var(--line);box-shadow:none}
.gruppe-satz{margin:0 0 8px;font-size:12.5px;color:var(--ink-3)}
details.gruppe-info{border:1px solid var(--line);border-radius:16px;background:var(--surface-2);padding:0 12px 6px}
details.gruppe-info > summary{cursor:pointer;list-style:none;padding:11px 0 9px}
details.gruppe-info > summary::-webkit-details-marker{display:none}
details.gruppe-info > summary::after{content:"";width:7px;height:7px;border-right:2px solid var(--ink-3);border-bottom:2px solid var(--ink-3);transform:rotate(45deg);margin-left:auto;transition:transform .2s}
details.gruppe-info[open] > summary::after{transform:rotate(-135deg)}
.aufgabe.todo-von_hand::before{background:var(--sun);box-shadow:none}
.aufgabe.todo-anschauen{border-color:var(--line-2)}
.aufgabe.todo-anschauen::before{background:var(--ink-3);box-shadow:none}
.aufgabe .a-warum{color:var(--ink);font-size:13.5px;margin:0 0 6px}
.aufgabe .a-herkunft{font-size:12px;color:var(--ink-3);margin:0 0 6px}
.a-technik{border:1px dashed var(--line);border-radius:10px;padding:6px 10px;background:var(--surface-2);margin:0 0 6px}
.a-technik-titel{display:block;font-size:11.5px;font-weight:700;color:var(--ink-3)}
.a-technik ul{margin:4px 0 0;padding-left:1.1em;font-size:12px;overflow-wrap:anywhere;color:var(--ink-2)}
.aufgabe .a-technik-text{font-size:11.5px;color:var(--ink-3);overflow-wrap:anywhere;margin:0 0 4px}
.a-teile{list-style:none;margin:0 0 8px;padding:0}
.a-teile li{padding:5px 0;border-top:1px solid var(--line-2);font-size:13px;overflow-wrap:anywhere}
.a-teile small{display:block;color:var(--ink-3);font-family:var(--font-mono);font-size:11px}
.aufgabe .knoepfe .a-details-knopf{margin-left:auto;padding:0 2px}
.aufgabe .knoepfe-klein{display:flex;gap:10px;flex-wrap:wrap}
.aufgabe .knoepfe-klein .mehr{padding:0}
.punkte-gruppiert{margin:4px 0 8px}
.aufgabe .punkte-satz{font-size:12.5px;color:var(--ink-2);margin:0 0 6px}
.aufgabe ol.punkte.gruppen{list-style:none;padding-left:0}
.punkt-gruppe{margin:0 0 8px;padding:8px 10px;border:1px solid var(--line);border-radius:12px;background:var(--surface-2)}
.punkt-gruppe > .anz{margin-left:6px;font-size:11px;padding:1px 7px}
.punkt-zeilen{margin:4px 0 0;padding-left:1.1em;font-size:13px}
.punkt-zeilen li{margin:2px 0}
.punkt-nr{color:var(--ink-3)}
.punkte-mehr > summary{cursor:pointer;color:var(--sun-tief);font-size:12.5px;font-weight:700;padding:4px 0}
html[data-theme=dark] .punkte-mehr > summary{color:var(--sun)}
.a-punkte-auf > summary{cursor:pointer;font-size:12.5px;font-weight:700;padding:4px 0}
@media (max-width:520px){
  .aufgabe .knoepfe .knopf{flex:1 1 calc(50% - 6px);justify-content:center}
  .aufgabe .knoepfe .a-details-knopf{flex:1 1 100%;text-align:center;margin-left:0}
  .a-meta{margin-left:0;white-space:normal;flex-basis:100%}
  .gruppe-kopf{font-size:15px}
}
.punkt-eigen{color:var(--ink)}
.a-teile .a-technik-text{display:block;margin:2px 0 0}
.punkt-nummern{color:var(--ink-3);font-size:11px}

/* 0055: „Für nächstes Mal merken“ an Antwortfeldern, Liste „Gemerkte Regeln“ */
.a-merken{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:13px;margin:6px 0 8px}
.a-merken input{width:18px;height:18px;accent-color:var(--ink)}
.a-merken label{font-weight:600}
.a-merken-hilfe{color:var(--ink-2);font-size:12px}
.regel-zeile{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:13px;padding:8px 0;border-top:1px solid var(--line-2)}
.regel-zeile>div{flex:1 1 220px;min-width:0}
.regel-text{margin:0;overflow-wrap:anywhere}
.regel-zeile small{color:var(--ink-2);font-size:11.5px}

/* Andrea 03.10.2026: „Das Eingabefeld soll bleiben, wenn ich nach oben scrolle, nicht wegrutschen.“ Der Verlauf scrollt
   im Rahmen (absolut darin — auch Safari gibt ihm so eine feste Höhe), das Eingabefeld darunter bleibt. Am Handy steht das
   Gesprächsfenster fest zwischen Kopf und Reiterleiste; öffnet iOS die Tastatur, hebt --vv-unten (ceo-chat.js,
   visualViewport) das Fenster samt Eingabefeld über die Tastatur. */
.chat-log{position:absolute;inset:0;height:auto}
.chat-unten{position:relative;z-index:2}
@media (max-width:899px){
  body[data-tab="ceo"]{overflow:hidden;overscroll-behavior:none}
  body[data-tab="ceo"] .spalte-ceo{position:fixed;z-index:15;left:max(10px, env(safe-area-inset-left));right:max(10px, env(safe-area-inset-right));
    top:max(calc(var(--kopf-ist, var(--kopf-h)) + 8px), calc(var(--vv-oben, 0px) + 8px));
    bottom:calc(max(calc(var(--tabs-h) + env(safe-area-inset-bottom)), var(--vv-unten, 0px)) + 8px);
    height:auto;min-height:0}
  html.tastatur-offen body[data-tab="ceo"] .chat-schnell,html.tastatur-offen body[data-tab="ceo"] .chat-unten .chat-klein{display:none}
}
@media (min-width:900px){.spalte-ceo{height:var(--chat-hoehe, calc(100dvh - var(--kopf-h) - 2 * var(--luft)));min-height:320px}}

/* Andrea 03.10.2026: Karten klarer — Übersicht der offenen Punkte (karten-uebersicht.js, Regel 16): Auffälliges oben,
   Tabelle Nr | Artikel | Frage | Empfehlung, fertiger Antwortsatz, Einzelheiten eingeklappt. Am Handy Zeilen als Kärtchen. */
.uebersicht{margin:4px 0 8px;display:grid;gap:8px;min-width:0}
.ue-auffaellig{border:1.5px solid var(--ton);background:var(--ton-soft);border-radius:12px;padding:8px 12px;font-size:13.5px}
.ue-auffaellig b{color:var(--ton);display:block;margin-bottom:4px}
.ue-auffaellig ul{margin:0;padding-left:1.2em}
.ue-auffaellig li{margin:2px 0;overflow-wrap:anywhere}
.ue-tabelle{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:12px}
.ue-tabelle:focus-visible{outline:2px solid var(--sun);outline-offset:2px}
.ue-tabelle table{border-collapse:collapse;width:100%;font-size:13px}
.ue-tabelle th,.ue-tabelle td{padding:6px 8px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line-2);overflow-wrap:break-word}
.ue-tabelle th{background:var(--surface-2);font-weight:700;white-space:nowrap}
.ue-tabelle tr:last-child td{border-bottom:0}
.ue-tabelle td small{display:block;color:var(--ink-3);font-size:11.5px;margin-top:2px}
.ue-nr{color:var(--ink-3);width:2.2em}
.ue-artikel{min-width:110px}
.ue-frage{min-width:170px}
.ue-empfehlung{min-width:140px}
.ue-keine{color:var(--ink-3)}
.ue-antwort{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:13px;background:var(--sun-soft);border:1px solid var(--sun-line);border-radius:12px;padding:8px 12px}
.ue-satz{font-weight:700;overflow-wrap:anywhere}
.ue-antwort .mehr{padding:0}
.ue-meldung{flex-basis:100%;font-size:12px;color:var(--ink-2)}
.ue-meldung:empty{display:none}
.ue-moeglich{color:var(--ink-3)}
@media (max-width:520px){
  .ue-tabelle{border:0;overflow:visible}
  .ue-tabelle table,.ue-tabelle tbody,.ue-tabelle tr,.ue-tabelle td{display:block;width:auto;min-width:0}
  .ue-tabelle thead{display:none}
  .ue-tabelle tr{border:1px solid var(--line);border-radius:12px;padding:6px 10px;margin:0 0 8px;background:var(--surface-2)}
  .ue-tabelle td{border:0;padding:2px 0}
  .ue-tabelle .ue-nr{display:inline-block;width:auto;margin-right:6px}
  .ue-tabelle .ue-artikel{display:inline}
  .ue-tabelle .ue-empfehlung::before{content:"Empfehlung: ";color:var(--ink-3);font-size:12px}
}

/* Daumen hoch/runter an CEO Bs Antworten (0062) */
.chat-z .chat-daumen{grid-column:1 / -1;display:flex;gap:4px;justify-self:end;margin-top:2px}
.chat-daumen-knopf{min-width:44px;min-height:32px;border-radius:10px;border:1px solid var(--line);background:transparent;font-size:15px;line-height:1;cursor:pointer;opacity:.55}
.chat-daumen-knopf:hover,.chat-daumen-knopf:focus-visible{opacity:1;border-color:var(--sun)}
.chat-daumen-knopf.an{opacity:1;background:var(--sun-soft);border-color:var(--sun-line)}
.chat-daumen-feld{display:flex;flex-direction:column;gap:6px;border:1px solid var(--sun-line);background:var(--sun-soft);border-radius:14px;padding:10px 12px;margin-bottom:8px}
.chat-daumen-feld[hidden]{display:none}
.chat-daumen-titel{font-weight:700;font-size:13px}
/* eigene Klassen, nicht .chat-klein: karten-klar (sw v41) aendert .chat-klein im Chat -- das Feld bleibt davon unberuehrt */
.chat-daumen-merk{display:flex;align-items:center;gap:6px;margin:0;font-size:12px;color:var(--ink-3)}
.chat-daumen-hinweis{margin:0;font-size:12px;color:var(--ink-3)}

/* 0078: Wochenmenü-Karte — Bild der Woche und Plan */
.mk-bild img{display:block;width:100%;max-width:480px;height:auto;border-radius:10px;border:1px solid var(--line)}
.mk-plan{margin-top:8px}
.mk-plan-text{white-space:pre-wrap;font:inherit;font-size:.9em;max-height:22em;overflow:auto;padding:8px;border-radius:8px;background:var(--surface-2)}

/* Probelauf 79/80 (19.10.2026): ruhige Liste — neue Karten nur als schwebender Hinweis (schiebt nichts), eingeklappte
   Karte „Antwort gesendet – Agent arbeitet“, gesperrte Freigabe während des Nachtrags */
.neu-platz{position:fixed;top:calc(var(--kopf-h) + 10px);left:50%;transform:translateX(-50%);z-index:25;pointer-events:none}
.neu-hinweis{pointer-events:auto;display:inline-flex;gap:8px;align-items:center;border:0;border-radius:999px;padding:8px 16px;background:var(--ink);color:var(--bg);font-weight:700;box-shadow:0 0 30px var(--glow-sun);cursor:pointer}
.neu-hinweis svg{width:16px;height:16px}
@media screen and (max-width:899px){body:not([data-tab="fuer-dich"]) .neu-platz{display:none}}
.aufgabe.gesendet{border-style:dashed}
.aufgabe.gesendet .a-kurz,.a-gesendet{color:var(--ink-2);font-weight:600}
.a-gesendet{margin:0 0 10px;font-size:13px}
.we-sperre{flex-basis:100%;display:flex;gap:7px;align-items:center;margin:0;font-size:12.5px;font-weight:600;color:var(--ton)}
.we-sperre svg{width:15px;height:15px}
