:root{
  --blau:#1f4e79; --blau2:#2962a0; --tinte:#0f2942;
  --gruen:#2ea866; --rot:#c0392b; --amber:#c77d0a;
  --bg:#f2f5f9; --karte:#ffffff; --rand:#dfe6ee;
  --text:#1b2733; --grau:#5d6b7a; --hell:#eef3f8;
}
*{box-sizing:border-box}
[hidden]{display:none !important}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--bg); color:var(--text);
  font:16px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
h1,h2,h3{margin:0}
small{color:var(--grau)}

.topbar{
  display:flex; gap:10px; align-items:center;
  background:linear-gradient(135deg,var(--blau),var(--blau2));
  color:#fff; padding:calc(9px + env(safe-area-inset-top)) 16px 9px;
  flex:0 0 auto; z-index:5;
}
.topbar .logo{width:26px;height:26px;border-radius:7px;box-shadow:0 1px 4px rgba(0,0,0,.25)}
.topbar h1{font-size:17px;font-weight:700;letter-spacing:.2px;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.topbar .top-ma{font-size:13px;font-weight:600;background:rgba(255,255,255,.2);padding:5px 12px;border-radius:20px;white-space:nowrap;max-width:48%;overflow:hidden;text-overflow:ellipsis}
.topbar .sub{display:none}

main{max-width:720px;margin:0 auto;padding:16px 14px 40px}

.card{
  background:var(--karte); border:1px solid var(--rand); border-radius:16px;
  padding:16px; margin-bottom:14px; box-shadow:0 1px 3px rgba(16,41,66,.05);
}
.card h2{font-size:16px;display:flex;align-items:center;gap:10px;margin-bottom:12px}
.step{
  display:inline-grid;place-items:center;width:26px;height:26px;flex:0 0 26px;
  background:var(--blau);color:#fff;border-radius:50%;font-size:14px;font-weight:700;
}

/* Drop-Zone */
.drop{display:block;border:2px dashed #b9c8d8;border-radius:14px;padding:22px;text-align:center;cursor:pointer;transition:.15s;background:var(--hell)}
.drop.drag{border-color:var(--blau);background:#e3edf7}
.drop-inner{display:flex;flex-direction:column;gap:6px;align-items:center;color:var(--grau)}
.drop-icon{width:44px;height:44px;border-radius:50%;background:var(--blau);color:#fff;font-size:26px;display:grid;place-items:center}
.drop b{color:var(--text)}

.hint{font-size:13px;color:var(--grau);margin:0 0 12px}
.roster-head,.emp-row{display:grid;grid-template-columns:1fr 68px 68px 30px;gap:8px;align-items:center}
.roster-head{font-size:11px;color:var(--grau);text-transform:uppercase;letter-spacing:.3px;padding:0 2px 6px}
.roster{display:flex;flex-direction:column;gap:8px}
.emp-row input{font-size:15px;padding:9px 10px;border:1px solid var(--rand);border-radius:9px;background:#fff;color:var(--text);width:100%}
.emp-row input.emp-name{font-weight:600}
.emp-row .emp-del{border:0;background:none;color:var(--grau);font-size:18px;cursor:pointer;padding:2px}
.emp-empty{font-size:13px;color:var(--grau);padding:6px 2px}
@media(prefers-color-scheme:dark){.emp-row input{background:#111a24}}
.paste-btn{margin-top:10px;width:100%;border:1.5px solid var(--blau);background:#fff;color:var(--blau);border-radius:10px;padding:11px;font-size:15px;font-weight:600;cursor:pointer}
.paste-btn:active{transform:translateY(1px)}
@media(prefers-color-scheme:dark){.paste-btn{background:#111a24;color:#7fb0e0;border-color:#3a6da0}}
.files{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
.files li{display:flex;align-items:center;gap:10px;background:var(--hell);border-radius:10px;padding:9px 12px;font-size:14px}
.files .name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.files .who{color:var(--grau);font-size:12px}
.files .rm{border:0;background:none;color:var(--grau);font-size:18px;cursor:pointer;padding:2px 6px}
.files .bad{color:var(--rot)}

/* Felder */
.grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:520px){.grid{grid-template-columns:1fr}}
.field{display:flex;flex-direction:column;gap:5px;font-size:14px}
.field>span{font-weight:600}
.field em{color:var(--grau);font-weight:400;font-style:normal}
.field input[type=date],.field input[type=number]{
  font-size:16px;padding:11px 12px;border:1px solid var(--rand);border-radius:10px;background:#fff;color:var(--text)
}
.field.checkbox{flex-direction:row;align-items:flex-start;gap:9px}
.field.checkbox input{margin-top:3px;width:20px;height:20px}
.advanced{margin-top:12px}
.advanced summary{cursor:pointer;color:var(--blau);font-weight:600;font-size:14px}
.advanced .grid{margin-top:12px}

/* Buttons */
.primary{
  display:block;width:100%;border:0;border-radius:14px;padding:16px;
  background:var(--blau);color:#fff;font-size:17px;font-weight:700;cursor:pointer;
  box-shadow:0 2px 8px rgba(31,78,121,.3);margin-bottom:14px
}
.primary:disabled{background:#a9bccc;box-shadow:none;cursor:not-allowed}
.primary.ghost{background:#fff;color:var(--blau);border:1.5px solid var(--blau);box-shadow:none}
.primary:active:not(:disabled){transform:translateY(1px)}

/* Ergebnis */
.results{display:flex;flex-direction:column;gap:14px}
.emp{background:var(--karte);border:1px solid var(--rand);border-radius:16px;overflow:hidden;box-shadow:0 1px 3px rgba(16,41,66,.05)}
.emp-head{background:linear-gradient(135deg,var(--blau),var(--blau2));color:#fff;padding:14px 16px}
.emp-head h3{font-size:17px}
.emp-head .ref{font-size:12px;opacity:.9;margin-top:3px}
.emp-body{padding:14px 16px}
.big{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}
@media(max-width:520px){.big{grid-template-columns:1fr}}
.tile{border:1px solid var(--rand);border-radius:12px;padding:12px;background:var(--hell)}
.tile .lab{font-size:12px;color:var(--grau);text-transform:uppercase;letter-spacing:.4px}
.tile .val{font-size:24px;font-weight:800;color:var(--blau);margin-top:2px}
.tile .val small{font-size:14px;font-weight:600;color:var(--grau)}
.tile.feier .val{color:var(--amber)}

table.kv{width:100%;border-collapse:collapse;font-size:13.5px;margin-top:4px}
table.kv td{padding:6px 4px;border-bottom:1px solid var(--rand);vertical-align:top}
table.kv td:last-child{text-align:right;font-variant-numeric:tabular-nums;font-weight:600}
table.kv tr:last-child td{border-bottom:0}

.fdays{margin-top:10px;font-size:13px}
.fdays summary{cursor:pointer;color:var(--blau);font-weight:600}
.fdays table{width:100%;border-collapse:collapse;margin-top:8px;font-size:12.5px}
.fdays th,.fdays td{padding:5px 6px;border:1px solid var(--rand);text-align:left}
.fdays th{background:var(--hell)}
.pill{display:inline-block;padding:1px 7px;border-radius:20px;font-size:11px;font-weight:700}
.pill.ok{background:#e4f5ec;color:var(--gruen)}
.pill.warn{background:#fdf0dc;color:var(--amber)}
.pill.no{background:#f7e4e1;color:var(--rot)}

/* Zeiterfassung */
.ze-card summary{cursor:pointer;font-size:15px;font-weight:600;color:var(--text)}
.ze-card[open] summary{margin-bottom:10px}
.ze-form{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.ze-form input,.ze-form select{font-size:15px;padding:9px 10px;border:1px solid var(--rand);border-radius:9px;background:#fff;color:var(--text);width:100%}
.ze-form #zeDatum{grid-column:1 / -1}
.ze-form #zeAdd{grid-column:1 / -1;border:1.5px solid var(--blau);background:#fff;color:var(--blau);font-weight:600;cursor:pointer}
@media(prefers-color-scheme:dark){.ze-form input,.ze-form select{background:#111a24}.ze-form #zeAdd{background:#111a24;color:#7fb0e0}}
.ze-list{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.ze-item{display:grid;grid-template-columns:auto 1fr auto auto;gap:8px;align-items:center;background:var(--hell);border-radius:9px;padding:7px 10px;font-size:13.5px}
.ze-item .zi-kat{font-size:11px;font-weight:700;padding:1px 7px;border-radius:20px;background:#e3edf7;color:var(--blau)}
.ze-item .zi-kat.krank{background:#f7e4e1;color:var(--rot)}
.ze-item .zi-kat.feiertag{background:#fdf0dc;color:var(--amber)}
.ze-item .zi-kat.urlaub{background:#e4f5ec;color:var(--gruen)}
.ze-item .zi-del{border:0;background:none;color:var(--grau);font-size:16px;cursor:pointer}
.ze-empty{color:var(--grau);font-size:13px;padding:6px 2px}
.ze-backup{display:flex;gap:10px;align-items:center;margin-top:12px;flex-wrap:wrap}
.ze-backup button,.ze-imp{font-size:13px;color:var(--blau);background:none;border:1px solid var(--rand);border-radius:8px;padding:7px 10px;cursor:pointer}
.status{text-align:center;color:var(--grau);font-size:14px;min-height:20px}
.status.err{color:var(--rot);font-weight:600}

.legal summary{cursor:pointer;font-weight:700;font-size:15px;color:var(--blau)}
.legal p{font-size:13px;margin:10px 0 0}
.legal .muted{color:var(--grau)}

.a2hs{position:fixed;left:12px;right:12px;bottom:calc(74px + env(safe-area-inset-bottom));background:var(--tinte);color:#fff;border-radius:14px;padding:12px 14px;display:flex;gap:10px;align-items:center;font-size:13px;box-shadow:0 6px 20px rgba(0,0,0,.3);z-index:35}
.a2hs button{margin-left:auto;background:none;border:0;color:#fff;font-size:16px;cursor:pointer}

@media(prefers-color-scheme:dark){
  :root{--bg:#0f1720;--karte:#18222e;--rand:#2a3948;--text:#e7edf3;--grau:#9fb0c0;--hell:#1e2b39}
  .field input,.primary.ghost{background:#111a24 !important}
  .primary.ghost{color:#7fb0e0;border-color:#3a6da0}
  .tile .val{color:#7fb0e0}
}

/* ===================== App-Shell v2: Tabs, Kalender, Modal ===================== */
/* App-Shell: Tab-Leiste liegt im Flex-Flow – kein body-padding nötig */
.view{animation:fade .15s ease}
@keyframes fade{from{opacity:.4}to{opacity:1}}

/* Tab-Leiste */
.tabbar{flex:0 0 auto;display:flex;background:var(--karte);border-top:1px solid var(--rand);padding-bottom:env(safe-area-inset-bottom);z-index:30;box-shadow:0 -0.5px 0 rgba(16,41,66,.10), 0 -5px 16px rgba(16,41,66,.05)}
.tab{flex:1;border:0;background:none;padding:8px 0 6px;font-size:11px;color:var(--grau);display:flex;flex-direction:column;align-items:center;gap:2px;cursor:pointer}
.tab .ti{font-size:20px;line-height:1}
.tab.active{color:var(--blau);font-weight:700}

/* Schwebender +-Button */
.fab{position:fixed;right:18px;bottom:calc(78px + env(safe-area-inset-bottom));width:56px;height:56px;border-radius:50%;border:0;background:var(--blau);color:#fff;font-size:30px;line-height:1;box-shadow:0 4px 14px rgba(31,78,121,.45);z-index:25;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0}
.fab:active{transform:translateY(1px)}

/* Kalender */
.cal-toolbar{display:flex;align-items:center;gap:8px;margin-bottom:10px;flex-wrap:wrap}
#calFilter{flex:1;min-width:130px;font-size:15px}
.cal-nav{display:flex;align-items:center;gap:6px}
.cal-nav button{width:34px;height:34px;border:1px solid var(--rand);background:var(--karte);border-radius:9px;font-size:18px;color:var(--blau);cursor:pointer}
#calTitle{min-width:104px;text-align:center;font-weight:700;font-size:15px}
.chip{border:1px solid var(--blau);background:none;color:var(--blau);border-radius:20px;padding:7px 13px;font-size:13px;font-weight:600;cursor:pointer}
.cal-weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-bottom:4px}
.cal-weekdays span{text-align:center;font-size:11px;color:var(--grau);font-weight:600}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.cal-cell{aspect-ratio:1/1.05;border:1px solid var(--rand);border-radius:10px;background:var(--karte);display:flex;flex-direction:column;align-items:center;padding:5px 2px 3px;cursor:pointer;position:relative}
.cal-cell .dnum{font-size:14px;font-weight:600}
.cal-cell.out{opacity:.32}
.cal-cell.today{border-color:var(--blau);border-width:2px}
.cal-cell.today .dnum{background:var(--rot);color:#fff;min-width:23px;height:23px;padding:0 4px;border-radius:12px;display:grid;place-items:center}
.cal-cell .dots{display:flex;gap:2px;flex-wrap:wrap;justify-content:center;margin-top:3px}
.cal-cell .hrs{font-size:9px;color:var(--grau);margin-top:auto;font-weight:600}
.dot{width:7px;height:7px;border-radius:50%;display:inline-block;background:var(--blau)}
.dot.arbeit{background:var(--blau)}.dot.krank{background:var(--rot)}.dot.feiertag{background:var(--amber)}.dot.urlaub{background:var(--gruen)}
.cal-legend{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-top:14px;font-size:12px;color:var(--grau)}
.cal-legend span{display:flex;align-items:center;gap:5px}
.center{text-align:center}

/* Buchungs-Fenster */
.modal{position:fixed;inset:0;background:rgba(15,23,32,.55);display:flex;align-items:flex-end;justify-content:center;z-index:40}
.sheet{background:var(--karte);width:100%;max-width:560px;border-radius:18px 18px 0 0;padding:16px 16px calc(18px + env(safe-area-inset-bottom));max-height:92vh;overflow:auto;box-shadow:0 -8px 30px rgba(0,0,0,.25)}
@media(min-width:560px){.modal{align-items:center}.sheet{border-radius:18px}}
.sheet-head{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.sheet-x{border:0;background:var(--hell);width:32px;height:32px;border-radius:50%;font-size:15px;color:var(--grau);cursor:pointer}
.sheet-head h3{font-size:17px;flex:1;margin:0}
.sheet-date{font-size:13px;color:var(--blau);font-weight:700}
.day-entries{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}
.day-entries:empty{display:none}
.de-item{display:flex;align-items:center;gap:8px;background:var(--hell);border-radius:9px;padding:8px 10px;font-size:13px;cursor:pointer}
.de-item .zi-kat{font-size:11px;font-weight:700;padding:1px 7px;border-radius:20px;background:#e3edf7;color:var(--blau)}
.de-item .zi-kat.krank{background:#f7e4e1;color:var(--rot)}
.de-item .zi-kat.feiertag{background:#fdf0dc;color:var(--amber)}
.de-item .zi-kat.urlaub{background:#e4f5ec;color:var(--gruen)}
.de-item .de-h{margin-left:auto;font-weight:700}
.book-form .field{margin-bottom:10px}
.book-form .times{grid-template-columns:1fr 1fr}
.book-form input,.book-form select{font-size:16px}
.book-actions{display:flex;gap:10px;margin-top:6px}
.book-actions .primary{flex:2;margin:0}
.danger{flex:1;border:1.5px solid var(--rot);background:none;color:var(--rot);border-radius:14px;padding:14px 10px;font-weight:700;cursor:pointer}
@media(prefers-color-scheme:dark){#calFilter,.cal-nav button,.cal-cell{background-color:#18222e}.book-form input,.book-form select{background-color:#111a24}}
.bk-autohint{display:block;background:#e4f5ec;color:#1f6f43;border-radius:10px;padding:10px 12px;font-size:13.5px;line-height:1.4;margin:2px 0 8px}
.bk-pausehint{display:block;color:var(--grau);font-size:12.5px;line-height:1.4;margin:-2px 0 8px}
.bk-pausehint.warn{color:var(--rot);font-weight:600}
@media(prefers-color-scheme:dark){.bk-autohint{background:rgba(46,168,102,.14);color:#8fe0b0}}

/* ===== Welle 1: Mitarbeiterakte + Feiertagsliste ===== */
.akte{border:1px solid var(--rand);border-radius:14px;padding:12px;margin-bottom:12px;background:var(--karte)}
.akte .ak-name{width:100%;font-size:16px;font-weight:700;padding:10px 12px;border:1px solid var(--rand);border-radius:10px;background:var(--hell);color:var(--text);margin-bottom:10px}
.akte-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.akte-grid .field{font-size:13px}
.akte-grid input{font-size:15px;padding:9px 10px;border:1px solid var(--rand);border-radius:9px;background:#fff;color:var(--text)}
.akte .field{margin-top:10px}
.akte select{font-size:15px;padding:10px;border:1px solid var(--rand);border-radius:9px;background:#fff;color:var(--text);width:100%}
.akte .ak-del{margin-top:12px;width:100%;border:1px solid var(--rand);background:none;color:var(--rot);border-radius:9px;padding:9px;font-size:13px;font-weight:600;cursor:pointer}
@media(prefers-color-scheme:dark){.akte-grid input,.akte select{background:#111a24}}
.ft-liste{margin:6px 0}
.ft-head{font-weight:700;font-size:13px;color:var(--blau);margin:8px 0 6px}
.ft-info{font-size:13px;color:var(--gruen);font-weight:600;padding:6px 0}
.ft-row{display:flex;justify-content:space-between;font-size:13px;padding:5px 2px;border-bottom:1px solid var(--rand)}
.ft-row span:first-child{color:var(--grau);font-variant-numeric:tabular-nums;min-width:92px}

/* ===== Welle 2a: Tracker-Chips, Warnungen, Hinweis ===== */
.ak-track{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.chip-t{font-size:12px;font-weight:600;padding:5px 10px;border-radius:20px;background:var(--hell);color:var(--text)}
.chip-t.url{background:#e4f5ec;color:#1c7a49}
.chip-t.krk{background:#f7e4e1;color:var(--rot)}
.ak-warn{margin-top:8px;font-size:12.5px;font-weight:600;color:#8a4b00;background:#fdf0dc;border-radius:8px;padding:7px 10px}
.bk-hinweis{display:block;color:#8a4b00;font-weight:600;font-size:12.5px;margin:-2px 0 10px}
.bk-hinweis:empty{display:none;margin:0}

/* ===== Welle 2b: Lohnkosten ===== */
.lk-summary{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}
.lk-tile{border:1px solid var(--rand);border-radius:12px;padding:12px;background:var(--hell)}
.lk-tile .lab{font-size:11px;color:var(--grau);text-transform:uppercase;letter-spacing:.3px}
.lk-tile .val{font-size:20px;font-weight:800;color:var(--blau);margin-top:3px}
.lk-tile.ag .val{color:var(--amber)}
.lk-chart{display:flex;align-items:flex-end;gap:4px;height:90px;padding:4px 0;border-bottom:1px solid var(--rand)}
.lk-bwrap{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:3px}
.lk-bar{width:100%;max-width:22px;background:linear-gradient(180deg,var(--blau2),var(--blau));border-radius:4px 4px 0 0;min-height:2px}
.lk-bwrap span{font-size:9px;color:var(--grau)}

/* ===== Welle 2c: gesperrte Tage ===== */
.cal-cell.gesperrt{background:repeating-linear-gradient(135deg,var(--hell),var(--hell) 6px,#e6ebf1 6px,#e6ebf1 12px)}
.cal-cell.gesperrt .dnum{color:var(--grau)}
@media(prefers-color-scheme:dark){.cal-cell.gesperrt{background:repeating-linear-gradient(135deg,#18222e,#18222e 6px,#141c26 6px,#141c26 12px)}}

/* ===== Fix: Ansichten füllen die volle Bildschirmhöhe ===== */
html{height:100%}
body{height:100vh;height:100dvh;height:calc(var(--vh,1vh)*100);display:flex;flex-direction:column;overflow:hidden}
main{flex:1 1 auto;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;display:flex;flex-direction:column}
.view{flex:1 0 auto;display:flex;flex-direction:column}
#view-kalender .cal-grid{flex:1 0 auto;grid-template-rows:repeat(6,minmax(46px,1fr))}
#view-kalender .cal-cell{aspect-ratio:auto}
#view-kalender .cal-legend{margin-top:auto}

/* ===== Welle 2e: Mitarbeiter-Farben, Auswahl, Tagesliste ===== */
/* Kalender kompakt + Tagesliste füllt Rest */
#view-kalender .cal-grid{flex:0 0 auto;grid-template-rows:repeat(6,52px)}
.dot.feier-dot{background:var(--amber)}
.cal-cell.sel{box-shadow:inset 0 0 0 2px var(--blau)}
.cal-legend{margin-top:8px}
.day-panel{flex:1 1 auto;min-height:110px;overflow-y:auto;-webkit-overflow-scrolling:touch;border-top:1px solid var(--rand);margin-top:8px;padding-top:8px}
.dp-head{display:flex;align-items:center;gap:8px;margin-bottom:8px;font-size:14px}
.dp-head b{font-size:15px}
.dp-feier{font-size:12px;font-weight:700;color:var(--amber);background:#fdf0dc;padding:1px 8px;border-radius:20px}
.dp-add{margin-left:auto;border:1.5px solid var(--blau);background:none;color:var(--blau);border-radius:20px;padding:6px 12px;font-size:13px;font-weight:600;cursor:pointer}
.dp-list{display:flex;flex-direction:column;gap:6px;padding-bottom:8px}
.dp-item{display:flex;align-items:center;gap:10px;width:100%;background:var(--hell);border:0;border-radius:10px;padding:10px 12px;font-size:14px;cursor:pointer;text-align:left;color:var(--text)}
.dp-dot{width:13px;height:13px;border-radius:50%;flex:0 0 13px;box-shadow:0 0 0 1px rgba(0,0,0,.08)}
.dp-name{font-weight:600;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dp-h{color:var(--grau);font-size:12.5px;white-space:nowrap}
.dp-empty{color:var(--grau);font-size:13px;padding:8px 2px}
/* Farbwahl in der Akte */
.ak-farbe-wrap{margin-top:12px}
.farbzeile{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:6px}
.ak-farbe{width:46px;height:34px;border:1px solid var(--rand);border-radius:8px;padding:0;background:none;cursor:pointer}
.swatches{display:flex;flex-wrap:wrap;gap:7px}
.swatch{width:23px;height:23px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px var(--rand);cursor:pointer;padding:0}
.swatch.aktiv{box-shadow:0 0 0 2px var(--blau)}

/* ===== Welle 3: Themes, Urlaubsbereich, Jahreskalender, Politur ===== */
/* 5 Tabs kompakter */
.tab{font-size:10px}
.tab .ti{font-size:18px}
/* Theme-Wahl */
.theme-wahl{display:flex;flex-wrap:wrap;gap:12px}
.theme-sw{width:42px;height:42px;border-radius:12px;border:2px solid #fff;box-shadow:0 0 0 1px var(--rand);cursor:pointer;padding:0}
.theme-sw.aktiv{box-shadow:0 0 0 3px var(--blau)}
/* Urlaubsbereich */
.jahr-badge{font-size:13px;font-weight:600;color:var(--grau);margin-left:4px}
.url-liste{display:flex;flex-direction:column;gap:12px}
.url-card{border:1px solid var(--rand);border-radius:14px;padding:14px;background:var(--karte)}
.url-top{display:flex;align-items:center;gap:10px;font-size:15px}
.url-dot{width:14px;height:14px;border-radius:50%;flex:0 0 14px;box-shadow:0 0 0 1px rgba(0,0,0,.1)}
.url-top b{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.url-rest{font-size:13px;font-weight:700;color:var(--blau);white-space:nowrap}
.url-bar{height:9px;background:var(--hell);border-radius:6px;overflow:hidden;margin:10px 0 6px}
.url-bar-fill{height:100%;border-radius:6px;transition:width .3s}
.url-meta{font-size:12.5px;color:var(--grau)}
.url-actions{display:flex;gap:10px;margin-top:12px}
.url-actions button{flex:1;border:1.5px solid var(--blau);background:none;color:var(--blau);border-radius:10px;padding:10px;font-size:13.5px;font-weight:600;cursor:pointer}
@media(prefers-color-scheme:dark){.url-actions button{background:#111a24}}
/* Jahreskalender */
.year-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:4px}
@media(max-width:430px){.year-grid{grid-template-columns:repeat(2,1fr)}}
.ym{border:1px solid var(--rand);border-radius:10px;background:var(--karte);padding:9px 6px 7px;cursor:pointer;text-align:center}
.ym:active{transform:translateY(1px)}
.ym-t{display:block;font-size:12px;font-weight:700;color:var(--blau);margin-bottom:5px}
.ym-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:1px}
.ym-grid i{aspect-ratio:1;font-size:7px;line-height:1;display:grid;place-items:center;color:var(--grau);border-radius:2px;font-style:normal}
.ym-grid i.has{background:var(--blau);color:#fff;font-weight:700}
.ym-grid i.fei{background:var(--amber);color:#fff}
/* Politur */
.chip:active,.paste-btn:active{transform:translateY(1px)}
button{transition:transform .05s ease, box-shadow .15s ease}
.card{transition:box-shadow .15s ease}

/* ===== Welle 4: Dashboard, Warn-Center, Wochenansicht, Segment-Umschalter ===== */
.seg{display:inline-flex;border:1px solid var(--rand);border-radius:9px;overflow:hidden;background:var(--karte)}
.seg-b{border:0;background:none;padding:7px 9px;font-size:12px;font-weight:600;color:var(--grau);cursor:pointer}
.seg-b.aktiv{background:var(--blau);color:#fff}
/* Dashboard */
#view-start .card h2{font-size:15px}
.ds-warn{border-color:#efd6ac}
.dw:last-child{margin-bottom:0}
.dw.warn .dw-main{color:#8a4b00}
.dw.verfall .dw-main{background:#fde8e6;color:var(--rot)}
.dw.info .dw-main{background:var(--hell);color:var(--grau)}
.ds-ok h2{color:var(--gruen)}
.ds-list{display:flex;flex-direction:column;gap:6px}
.ds-brow{display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:'dot name hrs' 'bar bar bar';gap:5px 10px;align-items:center;margin-bottom:11px}
.ds-brow:last-child{margin-bottom:0}
.ds-brow .dp-dot{grid-area:dot}
.ds-bn{grid-area:name;font-weight:600;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ds-bh{grid-area:hrs;font-weight:700;font-size:13px;color:var(--blau)}
.ds-bar{grid-area:bar;height:8px;background:var(--hell);border-radius:5px;overflow:hidden}
.ds-barf{height:100%;border-radius:5px;transition:width .3s}
.ds-ur{display:flex;align-items:center;gap:10px;padding:7px 0;border-bottom:1px solid var(--rand)}
.ds-ur:last-child{border-bottom:0}
.ampel{width:13px;height:13px;border-radius:50%;flex:0 0 13px}
.ampel.gruen{background:var(--gruen)}.ampel.amber{background:var(--amber)}.ampel.rot{background:var(--rot)}.ampel.grau{background:#c3ccd6}
.ds-urr{margin-left:auto;font-weight:700;font-size:13px}
.ds-fei{display:flex;justify-content:space-between;font-size:13.5px;padding:6px 0;border-bottom:1px solid var(--rand)}
.ds-fei:last-child{border-bottom:0}
.ds-fei span:first-child{color:var(--grau);min-width:92px}
/* Wochenansicht */
.week-grid{display:flex;flex-direction:column;gap:8px;flex:1 0 auto;padding-bottom:8px}
.wk-day{border:1px solid var(--rand);border-radius:12px;padding:10px 12px;background:var(--karte)}
.wk-day.heute{border-color:var(--blau);border-width:2px}
.wk-head{display:flex;align-items:center;margin-bottom:4px}
.wk-head b{font-size:14px}
.wk-add{margin-left:auto;width:28px;height:28px;border-radius:50%;border:1.5px solid var(--blau);background:none;color:var(--blau);font-size:16px;cursor:pointer;display:grid;place-items:center}
.wk-fei{font-size:12px;font-weight:700;color:var(--amber);margin:2px 0}
.wk-e{display:flex;align-items:center;gap:9px;padding:5px 0;font-size:13.5px;cursor:pointer}
.wk-n{font-weight:600;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wk-h{color:var(--grau);font-size:12.5px;white-space:nowrap}
.wk-empty{color:var(--grau);font-size:13px}

/* ===== Welle 5a: saubere Icons + Auswahllisten ===== */
.tab .ti{width:23px;height:23px;font-size:0;display:block;margin-bottom:1px}
.tab svg.ti{stroke:currentColor}
.sel-liste{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}
.sel-row{display:flex;align-items:center;gap:10px;background:var(--hell);border-radius:10px;padding:9px 12px;font-size:14px}
.sel-row input[type=checkbox]{width:20px;height:20px;flex:0 0 20px}
.sel-dot{width:12px;height:12px;border-radius:50%;flex:0 0 12px;box-shadow:0 0 0 1px rgba(0,0,0,.08)}
.sel-name{flex:1;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sel-one{border:1.5px solid var(--blau);background:none;color:var(--blau);border-radius:8px;padding:6px 13px;font-size:13px;font-weight:600;cursor:pointer}
.sel-actions{display:flex;gap:10px}
.sel-actions .paste-btn{margin-top:0}
.sel-name:has(.sel-mail){white-space:normal;line-height:1.25}
.sel-mail{display:block;font-size:11px;color:var(--grau);font-weight:400;font-style:normal;overflow:hidden;text-overflow:ellipsis}
.sel-send{flex:0 0 auto;border:1.5px solid var(--blau);background:var(--blau);color:#fff;border-radius:8px;padding:6px 11px;font-size:15px;line-height:1;cursor:pointer}
.url-cb{width:20px;height:20px;flex:0 0 20px;margin-right:2px}
#urlSelSend{margin-top:14px}

/* ===== Welle 5b: Abschnitts-Labels, Anleitung ===== */
.sec-label{font-size:11px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--grau);margin:4px 4px 8px}
.anleitung{font-size:13.5px;line-height:1.5}
.anl-s{margin-bottom:12px}
.anl-s b{color:var(--blau);display:block;margin-bottom:3px}
.anl-s ul{margin:0;padding-left:18px;color:var(--text)}
.anl-s li{margin-bottom:3px}
.ueber .hint{line-height:1.5}

/* ===== Welle 6: Lohn-Stammdaten, Einmalzahlungen ===== */
.ak-stamm{margin-top:12px;border-top:1px solid var(--rand);padding-top:10px}
.ak-stamm summary{cursor:pointer;font-size:13.5px;font-weight:600;color:var(--blau)}
.ak-stamm[open] summary{margin-bottom:10px}
.ak-stamm .field{margin-top:8px}
.ak-stamm input,.ak-stamm select{font-size:15px;padding:9px 10px;border:1px solid var(--rand);border-radius:9px;background:#fff;color:var(--text)}
.ak-stamm .ak-pers{margin-top:12px}
@media(prefers-color-scheme:dark){.ak-stamm input,.ak-stamm select{background:#111a24}}
.zz-liste{display:flex;flex-direction:column;gap:6px;margin-top:12px}
.zz-item{display:flex;align-items:center;gap:8px;background:var(--hell);border-radius:9px;padding:8px 10px;font-size:13.5px}
.zz-item .zz-art{color:var(--grau)}
.zz-item .zz-b{margin-left:auto;font-weight:700;color:var(--blau)}
.zz-item .zz-del{border:0;background:none;color:var(--grau);font-size:15px;cursor:pointer}

/* ===== Welle 7: volle Höhe + größere Tab-Icons ===== */
/* Tab-Leiste ist wieder im Fluss (Flex-Kind am Body-Ende); die Body-Höhe kommt per JS (--vh),
   damit die Leiste in Safari UND als Home-Bildschirm-App bündig unten sitzt. */
main{padding-bottom:8px}
.view{flex:1 1 auto;min-height:0}
#view-kalender .day-panel{flex:1 1 0;min-height:120px}
/* Tab-Leiste: größere Icons, Labels nah an die Home-Indicator-Zone (wenig Leerraum darunter) */
.tabbar{padding-bottom:calc(2px + env(safe-area-inset-bottom))}

/* ===== Design v3: weicher, macOS-angelehnter Look für alle Formular-Controls (toolweit) ===== */
select,
input[type=text],input[type=date],input[type=number],input[type=time],input[type=search],input[type=email],input[type=tel],
textarea{
  -webkit-appearance:none;appearance:none;font-family:inherit;font-size:16px;color:var(--text);
  background-color:var(--karte);border:1px solid var(--rand);border-radius:12px;
  padding:12px 14px;width:100%;box-shadow:0 1px 2px rgba(16,41,66,.05);
  transition:border-color .15s ease, box-shadow .15s ease;
}
select{
  padding-right:40px;cursor:pointer;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235d6b7a' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><path d='M6 9l6 6 6-6'/></svg>");
  background-repeat:no-repeat;background-position:right 14px center;
}
select:focus,input:focus,textarea:focus{
  outline:none;border-color:var(--blau);
  box-shadow:0 0 0 3px rgba(31,78,121,.20);
  box-shadow:0 0 0 3px color-mix(in srgb, var(--blau) 24%, transparent);
}
@media(prefers-color-scheme:dark){
  select,input[type=text],input[type=date],input[type=number],input[type=time],input[type=search],input[type=email],input[type=tel],textarea{
    background-color:#141d28;border-color:#2b3b4c;color:#e8eef4}
  select{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2394a6b8' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><path d='M6 9l6 6 6-6'/></svg>")}
}
.tab{padding:9px 0 6px;font-size:10px;gap:3px}
.tab .ti{width:27px;height:27px;margin-bottom:0}

/* ===== Cockpit (Lohn) ===== */
.cockpit-body{margin-top:6px}
.ck-zeitraum{font-size:13px;color:var(--grau);font-weight:600;margin-bottom:10px}
.ck-hero{display:flex;flex-direction:column;gap:3px;background:linear-gradient(135deg,var(--blau),var(--blau2));color:#fff;border-radius:16px;padding:16px 18px;margin-bottom:12px;box-shadow:0 2px 10px rgba(31,78,121,.22)}
.ck-hero-l{font-size:13px;opacity:.92;font-weight:600}
.ck-hero-v{font-size:30px;font-weight:800;letter-spacing:.3px;line-height:1.1}
.ck-hero-s{font-size:12.5px;opacity:.9}
.ck-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ck-tile{display:flex;flex-direction:column;gap:3px;background:var(--hell);border:1px solid var(--rand);border-radius:12px;padding:11px 13px}
.ck-tile .ck-l{font-size:12.5px;color:var(--grau);font-weight:600}
.ck-tile .ck-v{font-size:17px;font-weight:700}
.ck-tile .ck-v small{font-size:12.5px;font-weight:600;color:var(--gruen)}
@media(prefers-color-scheme:dark){.ck-tile{background:#141d28;border-color:#2b3b4c}}

/* Kalender: Lohn-Info bei Einzel-Mitarbeiter */
.cal-ma-info{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;background:var(--hell);border:1px solid var(--rand);border-radius:12px;padding:9px 13px;margin-top:8px}
.cal-ma-info .cmi-h{font-size:17px;font-weight:800;color:var(--blau)}
.cal-ma-info .cmi-e{font-size:16px;font-weight:700;color:var(--gruen)}
.cal-ma-info .cmi-e.cmi-muted{color:var(--grau);font-weight:600;font-size:13px}
.cal-ma-info .cmi-s{font-size:12.5px;color:var(--grau);margin-left:auto}
@media(prefers-color-scheme:dark){.cal-ma-info{background:#141d28;border-color:#2b3b4c}}

/* ===== Block B: aufklappbare Team-Akte ===== */
.team-suche{margin-bottom:12px}
details.akte{padding:0;border:1px solid var(--rand);border-radius:14px;background:var(--karte);margin-bottom:10px;overflow:hidden}
details.akte[open]{box-shadow:0 2px 12px rgba(16,41,66,.07)}
.ak-sum{display:flex;align-items:center;gap:11px;padding:13px 14px;cursor:pointer;list-style:none;-webkit-user-select:none;user-select:none}
.ak-sum::-webkit-details-marker{display:none}
.ak-dot{width:14px;height:14px;border-radius:50%;flex:0 0 14px}
.ak-sum-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.ak-sum-name{font-size:16px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ak-sum-sub{font-size:12.5px;color:var(--grau);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ak-sum-warn{font-size:13px;color:var(--amber);font-weight:700;flex:0 0 auto}
.ak-sum::after{content:'';width:9px;height:9px;border-right:2px solid var(--grau);border-bottom:2px solid var(--grau);transform:rotate(-45deg);transition:transform .15s;flex:0 0 auto}
details.akte[open] .ak-sum::after{transform:rotate(45deg)}
.ak-body{padding:2px 14px 14px}
.ak-body>.field{margin-bottom:11px}
.akte-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:11px}
.akte-grid .ak-col-full{grid-column:1 / -1}
.ak-farbe-det{border:1px solid var(--rand);border-radius:12px;margin-bottom:11px;overflow:hidden}
.ak-farbe-sum{display:flex;align-items:center;gap:10px;padding:11px 13px;cursor:pointer;font-size:14px;font-weight:600;color:var(--blau);list-style:none}
.ak-farbe-sum::-webkit-details-marker{display:none}
.cur-farbe{width:22px;height:22px;border-radius:50%;box-shadow:0 0 0 2px #fff,0 0 0 3px var(--rand)}
.farbzeile{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:0 13px 13px}
.ak-farbe{width:46px;height:36px;padding:2px;border:1px solid var(--rand);border-radius:9px;background:none}
.swatches{display:flex;flex-wrap:wrap;gap:7px}
.swatch{width:27px;height:27px;border-radius:50%;border:0;cursor:pointer;box-shadow:0 0 0 2px transparent;padding:0}
.swatch.aktiv{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--blau)}
.cal-cell.frei-tag{background:repeating-linear-gradient(45deg,var(--hell),var(--hell) 5px,#dde6ef 5px,#dde6ef 10px)}
/* Urlaub-Karte: genommen + geplant Balken, 4 Kennzahlen */
.url-bar{display:flex;overflow:hidden}
.url-bar-fill{flex:0 0 auto}
.url-bar-plan{flex:0 0 auto;height:100%;opacity:.42}
.url-meta4{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:11px 0;text-align:center}
.url-meta4 span{display:flex;flex-direction:column;gap:1px;font-size:11px;color:var(--grau)}
.url-meta4 b{font-size:19px;color:var(--text);font-weight:800;line-height:1.1}
.url-meta4 .neg b{color:var(--rot)}
.url-ueb{font-size:11.5px;color:var(--grau);margin:2px 0 0;font-style:italic}
.stn-einzel{margin-top:12px}
.stn-einzel>summary{font-size:13.5px;color:var(--blau);font-weight:600;cursor:pointer;padding:6px 0}
.stn-einzel[open]>summary{margin-bottom:8px}
.url-rest.neg{color:var(--rot)}

/* ===== E: Arbeitszeit (Anwesenheit + MA-Jahr) ===== */
.zeit-seg{margin-bottom:12px}
.zeit-titel{flex:1;text-align:center;font-weight:700;font-size:15px}
.heute-mini{border:1.5px solid var(--blau);background:none;color:var(--blau);border-radius:10px;padding:8px 12px;font-size:13px;font-weight:600;cursor:pointer}
.zw-matrix{display:flex;flex-direction:column;gap:3px;overflow-x:auto}
.zw-row{display:grid;grid-template-columns:92px repeat(7,minmax(30px,1fr));gap:3px;min-width:330px}
.zw-head .zw-cell{background:none;flex-direction:column;font-size:10.5px;color:var(--grau);padding:1px 0;min-height:0}
.zw-head .zw-dn{font-weight:700;color:var(--text);font-size:12px}
.zw-name{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:600;padding:4px 2px;overflow:hidden}
.zw-nm{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.zw-dot{width:10px;height:10px;border-radius:50%;flex:0 0 10px}
.zw-cell{display:flex;align-items:center;justify-content:center;min-height:36px;background:var(--hell);border-radius:7px}
.zw-cell.heute{outline:2px solid var(--blau);outline-offset:-2px}
.zw-hrs{font-size:9.5px;font-weight:700;color:#fff;padding:2px 3px;border-radius:5px;line-height:1.05;text-align:center}
.zw-badge{font-size:10.5px;font-weight:800;padding:2px 5px;border-radius:6px}
.zw-empty{color:#c2ccd6}
.st-urlaub{background:#e4f5ec;color:var(--gruen)}
.st-krank{background:#f7e4e1;color:var(--rot)}
.st-feier{background:#fdf0dc;color:var(--amber)}
.st-frei{background:#e7edf4;color:var(--grau)}
.zj-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.zj-month{background:var(--karte);border:1px solid var(--rand);border-radius:12px;padding:8px 8px 9px}
.zj-mname{font-size:12.5px;font-weight:700;color:var(--blau);margin-bottom:5px;text-align:center}
.zj-days{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.zj-d{font-size:9px;display:flex;align-items:center;justify-content:center;aspect-ratio:1;border-radius:3px;color:var(--grau);border:1px solid transparent}
.zj-d.out{visibility:hidden}
.zj-d.st-urlaub{background:#cdeede;color:#1f6f43}
.zj-d.st-krank{background:#f3cec8;color:#a5281a}
.zj-d.st-feier{background:#f9e2be;color:#8a5406}
.zj-d.st-frei{background:#e0e7ef;color:#8794a3}
.zeit-legende{display:flex;flex-wrap:wrap;gap:11px;margin-top:12px;font-size:12px;color:var(--grau)}
.lg-i{display:flex;align-items:center;gap:5px}
.lg-sw{width:13px;height:13px;border-radius:4px}
.lg-sw.st-arbeit{background:var(--blau)}
@media(prefers-color-scheme:dark){.zw-cell{background:#18222e}}

/* ===== D2: Ü60-Lesbarkeit, mehr Kontrast, größere Touch-Ziele ===== */
:root{--grau:#4f5e6c}
body{font-size:16.5px;line-height:1.55}
.card{padding:17px}
.card h2{font-size:18px}
.hint{font-size:14px;line-height:1.45}
.field{font-size:15px}
.field>span{font-size:15px;font-weight:600}
.sec-label{font-size:12.5px;letter-spacing:.4px}
select,input[type=text],input[type=date],input[type=number],input[type=time],input[type=search],input[type=email],input[type=tel],textarea{font-size:16.5px;padding:13px 14px}
.paste-btn{font-size:16px;padding:14px}
.primary{font-size:18px;padding:17px}
.danger{font-size:16px;padding:15px 10px}
.tab{font-size:11px}
.ak-sum{padding:15px 14px}
.ak-sum-name{font-size:16.5px}
.ak-sum-sub{font-size:13px}
.chip-t{font-size:12.5px}
.url-meta4 b{font-size:20px}
.url-meta4 span{font-size:12px}
.url-top b{font-size:16.5px}
.ck-hero-v{font-size:33px}
.ck-tile .ck-v{font-size:18px}
.ck-tile .ck-l{font-size:13px}
.cal-cell .dnum{font-size:15px}
.dp-name{font-size:15px}
.de-item{font-size:14.5px}
.zeit-titel{font-size:16px}
.bk-autohint{font-size:14px}
.bk-pausehint{font-size:13px}

/* ===== iOS-Layout-Fix: robuste Shell, kein Horizontal-Überlauf, Status als Toast ===== */
html{height:100%;overflow:hidden}
html,body{width:100%;max-width:100%;overflow-x:hidden;overscroll-behavior-y:none}
body{height:100%;display:flex;flex-direction:column;overflow:hidden}
main{flex:1 1 auto;min-height:0;min-width:0;width:100%;overflow-y:auto;overflow-x:hidden;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch}
.view{width:100%}
.view,.view>*,.card,.tm-item{min-width:0;max-width:100%}
.tm-main{overflow:hidden}
.status{position:fixed;left:12px;right:12px;bottom:calc(82px + env(safe-area-inset-bottom));z-index:60;margin:0;text-align:center;font-size:14.5px;font-weight:500;padding:13px 16px;border-radius:13px;background:var(--tinte);color:#fff;box-shadow:0 8px 24px rgba(0,0,0,.3);min-height:0}
.status.err{background:var(--rot);color:#fff;font-weight:600}
.status:empty{display:none}

/* ===== G3: Schriftskalierung (--sc) für Fließtexte/Kennzahlen (nicht die dichten Raster) ===== */
:root{--sc:1}
body{font-size:calc(16.5px * var(--sc))}
.card h2{font-size:calc(18px * var(--sc))}
.hint{font-size:calc(14px * var(--sc))}
.field,.field>span{font-size:calc(15px * var(--sc))}
.paste-btn{font-size:calc(16px * var(--sc))}
.primary{font-size:calc(18px * var(--sc))}
select,input[type=text],input[type=date],input[type=number],input[type=time],input[type=search],input[type=email],input[type=tel],textarea{font-size:calc(16.5px * var(--sc))}
.ak-sum-name{font-size:calc(16.5px * var(--sc))}
.ak-sum-sub{font-size:calc(13px * var(--sc))}
.chip-t{font-size:calc(12.5px * var(--sc))}
.url-top b{font-size:calc(16.5px * var(--sc))}
.url-meta4 b{font-size:calc(20px * var(--sc))}
.url-meta4 span{font-size:calc(12px * var(--sc))}
.dp-name{font-size:calc(15px * var(--sc))}
.dp-h,.de-h,.de-item{font-size:calc(14px * var(--sc))}
.zi-kat{font-size:calc(11px * var(--sc))}
.ds-bn,.ds-urr{font-size:calc(14px * var(--sc))}
.ds-fei span{font-size:calc(14px * var(--sc))}
.ck-hero-v{font-size:calc(33px * var(--sc))}
.ck-tile .ck-v{font-size:calc(18px * var(--sc))}
.ck-tile .ck-l{font-size:calc(13px * var(--sc))}

/* Dashboard-Warnungen als klickbare Buttons */
.dw{display:flex;align-items:stretch;gap:6px;margin-bottom:8px}
.dw-main{flex:1;min-width:0;display:flex;align-items:center;gap:9px;text-align:left;border:0;background:var(--hell);border-radius:11px;padding:12px 13px;cursor:pointer;font-size:calc(14px * var(--sc));color:var(--text);line-height:1.4;font-family:inherit}
.dw-main:active{transform:translateY(1px)}
.dw .dw-txt{flex:1;min-width:0}
.dw .dw-go{color:var(--blau);font-weight:800;font-size:calc(19px * var(--sc));flex:0 0 auto}
.dw.warn .dw-main,.dw.verfall .dw-main{background:#fdf0dc}
.dw.geb .dw-main{background:#e6f0ff;color:#1f4e79}
.dw-x{flex:0 0 auto;border:0;background:var(--hell);color:var(--grau);border-radius:11px;padding:0 14px;font-size:15px;cursor:pointer;font-family:inherit;font-weight:600}
.dw-x:active{transform:translateY(1px)}
.dw-reset{width:100%;border:0;background:none;color:var(--blau);font-size:calc(13px * var(--sc));padding:9px;cursor:pointer;font-weight:600;font-family:inherit}
.ak-hi{outline:2px solid var(--blau)!important;outline-offset:1px;border-radius:8px;transition:outline .2s}
/* Zeiten kopieren / Muster-Vorschläge im Buchen-Dialog */
.bk-vorschlaege{display:flex;flex-direction:column;gap:7px;margin:2px 0 4px}
.bk-chip{border:1.5px solid var(--blau);background:#eef4fb;color:var(--blau);border-radius:11px;padding:10px 13px;font-size:calc(13.5px * var(--sc));font-weight:600;text-align:left;cursor:pointer;font-family:inherit;line-height:1.35}
.bk-chip:active{transform:translateY(1px)}
@media(prefers-color-scheme:dark){ .bk-chip{background:#16283c} }
.bk-serie{margin:4px 0 2px}
.bk-serie>summary{font-size:calc(13.5px * var(--sc));color:var(--blau);font-weight:600;cursor:pointer;padding:5px 0}
.bk-serie[open]>summary{margin-bottom:8px}
.url-hi{box-shadow:0 0 0 2px var(--blau)!important;transition:box-shadow .2s}

/* ===== H1: Termine ===== */
.tm-chips{display:flex;flex-wrap:wrap;gap:8px;margin:-4px 0 11px}
.tm-chip{border:1.5px solid var(--blau);background:none;color:var(--blau);border-radius:20px;padding:8px 13px;font-size:calc(13.5px * var(--sc));font-weight:600;cursor:pointer;font-family:inherit}
.tm-chip:active{transform:translateY(1px)}
.tm-liste{display:flex;flex-direction:column;gap:8px}
.tm-item{display:flex;align-items:center;gap:9px;background:var(--hell);border-radius:11px;padding:10px 12px}
.tm-dot{width:11px;height:11px;border-radius:50%;flex:0 0 11px}
.tm-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.tm-top{font-size:calc(14px * var(--sc));white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tm-sub{font-size:calc(12.5px * var(--sc));color:var(--grau)}
.tm-resend,.tm-del{border:0;background:none;font-size:18px;cursor:pointer;padding:4px 7px;flex:0 0 auto;font-family:inherit}
.tm-resend{color:var(--blau)}
.tm-del{color:var(--grau)}
.zw-cell.zw-book{cursor:pointer}
.zw-cell.zw-book:active{filter:brightness(.93)}
.zw-hinweis{font-size:12.5px;color:var(--grau);margin:0 0 8px}
.frei-lbl{font-size:9.5px;font-weight:700;color:var(--grau);text-transform:uppercase;letter-spacing:.2px}
@media(prefers-color-scheme:dark){.cur-farbe{box-shadow:0 0 0 2px #0f2942,0 0 0 3px #2b3b4c}.swatch.aktiv{box-shadow:0 0 0 2px #0f2942,0 0 0 4px var(--blau)}.cal-cell.frei-tag{background:repeating-linear-gradient(45deg,#18222e,#18222e 5px,#22303f 5px,#22303f 10px)}}
.tab svg.ti{stroke-width:1.9}

/* Fix: leeres Status-Feld darf keinen Platz einnehmen */
.status{margin:0}
.status:empty{display:none}

/* ============================================================
   Design „EXCLUSIVE by Melanie" (Premium-Neukunden-Look)
   Weiß/Creme · Schwarz · Rosé #e8a0b4 · warme Nude-Töne
   Poppins (Versalien, Letter-Spacing) + Montserrat (Fließtext)
   ============================================================ */
@font-face{font-family:'Poppins';font-style:normal;font-weight:300;font-display:swap;src:url('lib/fonts/Poppins-300.woff2') format('woff2')}
@font-face{font-family:'Poppins';font-style:normal;font-weight:400;font-display:swap;src:url('lib/fonts/Poppins-400.woff2') format('woff2')}
@font-face{font-family:'Poppins';font-style:normal;font-weight:600;font-display:swap;src:url('lib/fonts/Poppins-600.woff2') format('woff2')}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:400 700;font-display:swap;src:url('lib/fonts/Montserrat-400.woff2') format('woff2')}

:root[data-design="exclusive"]{
  --blau:#191614; --blau2:#453e3a; --tinte:#191614;
  --bg:#faf7f4; --karte:#ffffff; --rand:#eadfd6;
  --text:#22201e; --grau:#8b7f76; --hell:#f4ede6;
  --gruen:#5d7d5f; --amber:#b9863c; --rot:#b0483f;
  --ex-rose:#e8a0b4; --ex-rose-soft:#f9e8ed; --ex-rose-text:#a5566d;
}
:root[data-design="exclusive"] body{background:var(--bg);font-family:'Montserrat',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif}
:root[data-design="exclusive"] h1,
:root[data-design="exclusive"] h2,
:root[data-design="exclusive"] h3{font-family:'Poppins','Montserrat',sans-serif}
:root[data-design="exclusive"] .card h2{text-transform:uppercase;letter-spacing:.12em;font-weight:500;font-size:calc(15px * var(--sc));color:#191614}
:root[data-design="exclusive"] .sec-label{letter-spacing:.28em;color:#b3a89f}
:root[data-design="exclusive"] .card{border-radius:10px;border:1px solid var(--rand);box-shadow:0 1px 3px rgba(74,56,42,.05)}

/* Kopfzeile: hell, Wordmark-Logo, feine Linie */
:root[data-design="exclusive"] .topbar{background:#fffdfb;color:#191614;border-bottom:1px solid var(--rand);padding-top:calc(11px + env(safe-area-inset-top));padding-bottom:11px}
:root[data-design="exclusive"] .topbar h1{font-weight:500;text-transform:uppercase;letter-spacing:.16em;font-size:calc(13.5px * var(--sc));color:#191614}
:root[data-design="exclusive"] .topbar .top-ma{background:var(--ex-rose-soft);color:var(--ex-rose-text)}
:root[data-design="exclusive"] .topbar .logo{border-radius:0;box-shadow:none}
:root[data-design="exclusive"] .topbar .logo.logo-mr{width:28px;height:28px;border-radius:6px;border:1px solid #e5dad0}
:root[data-design="exclusive"] .ex-hero img{height:56px}

/* Tab-Leiste: hell, Versalien, Rosé-Punkt unter aktivem Tab */
:root[data-design="exclusive"] .tabbar{background:#fffdfb;border-top:1px solid var(--rand);box-shadow:none}
:root[data-design="exclusive"] .tab{color:#af9f94;font-family:'Poppins',sans-serif;font-weight:300;text-transform:uppercase;letter-spacing:.05em;font-size:calc(9.5px * var(--sc))}
:root[data-design="exclusive"] .tab.active{color:#191614;font-weight:600}
:root[data-design="exclusive"] .tab.active::after{content:'';width:4px;height:4px;border-radius:50%;background:var(--ex-rose);margin-top:1px}

/* Buttons: eckig-elegant, Schwarz gefüllt bzw. Outline */
:root[data-design="exclusive"] .primary{background:#ffc0cb;color:#191614;border-radius:100px;box-shadow:none;font-family:'Poppins',sans-serif;font-weight:500;letter-spacing:.04em;font-size:calc(15px * var(--sc))}
:root[data-design="exclusive"] .primary:disabled{background:#f3dade;color:#b9a3a9}
:root[data-design="exclusive"] .primary.ghost{background:none;border:1.5px solid #191614;color:#191614;border-radius:100px}
:root[data-design="exclusive"] .paste-btn{border-color:#191614;color:#191614;border-radius:100px;background:#fff}
:root[data-design="exclusive"] .ze-imp{border-color:#191614;color:#191614;border-radius:100px}
:root[data-design="exclusive"] .chip{border-color:#191614;color:#191614;border-radius:100px}
:root[data-design="exclusive"] .heute-mini{border-color:#191614;color:#191614;border-radius:100px}
:root[data-design="exclusive"] .fab{background:#ffc0cb;color:#191614;box-shadow:0 6px 18px rgba(232,160,180,.45)}
:root[data-design="exclusive"] .seg-b.aktiv{background:#191614;color:#fff}
:root[data-design="exclusive"] .sel-send{background:#ffc0cb;border-color:#ffc0cb;color:#191614;border-radius:100px}
:root[data-design="exclusive"] .sel-one{border-color:#191614;color:#191614;border-radius:100px}

/* Formularfelder: feine warme Ränder */
:root[data-design="exclusive"] select,
:root[data-design="exclusive"] input[type=text],:root[data-design="exclusive"] input[type=date],
:root[data-design="exclusive"] input[type=number],:root[data-design="exclusive"] input[type=time],
:root[data-design="exclusive"] input[type=search],:root[data-design="exclusive"] input[type=email],
:root[data-design="exclusive"] input[type=tel],:root[data-design="exclusive"] textarea{border-radius:6px;border-color:#e5d9cf;background-color:#fff}
:root[data-design="exclusive"] select:focus,:root[data-design="exclusive"] input:focus,:root[data-design="exclusive"] textarea:focus{border-color:#191614;box-shadow:0 0 0 3px rgba(25,22,20,.14)}

/* Vorschlags-Chips (Zeiten kopieren) in Rosé */
:root[data-design="exclusive"] .bk-chip{background:var(--ex-rose-soft);border-color:var(--ex-rose);color:var(--ex-rose-text);border-radius:6px}
:root[data-design="exclusive"] .dw.geb .dw-main{background:var(--ex-rose-soft);color:var(--ex-rose-text)}

/* Marken-Kopf auf dem Start-Tab */
.ex-hero{display:none}
:root[data-design="exclusive"] .ex-hero{display:flex;flex-direction:column;align-items:center;gap:6px;padding:20px 0 10px}
:root[data-design="exclusive"] .ex-hero img{height:46px;width:auto;max-width:80%;object-fit:contain}
:root[data-design="exclusive"] .ex-hero span{font-family:'Poppins',sans-serif;font-size:9.5px;letter-spacing:.42em;text-transform:uppercase;color:#b3a89f;padding-left:.42em}

/* Design-Auswahl: MR-Monogramm als Kachel */
.theme-sw[data-k="exclusive"]{background:#ffffff url('icons/exclusive-mr.png') center/86% no-repeat !important;border:1px solid #d9cfc6}


/* Editorial-Zahlen: gross & leicht */
:root[data-design="exclusive"] .url-meta4 b{font-family:'Poppins',sans-serif;font-weight:300}
:root[data-design="exclusive"] .ck-hero b,:root[data-design="exclusive"] .ck-big{font-family:'Poppins',sans-serif;font-weight:300}
:root[data-design="exclusive"] .seg{border-radius:100px;overflow:hidden}
:root[data-design="exclusive"] .seg-b{font-family:'Poppins',sans-serif}

/* Dunkler Abend-Look: Espresso-Schwarz, Creme, Rosé */
@media(prefers-color-scheme:dark){
  :root[data-design="exclusive"]{
    --bg:#141110; --karte:#1d1917; --rand:#332c27; --text:#f0e9e3; --grau:#a3968c; --hell:#262019;
    --blau:#f0e9e3; --blau2:#cfc8c2; --tinte:#000000;
  }
  :root[data-design="exclusive"] .topbar{background:#181412;color:#f0e9e3;border-bottom-color:#332c27}
  :root[data-design="exclusive"] .topbar h1{color:#f0e9e3}
  :root[data-design="exclusive"] .topbar .top-ma{background:#3a2a30;color:var(--ex-rose)}
  :root[data-design="exclusive"] .topbar .logo.logo-mr{border-color:#3a322c;filter:brightness(.92)}
  :root[data-design="exclusive"] .ex-hero img{filter:invert(.92) sepia(.06)}
  :root[data-design="exclusive"] .card h2{color:#f0e9e3}
  :root[data-design="exclusive"] .tabbar{background:#181412;border-top-color:#332c27}
  :root[data-design="exclusive"] .tab{color:#7d716a}
  :root[data-design="exclusive"] .tab.active{color:#f0e9e3}
  :root[data-design="exclusive"] .primary{background:#ffc0cb;color:#191614}
  :root[data-design="exclusive"] .primary:disabled{background:#4a413b;color:#8b7f76}
  :root[data-design="exclusive"] .primary.ghost{background:none;border-color:#f0e9e3;color:#f0e9e3}
  :root[data-design="exclusive"] .paste-btn{border-color:#f0e9e3;color:#f0e9e3;background:transparent}
  :root[data-design="exclusive"] .ze-imp{border-color:#f0e9e3;color:#f0e9e3}
  :root[data-design="exclusive"] .chip{border-color:#f0e9e3;color:#f0e9e3}
  :root[data-design="exclusive"] .heute-mini{border-color:#f0e9e3;color:#f0e9e3}
  :root[data-design="exclusive"] .fab{background:#ffc0cb;color:#191614}
  :root[data-design="exclusive"] .seg-b.aktiv{background:#f0e9e3;color:#191614}
  :root[data-design="exclusive"] .sel-one{border-color:#f0e9e3;color:#f0e9e3}
  :root[data-design="exclusive"] select,
  :root[data-design="exclusive"] input[type=text],:root[data-design="exclusive"] input[type=date],
  :root[data-design="exclusive"] input[type=number],:root[data-design="exclusive"] input[type=time],
  :root[data-design="exclusive"] input[type=search],:root[data-design="exclusive"] input[type=email],
  :root[data-design="exclusive"] input[type=tel],:root[data-design="exclusive"] textarea{background-color:#241f1c;border-color:#3a322c;color:#f0e9e3}
  :root[data-design="exclusive"] .bk-chip{background:#33262b;border-color:#8c5566;color:#eebbc8}
  :root[data-design="exclusive"] .ex-hero span{color:#7d716a}
}

/* Stundenzettel-Scanner: Kontroll-Tabelle */
.scan-review{margin-top:6px}
.sr-row{display:flex;gap:10px;align-items:flex-start;background:var(--hell);border-radius:10px;padding:10px 12px;margin-bottom:7px}
.sr-row.warn{background:#fdf0dc}
.sr-row input[type=checkbox]{width:20px;height:20px;flex:0 0 20px;margin-top:2px}
.sr-body{flex:1;min-width:0}
.sr-kopf{font-size:calc(13.5px * var(--sc));line-height:1.5}
.sr-t{width:92px !important;padding:6px 8px !important;font-size:14px !important;display:inline-block}
.sr-p{width:64px !important;padding:6px 8px !important;font-size:14px !important;display:inline-block}
.sr-warn{font-size:calc(12px * var(--sc));color:#8a4b00;margin-top:4px}
:root[data-design="exclusive"] .sr-row.warn{background:#f9e8ed}
:root[data-design="exclusive"] .sr-warn{color:#a5566d}
#scanText{margin-top:4px}
/* Scanner: Gruppierung je Zettel/Mitarbeiterin */
.sg-gruppe{border:1px solid var(--rand);border-radius:12px;padding:11px;margin-bottom:12px;background:var(--karte)}
.sg-kopf{display:flex;flex-direction:column;gap:7px;margin-bottom:9px}
.sg-datei{font-size:11.5px;color:var(--grau);font-family:ui-monospace,monospace;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sg-warn{font-size:calc(12.5px * var(--sc));color:#8a4b00;font-weight:600}
:root[data-design="exclusive"] .sg-warn{color:#a5566d}
.sr-kopfzeile{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:12px 0 8px}
.sr-alle{border:1.5px solid var(--blau);background:none;color:var(--blau);border-radius:8px;padding:7px 11px;font-size:calc(12.5px * var(--sc));font-weight:600;cursor:pointer;white-space:nowrap;font-family:inherit}
:root[data-design="exclusive"] .sr-alle{border-radius:100px;border-color:#191614;color:#191614}

/* Arbeitsrhythmus in der Akte */
.rh-box{border:1px solid var(--rand);border-radius:12px;padding:12px;margin:6px 0 12px;background:var(--hell)}
.rh-titel{font-weight:700;font-size:calc(14.5px * var(--sc));margin-bottom:6px}
.rh-titel em{font-weight:400;color:var(--grau);font-style:normal;font-size:.85em}
.rh-gilt{font-size:calc(12.5px * var(--sc));color:var(--grau);margin-bottom:8px}
.rh-seg{display:flex;border:1px solid var(--rand);border-radius:9px;overflow:hidden;background:var(--karte)}
.rh-seg button{flex:1;border:0;background:none;padding:8px 2px;white-space:nowrap;font-size:calc(13px * var(--sc));color:var(--text);cursor:pointer;font-family:inherit}
.rh-seg button+button{border-left:1px solid var(--rand)}
.rh-seg button.aktiv{background:var(--blau);color:#fff;font-weight:700}
.rh-box>.rh-seg{margin-bottom:8px}
.rh-row{display:grid;grid-template-columns:28px 1fr 58px;gap:8px;align-items:center;margin-top:6px}
.rh-row b{font-size:calc(14px * var(--sc))}
.rh-soll:disabled{opacity:.35}
.rh-soll{padding:8px !important;font-size:14px !important;text-align:center}
.rh-ref{font-size:calc(12.5px * var(--sc));color:var(--grau);margin:4px 0 2px 36px}
.rh-ref input{width:auto !important;padding:6px 8px !important;font-size:14px !important;display:inline-block}
.rh-fehlt{color:var(--rot)}
.rh-fuss{display:grid;grid-template-columns:1fr;gap:6px;margin-top:14px;padding-top:12px;border-top:1px solid var(--rand)}
.rh-fuss span{font-size:calc(12.5px * var(--sc));color:var(--grau)}
.rh-fuss input{padding:8px !important;font-size:14px !important}
.rh-box .paste-btn{margin-top:6px}
:root[data-design="exclusive"] .rh-seg{border-radius:100px}
:root[data-design="exclusive"] .rh-seg button.aktiv{background:#191614}

/* PDF-Vorschau in der App */
.pdf-modal{z-index:55}
.pdf-sheet{display:flex;flex-direction:column;height:94vh;height:calc(var(--vh,1vh)*94);max-height:none;padding-bottom:calc(12px + env(safe-area-inset-bottom))}
.pdf-seiten{flex:1 1 auto;overflow:auto;-webkit-overflow-scrolling:touch;background:var(--hell);border-radius:12px;padding:10px;min-height:200px}
.pdf-seite{display:block;width:100%;height:auto;background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.15);border-radius:3px}
.pdf-seite+.pdf-seite{margin-top:10px}
.pdf-lade{text-align:center;margin:40px 0}
.pdf-aktionen{display:grid;gap:8px;margin-top:12px;flex:0 0 auto}
.pdf-aktionen .paste-btn{margin:0}
.pdf-aktionen .primary{width:100%}
.pdf-sheet .sheet-head h3{font-size:15px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ruhetage{margin-top:6px}
.ruhetage button{padding:9px 2px}
.rh-seg button{font-size:calc(12.5px * var(--sc))}
.rh-row .rh-seg button{flex:1 1 auto;padding:8px 3px}
.rh-row{grid-template-columns:28px 1fr 48px}

/* ============================================================
   TEAM-APP (Server-Modus): Anmeldung, Mitarbeiter-Portal, Admin-Bausteine
   ============================================================ */
body.team-vollbild > :not(#teamRoot):not(script):not(.team-dialog):not(.team-toast){display:none !important}
#teamRoot{flex:1 1 auto;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;background:#faf7f4;color:#22201e;font-family:'Montserrat',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif}

/* Meldung (Toast) */
.team-toast{position:fixed;left:50%;bottom:calc(86px + env(safe-area-inset-bottom));transform:translate(-50%,20px);opacity:0;pointer-events:none;
  z-index:90;max-width:min(520px,calc(100vw - 32px));width:max-content;background:#191614;color:#fff;padding:12px 18px;border-radius:12px;
  font-size:14.5px;line-height:1.4;box-shadow:0 10px 28px rgba(0,0,0,.28);transition:opacity .2s ease, transform .2s ease;text-align:center}
.team-toast.sichtbar{opacity:1;transform:translate(-50%,0)}
.team-toast.fehler{background:#b0483f}

/* Dialog */
.team-dialog{position:fixed;inset:0;z-index:80;background:rgba(20,17,16,.5);display:flex;align-items:flex-end;justify-content:center;animation:fade .15s ease}
.team-dialog-box{background:#fff;color:#22201e;width:100%;max-width:520px;max-height:92vh;max-height:calc(var(--vh,1vh)*92);overflow:auto;border-radius:18px 18px 0 0;
  padding:20px 18px calc(16px + env(safe-area-inset-bottom));box-shadow:0 -10px 30px rgba(0,0,0,.25);font-family:'Montserrat',-apple-system,sans-serif}
.team-dialog-box h3{font-family:'Poppins',sans-serif;font-weight:500;font-size:17px;letter-spacing:.02em;margin:0 0 10px}
.team-dialog-box p{margin:0 0 10px;font-size:15px;line-height:1.5}
.team-dialog-box ul{margin:0 0 12px;padding-left:20px}
.team-dialog-knoepfe{display:flex;flex-direction:column-reverse;gap:8px;margin-top:16px}
.team-dialog-knoepfe button{border:1.5px solid #191614;background:#fff;color:#191614;border-radius:100px;padding:13px 16px;font:500 15.5px 'Poppins',sans-serif;cursor:pointer}
.team-dialog-knoepfe button.haupt{background:#ffc0cb;border-color:#ffc0cb}
.team-dialog-knoepfe button.gefahr{background:#b0483f;border-color:#b0483f;color:#fff}
.team-feld{display:block;margin:0 0 12px}
.team-feld>span{display:block;font-size:13.5px;color:#8b7f76;margin-bottom:5px}
.team-klein{font-size:13px !important;color:#8b7f76}
.tk-linktext{font-size:14px;line-height:1.45;resize:none}
@media(min-width:700px){
  .team-dialog{align-items:center}
  .team-dialog-box{border-radius:16px;padding:24px}
  .team-dialog-knoepfe{flex-direction:row-reverse;flex-wrap:wrap}
  .team-dialog-knoepfe button{flex:1 1 auto}
}

/* Anmeldung */
.tl-seite{min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:calc(24px + env(safe-area-inset-top)) 18px calc(24px + env(safe-area-inset-bottom))}
.tl-karte{width:100%;max-width:420px;background:#fff;border:1px solid #eadfd6;border-radius:14px;padding:28px 22px;box-shadow:0 8px 30px rgba(74,56,42,.07)}
.tl-marke{display:flex;flex-direction:column;align-items:center;gap:8px;margin-bottom:22px}
.tl-marke img{width:min(230px,70%);height:auto}
.tl-marke span{font-family:'Poppins',sans-serif;font-size:10px;letter-spacing:.42em;text-transform:uppercase;color:#b3a89f;padding-left:.42em}
.tl-titel{font-family:'Poppins',sans-serif;font-weight:400;font-size:20px;text-align:center;margin:0 0 16px}
.tl-hinweis{background:#f9e8ed;color:#a5566d;border-radius:10px;padding:12px 14px;font-size:14.5px;margin:0 0 14px;text-align:center}
.tl-haupt{width:100%;display:flex;align-items:center;justify-content:center;gap:10px;border:0;background:#191614;color:#fff;border-radius:100px;padding:15px 18px;font:500 16px 'Poppins',sans-serif;letter-spacing:.03em;cursor:pointer;margin:6px 0}
.tl-haupt:disabled{opacity:.6}
.tl-zweit{width:100%;border:1.5px solid #191614;background:#fff;color:#191614;border-radius:100px;padding:13px 18px;font:500 15px 'Poppins',sans-serif;cursor:pointer;margin-top:14px}
.tl-fid{width:22px;height:22px;display:inline-block;background:no-repeat center/contain url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.7' stroke-linecap='round'><path d='M4 8V6a2 2 0 0 1 2-2h2M16 4h2a2 2 0 0 1 2 2v2M20 16v2a2 2 0 0 1-2 2h-2M8 20H6a2 2 0 0 1-2-2v-2'/><path d='M9 9v1.5M15 9v1.5M12 9v4h-1M9.5 16c1.5 1 3.5 1 5 0'/></svg>")}
.tl-klein{font-size:13.5px;color:#8b7f76;text-align:center;margin:14px 0 0}
.tl-link{margin-top:14px;font-size:14px}
.tl-link summary{cursor:pointer;color:#8b7f76;text-align:center;list-style:none}
.tl-link summary::-webkit-details-marker{display:none}
.tl-link input{margin:10px 0 8px}
.tl-link button{width:100%;border:1.5px solid #191614;background:#fff;border-radius:100px;padding:11px;font:500 14.5px 'Poppins',sans-serif;cursor:pointer}
.tl-fuss{font-family:'Poppins',sans-serif;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:#c4b8ae;margin-top:22px}
.tl-schritte{list-style:none;padding:0;margin:0 0 6px;counter-reset:s}
.tl-schritte li{counter-increment:s;position:relative;padding:0 0 18px 42px}
.tl-schritte li::before{content:counter(s);position:absolute;left:0;top:-2px;width:28px;height:28px;border-radius:50%;border:1.5px solid #191614;display:flex;align-items:center;justify-content:center;font:500 14px 'Poppins',sans-serif}
.tl-schritte li.fertig::before{content:'✓';background:#191614;color:#fff}
.tl-schritte b{display:block;font-family:'Poppins',sans-serif;font-weight:500;margin-bottom:3px}
.tl-schritte span{display:block;font-size:14px;color:#6f645c;margin-bottom:8px}
.tl-teilen{display:inline-block;width:16px;height:16px;vertical-align:-2px;background:no-repeat center/contain url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23007aff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M12 3v12M8 7l4-4 4 4'/><path d='M6 11H5a1 1 0 0 0-1 1v8a1 1 0 0 0 1 1h14a1 1 0 0 0 1-1v-8a1 1 0 0 0-1-1h-1'/></svg>")}

/* Mitarbeiter-Portal */
.tp{min-height:100%;display:flex;flex-direction:column;max-width:760px;margin:0 auto}
.tp-kopf{display:flex;align-items:center;gap:12px;padding:calc(12px + env(safe-area-inset-top)) 18px 12px;background:#fffdfb;border-bottom:1px solid #eadfd6;position:sticky;top:0;z-index:5}
.tp-mr{width:34px;height:34px;border:1px solid #e5dad0;border-radius:6px}
.tp-gruss{flex:1;min-width:0;display:flex;flex-direction:column}
.tp-gruss span{font-family:'Poppins',sans-serif;font-size:17px;font-weight:500}
.tp-gruss small{font-size:12.5px;color:#8b7f76}
.tp-wort{height:30px;width:auto;opacity:.9}
.tp-offline{background:#f4ede6;color:#8b7f76;text-align:center;font-size:13px;padding:6px}
.tp-inhalt{flex:1 1 auto;padding:16px 16px 24px}
.tp-tabs{position:sticky;bottom:0;display:flex;background:#fffdfb;border-top:1px solid #eadfd6;padding-bottom:env(safe-area-inset-bottom)}
.tp-tab{flex:1;border:0;background:none;padding:9px 0 7px;display:flex;flex-direction:column;align-items:center;gap:3px;color:#af9f94;font:300 10.5px 'Poppins',sans-serif;letter-spacing:.06em;text-transform:uppercase;cursor:pointer}
.tp-tab svg{width:26px;height:26px}
.tp-tab.aktiv{color:#191614;font-weight:600}
.tp-tab.aktiv::after{content:'';width:4px;height:4px;border-radius:50%;background:#e8a0b4}
.tp-karte{background:#fff;border:1px solid #eadfd6;border-radius:12px;padding:16px;margin:0 0 14px;box-shadow:0 1px 3px rgba(74,56,42,.05)}
.tp-karte h2{font-family:'Poppins',sans-serif;font-weight:500;font-size:14px;letter-spacing:.12em;text-transform:uppercase;margin:0 0 12px}
.tp-gross{width:100%;display:flex;align-items:center;justify-content:center;gap:10px;border:0;background:#ffc0cb;color:#191614;border-radius:100px;padding:16px;font:500 16.5px 'Poppins',sans-serif;letter-spacing:.03em;margin:0 0 16px;cursor:pointer;box-shadow:0 6px 18px rgba(232,160,180,.35)}
.tp-gross span{font-size:22px;line-height:1}
.tp-gross:disabled{opacity:.5;box-shadow:none}
.tp-hinweis{background:#f9e8ed;color:#a5566d;border-radius:10px;padding:11px 14px;font-size:14px;margin:0 0 14px}
.tp-monat{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.tp-monat h2{margin:0;text-align:center;flex:1}
.tp-pfeil{width:38px;height:38px;border-radius:50%;border:1px solid #eadfd6;background:#fff;font-size:20px;cursor:pointer;color:#191614}
.tp-pfeil:disabled{opacity:.3}
.tp-summen{display:flex;gap:8px;margin:4px 0 12px}
.tp-summen>div{flex:1;background:#f4ede6;border-radius:10px;padding:10px 6px;text-align:center}
.tp-summen b{display:block;font:300 22px 'Poppins',sans-serif}
.tp-summen span{font-size:11.5px;color:#8b7f76}
.tp-liste{list-style:none;margin:0;padding:0}
.tp-zeile{display:grid;grid-template-columns:auto 1fr auto auto;gap:2px 10px;align-items:center;padding:10px 2px;border-top:1px solid #f1e8e0;font-size:14.5px}
.tp-zeile:first-child{border-top:0}
.tp-tag{font-weight:600;min-width:84px}
.tp-kat{font-size:12px;border-radius:100px;padding:2px 9px;justify-self:start;background:#f4ede6;color:#6f645c}
.tp-zeile.urlaub .tp-kat{background:#f9e8ed;color:#a5566d}
.tp-zeile.krank .tp-kat{background:#fbefe0;color:#9a6a2c}
.tp-zeile.feiertag .tp-kat{background:#ece8f6;color:#5e4f8a}
.tp-zeit{grid-column:1/3;font-size:13.5px;color:#6f645c}
.tp-zeile .tp-kat{grid-column:2}
.tp-std{grid-column:3;grid-row:1/3;font:300 18px 'Poppins',sans-serif}
.tp-schloss{grid-column:4;grid-row:1/3;font-size:12px;opacity:.55}
.tp-notiz{grid-column:1/-1;font-size:12.5px;color:#8b7f76;font-style:italic}
.tp-leer{color:#8b7f76;text-align:center;padding:14px 0;margin:0}
.tp-chips{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px}
.tp-chip{border:1px solid #e8a0b4;background:#f9e8ed;color:#a5566d;border-radius:100px;padding:6px 12px;font-size:13px;cursor:pointer}
.tp-zwei{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.tp-ergibt{min-height:22px;margin:4px 0 12px;font-size:15px}
.tp-ergibt .warn{display:block;color:#b0483f;font-size:13px;margin-top:3px}
.tp-bestaetigung{background:#f4ede6;border-radius:12px;padding:14px;text-align:center;font-size:15px;margin-bottom:10px}
.tp-bestaetigung .tp-gesamt{font:300 30px 'Poppins',sans-serif;margin-top:6px}
.tp-urlaubskonto{text-align:center}
.tp-ring{width:132px;height:132px;margin:2px auto 14px;border-radius:50%;border:2px solid #ffc0cb;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:inset 0 0 0 6px #fdf3f5}
.tp-ring b{font:300 44px/1 'Poppins',sans-serif}
.tp-ring span{font-size:12px;color:#8b7f76;margin-top:4px;text-transform:uppercase;letter-spacing:.1em}
.tp-antraege{list-style:none;margin:0;padding:0}
.tp-antrag{border-top:1px solid #f1e8e0;padding:12px 0}
.tp-antrag:first-child{border-top:0;padding-top:2px}
.tp-ak{display:flex;justify-content:space-between;gap:10px;align-items:center}
.tp-st{font-size:12px;border-radius:100px;padding:3px 10px;background:#f4ede6;color:#6f645c;white-space:nowrap}
.st-genehmigt>.tp-ak .tp-st{background:#e3efe3;color:#4d6d4f}
.st-abgelehnt>.tp-ak .tp-st{background:#f6e1df;color:#b0483f}
.st-offen>.tp-ak .tp-st{background:#fbefe0;color:#9a6a2c}
.st-zurueckgezogen,.st-storniert,.st-geaendert{opacity:.6}
.tp-ad{font-size:13.5px;color:#6f645c;margin-top:3px}
.tp-antwort{font-size:13.5px;margin-top:6px;background:#f4ede6;border-radius:8px;padding:8px 10px}
.tp-folge{font-size:13px;margin-top:6px;padding-left:10px;border-left:2px solid #e8a0b4;color:#6f645c}
.tp-ak-knoepfe{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.tp-ak-knoepfe button,.tp-knopf{border:1.5px solid #191614;background:#fff;color:#191614;border-radius:100px;padding:8px 14px;font:500 13.5px 'Poppins',sans-serif;cursor:pointer}
.tp-knopf{padding:11px 18px;font-size:14.5px}
.tp-knopf.haupt{background:#ffc0cb;border-color:#ffc0cb}
.tp-knopf.leise{border-color:#d9cfc6;color:#6f645c}
.tp-knopf.breit{width:100%;margin-bottom:20px}
.tp-reihe{display:flex;gap:8px;flex-wrap:wrap}
.tp-ok{color:#4d6d4f;font-weight:600;margin:0 0 10px}
.tp-daten{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:0;font-size:15px}
.tp-daten dt{color:#8b7f76}
.tp-daten dd{margin:0}
.tp-select{max-width:260px}

/* Admin: Abgleich-Anzeige, Anträge, Zugänge */
.team-sync{display:flex;align-items:center;gap:6px;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.12);color:inherit;border-radius:100px;padding:4px 10px;font-size:11.5px;cursor:pointer;white-space:nowrap}
:root[data-design="exclusive"] .team-sync{border-color:#eadfd6;background:#fff;color:#8b7f76}
.ts-punkt{width:8px;height:8px;border-radius:50%;background:#5d9c63}
.team-sync[data-z="wartet"] .ts-punkt{background:#c79a3c;animation:tsPuls 1s ease infinite}
.team-sync[data-z="offline"] .ts-punkt,.team-sync[data-z="fehler"] .ts-punkt{background:#b0483f}
@keyframes tsPuls{50%{opacity:.35}}
@media(max-width:420px){ .team-sync .ts-text{display:none} .team-sync{padding:6px} }
.tab{position:relative}
.team-badge{position:absolute;top:4px;left:calc(50% + 6px);min-width:18px;height:18px;border-radius:9px;background:#e8a0b4;color:#191614;font:600 11px/18px 'Poppins',sans-serif;text-align:center;padding:0 5px}
.team-inbox{border-color:#e8a0b4 !important}
.team-zahl{background:#ffc0cb;color:#191614;border-radius:100px;font-size:12px;padding:1px 9px;letter-spacing:0}
.ti-antrag{border-top:1px solid var(--rand);padding:12px 0}
.ti-antrag:first-of-type{border-top:0;padding-top:0}
.ti-kopf{display:flex;justify-content:space-between;align-items:center;gap:8px}
.ti-art{font-size:12px;border-radius:100px;padding:2px 10px;background:#fbefe0;color:#9a6a2c;white-space:nowrap}
.ti-art.ti-storno{background:#f6e1df;color:#b0483f}
.ti-art.ti-aenderung{background:#ece8f6;color:#5e4f8a}
.ti-zeit{font-size:15px;margin-top:3px}
.ti-bezug,.ti-notiz{font-size:13.5px;color:var(--grau);margin-top:2px}
.ti-knoepfe{display:flex;gap:8px;margin-top:10px}
.ti-knoepfe button{flex:1;border:1.5px solid var(--text);background:var(--karte);color:var(--text);border-radius:100px;padding:10px;font-weight:600;font-size:14.5px;cursor:pointer}
.ti-knoepfe .ti-ja{background:#ffc0cb;border-color:#ffc0cb;color:#191614}
.team-karte h2{margin-bottom:8px}
.tk-knoepfe{display:flex;flex-direction:column;gap:8px}
.tk-knoepfe .paste-btn{margin:0}
.tz-liste{display:flex;flex-direction:column;margin:6px 0 10px}
.tz-zeile{display:grid;grid-template-columns:1fr auto;gap:4px 10px;align-items:center;padding:11px 0;border-top:1px solid var(--rand)}
.tz-zeile:first-child{border-top:0}
.tz-name b{font-size:15px}
.tz-chips{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}
.tz-chip{font-size:11.5px;border-radius:100px;padding:2px 8px;background:var(--hell);color:var(--grau)}
.tz-chip.gruen{background:#e3efe3;color:#4d6d4f}
.tz-chip.gelb{background:#fbefe0;color:#9a6a2c}
.tz-chip.rot{background:#f6e1df;color:#b0483f}
.tz-aktionen{display:flex;gap:6px}
.tz-aktionen button{border:1.5px solid var(--text);background:var(--karte);color:var(--text);border-radius:100px;padding:7px 12px;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap}
.tz-aktionen .tz-mehr{padding:7px 11px}
.tz-erin{grid-column:1/-1;font-size:12.5px;color:var(--grau);display:flex;align-items:center;gap:6px}
.team-schalter{display:flex;align-items:center;gap:10px;font-weight:600}
.team-schalter input,.tz-erin input{width:20px;height:20px;accent-color:#191614}

@media(prefers-color-scheme:dark){
  #teamRoot{background:#141110;color:#f0e9e3}
  .tl-karte,.tp-karte,.team-dialog-box{background:#1d1917;border-color:#332c27;color:#f0e9e3}
  .tl-marke img,.tp-wort{filter:invert(.92) sepia(.06)}
  .tp-kopf,.tp-tabs{background:#181412;border-color:#332c27}
  .tp-summen>div,.tp-bestaetigung,.tp-antwort{background:#262019}
  .tp-zeile,.tp-antrag{border-color:#2b2420}
  .tl-haupt{background:#f0e9e3;color:#191614}
  .tl-fid{filter:invert(1)}
  .tl-zweit,.tl-link button,.tp-ak-knoepfe button,.tp-knopf,.team-dialog-knoepfe button{background:transparent;color:#f0e9e3;border-color:#f0e9e3}
  .tp-knopf.haupt,.team-dialog-knoepfe button.haupt{background:#ffc0cb;color:#191614;border-color:#ffc0cb}
  .tp-pfeil{background:transparent;color:#f0e9e3;border-color:#332c27}
  .tp-tab.aktiv{color:#f0e9e3}
}

/* ============================================================
   WEB-ANSICHT (Computer/Tablet quer): Seitenleiste statt Tab-Leiste, breite Inhalte
   ============================================================ */
@media (min-width:1024px){
  body:not(.team-vollbild){display:grid !important;grid-template-columns:236px minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);grid-template-areas:"nav top" "nav main"}
  body:not(.team-vollbild) > .topbar{grid-area:top;padding:14px 28px}
  body:not(.team-vollbild) > main{grid-area:main;max-width:none;padding:22px 32px 40px}
  body:not(.team-vollbild) > .tabbar{grid-area:nav;flex-direction:column;justify-content:flex-start;gap:2px;padding:22px 14px;border-top:0;border-right:1px solid var(--rand);box-shadow:none;overflow-y:auto}
  body:not(.team-vollbild) > .tabbar::before{content:'';display:block;height:64px;margin:0 6px 18px;background:no-repeat center/contain url('icons/exclusive-wordmark.png')}
  :root:not([data-design="exclusive"]) body:not(.team-vollbild) > .tabbar::before{background-image:url('icons/icon-192.png');height:44px}
  body:not(.team-vollbild) .tab{flex:0 0 auto;flex-direction:row;justify-content:flex-start;gap:12px;padding:11px 14px;border-radius:10px;font-size:14px !important;text-transform:none;letter-spacing:.01em}
  body:not(.team-vollbild) .tab .ti{width:22px;height:22px}
  body:not(.team-vollbild) .tab:hover{background:var(--hell)}
  body:not(.team-vollbild) .tab.active{background:var(--hell)}
  :root[data-design="exclusive"] body:not(.team-vollbild) .tab.active{background:#f9e8ed;color:#191614}
  body:not(.team-vollbild) .tab.active::after{display:none}
  body:not(.team-vollbild) .team-badge{position:static;margin-left:auto}
  body:not(.team-vollbild) > main{display:block}
  main > .view{max-width:1240px;margin:0 auto;width:100%;flex:none;height:auto;min-height:0}
  .fab{right:40px;bottom:36px}
  .status{left:50%;right:auto;transform:translateX(-50%);bottom:30px;max-width:560px}
  .team-toast{bottom:30px}
  .modal{align-items:center}
  .modal .sheet{border-radius:16px;max-width:640px}
  /* Kalender: Monat links, Tagesdetail rechts */
  #view-kalender:not([hidden]){display:grid;grid-template-columns:minmax(0,1.6fr) minmax(320px,1fr);column-gap:28px;align-items:start}
  #view-kalender > *{grid-column:1}
  #view-kalender > #dayPanel{grid-column:2;grid-row:1 / span 8;position:sticky;top:0;max-height:calc(100vh - 120px);overflow:auto}
  /* Übersichten zweispaltig */
  #dashboard{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 20px;align-items:start}
  #dashboard > .ex-hero,#dashboard > .ds-warn,#dashboard > #diagStart{grid-column:1/-1}
  #view-einst:not([hidden]),#view-calc:not([hidden]){display:block;column-count:2;column-gap:22px}
  #view-einst .card,#view-calc .card,#view-einst .sec-label,#view-calc .sec-label,#teamKarte{break-inside:avoid}
  #view-einst > #teamKarte{column-span:all;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 22px;align-items:start}
  #teamKarte > .sec-label{grid-column:1/-1}
  #view-urlaub .url-liste{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:14px}
  /* Portal am Computer: zentriert, Tabs oben */
  .tp{max-width:980px;padding:0 24px}
  .tp-kopf{order:-2;border:0;background:transparent;position:static;padding-top:24px}
  .tp-tabs{order:-1;position:static;border:1px solid #eadfd6;border-radius:100px;background:#fff;margin:0 0 6px;padding:4px}
  .tp-tab{flex-direction:row;justify-content:center;gap:8px;border-radius:100px;font-size:12.5px}
  .tp-tab svg{width:20px;height:20px}
  .tp-tab.aktiv{background:#f9e8ed}
  .tp-tab.aktiv::after{display:none}
  .tp-inhalt{padding:16px 0 40px}
  .team-toast{bottom:30px}
}
.tl-schritte span.tl-teilen{display:inline-block;margin:0 2px}
.tp-zwei>*{min-width:0}
.tp-zwei input{min-width:0;width:100%;padding-left:10px;padding-right:8px}