:root{--papier:#f4f1ea;--karte:#fffdf8;--tinte:#1b2333;--matt:#6b7280;--linie:#e3ddd0;--navy:#16233a;--akzent:#b5562b;--rot:#b42318;--rot-bg:#fde8e6;--gelb:#8a5a00;--gelb-bg:#fff2cc;--gruen:#1f6f43;--gruen-bg:#e3f2e8;--blau-bg:#e7eef9;--feld:#f7f4ee}
@media (prefers-color-scheme:dark){:root{--papier:#12161d;--karte:#1a2029;--tinte:#e8eaee;--matt:#9aa3b0;--linie:#2a323e;--navy:#c9d6ec;--akzent:#e08a5c;--rot:#ff8a80;--rot-bg:#3a1d1b;--gelb:#f3c868;--gelb-bg:#3a2f12;--gruen:#7fd6a0;--gruen-bg:#16301f;--blau-bg:#1c2a40;--feld:#141a22}}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--papier);color:var(--tinte);font:16px/1.45 -apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,sans-serif;padding-bottom:calc(76px + env(safe-area-inset-bottom))}
a{color:inherit}main{max-width:760px;margin:0 auto;padding:12px 16px 24px}
.kopf{position:sticky;top:0;z-index:5;background:color-mix(in srgb,var(--papier) 92%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--linie);padding-top:env(safe-area-inset-top)}
.kopf-zeile{max-width:760px;margin:0 auto;display:flex;gap:10px;align-items:center;padding:10px 16px 6px}
.marke{font-weight:700;letter-spacing:-.01em;text-decoration:none;white-space:nowrap;display:flex;align-items:center;gap:8px}
.punkt{width:12px;height:12px;border-radius:3px;background:var(--akzent);display:inline-block;box-shadow:5px 5px 0 var(--navy)}
.suche{flex:1}.suche input{width:100%;border:1px solid var(--linie);background:var(--karte);border-radius:10px;padding:7px 10px;font-size:15px;color:inherit}
.icon{text-decoration:none;font-size:20px;padding:4px}
.kapseln{max-width:760px;margin:0 auto;display:flex;flex-wrap:wrap;gap:6px;padding:4px 16px 12px}.kapseln[hidden]{display:none}
.kaps-knopf{flex:none;font:inherit;font-size:14px;padding:6px 11px;border-radius:99px;border:1px solid var(--linie);background:var(--karte);color:var(--tinte);white-space:nowrap;max-width:38vw;overflow:hidden;text-overflow:ellipsis}.kaps-knopf.aktiv{background:var(--navy);border-color:var(--navy);color:var(--papier);font-weight:600}
.sprung{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 6px}
.chip{flex:none;text-decoration:none;font-size:14px;padding:5px 11px;border-radius:99px;border:1px solid var(--linie);background:var(--karte);color:var(--matt)}
.chip.an{background:var(--navy);border-color:var(--navy);color:var(--papier);font-weight:600}
h1.seite{font-size:26px;letter-spacing:-.02em;margin:10px 0 14px}h1.seite small{font-size:15px;color:var(--matt);font-weight:500}
h2{font-size:13px;text-transform:uppercase;letter-spacing:.06em;color:var(--matt);margin:26px 0 8px;display:flex;justify-content:space-between;align-items:baseline}
h2 .mehr{text-transform:none;letter-spacing:0;font-size:14px;color:var(--akzent);text-decoration:none}
h3{margin:4px 0;font-size:17px}
.kacheln{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.kachel{background:var(--karte);border:1px solid var(--linie);border-radius:14px;padding:10px;text-decoration:none;font-size:12px;color:var(--matt);line-height:1.2}
.kachel b{display:block;font-size:26px;color:var(--tinte);font-variant-numeric:tabular-nums;margin-bottom:2px}
.kachel.rot{background:var(--rot-bg);border-color:transparent}.kachel.rot b{color:var(--rot)}.kachel.gelb{background:var(--gelb-bg);border-color:transparent}.kachel.gelb b{color:var(--gelb)}
@media (max-width:380px){.kacheln{grid-template-columns:repeat(2,1fr)}}
.liste{background:var(--karte);border:1px solid var(--linie);border-radius:14px;overflow:hidden}
.zeile{display:flex;gap:12px;padding:12px 14px;text-decoration:none;border-top:1px solid var(--linie)}.liste>.zeile:first-child{border-top:0}
.zeile:active{background:var(--feld)}
.z-links{flex:1;min-width:0}.z-titel{font-weight:600;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.z-unter{font-size:14px;color:var(--matt);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block;text-decoration:none}
.z-tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px;align-items:center}
.tag{font-size:12px;padding:2px 8px;border-radius:99px;background:var(--feld);border:1px solid var(--linie);white-space:nowrap}
.tag.aus{background:var(--blau-bg);border-color:transparent}
.st-offen,.st-in-Bearbeitung{background:var(--gelb-bg);border-color:transparent}.st-delegiert{background:var(--blau-bg);border-color:transparent}
.st-Antwort-prüfen,.st-prüfen-Vorscreen{background:var(--rot-bg);border-color:transparent}.st-erledigt,.st-beantwortet{background:var(--gruen-bg);border-color:transparent}
.vgnr{font-size:12px;color:var(--matt);font-variant-numeric:tabular-nums}.vgnr.gross{font-size:13px;text-transform:uppercase;letter-spacing:.05em}
.z-rechts{flex:none;text-align:right}
.frist{font-weight:700;font-variant-numeric:tabular-nums;font-size:15px}.frist small{display:block;font-weight:500;font-size:12px;color:var(--matt)}
.frist.rot{color:var(--rot)}.frist.gelb{color:var(--gelb)}.frist.leer{color:var(--matt);font-weight:500}
.rot-t{color:var(--rot)}.gelb-t{color:var(--gelb)}
.karte{background:var(--karte);border:1px solid var(--linie);border-radius:14px;padding:14px;margin-bottom:10px}
.karte.klein{padding:10px 12px;font-size:15px}.flex{display:flex;justify-content:space-between;align-items:center;gap:10px}
.k-art{font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--akzent);font-weight:600}
.knopf{display:inline-block;border:0;background:var(--navy);color:var(--papier);font:inherit;font-weight:600;font-size:15px;padding:10px 14px;border-radius:10px;text-decoration:none;cursor:pointer;text-align:center}
.knopf.hell{background:var(--karte);color:var(--tinte);border:1px solid var(--linie)}.knopf.an{background:var(--akzent);color:#fff}
.knopf.klein{padding:6px 10px;font-size:13px}.knopf.voll{width:100%}.knopf.links{text-align:left}
.aktionen{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
input,textarea,select{font:inherit;font-size:16px;color:inherit;background:var(--feld);border:1px solid var(--linie);border-radius:10px;padding:9px 10px;width:100%}
textarea{resize:vertical}
.stapel{display:flex;flex-direction:column;gap:8px;margin:8px 0}.reihe{display:flex;gap:8px;align-items:center}.reihe>*{flex:1}.reihe .knopf{flex:none}
.schnell{display:flex;gap:6px;flex-wrap:wrap}
.segment{display:flex;background:var(--feld);border:1px solid var(--linie);border-radius:10px;padding:3px;gap:3px;margin-bottom:8px}
.segment button,.segment label{flex:1;border:0;background:transparent;font:inherit;font-size:14px;padding:7px 4px;border-radius:8px;color:var(--matt);text-align:center}
.segment button.an{background:var(--karte);color:var(--tinte);font-weight:600;box-shadow:0 1px 2px rgb(0 0 0/.08)}
.segment.klein label{display:flex;gap:6px;justify-content:center;align-items:center}.segment input{width:auto}
.filter{margin-bottom:6px}
.dezent{color:var(--matt);font-size:13px}.stand{color:var(--matt);font-size:12px;text-align:center;margin-top:30px}
.hinweis{background:var(--gruen-bg);color:var(--gruen);border-radius:10px;padding:10px 12px;margin:8px 0;font-size:14px}
.leerbox{text-align:center;color:var(--matt);padding:30px 10px}
.zurueck{text-decoration:none;color:var(--akzent);font-size:15px}
.vg-kopf h1{font-size:22px;letter-spacing:-.01em;margin:4px 0}
.fakten{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px;margin-top:14px}
.fakten>div{background:var(--karte);border:1px solid var(--linie);border-radius:12px;padding:9px 11px}
.fakten span{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--matt)}.fakten small{display:block;color:var(--matt);font-size:12px}
.text{background:var(--karte);border:1px solid var(--linie);border-radius:12px;padding:12px;margin:0;font-size:15px}
ul.text{padding-left:30px}
.verlauf{list-style:none;margin:0;padding:0 0 0 14px;border-left:2px solid var(--linie)}
.verlauf li{position:relative;background:var(--karte);border:1px solid var(--linie);border-radius:12px;padding:10px 12px;margin:0 0 8px 8px}
.verlauf li:before{content:"";position:absolute;left:-17px;top:16px;width:10px;height:10px;border-radius:50%;background:var(--navy);border:2px solid var(--papier)}
.verlauf .ve-ausgang:before{background:var(--akzent)}.verlauf .ve-delegation:before{background:var(--matt)}.verlauf .ve-whatsapp:before{background:#25a35a}
.ve-kopf{display:flex;justify-content:space-between;gap:8px;font-size:15px}.ve-kopf span{color:var(--matt);font-size:13px;white-space:nowrap}
.ve-text{font-size:14px;color:var(--matt);margin-top:4px}
.dok{display:inline-block;margin-top:6px;font-size:14px;color:var(--akzent);text-decoration:none;word-break:break-all}
.status-wahl{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:6px}.status-wahl .knopf{font-size:13px;padding:7px 10px}
details.aufklapp{background:var(--karte);border:1px solid var(--linie);border-radius:12px;padding:0 12px;margin-top:8px}
details.aufklapp summary{padding:12px 0;font-weight:600;cursor:pointer;list-style:none}details.aufklapp summary::-webkit-details-marker{display:none}
details.aufklapp summary:after{content:"›";float:right;color:var(--matt);transition:transform .15s}details.aufklapp[open] summary:after{transform:rotate(90deg)}
.sprech{border-radius:14px;padding:10px 12px;margin:0 0 8px;max-width:92%}
.sprech.ich{background:var(--blau-bg);margin-left:auto}.sprech.claude{background:var(--karte);border:1px solid var(--linie)}
.sp-kopf{font-size:12px;color:var(--matt)}.sp-text{white-space:pre-wrap;font-size:15px;margin:4px 0 6px}
pre.entwurf{white-space:pre-wrap;font:inherit;font-size:14px;background:var(--feld);border-radius:10px;padding:10px;margin:10px 0 0}
.kal-kopf{display:flex;align-items:center;justify-content:space-between}.kal-kopf h1{margin:10px 0}
table.monat{width:100%;border-collapse:separate;border-spacing:3px;table-layout:fixed}
.monat th{font-size:12px;color:var(--matt);font-weight:500}
.monat td{background:var(--karte);border:1px solid var(--linie);border-radius:8px;height:52px;vertical-align:top;padding:4px;font-size:13px}
.monat td.fremd{opacity:.35}.monat td.heute{border-color:var(--akzent);box-shadow:inset 0 0 0 1px var(--akzent)}
.punkte{display:flex;gap:3px;flex-wrap:wrap;margin-top:4px}.punkte i,.legende i{width:7px;height:7px;border-radius:50%;display:inline-block}
.p-frist{background:var(--rot)}.p-wiedervorlage{background:var(--akzent)}.p-termin{background:var(--navy)}
.legende{font-size:13px;color:var(--matt);display:flex;gap:10px;align-items:center}.legende i{margin-left:6px;margin-right:-6px}
.abo{font-size:12px;word-break:break-all;color:var(--matt);margin:4px 0 6px;font-family:ui-monospace,Menlo,monospace}
.login{max-width:340px;margin:12vh auto 0;text-align:center}.login form{display:flex;flex-direction:column;gap:10px;margin-top:18px}
.login input{text-align:center;font-size:22px;letter-spacing:.3em}
.logo-gross .punkt{width:34px;height:34px;border-radius:8px;box-shadow:12px 12px 0 var(--navy)}
.leiste{position:fixed;left:0;right:0;bottom:0;z-index:6;display:flex;background:color-mix(in srgb,var(--karte) 94%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-top:1px solid var(--linie);padding:6px 4px calc(6px + env(safe-area-inset-bottom))}
.leiste a{flex:1;text-align:center;text-decoration:none;font-size:11px;color:var(--matt);position:relative;padding:2px 0}
.leiste a span{display:block;font-size:20px;line-height:1.2}.leiste a.an{color:var(--akzent);font-weight:600}
.zahl{position:absolute;top:-2px;left:calc(50% + 6px);background:var(--akzent);color:#fff;font-size:11px;border-radius:99px;padding:0 6px;line-height:17px}
.scan-knoepfe{display:grid;grid-template-columns:1fr 1fr;gap:8px}.scan-gross{padding:22px 10px;font-size:16px;display:flex;align-items:center;justify-content:center;gap:6px}
.scan-seiten{display:flex;gap:8px;overflow-x:auto;padding:4px 0}
.scan-seite{position:relative;flex:none;width:92px;height:122px;border-radius:10px;border:1px solid var(--linie);background:var(--karte);display:flex;align-items:center;justify-content:center;overflow:hidden;color:var(--matt);font-weight:600;text-align:center}
.scan-seite img{width:100%;height:100%;object-fit:cover}.scan-seite button{position:absolute;top:4px;right:4px;width:24px;height:24px;border-radius:99px;border:0;background:rgb(0 0 0/.55);color:#fff;font-size:15px;line-height:1}
.scan-seite.plus{border-style:dashed;font-size:26px;line-height:1.1;cursor:pointer}.scan-seite.plus small{font-size:12px;font-weight:500}
.hinweis.rot{background:var(--rot-bg);color:var(--rot)}.tag.rot{background:var(--rot-bg);color:var(--rot);border-color:transparent}.tag.gruen{background:var(--gruen-bg);color:var(--gruen);border-color:transparent}
.kamera{font-size:19px}
.ansicht-leiste{position:sticky;top:calc(env(safe-area-inset-top) + 55px);z-index:4;display:flex;gap:8px;align-items:center;background:var(--papier);padding:8px 0;border-bottom:1px solid var(--linie);margin:-4px 0 10px}
.ansicht-name{flex:1;min-width:0;font-size:13px;color:var(--matt);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ansicht-seiten{display:flex;flex-direction:column;gap:10px}.ansicht-seiten img{width:100%;height:auto;border:1px solid var(--linie);border-radius:6px;background:#fff;box-shadow:0 1px 3px rgb(0 0 0/.06)}
.ansicht-rahmen{width:100%;height:75vh;border:1px solid var(--linie);border-radius:8px;background:#fff}
.schnell-status{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px;margin:10px 0 4px}.schnell-status .knopf{font-size:13px;padding:9px 4px}
