/* Layout wie das bisherige On-the-Fly-Buch: schmale Arbeitsspalte, oben Lagebericht
   (überfällig/heute), darunter Kategorien als Listen; Bearbeiten im Bottom-Sheet. */
:root{
  --bg:#f4f6f7; --surface:#ffffff; --fg:#17232a; --muted:#5d6d75; --line:#dfe5e8;
  --accent:#1d5e6c; --accent-soft:#e2eef0; --late:#b3261e; --late-soft:#fbe9e7; --today:#9a5b00; --today-soft:#fdf1dc; --done:#3d7a46;
  --sans:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#0f1619; --surface:#172126; --fg:#e4ecef; --muted:#93a4ab; --line:#26343a;
  --accent:#6fb7c6; --accent-soft:#1b3238; --late:#f08a80; --late-soft:#3a1d1b; --today:#e9b45c; --today-soft:#36290f; --done:#7cc189; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0f1619; --surface:#172126; --fg:#e4ecef; --muted:#93a4ab; --line:#26343a;
  --accent:#6fb7c6; --accent-soft:#1b3238; --late:#f08a80; --late-soft:#3a1d1b; --today:#e9b45c; --today-soft:#36290f; --done:#7cc189; color-scheme:dark}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--sans);font-size:15px;line-height:1.45}
[hidden]{display:none!important}
.wrap{max-width:760px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-top:calc(20px + env(safe-area-inset-top,0px));padding-bottom:96px;display:flex;flex-direction:column;gap:18px}
.wrap.narrow{max-width:460px;padding-top:15vh}
header{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 16px}
.head-right{display:flex;align-items:center;gap:8px}
h1{font-size:22px;font-weight:600;margin:0;letter-spacing:-.01em}
.stamp{font-family:var(--mono);font-size:12px;color:var(--muted)}
.iconbtn{border:1px solid var(--line);background:var(--surface);color:var(--fg);border-radius:8px;min-width:34px;height:34px;padding:0 8px;font-size:16px;cursor:pointer}
.tabs{display:flex;gap:4px;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:4px;width:fit-content;max-width:100%;overflow-x:auto}
.tabs button{border:0;background:none;color:var(--muted);font:500 14px var(--sans);padding:6px 12px;border-radius:7px;cursor:pointer;white-space:nowrap}
.tabs button[aria-pressed="true"]{background:var(--accent-soft);color:var(--accent)}
.tabs .n{font-family:var(--mono);font-size:12px;margin-left:4px}
input[type=search]{width:100%;font:15px var(--sans);padding:9px 12px;border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--fg)}
.banner{border:1px solid var(--line);background:var(--surface);border-radius:12px;padding:12px 14px;display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between}
.banner p{margin:0;flex:1 1 260px}
.banner.warn{border-color:var(--today);background:var(--today-soft)}
.alerts{display:flex;flex-direction:column;gap:8px}
.alerts:empty{display:none}
.alert{border-radius:10px;padding:10px 14px;display:flex;flex-direction:column;gap:4px}
.alert h2{margin:0;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.06em}
.alert.late{background:var(--late-soft);color:var(--late)}
.alert.today{background:var(--today-soft);color:var(--today)}
.alert.plan{background:var(--accent-soft);color:var(--accent)}
.alert ul{margin:0;padding-left:18px;color:var(--fg)}
main{display:flex;flex-direction:column;gap:20px}
section.cat{display:flex;flex-direction:column;gap:6px}
section.cat h2{margin:0;font-size:12px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.07em;display:flex;gap:8px}
section.cat h2 .n{font-family:var(--mono)}
.list{background:var(--surface);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.task{display:flex;gap:12px;align-items:flex-start;padding:11px 14px;border-top:1px solid var(--line)}
.task:first-child{border-top:0}
.check{flex:none;width:24px;height:24px;margin-top:1px;border-radius:50%;border:2px solid var(--muted);background:none;cursor:pointer;display:grid;place-items:center;color:var(--surface);font-size:13px}
.check:hover{border-color:var(--done)}
.task.is-done .check{background:var(--done);border-color:var(--done)}
.body{flex:1;min-width:0;cursor:pointer;display:flex;flex-direction:column;gap:3px}
.title{overflow-wrap:anywhere}
.task.is-done .title,.task.is-deleted .title{text-decoration:line-through;color:var(--muted)}
.meta{display:flex;flex-wrap:wrap;gap:6px;font-family:var(--mono);font-size:12px;color:var(--muted)}
.chip{padding:1px 7px;border-radius:5px;background:var(--bg);border:1px solid var(--line)}
.chip.late{color:var(--late);border-color:currentColor;background:var(--late-soft)}
.chip.today{color:var(--today);border-color:currentColor;background:var(--today-soft)}
.chip.vendor{color:var(--accent);background:var(--accent-soft);border-color:transparent}
.chip.locked{color:var(--muted)}
.notes{font-size:13px;color:var(--muted);white-space:pre-wrap;overflow-wrap:anywhere}
.links{display:flex;flex-direction:column;gap:2px;font-size:13px}
.links a{color:var(--accent);overflow-wrap:anywhere}
.status-line{font-size:12px;color:var(--muted);font-family:var(--mono)}
.phone{display:flex;gap:10px;flex-wrap:wrap;align-items:center;font-size:13px}
.phone a{color:var(--accent);font-weight:500}
.empty{padding:28px 16px;text-align:center;color:var(--muted);background:var(--surface);border:1px dashed var(--line);border-radius:12px}
.entry{padding:12px 14px;border-top:1px solid var(--line);cursor:pointer;display:flex;flex-direction:column;gap:4px}
.entry:first-child{border-top:0}
.entry .what{overflow-wrap:anywhere}
.entry dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:2px 10px;font-size:13px;color:var(--muted)}
.entry dt{font-weight:600}
.entry dd{margin:0;overflow-wrap:anywhere}
.fab{position:fixed;right:calc(20px + env(safe-area-inset-right,0px));bottom:calc(20px + env(safe-area-inset-bottom,0px));border:0;border-radius:28px;background:var(--accent);color:var(--surface);font:600 15px var(--sans);padding:14px 20px;box-shadow:0 6px 18px rgba(0,0,0,.18);cursor:pointer}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.scrim{position:fixed;inset:0;background:rgba(10,20,25,.45);display:flex;align-items:flex-end;justify-content:center;z-index:10}
.sheet{background:var(--surface);color:var(--fg);width:100%;max-width:640px;max-height:92%;overflow:auto;border-radius:16px 16px 0 0;padding:18px max(16px,env(safe-area-inset-right,0px)) calc(18px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px));display:flex;flex-direction:column;gap:12px}
.sheet h3{margin:0;font-size:17px}
.field{display:flex;flex-direction:column;gap:4px}
.field label,.field .lbl{font-size:12px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.field input,.field select,.field textarea{font:15px var(--sans);padding:9px 10px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--fg);width:100%}
.field input:disabled,.field textarea:disabled{opacity:.6}
.row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (max-width:460px){.row{grid-template-columns:1fr}.tabs button{padding:6px 8px}}
.linkrow{display:grid;grid-template-columns:auto 1fr auto;gap:6px;align-items:center}
.linkrow input{min-width:0}
.stbtn{border:1px solid var(--line);background:var(--bg);border-radius:8px;padding:6px 8px;cursor:pointer;font-size:15px;color:var(--fg)}
.btns{display:flex;flex-wrap:wrap;gap:8px;justify-content:space-between}
.btns .grp{display:flex;gap:8px;flex-wrap:wrap}
.btn{display:inline-block;text-decoration:none;border:1px solid var(--line);background:var(--bg);color:var(--fg);font:500 14px var(--sans);padding:9px 14px;border-radius:8px;cursor:pointer}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--surface)}
.btn.danger{color:var(--late)}
.btn[aria-pressed="true"]{background:var(--accent-soft);border-color:var(--accent);color:var(--accent)}
.vgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.log{font-family:var(--mono);font-size:12px;color:var(--muted);display:flex;flex-direction:column;gap:2px;border-top:1px solid var(--line);padding-top:8px}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(84px + env(safe-area-inset-bottom,0px));background:var(--fg);color:var(--bg);padding:8px 14px;border-radius:8px;font-size:14px;z-index:20;max-width:calc(100% - 32px)}
.note{font-size:13px;color:var(--muted)}
.err{font-size:13px;color:var(--late)}
.recovery{font-family:var(--mono);font-size:16px;letter-spacing:.03em;background:var(--bg);border:1px dashed var(--accent);border-radius:10px;padding:12px;word-break:break-all;user-select:all}
.menu{display:flex;flex-direction:column;gap:6px}
.menu .btn{text-align:left}
.login{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
@media (prefers-reduced-motion:no-preference){.sheet{animation:up .18s ease-out}@keyframes up{from{transform:translateY(24px);opacity:.6}}}
.set{border:1px solid var(--line);border-radius:10px;padding:10px 12px;display:flex;flex-direction:column;gap:8px;margin:0}
.set legend{font-size:12px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;padding:0 4px}
.set input[type=time],.set select{font:15px var(--sans);padding:7px 9px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--fg);width:fit-content}
.sw{display:flex;align-items:center;gap:8px;font-size:14px}
.inline{display:flex;align-items:center;gap:6px;font-size:14px;flex-wrap:wrap}
.days{display:flex;flex-wrap:wrap;gap:4px}
.day{border:1px solid var(--line);background:var(--bg);color:var(--muted);border-radius:7px;padding:5px 9px;font:500 13px var(--sans);cursor:pointer;min-width:38px}
.day[aria-pressed="true"]{background:var(--accent-soft);border-color:var(--accent);color:var(--accent)}
.slot{display:flex;flex-wrap:wrap;gap:6px;align-items:center;padding:6px 0;border-top:1px dashed var(--line)}
.pause{display:flex;flex-direction:column;gap:6px;border-top:1px dashed var(--line);padding-top:8px}
.pause .grp{display:flex;flex-wrap:wrap;gap:6px}
