:root{
  --bg:#fbf6ec; --card:#fffdf8; --ink:#3a3a3a; --muted:#8a8478; --line:#e6dfd0; --side:#ffffff; --banner:#a9cdd2;
  --cols:7;
}
body.dark{ --bg:#1f1d24; --card:#2a2832; --ink:#ece9f2; --muted:#9a96a8; --line:#3d3a48; --side:#25232c; --banner:#4b6a73; }
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{background:var(--bg);color:var(--ink);font:14px/1.35 "Segoe UI",system-ui,-apple-system,sans-serif}
button,input,select{font:inherit;color:inherit}
.app{display:grid;grid-template-columns:288px 1fr;height:100vh;height:100dvh}
aside{background:var(--side);padding:18px 16px;overflow:auto;border-right:1px solid var(--line)}
main{display:flex;flex-direction:column;min-width:0;height:100vh;height:100dvh}
.banner{background:var(--banner);color:#fff;text-align:center;letter-spacing:.35em;font-weight:600;padding:26px 8px;border-radius:6px;margin-bottom:14px}
.pill{background:#f5b7b7;border-radius:4px;text-align:center;padding:6px;margin-bottom:6px;font-size:12px}
.pill b{display:block;font-size:11px;letter-spacing:.2em}
.mini{margin:14px 0}
.mini-head{display:flex;align-items:center;gap:4px;margin-bottom:6px}
.mini-head select{flex:1;border:1px solid var(--line);background:var(--card);border-radius:6px;padding:4px}
.iconbtn{border:1px solid var(--line);background:var(--card);border-radius:8px;padding:5px 10px;cursor:pointer}
.iconbtn:hover{filter:brightness(.96)}
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;text-align:center;font-size:12px}
.cal .dow{color:var(--muted);font-size:10px;letter-spacing:.1em;padding:2px 0}
.cal button{border:0;background:none;border-radius:50%;aspect-ratio:1;cursor:pointer}
.cal button.out{color:var(--muted);opacity:.5}
.cal button.inweek{background:#f7d9cf;border-radius:4px}
body.dark .cal button.inweek{background:#4a3a44}
.cal button.today{outline:2px solid #e98f8f}
.cal button:hover{background:#ece3d0}
h4{letter-spacing:.25em;font-size:11px;margin:18px 0 8px;text-transform:uppercase}
.bar{height:22px;background:var(--line);border-radius:4px;overflow:hidden;position:relative}
.bar i{display:block;height:100%;background:#e8d98e;transition:width .3s}
.barrow{display:flex;align-items:center;gap:10px}.barrow .bar{flex:1}.barrow b{min-width:48px;text-align:right}
.topbar{display:flex;align-items:center;gap:8px;padding:12px 16px;flex-wrap:wrap;touch-action:pan-y}
.topbar h2{margin:0;font-size:16px;letter-spacing:.12em;flex:1;min-width:140px}
.topbar .menu{display:none}
.board{flex:1;overflow-x:auto;overflow-y:auto;display:flex;gap:2px;padding:0 16px 16px;scroll-snap-type:x mandatory}
.day{flex:0 0 calc((100% - (var(--cols) - 1) * 2px) / var(--cols));min-width:150px;scroll-snap-align:start;background:var(--card);border-right:1px dashed var(--line);display:flex;flex-direction:column}
.day.today .dh{box-shadow:inset 0 -3px 0 #e98f8f}
.day.sel{background:color-mix(in srgb,var(--c) 14%,var(--card));box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--c) 100%,black 18%)}
.cal button.sel{background:#e98f8f;color:#fff}
.addev{display:flex;flex-wrap:wrap;gap:3px;padding:4px 6px;border-bottom:1px dotted var(--line);align-items:center}
.addev select,.addev input{border:1px solid var(--line);background:var(--card);border-radius:5px;padding:2px;font-size:12px;min-width:0}
.addev input{flex:1 1 70px}
.addev button{border:0;background:color-mix(in srgb,var(--c) 100%,black 10%);color:#fff;border-radius:5px;cursor:pointer;padding:2px 8px}
.dh{background:var(--c);text-align:center;padding:10px 4px 2px;letter-spacing:.3em;font-weight:700;font-size:12px;text-transform:uppercase;color:#4a3f3f}
.dd{background:color-mix(in srgb,var(--c) 55%,white);text-align:center;font-weight:600;padding:5px;font-size:12px;color:#4a3f3f}
body.dark .dh,body.dark .dd{color:#201d25}
.focus{padding:10px 8px 14px;text-align:center}
.focus small{display:block;font-style:italic;color:var(--muted);margin-bottom:4px}
.focus input{width:100%;border:0;background:none;text-align:center;font-weight:600;padding:2px}
.sec{background:color-mix(in srgb,var(--c) 40%,white);text-align:center;letter-spacing:.3em;font-size:11px;padding:4px;font-weight:600;text-transform:uppercase;color:#4a3f3f}
body.dark .sec{background:color-mix(in srgb,var(--c) 55%,#2a2832);color:#201d25}
.ev{display:flex;gap:6px;padding:3px 8px;font-size:12px;border-bottom:1px dotted var(--line)}
.ev span{color:var(--muted);white-space:nowrap}
.ev .x,.task .x{margin-left:auto;opacity:0;cursor:pointer;border:0;background:none;color:var(--muted)}
.ev:hover .x,.task:hover .x{opacity:1}
.add{width:100%;border:0;border-bottom:1px dotted var(--line);background:none;padding:4px 8px;font-size:12px;color:var(--muted)}
.add:focus{outline:none;background:color-mix(in srgb,var(--c) 18%,transparent);color:var(--ink)}
.prog{padding:4px 6px}
.prog .bar{height:14px;background:color-mix(in srgb,var(--c) 30%,var(--card))}
.prog .bar i{background:color-mix(in srgb,var(--c) 100%,black 15%)}
.prog .bar em{position:absolute;right:6px;top:-1px;font-size:10px;font-style:normal}
.task{display:flex;align-items:center;gap:8px;padding:5px 8px;border-bottom:1px dotted var(--line)}
.task input[type=checkbox]{appearance:none;width:15px;height:15px;border:1.5px solid var(--muted);border-radius:3px;flex:none;cursor:pointer;display:grid;place-items:center;background:var(--card)}
.task input[type=checkbox]:checked{background:color-mix(in srgb,var(--c) 100%,black 18%);border-color:transparent}
.task input[type=checkbox]:checked::after{content:"✓";font-size:11px;color:#fff;line-height:1}
.task.done span.t{text-decoration:line-through;color:var(--muted)}
.todo .task{--c:#cfc9bb}
.dim{color:var(--muted);font-size:12px}
.t,[data-edit]{cursor:pointer}
.day.over{outline:2px dashed color-mix(in srgb,var(--c) 100%,black 25%);outline-offset:-2px}
[draggable=true]{cursor:grab}
.edit{flex-wrap:wrap;gap:4px;background:color-mix(in srgb,var(--c) 22%,var(--card));padding:6px}
.ev.edit{display:flex;align-items:center}
.edit input.ed{flex:1 1 90px;min-width:0;border:1px solid var(--line);border-radius:5px;padding:3px 5px;background:var(--card)}
.edit select{border:1px solid var(--line);border-radius:5px;background:var(--card);padding:2px;font-size:12px;min-width:0}
.edit .row2{display:flex;gap:4px;width:100%;align-items:center}
.edit .row2 select.mv{flex:1}
.edit .ok{border:0;background:color-mix(in srgb,var(--c) 100%,black 15%);color:#fff;border-radius:5px;padding:3px 9px;cursor:pointer}
.edit .no{border:0;background:none;cursor:pointer;color:var(--muted)}
dialog{border:0;border-radius:14px;padding:20px;max-width:460px;width:92%;background:var(--card);color:var(--ink);box-shadow:0 10px 40px #0004}
dialog::backdrop{background:#0006}
.themes{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0 14px}
.theme{border:2px solid transparent;border-radius:10px;padding:6px;cursor:pointer;background:var(--bg)}
.theme.on{border-color:#e98f8f}
.theme div{display:flex;gap:2px;margin-bottom:4px}.theme div i{width:14px;height:14px;border-radius:3px}
.row{display:grid;grid-template-columns:70px 44px 1fr;gap:8px;align-items:center;margin:5px 0}
.row input[type=color]{width:40px;height:30px;border:0;padding:0;background:none}
.row input[type=text],.f input,.f select{border:1px solid var(--line);border-radius:6px;padding:5px;background:var(--bg);width:100%}
.f{display:grid;grid-template-columns:110px 1fr;gap:8px;align-items:center;margin:6px 0}
.hint{background:#fff4c9;color:#5c4b00;border-radius:8px;padding:6px 10px;font-size:12px;margin:0 16px 8px}
@media (max-width:1250px){:root{--cols:5}}
@media (max-width:1000px){:root{--cols:3}}
@media (max-width:900px){
  .app{grid-template-columns:1fr}
  aside{position:fixed;inset:0 25% 0 0;z-index:5;transform:translateX(-105%);transition:transform .25s;box-shadow:4px 0 20px #0003}
  aside.open{transform:none}
  .topbar .menu{display:inline-block}
}
@media (max-width:640px){:root{--cols:1}}
/* iOS standalone: keep content out of the notch / home bar */
body{padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
.app{height:calc(100vh - env(safe-area-inset-top) - env(safe-area-inset-bottom));height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom))}
main{height:100%}
html{-webkit-text-size-adjust:100%}
@media (pointer:coarse){input,select{font-size:16px}} /* stops iPad Safari from zooming in when a field is focused */


/* ===== v2: habits, repeating events, copy/move, export ===== */
.rep{color:var(--muted);font-weight:400;margin-left:4px}
.lnk{border:0;background:none;color:#3b6e99;cursor:pointer;text-decoration:underline;padding:0;font-size:12px}
.edit .seg label{margin-right:8px;cursor:pointer}
.edit .hintline{font-size:11px;color:var(--muted)}
.addev button.rp{background:none;color:var(--ink);border:1px solid var(--line)}

/* habits */
#habits{margin-top:4px}
.hgrid{display:grid;grid-template-columns:minmax(0,1fr) repeat(7,17px) 32px;gap:2px;align-items:center;padding:3px 0;border-bottom:1px dotted var(--line)}
.hhead{border-bottom:0}
.hd{font-size:10px;text-align:center;background:var(--c);border-radius:3px;color:#4a3f3f;line-height:16px}
body.dark .hd{color:#201d25}
.hd.sel{outline:2px solid #e98f8f}
.hn{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}
.hp{font-size:10px;text-align:right;color:var(--muted);font-weight:600}
.hc{position:relative;display:block;width:17px;height:17px}
.hc input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer;width:100%;height:100%}
.hc i{display:block;width:100%;height:100%;border-radius:4px;border:1.5px solid color-mix(in srgb,var(--c) 100%,black 15%);background:color-mix(in srgb,var(--c) 25%,var(--card))}
.hc input:checked+i{background:color-mix(in srgb,var(--c) 100%,black 15%)}
.hc input:checked+i::after{content:"✓";color:#fff;font-size:11px;display:grid;place-items:center;height:100%;line-height:1}

/* dialogs */
.dlgbtns{display:flex;gap:8px;margin-top:14px;align-items:center}
.iconbtn.primary{background:#a9cdd2;border-color:transparent;color:#22464b;font-weight:600}
.iconbtn.danger{color:#c0504d}
.iconbtn:disabled{opacity:.4;cursor:not-allowed}
.f .inl,.inl{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.f.inl{display:grid}
.f .inl select,.f .inl input[type=date],.f.inl input[type=date]{width:auto}
.f input[type=radio],.f input[type=checkbox],.f .chip input{width:auto}
.chips{display:flex;gap:4px;flex-wrap:wrap}
.chip{position:relative}
.chip input{position:absolute;opacity:0;pointer-events:none}
.chip span{display:inline-block;padding:3px 8px;border:1px solid var(--line);border-radius:12px;cursor:pointer;font-size:12px;background:var(--card)}
.chip input:checked+span{background:#f7b2a6;border-color:transparent;color:#4a3f3f}
.opt{margin:6px 0}
.opt label{cursor:pointer}

/* print / PDF */
#printRoot{display:none}
@media print{
  @page{size:A4 landscape;margin:8mm}
  html,body{background:#fff!important;height:auto!important;overflow:visible!important;padding:0!important}
  .app,dialog{display:none!important}
  *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  #printRoot{display:block;color:#2b2b2b;font:9pt/1.3 "Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif}
  .pp{break-after:page;page-break-after:always}
  .pp:last-child{break-after:auto;page-break-after:auto}
  .pp header{display:flex;justify-content:space-between;align-items:baseline;background:#a9cdd2;color:#fff;padding:3mm 5mm;border-radius:2mm;margin-bottom:3mm}
  .pp header b{letter-spacing:.35em;font-size:12pt}
  .pp header span{font-size:10pt;letter-spacing:.08em}
  .pgrid{display:grid;grid-template-columns:repeat(7,1fr);border:1px solid #e6dfd0}
  .pc{border-right:1px dashed #d9d2c2;min-height:70mm;padding-bottom:3px;min-width:0}
  .pc:last-child{border-right:0}
  .ph{background:var(--c);text-align:center;font-weight:700;letter-spacing:.18em;text-transform:uppercase;font-size:7.5pt;padding:4px 2px 1px;color:#4a3f3f}
  .pd{background:color-mix(in srgb,var(--c) 55%,white);text-align:center;font-size:7.5pt;padding:2px;color:#4a3f3f}
  .pf{font-style:italic;text-align:center;padding:4px 3px;font-size:8.5pt;font-weight:600}
  .ps{background:color-mix(in srgb,var(--c,#cfc9bb) 40%,white);letter-spacing:.2em;text-transform:uppercase;font-size:6.5pt;text-align:center;padding:2px;font-weight:600;margin-top:3px;color:#4a3f3f}
  .pe{padding:2px 4px;border-bottom:1px dotted #ddd;font-size:8pt}
  .pe b{color:#777;font-weight:600;margin-right:2px}
  .pt{display:flex;gap:4px;padding:2px 4px;border-bottom:1px dotted #ddd;font-size:8pt;align-items:flex-start}
  .pt i{flex:none;width:9px;height:9px;border:1px solid #888;border-radius:2px;font-size:7pt;line-height:8px;text-align:center;font-style:normal;margin-top:1px}
  .pt.d span{text-decoration:line-through;color:#888}
  .pt.d i{background:#cfc9bb;border-color:#cfc9bb;color:#fff}
  .pn{color:#aaa;text-align:center;font-size:8pt}
  .pbottom{display:grid;grid-template-columns:1fr 1fr;gap:8mm;margin-top:5mm}
  .pb table{width:100%;border-collapse:collapse;font-size:8pt}
  .pb td,.pb th{border-bottom:1px dotted #ddd;padding:2px 3px;text-align:left}
  .pb .c{text-align:center}
}

/* ===== v3: day-colored sidebar, file chip, duplicate, daily sheet ===== */
.x.dup{margin-left:auto}
.x.dup+.x{margin-left:2px}
.ev .x.dup,.task .x.dup{font-size:12px}

/* the sidebar calendar follows the active day's color (--ac is set from JS) */
#side{--ac:#f6c7a0}
.pill{background:color-mix(in srgb,var(--ac) 75%,white);color:#3a3030;transition:background .25s}
.pill.end{background:color-mix(in srgb,var(--ac) 45%,white)}
body.dark .pill{color:#201d25}
.mini .mini-head select{border-color:color-mix(in srgb,var(--ac) 70%,var(--line))}
.mini .cal button.inweek{background:color-mix(in srgb,var(--ac) 40%,var(--card));transition:background .25s}
body.dark .mini .cal button.inweek{background:color-mix(in srgb,var(--ac) 30%,var(--card))}
.mini .cal button.today{outline:2px solid color-mix(in srgb,var(--ac) 100%,black 25%)}
.mini .cal button.sel{background:color-mix(in srgb,var(--ac) 100%,black 8%);color:#3a3030;font-weight:700;outline:2px solid color-mix(in srgb,var(--ac) 100%,black 28%)}
body.dark .mini .cal button.sel{color:#201d25}
.mini .cal button:hover{background:color-mix(in srgb,var(--ac) 55%,var(--card))}

/* save-status chip */
.chip2{border-radius:14px;padding:5px 12px;border:1px solid var(--line);cursor:pointer;font-size:12px;background:var(--card)}
.chip2.ok{color:#3d7a4f;border-color:#bfe0c7;background:color-mix(in srgb,#c4e6c8 35%,var(--card))}
.chip2.warn{color:#8a5a00;border-color:#ecd28a;background:#fff4c9}
body.dark .chip2.warn{color:#f1d78a;background:#4a4223}
body.dark .chip2.ok{color:#9fd8ae}
.big{font-size:15px;margin:4px 0}
#dlgFile hr{border:0;border-top:1px solid var(--line);margin:14px 0 10px}
.modes{display:flex;gap:16px;margin-bottom:10px}
.modes label{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:6px 10px}

/* daily to-do sheet (print) */
@media print{
  .dayp{display:flex;flex-direction:column;min-height:190mm}
  .dhd{display:flex;justify-content:space-between;align-items:baseline;background:var(--c);color:#3a3030;padding:4mm 6mm;border-radius:2mm}
  .dhd b{font-size:20pt;letter-spacing:.22em;text-transform:uppercase}
  .dhd span{font-size:12pt}
  .dfocus{font-size:13pt;font-weight:600;font-style:italic;text-align:center;padding:4mm 0 2mm}
  .dfocus small{font-weight:400;color:#777;margin-right:4px}
  .dgrid{display:grid;grid-template-columns:5fr 7fr;gap:8mm;margin-top:4mm;flex:1}
  .dgrid.one{grid-template-columns:1fr}
  .ds{background:color-mix(in srgb,var(--c) 45%,white);text-align:center;letter-spacing:.25em;text-transform:uppercase;font-size:8.5pt;font-weight:600;padding:2mm;margin-bottom:1mm;color:#4a3f3f}
  .de{display:flex;gap:3mm;padding:2.2mm 1mm;border-bottom:1px dotted #bbb;font-size:11pt}
  .de b{flex:none;min-width:14mm;color:#777;font-weight:600}
  .dt{display:flex;gap:3mm;align-items:flex-start;padding:2.6mm 1mm;border-bottom:1px dotted #bbb;font-size:11.5pt;min-height:9.5mm}
  .dt i{flex:none;width:4.2mm;height:4.2mm;border:1.2px solid #777;border-radius:1mm;font-size:9pt;line-height:4mm;text-align:center;font-style:normal;margin-top:.6mm}
  .dt.d span{text-decoration:line-through;color:#888}
  .dt.d i{background:var(--c);border-color:var(--c);color:#3a3030}
  .dn{color:#aaa;text-align:center;padding:2mm}
  .dfoot{text-align:center;letter-spacing:.4em;font-size:8pt;color:#aaa;margin-top:4mm}
}

.tip{margin:8px 0;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:8px 12px;font-size:13px}
.tip summary{cursor:pointer;font-weight:600}
.tip ol{margin:6px 0 2px;padding-left:20px}

/* ===== v4: KW (Kalenderwoche) ===== */
.kw{display:inline-block;background:color-mix(in srgb,var(--ac,#f6c7a0) 60%,var(--card));border-radius:8px;padding:2px 9px;margin-right:6px;letter-spacing:.08em}
.cal{grid-template-columns:26px repeat(7,1fr)}
.cal .kwh{font-size:9px;letter-spacing:.05em}
.mini .cal button.kwn{aspect-ratio:auto;border-radius:6px;font-size:10px;color:var(--muted);padding:0}
.mini .cal button.kwn.inweek{color:var(--ink);font-weight:700}

/* lab book items (read-only) */
.ev.lab{background:rgba(99,102,241,.10);border-radius:4px;border-bottom-color:transparent}
.ev.lab .labl{margin-left:auto;text-decoration:none;font-weight:700;color:#4338ca}
body.dark .ev.lab{background:rgba(129,140,248,.16)}
body.dark .ev.lab .labl{color:#a5b4fc}