:root{--bg:#f3f5f8;--flaeche:#fff;--flaeche-2:#f8f9fb;--text:#1b2230;--leise:#667085;--linie:#e3e7ed;--akzent:#1f5fae;--akzent-hell:#e8f0fb;--akzent-text:#fff;--gefahr:#b42318;--gefahr-hell:#fdecea;--a:#c0392b;--b:#c27803;--c:#2e7d32;--txt-aufgabe:#1f5fae;--txt-termin:#8a5200;--txt-meilenstein:#b42318;--txt-notiz:var(--text);--schatten:0 1px 2px #1018280d, 0 1px 3px #1018280f;--radius:12px;--leiste:232px;--tabbar:64px;color:var(--text);background:var(--bg);-webkit-text-size-adjust:100%;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:15px;line-height:1.45}@media (prefers-color-scheme:dark){:root{--bg:#0f1216;--flaeche:#181c22;--flaeche-2:#1d222a;--text:#e6e8eb;--leise:#98a2b3;--linie:#2a3039;--akzent:#6ea8ff;--akzent-hell:#1b2a40;--akzent-text:#0b1220;--gefahr:#ff7b72;--gefahr-hell:#3a1d1b;--txt-aufgabe:#6ea8ff;--txt-termin:#f0a23b;--txt-meilenstein:#ff7b72;--schatten:0 1px 2px #0006}}*{box-sizing:border-box}body{background:var(--bg);margin:0}a{color:var(--akzent)}h1{letter-spacing:-.01em;margin:0;font-size:1.45rem;line-height:1.2}.nowrap{white-space:nowrap}.leer{color:var(--leise);text-align:center;padding:1.5rem}.fehler{color:var(--gefahr)}.rahmen{min-height:100vh}.seite{max-width:1240px;margin:0 auto;padding:1.5rem 1.75rem 3rem}.seitenleiste{width:var(--leiste);background:var(--flaeche);border-right:1px solid var(--linie);flex-direction:column;gap:.5rem;padding:1.25rem .9rem;display:flex;position:fixed;inset:0 auto 0 0}.rahmen .seite{margin-left:var(--leiste);max-width:none}.marke{letter-spacing:-.01em;padding:0 .6rem .5rem;font-size:1.05rem;font-weight:700}.seitenleiste .neu{justify-content:center;margin-bottom:.75rem}.seitenleiste nav{flex-direction:column;flex:1;gap:.15rem;display:flex}.seitenleiste nav a,.seitenleiste .abmelden{color:var(--leise);background:0 0;border-radius:8px;align-items:center;gap:.7rem;padding:.55rem .7rem;font-size:.95rem;font-weight:500;text-decoration:none;display:flex}.seitenleiste nav a:hover,.seitenleiste .abmelden:hover{background:var(--flaeche-2);color:var(--text)}.seitenleiste nav a.aktiv{background:var(--akzent-hell);color:var(--akzent)}.handy-kopf,.tabbar{display:none}button,.knopf{font:inherit;background:var(--akzent);color:var(--akzent-text);cursor:pointer;white-space:nowrap;border:0;border-radius:8px;align-items:center;gap:.4rem;min-height:38px;padding:.5rem .95rem;font-weight:500;text-decoration:none;display:inline-flex}button:hover,.knopf:hover{filter:brightness(1.07)}button.link{color:var(--akzent);background:0 0;min-height:0;padding:.45rem .3rem}button.gefahr,.gefahr{color:var(--gefahr)}.icon-knopf{color:var(--leise);background:0 0;border-radius:8px;min-height:0;padding:.4rem;display:inline-flex}.icon-knopf:hover{background:var(--flaeche-2);color:var(--text)}input,select,textarea{font:inherit;color:var(--text);background:var(--flaeche);border:1px solid var(--linie);border-radius:8px;max-width:100%;min-height:38px;padding:.5rem .65rem}input:focus,select:focus,textarea:focus{outline:2px solid var(--akzent);outline-offset:-1px;border-color:#0000}input[type=checkbox]{width:18px;height:18px;min-height:0;accent-color:var(--akzent)}label.haken{color:var(--text);white-space:nowrap;align-items:center;gap:.45rem;font-size:.92rem;display:inline-flex}.zahl{background:var(--flaeche-2);min-width:1.35rem;color:var(--leise);text-align:center;border-radius:999px;margin-left:.35rem;padding:0 .35rem;font-size:.75rem;font-weight:600;line-height:1.35rem;display:inline-block}.karte{background:var(--flaeche);border:1px solid var(--linie);border-radius:var(--radius);box-shadow:var(--schatten);padding:1.1rem 1.25rem}.seitenkopf{justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1rem;display:flex}.zurueck{color:var(--leise);align-items:center;gap:.3rem;margin-bottom:.6rem;font-size:.9rem;text-decoration:none;display:inline-flex}.zurueck:hover{color:var(--akzent)}.segment{background:var(--flaeche-2);border:1px solid var(--linie);border-radius:10px;gap:2px;max-width:100%;margin-bottom:1rem;padding:3px;display:inline-flex;overflow-x:auto}.segment button{color:var(--leise);background:0 0;border-radius:7px;min-height:34px;padding:.35rem .9rem}.segment button.aktiv{background:var(--flaeche);color:var(--text);box-shadow:var(--schatten);font-weight:600}.segment.klein{margin-bottom:0}.zeitraum{flex-wrap:wrap;align-items:center;gap:.75rem;margin-bottom:1rem;display:flex}.zeitraum .spanne{color:var(--leise);font-size:.9rem}.reiter{border-bottom:1px solid var(--linie);scrollbar-width:none;gap:.25rem;margin:1.25rem 0 1rem;display:flex;overflow-x:auto}.reiter::-webkit-scrollbar{display:none}.reiter button{color:var(--leise);background:0 0;border-bottom:2px solid #0000;border-radius:0;min-height:0;padding:.55rem .8rem}.reiter button.aktiv{color:var(--akzent);border-bottom-color:var(--akzent);font-weight:600}.filterleiste{flex-direction:column;gap:.6rem;margin-bottom:1rem;display:flex}.filter-zeile{align-items:center;gap:.5rem;display:flex}.filter-zeile .suche{flex:1;min-width:0}.filter-knopf{background:var(--flaeche);color:var(--text);border:1px solid var(--linie);display:none}.filter-knopf.offen{border-color:var(--akzent);color:var(--akzent)}.filter-knopf .zahl{background:var(--akzent);color:var(--akzent-text)}.filter-mehr{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.filter{flex-wrap:wrap;align-items:center;gap:.5rem;margin-bottom:1rem;display:flex}.filter>label{color:var(--leise);align-items:center;gap:.35rem;font-size:.9rem;display:inline-flex}.liste{border-collapse:separate;border-spacing:0;background:var(--flaeche);border:1px solid var(--linie);border-radius:var(--radius);width:100%;box-shadow:var(--schatten);overflow:hidden}.liste th,.liste td{text-align:left;border-bottom:1px solid var(--linie);vertical-align:top;padding:.65rem .8rem}.liste tbody tr:last-child td{border-bottom:0}.liste th{text-transform:uppercase;letter-spacing:.04em;color:var(--leise);background:var(--flaeche-2);font-size:.75rem;font-weight:600}.liste tr.klickbar{cursor:pointer}.liste tr.klickbar:hover td{background:var(--akzent-hell)}.liste td.c-check{width:2.2rem}.liste td.c-meta,.liste td.c-datum,.liste td.c-nr{color:var(--leise);font-size:.92rem}.liste td.c-aktion{text-align:right;width:1%}.liste .benennung{font-weight:600}.liste .beschreibung{color:var(--leise);-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-top:.15rem;font-size:.85rem;display:-webkit-box;overflow:hidden}.liste tr.erledigt .benennung,.liste tr.erledigt td{color:var(--leise)!important}.liste tr.erledigt .benennung{text-decoration:line-through}.gruppe td{background:var(--flaeche-2);text-transform:uppercase;letter-spacing:.04em;color:var(--leise);padding:.45rem .8rem;font-size:.78rem;font-weight:600}.gruppe.ueberfaellig td{color:var(--gefahr);background:var(--gefahr-hell)}tr.ueberfaellig td.c-datum{color:var(--gefahr);font-weight:600}.prio{color:#fff;background:var(--leise);border-radius:7px;flex-shrink:0;justify-content:center;align-items:center;width:1.7rem;height:1.7rem;font-size:.85rem;font-weight:700;display:inline-flex}.prio-A{background:var(--a)}.prio-B{background:var(--b)}.prio-C{background:var(--c)}.chip{background:var(--flaeche-2);color:var(--leise);border:1px solid var(--linie);border-radius:999px;padding:.05rem .5rem;font-size:.78rem;font-weight:600;display:inline-block}.chip.prio-hoch{color:var(--gefahr);background:var(--gefahr-hell);border-color:currentColor}.chip.prio-mittel{color:var(--txt-termin);background:0 0;border-color:currentColor}.text-art-aufgabe{color:var(--txt-aufgabe)!important}.text-art-termin{color:var(--txt-termin)!important}.text-art-meilenstein{color:var(--txt-meilenstein)!important}.text-art-notiz{color:var(--txt-notiz)!important}.punkt{vertical-align:middle;border-radius:50%;width:.55rem;height:.55rem;margin-right:.4rem;display:inline-block}.punkt.art-aufgabe{background:var(--txt-aufgabe)}.punkt.art-termin{background:var(--txt-termin)}.punkt.art-meilenstein{background:var(--txt-meilenstein);border-radius:1px;transform:rotate(45deg)}.projektkopf{flex-direction:column;gap:.9rem;display:flex}.projektkopf-titel{align-items:flex-start;gap:.8rem;display:flex}.projektkopf-titel>div{flex:1;min-width:0}.projektkopf .prio{border-radius:9px;width:2.2rem;height:2.2rem;font-size:1rem}.projektkopf .nr{color:var(--leise);font-size:.85rem;font-weight:600}.kennzahlen{flex-wrap:wrap;gap:.6rem 2rem;display:flex}.kennzahlen div{flex-direction:column;font-weight:500;display:flex}.kennzahlen span{color:var(--leise);text-transform:uppercase;letter-spacing:.04em;font-size:.75rem;font-weight:600}.info{grid-template-columns:max-content 1fr;gap:.55rem 2rem;margin:0 0 1.1rem;display:grid}.info dt{color:var(--leise)}.info dd{margin:0}.maske{flex-direction:column;gap:1rem;max-width:620px;display:flex}.maske label{color:var(--leise);flex-direction:column;gap:.35rem;font-size:.88rem;font-weight:500;display:flex}.maske label.haken{color:var(--text);flex-direction:row;align-items:center}.maske label small{font-weight:400}.paar{grid-template-columns:1fr 1fr;gap:1rem;display:grid}.knopfreihe{flex-wrap:wrap;align-items:center;gap:.75rem;padding-top:.25rem;display:flex}.knopfreihe .gefahr{margin-left:auto}.seite>h1{margin-bottom:1rem}.personen-form{grid-template-columns:repeat(4,1fr) auto;gap:.5rem;margin-bottom:1rem;display:grid}.login{place-items:center;min-height:100vh;padding:1rem;display:grid}.login .karte{width:100%;max-width:400px;padding:1.75rem}.login h1{margin-bottom:.25rem}.gantt{background:var(--flaeche);border:1px solid var(--linie);border-radius:var(--radius);box-shadow:var(--schatten);display:flex;overflow:hidden}.gantt-namen{border-right:1px solid var(--linie);flex-shrink:0;width:260px}.gantt-name{white-space:nowrap;text-overflow:ellipsis;border-bottom:1px solid var(--linie);height:34px;padding:0 .7rem;font-size:.85rem;line-height:34px;overflow:hidden}.gantt-name a{text-decoration:none}.gantt-name a:hover{text-decoration:underline}.gantt-flaeche{flex:1;overflow-x:auto}.gantt-kopf{border-bottom:1px solid var(--linie);height:30px;color:var(--leise);background:var(--flaeche-2);font-size:.72rem;display:flex}.gantt-kopf>div{border-right:1px solid var(--linie);text-align:center;flex-shrink:0;line-height:30px;overflow:hidden}.gantt-kopf>div.we{background:var(--bg)}.gantt-zeile{border-bottom:1px solid var(--linie);height:34px;position:relative}.gantt-balken{background:var(--txt-aufgabe);border-radius:5px;height:16px;position:absolute;top:9px}.gantt-balken.art-projekt{background:var(--leise);opacity:.55}.gantt-balken.art-termin{background:var(--txt-termin)}.gantt-balken.erledigt{opacity:.35}.gantt-raute{background:var(--txt-meilenstein);border-radius:2px;width:14px;height:14px;position:absolute;top:10px;transform:rotate(45deg)}.gantt-heute{background:var(--gefahr);opacity:.55;z-index:1;width:2px;position:absolute;top:0;bottom:0}.gantt-name.kopf,.gantt-zeile.kopf{background:var(--flaeche-2)}.gantt-name.kopf a{color:var(--text);font-weight:600}.gantt-name.eingerueckt{padding-left:1.4rem}@media (width<=1100px){:root{--leiste:200px}.seite{padding:1.25rem 1.25rem 3rem}.personen-form{grid-template-columns:1fr 1fr}}@media (width<=1080px){.liste.karten,.liste.karten tbody{box-shadow:none;background:0 0;border:0;border-radius:0;display:block;overflow:visible}.liste.karten thead{display:none}.liste.karten tr{background:var(--flaeche);border:1px solid var(--linie);border-radius:var(--radius);box-shadow:var(--schatten);flex-wrap:wrap;align-items:center;gap:.3rem .9rem;margin-bottom:.6rem;padding:.75rem .9rem;display:flex;position:relative}.liste.karten td{border:0;padding:0;font-size:.85rem;display:block}.liste.karten td:empty{display:none}.liste.karten tr:has(>td.c-check:not(:empty)){padding-left:2.8rem}.liste.karten td.c-check{width:auto;position:absolute;top:.85rem;left:.9rem}.liste.karten td.c-check:empty{display:none}.liste.karten td.c-vorn{order:-3}.liste.karten td.c-nr{order:-2;font-weight:600}.liste.karten td.c-haupt{flex:70%;order:-1;min-width:0;font-size:1rem}.liste.karten td.c-check+td.c-haupt,.liste.karten td.c-vorn~td.c-haupt{flex-basis:100%}.liste.karten td.c-aktion{position:absolute;top:.5rem;right:.5rem}.liste.karten tr.klickbar:hover td{background:0 0}.liste.karten tr.gruppe{box-shadow:none;background:0 0;border:0;margin:0;padding:.6rem .2rem .3rem}.liste.karten tr.gruppe td{background:0 0;padding:0}.liste.karten tr.leer-zeile{justify-content:center}.liste.karten tr.ueberfaellig:not(.gruppe){border-left:3px solid var(--gefahr)}}@media (width<=760px){.seitenleiste{display:none}.rahmen .seite{padding:.9rem 1rem calc(var(--tabbar) + 2rem);margin-left:0}.nur-gross{display:none}.seitenkopf .knopf{justify-content:center;min-width:40px;padding:.5rem}h1{font-size:1.3rem}.handy-kopf{z-index:20;padding:calc(.55rem + env(safe-area-inset-top)) .6rem .55rem 1rem;background:var(--flaeche);border-bottom:1px solid var(--linie);justify-content:space-between;align-items:center;display:flex;position:sticky;top:0}.handy-kopf .marke{padding:0}.tabbar{z-index:30;height:calc(var(--tabbar) + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);background:var(--flaeche);border-top:1px solid var(--linie);grid-template-columns:repeat(5,1fr);align-items:center;display:grid;position:fixed;inset:auto 0 0}.tabbar a{color:var(--leise);flex-direction:column;align-items:center;gap:2px;font-size:.7rem;font-weight:500;text-decoration:none;display:flex}.tabbar a.aktiv{color:var(--akzent)}.tabbar .fab{background:var(--akzent);width:52px;height:52px;color:var(--akzent-text);border-radius:50%;justify-content:center;justify-self:center;margin-top:-18px;box-shadow:0 4px 12px #1f5fae59}.segment{display:flex}.segment button{flex:1;padding:.35rem .5rem}.zeitraum{flex-direction:column;align-items:stretch;gap:.4rem}.zeitraum .spanne{text-align:center}.filter-knopf{display:inline-flex}.filter-mehr{flex-direction:column;align-items:stretch;display:none}.filter-mehr.offen{display:flex}.filter-mehr select{width:100%}.projektkopf .kennzahlen{gap:.5rem 1.25rem}.info{grid-template-columns:1fr;gap:.1rem}.info dd{margin-bottom:.55rem}.personen-form{grid-template-columns:1fr}.karte{padding:1rem}.maske{max-width:none}.terminplan-steuerung input[type=date]{flex:1;min-width:0}.terminplan-steuerung>label:not(.haken){flex:45%}.gantt-namen{width:132px}.gantt-name.eingerueckt{padding-left:.9rem}}@media (width<=380px){.paar{grid-template-columns:1fr}}
