:root{--bg:#f5f6f8;--card:#fff;--ink:#1c2430;--muted:#5d6b7c;--line:#dde2e8;--brand:#1f4e79;--ok:#2e7d4f;--warn:#b26a00;--focus:#0b6bcb}
@media (prefers-color-scheme:dark){:root{--bg:#10151c;--card:#18202a;--ink:#e8edf3;--muted:#9aa8b8;--line:#2b3644;--brand:#6aa7e0;--ok:#5cc98a;--warn:#e0a040;--focus:#7ab8ff}}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.45 system-ui,Segoe UI,Roboto,sans-serif}
.wrap{max-width:980px;margin:0 auto;padding:0 16px}
.top{background:var(--card);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}
.bar{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding-top:10px;padding-bottom:10px}
h1{font-size:1.25rem;margin:0}h2.ress-h{font-size:1.15rem;margin:28px 0 4px;color:var(--brand)}h3.phase-h{font-size:.85rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin:14px 0 6px}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px;margin:14px 0}
.narrow{max-width:380px;margin:12vh auto}.login{display:block}.err{color:#b3261e}.muted{color:var(--muted)}.small{font-size:.85rem}
label{display:flex;flex-direction:column;gap:4px;font-size:.8rem;color:var(--muted)}
select,input,textarea,button,.btn{font:inherit;color:var(--ink)}
select,input[type=search],input[type=password],input:not([type]),textarea{background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:8px;min-height:40px}
:focus-visible{outline:3px solid var(--focus);outline-offset:1px}
button,.btn{border-radius:8px;border:1px solid var(--line);background:var(--card);padding:8px 12px;cursor:pointer;min-height:40px;text-decoration:none;display:inline-flex;align-items:center}
.primary{background:var(--brand);border-color:var(--brand);color:#fff}@media (prefers-color-scheme:dark){.primary{color:#0b1520}}
.link{background:none;border:0;color:var(--brand);padding:0;min-height:0;text-decoration:underline}
.filters{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}.filters label{min-width:140px;flex:1}.grow{flex:2!important}.btns{display:flex;gap:8px}
.summary .big{font-size:1.05rem;margin-bottom:8px}.bar-bg{height:10px;background:var(--line);border-radius:6px;overflow:hidden}.bar-fg{height:100%;background:var(--ok)}
.ress{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:8px;margin-top:12px}
.chip{position:relative;display:flex;justify-content:space-between;gap:8px;padding:8px 10px;border:1px solid var(--line);border-radius:8px;text-decoration:none;color:var(--ink);font-size:.85rem;overflow:hidden}
.chip i{position:absolute;left:0;bottom:0;height:3px;background:var(--ok)}.chip em{font-style:normal;color:var(--muted)}
.toolbar{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px;margin:6px 0}
.task{display:flex;gap:12px;background:var(--card);border:1px solid var(--line);border-left:5px solid #e0a040;border-radius:10px;padding:12px;margin:8px 0}
.task.s-erledigt{border-left-color:var(--ok);opacity:.78}.task.s-erledigt .title{text-decoration:line-through}
.task.s-in-Arbeit{border-left-color:#d8b100}.task.s-entfällt{border-left-color:#9aa0a6;opacity:.6}.task.s-zu-prüfen{border-left-color:#4a90d9}
.check{flex:none}.check input{width:26px;height:26px;margin:0;accent-color:var(--ok)}.check span{display:none}
.main{flex:1;min-width:0}.title{font-weight:600}.hint{background:rgba(224,160,64,.15);border-radius:8px;padding:6px 8px;margin:6px 0;font-size:.9rem}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;margin-top:8px}.row label{min-width:150px}
.badge{font-size:.7rem;border-radius:99px;padding:2px 8px;border:1px solid var(--warn);color:var(--warn);font-weight:500}
details{margin-top:8px}summary{cursor:pointer;color:var(--brand);font-size:.9rem}textarea{width:100%;resize:vertical}
.histlist{margin:6px 0 0;padding-left:18px}.foot{text-align:center;margin:30px 0}
dialog{border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink);max-width:420px;width:92%}dialog form{display:flex;flex-direction:column;gap:10px}
@media(max-width:560px){.row label{min-width:100%}.task{padding:10px}}
.login form{display:flex;flex-direction:column;gap:12px}
@media(max-width:560px){.top{position:static}}
.top h1 select{font-size:1rem;font-weight:600;margin-left:6px}
.toolbar .acts{display:flex;gap:8px;flex-wrap:wrap}
.seg{display:inline-flex}.seg .btn{border-radius:0}.seg .btn:first-child{border-radius:8px 0 0 8px}.seg .btn:last-child{border-radius:0 8px 8px 0;border-left:0}
.seg .btn.on{background:var(--brand);border-color:var(--brand);color:#fff}@media (prefers-color-scheme:dark){.seg .btn.on{color:#0b1520}}
.entfall-note{margin:6px 0}
fieldset{border:1px solid var(--line);border-radius:8px;display:flex;flex-direction:column;gap:6px;margin:0;padding:8px 10px}legend{font-size:.85rem;color:var(--muted)}
label.radio{flex-direction:row;align-items:center;gap:8px;font-size:1rem;color:var(--ink)}
dialog input:not([type]){background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:8px;min-height:40px}
.tablewrap{background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden}
table.liste{width:100%;border-collapse:collapse;font-size:.92rem}
.liste th,.liste td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:top}
.liste th a{color:var(--muted);text-decoration:none;white-space:nowrap;font-size:.8rem}.liste th a.on,.liste th a:hover{color:var(--brand);font-weight:700}
.liste select{width:100%;max-width:170px}
.trow{--st:#e0a040}.trow.s-erledigt{--st:var(--ok)}.trow.s-in-Arbeit{--st:#d8b100}.trow.s-entfällt{--st:#9aa0a6}.trow.s-zu-prüfen{--st:#4a90d9}
.trow td:first-child{border-left:5px solid var(--st)}.trow.s-erledigt .title{text-decoration:line-through;opacity:.78}.trow.s-entfällt{opacity:.65}
@media(max-width:700px){
  .liste,.liste tbody,.liste tr,.liste td{display:block}.liste thead{display:none}
  .liste tr{padding:10px;border-bottom:1px solid var(--line);border-left:5px solid var(--st)}
  .liste td,.trow td:first-child{border:0;padding:3px 0}
  .liste td[data-l]::before{content:attr(data-l) ": ";color:var(--muted);font-size:.8rem}
  .liste td[data-l="Nr"]{display:none}.liste select{max-width:none}
}

/* ---------- Bereiche ---------- */
.wrap.wide{max-width:1500px}
.bgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px;align-items:start}
.bcard{background:var(--card);border:2px dashed var(--line);border-radius:14px;padding:14px 16px;display:flex;flex-direction:column;gap:6px}
.bcard.ok{border:2px solid var(--ok)}
.bcard h2{margin:0;font-size:1.2rem}.bcard .meta{margin:0;color:var(--muted);font-size:.85rem}
.bcard .lbl{font-size:.75rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-top:6px}
.leute{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.leute li{display:flex;gap:6px;align-items:center}.leute input{flex:1;min-width:0;font-weight:600}
.leute .r-leitung input.p-name{border-color:var(--ok)}
.p-rolle{min-width:76px;font-size:.8rem;justify-content:center}.r-leitung .p-rolle{background:var(--ok);border-color:var(--ok);color:#fff}
@media (prefers-color-scheme:dark){.r-leitung .p-rolle{color:#0b1520}}
.subs{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.sub{border-top:1px solid var(--line);padding-top:8px}.sub-head{display:flex;gap:8px;align-items:center;margin-bottom:6px}
.sub-name{flex:1;min-width:0;font-weight:600;border-style:dashed}
.addsub input,.bnotiz textarea{width:100%}.bnotiz{margin-top:4px}
.offen-liste{margin:8px 0 0}
body.beamer{font-size:21px}
body.beamer .wrap.wide{max-width:none;padding:0 28px}
body.beamer .bgrid{grid-template-columns:repeat(4,minmax(0,1fr))}
body.beamer .bcard h2{font-size:1.7rem}
body.beamer .leute input,body.beamer .add-person{min-height:52px;font-size:1.35rem}
body.beamer .p-rolle{min-height:52px;font-size:1rem;min-width:96px}
body.beamer .meta,body.beamer .lbl{font-size:1rem}
@media(max-width:1100px){body.beamer .bgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){body.beamer .bgrid{grid-template-columns:1fr}}

/* ---------- Navigation, Neuigkeiten, Meetings, Themen ---------- */
.tabs{display:flex;gap:6px;align-items:center;flex-wrap:wrap;padding-top:10px;padding-bottom:2px}
.tabs a{padding:8px 14px;border-radius:8px;border:1px solid var(--line);background:var(--card);color:var(--ink);text-decoration:none;min-height:40px;display:inline-flex;align-items:center}
.tabs a.on{background:var(--brand);border-color:var(--brand);color:#fff}@media (prefers-color-scheme:dark){.tabs a.on{color:#0b1520}}
.tabs .mine-link{margin-left:6px}.who-nav{flex-direction:row;align-items:center;gap:6px;margin-left:auto}
.news{padding:10px 14px;margin:8px 0}.news-head{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
#news-list{margin:6px 0 0;padding-left:0;list-style:none}#news-list li{padding:2px 0}
h2.sec{font-size:1.1rem;margin:6px 0 10px}
.mrow{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap}.mtitle{font-weight:600;font-size:1.05rem}
.meeting label{margin-top:8px}.meeting textarea{width:100%}.stack{display:flex;flex-direction:column;gap:8px}
.konflikt{border-color:var(--warn)}.konflikt textarea{width:100%;margin:8px 0}
.mtasks{list-style:none;padding:0;margin:12px 0 0;display:flex;flex-direction:column;gap:8px}
.mtasks li{display:flex;gap:8px;flex-wrap:wrap;align-items:center;border-top:1px solid var(--line);padding-top:8px}.mt-title{font-weight:600;flex:1 1 220px}
a.badge{text-decoration:none;color:var(--brand);border-color:var(--brand)}
.einordnung{margin:10px 0}
[hidden]{display:none!important}
input[type=url],input[type=date],input[type=time]{background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:8px;min-height:40px}
main a:not(.btn):not(.badge):not(.chip){color:var(--brand)}

/* ---------- Bereiche im Stil des Beamer-Mockups ---------- */
body.bereiche-seite{font-family:'Barlow',system-ui,sans-serif;font-size:18px}
html[data-theme=dark] body.bereiche-seite .top{background:#1b1f25}
html[data-theme=dark] body.bereiche-seite .tabs a{background:#1b1f25;color:#f4f1ea}
html[data-theme=dark] body.bereiche-seite .tabs a.on{background:#ff7a70;border-color:#ff7a70;color:#121417}
html[data-theme=dark] body.bereiche-seite .news{background:#1b1f25}
html[data-theme=dark] body.bereiche-seite main a:not(.btn):not(.badge){color:#ff9a92}
.bhead{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin:18px 0 16px}
.bhead .eyebrow{font-family:'Barlow Condensed',sans-serif;font-weight:600;font-size:1.05rem;letter-spacing:.14em;text-transform:uppercase;color:#ff7a70}
.bhead .btitle{margin:2px 0 0;font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:2.8rem;line-height:1.05}
.bprog{min-width:300px}.bprog .bcount{font-size:1.25rem;font-weight:500;margin-bottom:6px;text-align:right}
html[data-theme=dark] body.bereiche-seite .bar-bg{background:#2a2f36;height:14px;border-radius:7px}
html[data-theme=dark] body.bereiche-seite .bgrid{grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:16px}
html[data-theme=dark] body.bereiche-seite .bcard{background:#1b1f25;border:2px dashed #6b7280;border-radius:14px}
html[data-theme=dark] body.bereiche-seite .bcard.ok{background:#12261f;border:2px solid #3ecf9e}
html[data-theme=dark] body.bereiche-seite .bcard h2{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:1.95rem;line-height:1.05}
html[data-theme=dark] body.bereiche-seite .bcard .meta{color:#c4c9d0;font-size:1rem}
html[data-theme=dark] body.bereiche-seite .bcard .lbl{color:#aab1ba}
html[data-theme=dark] body.bereiche-seite .leute input,html[data-theme=dark] body.bereiche-seite .add-person,html[data-theme=dark] body.bereiche-seite .add-sub,html[data-theme=dark] body.bereiche-seite .sub-name,html[data-theme=dark] body.bereiche-seite .b-notiz{background:#f4f1ea;color:#121417;border-color:#f4f1ea;font-family:'Barlow',sans-serif}
html[data-theme=dark] body.bereiche-seite .leute input{font-size:1.4rem;min-height:52px}
html[data-theme=dark] body.bereiche-seite .add-person,html[data-theme=dark] body.bereiche-seite .add-sub{font-size:1.15rem;min-height:48px}
html[data-theme=dark] body.bereiche-seite ::placeholder{color:#6b7280;opacity:1}
html[data-theme=dark] body.bereiche-seite .p-rolle{background:#2a2f36;color:#f4f1ea;border-color:#2a2f36;min-height:52px}
html[data-theme=dark] body.bereiche-seite .r-leitung .p-rolle{background:#3ecf9e;border-color:#3ecf9e;color:#0b1520}
html[data-theme=dark] body.bereiche-seite .r-leitung input.p-name{border-color:#3ecf9e}
html[data-theme=dark] body.bereiche-seite .offen-kachel{border:2px solid #2a2f36}
html[data-theme=dark] body.bereiche-seite .offen-kachel h2{color:#ff7a70}.offen-text{font-size:1.25rem;line-height:1.35;margin:0}
html[data-theme=dark] body.bereiche-seite .sub{border-top-color:#2a2f36}
html[data-theme=dark] body.bereiche-seite .foot{color:#aab1ba}
html[data-theme=dark] body.bereiche-seite .btn,html[data-theme=dark] body.bereiche-seite button.ghost{background:#1b1f25;color:#f4f1ea;border-color:#2a2f36}
body.bereiche-seite.beamer{font-size:22px}

/* ---------- Hell und Dunkel ---------- */
html[data-theme=dark]{--bg:#121417;--card:#1b1f25;--ink:#f4f1ea;--muted:#aab1ba;--line:#2a2f36;--brand:#ff7a70;--ok:#3ecf9e;--warn:#e0a040;--focus:#ffb4ae;color-scheme:dark}
html[data-theme=light]{--bg:#f5f6f8;--card:#fff;--ink:#1c2430;--muted:#5d6b7c;--line:#dde2e8;--brand:#1f4e79;--ok:#2e7d4f;--warn:#b26a00;--focus:#0b6bcb;color-scheme:light}
html[data-theme=dark] .primary,html[data-theme=dark] .seg .btn.on,html[data-theme=dark] .tabs a.on,html[data-theme=dark] .r-leitung .p-rolle{color:#121417}
html[data-theme=light] .primary,html[data-theme=light] .seg .btn.on,html[data-theme=light] .tabs a.on,html[data-theme=light] .r-leitung .p-rolle{color:#fff}
html[data-theme=dark] .err{color:#ff9a92}
html[data-theme=dark] .hint{background:rgba(224,160,64,.18)}
#theme-toggle{margin-left:auto}
.tabs .who-nav{margin-left:0}

/* ---------- Normale Ansicht kompakt, Beamer gross ---------- */
body.bereiche-seite{font-size:15px}
body.bereiche-seite .bhead{margin:12px 0}
body.bereiche-seite .bhead .eyebrow{font-size:.85rem}
body.bereiche-seite .bhead .btitle{font-size:1.9rem}
body.bereiche-seite .bprog{min-width:220px}
body.bereiche-seite .bprog .bcount{font-size:1rem}
html body.bereiche-seite .bgrid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
html body.bereiche-seite .bcard{padding:12px 14px}
html body.bereiche-seite .bcard h2{font-size:1.3rem}
html body.bereiche-seite .bcard .meta{font-size:.85rem}
html body.bereiche-seite .leute input{font-size:1rem;min-height:38px}
html body.bereiche-seite .add-person,html body.bereiche-seite .add-sub{font-size:.9rem;min-height:36px}
html body.bereiche-seite .p-rolle{min-height:38px}
html body.bereiche-seite .offen-text{font-size:1rem}
html body.bereiche-seite.beamer{font-size:22px}
html body.bereiche-seite.beamer .bhead .btitle{font-size:2.8rem}
html body.bereiche-seite.beamer .bgrid{grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:16px}
html body.bereiche-seite.beamer .bcard h2{font-size:1.95rem}
html body.bereiche-seite.beamer .bcard .meta{font-size:1rem}
html body.bereiche-seite.beamer .leute input{font-size:1.4rem;min-height:52px}
html body.bereiche-seite.beamer .add-person,html body.bereiche-seite.beamer .add-sub{font-size:1.15rem;min-height:48px}
html body.bereiche-seite.beamer .p-rolle{min-height:52px}
html body.bereiche-seite.beamer .offen-text{font-size:1.25rem}

/* ---------- Fristen ---------- */
.badge.frist{background:var(--card);border:1px solid var(--line);color:var(--ink)}
.badge.frist.bald{border-color:var(--warn);color:var(--warn);font-weight:600}
.badge.frist.ueber{background:#b3261e;border-color:#b3261e;color:#fff;font-weight:600}
.badge.frist.erl{opacity:.6}
.dringend{border-left:6px solid var(--warn)}
.dringend h2{margin:0 0 6px;font-size:1.1rem}
.dringend ul{margin:0 0 6px;padding-left:18px}.dringend li{margin:4px 0}

.badge.mark{background:var(--brand);color:var(--bg);border-color:var(--brand)}
.markbox{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:8px 0}
.mark-chip{background:var(--card);border:1px solid var(--brand);border-radius:14px;padding:2px 10px}

/* ---------- Bands ---------- */
.sumgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;margin-bottom:10px}
.sumbox{border:2px solid var(--line);border-radius:12px;padding:8px 12px;text-align:center}
.sumbox .sn{font-size:1.8rem;font-weight:700}.sumbox .sl{font-weight:600}
.sumbox.st-angefragt{border-color:var(--warn)}.sumbox.st-bestaetigt{border-color:var(--ok)}.sumbox.st-abgelehnt{opacity:.7}
.budget{display:flex;flex-wrap:wrap;gap:6px 20px;align-items:center}.budget input{width:110px}
.over{color:#b3261e;font-weight:600}
html[data-theme=dark] .over{color:#ff9a92}
.bandgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px;margin-bottom:12px}
.band{border-left:6px solid var(--line)}
.band.st-angefragt{border-left-color:var(--warn)}.band.st-bestaetigt{border-left-color:var(--ok)}.band.st-vorgeschlagen{border-left-color:var(--brand)}.band.st-abgelehnt{opacity:.75}
.band .bh{display:flex;gap:8px;align-items:center}.band .name{font-weight:700;font-size:1.15rem;flex:1}
.stbtns{display:flex;flex-wrap:wrap;gap:4px;margin:8px 0}
.stbtns .btn{padding:4px 8px;min-height:36px}

/* ---------- Personen ---------- */
.plist{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:8px}
.plist li{display:flex;gap:10px;align-items:center;border:1px solid var(--line);border-radius:10px;padding:6px 10px}
.plist .pname{flex:1;min-width:0}
.plist button:disabled{opacity:.4;cursor:not-allowed}

/* ---------- Bereichsnamen ---------- */
.bcard h2 .b-name{width:100%;font:inherit;background:transparent;color:inherit;border:1px dashed transparent;border-radius:8px;padding:2px 4px}
.bcard h2 .b-name:hover,.bcard h2 .b-name:focus{border-color:var(--line)}
.newhaupt{margin:8px 0 14px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.newhaupt input{min-width:260px}

.band label.grund input{border-color:var(--warn)}
.sumbox.st-abgesagt{border-color:#b3261e}.band.st-abgesagt{border-left-color:#b3261e}

.pill{display:inline-block;border-radius:99px;padding:2px 10px;font-size:.8rem;border:1px solid var(--st,#e0a040);color:var(--ink);white-space:nowrap}
.pill.s-erledigt{--st:var(--ok)}.pill.s-in-Arbeit{--st:#d8b100}.pill.s-entfällt{--st:#9aa0a6}.pill.s-zu-prüfen{--st:#4a90d9}
.admin-liste td{vertical-align:top}.admin-liste .t-aufgabe{min-width:240px}
a.sumbox{text-decoration:none;color:inherit}.sumbox.warnbox{border-color:var(--warn)}
.narrow-card{max-width:520px}.toolbar .acts form{display:inline}
.danger{border-color:#b3261e;color:#b3261e}html[data-theme=dark] .danger{border-color:#ff9a92;color:#ff9a92}
.trash li{display:flex;gap:10px;justify-content:space-between;align-items:center;flex-wrap:wrap}
button.trash{font-size:.85rem}
.plist.trash{grid-template-columns:1fr}