:root{
  --bg:#EDF0F3; --surface:#FFFFFF; --text:#121C26; --muted:#4B5A68; --line:#CBD3DB;
  --accent:#0B4F8A; --ok:#15803D; --ok-solid:#15803D; --ok-bg:#DCF2E3;
  --bad:#B42318; --bad-solid:#B42318; --bad-bg:#FBE4E1;
  --part:#9A4A00; --part-solid:#B45309; --part-bg:#FFE9C7;
  --hint-bg:#FFF3C4; --hint-text:#5A4300; --toast-bg:#121C26; --toast-text:#FFFFFF;
  --c-repair:#C2410C; --c-reno:#1D4ED8; --c-check:#0F766E; --c-clean:#475569; --c-hand:#BE185D;
  --on-cat:#FFFFFF;
  --font:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root{
    --bg:#0E141A; --surface:#18212A; --text:#EAF0F5; --muted:#A9B7C4; --line:#2E3C4A;
    --accent:#7DB7F0; --ok:#4ADE80; --ok-bg:#12301E; --bad:#FF9A90; --bad-bg:#3A1714;
    --part:#FBBF24; --part-bg:#3A2A06;
    --hint-bg:#3A3000; --hint-text:#FFE58A; --toast-bg:#EAF0F5; --toast-text:#0E141A;
    --c-clean:#5B6B7D; color-scheme:dark;
  }
}
*{box-sizing:border-box}
html{font-size:112.5%;-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--bg);color:var(--text);font:400 1rem/1.4 var(--font);
  padding-top:env(safe-area-inset-top,0px);
  padding-left:max(16px,env(safe-area-inset-left,0px));
  padding-right:max(16px,env(safe-area-inset-right,0px));
  -webkit-tap-highlight-color:transparent;
}
body.lock{overflow:hidden}
button{font:inherit;color:inherit;cursor:pointer;-webkit-appearance:none;appearance:none}
h1,h2,p{margin:0}
[hidden]{display:none!important}
.wrap{max-width:30rem;margin:0 auto}
.ic{flex:none;display:block}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px}

.netbar{background:var(--part-bg);color:var(--part);border-radius:.8rem;padding:.5rem .8rem;margin-top:.7rem;font-weight:700;font-size:.9rem}

/* Anmeldung */
.join{padding:2.5rem 0}
.join h1{font-size:2.1rem;line-height:1.15;margin-bottom:.6rem}
.join p{color:var(--muted);margin-bottom:1rem}
.err{color:var(--bad);font-weight:700;margin-top:.8rem}

/* Tagesansicht */
#screen{padding-bottom:calc(7rem + env(safe-area-inset-bottom,0px))}
.dayhead{display:grid;grid-template-columns:3.2rem 1fr 3.2rem;align-items:center;gap:.5rem;margin:.9rem 0 .8rem}
.dayhead h1{font-size:2.1rem;line-height:1.1;text-align:center}
.dayhead p{text-align:center;color:var(--muted)}
.sq{width:3.2rem;height:3.2rem;border-radius:.9rem;border:2px solid var(--line);background:var(--surface);color:var(--text);display:grid;place-items:center;padding:0}
.progress{height:.7rem;border-radius:99px;background:var(--line);overflow:hidden;margin-bottom:.4rem}
.progress>span{display:block;height:100%;background:var(--ok)}
.pcount{color:var(--muted);margin-bottom:1rem}
.planfor{background:var(--surface);border:1px solid var(--line);border-radius:.8rem;padding:.5rem .8rem;margin-bottom:.8rem;font-size:.9rem;color:var(--muted);display:flex;gap:.6rem;align-items:center;flex-wrap:wrap}
.planfor b{color:var(--text)}
.planfor select{font:inherit;font-weight:700;color:var(--text);background:var(--bg);border:1px solid var(--line);border-radius:.6rem;padding:.3rem .5rem}
.list{display:grid;gap:.85rem}
.empty{background:var(--surface);border:2px dashed var(--line);border-radius:1.1rem;padding:1.4rem;text-align:center;color:var(--muted)}

.block{display:grid;grid-template-columns:4.4rem minmax(0,1fr);gap:.2rem 1rem;width:100%;text-align:left;color:var(--on-cat);background:var(--cat);border:0;border-radius:1.1rem;padding:1rem;min-height:6.2rem}
.cat-repair{--cat:var(--c-repair)} .cat-reno{--cat:var(--c-reno)} .cat-check{--cat:var(--c-check)} .cat-clean{--cat:var(--c-clean)} .cat-hand{--cat:var(--c-hand)}
.block .time b{display:block;font-size:1.35rem;line-height:1.1;font-variant-numeric:tabular-nums}
.block .time i{font-style:normal;font-size:.82rem;opacity:.92;font-variant-numeric:tabular-nums}
.block .title{display:block;font-size:1.3rem;font-weight:700;line-height:1.2;overflow-wrap:anywhere}
.block .where{display:flex;gap:.35rem;align-items:flex-start;font-size:.95rem;margin-top:.3rem}
.block .where .ic{margin-top:.15rem}
.block .meta{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.6rem;align-items:center}
.chip{display:inline-flex;gap:.3rem;align-items:center;background:rgba(255,255,255,.22);border-radius:99px;padding:.15rem .6rem;font-size:.85rem;font-weight:700}
.tag{display:inline-block;background:#fff;color:#111;border-radius:.4rem;padding:.05rem .5rem;font-size:.8rem;font-weight:700;margin-bottom:.35rem}
.block.is-now{box-shadow:0 0 0 4px var(--bg),0 0 0 7px var(--text)}
.block.is-done,.block.is-failed,.block.is-partial{background:var(--surface);color:var(--text);border:2px solid var(--line);border-left:.7rem solid var(--cat);padding:.9rem 1rem .9rem .9rem}
.block.is-done .chip,.block.is-failed .chip,.block.is-partial .chip{background:var(--bg)}
.block.is-failed{border-style:dashed;border-left-style:solid}
.st{display:inline-flex;gap:.3rem;align-items:center;font-weight:700;margin-top:.5rem;font-size:.95rem}
.st-ok{color:var(--ok)} .st-bad{color:var(--bad)} .st-part{color:var(--part)}

/* Woche */
.week{display:grid;gap:.7rem}
.wday{display:grid;grid-template-columns:3.6rem minmax(0,1fr);gap:.8rem;width:100%;text-align:left;background:var(--surface);border:2px solid var(--line);border-radius:1rem;padding:.8rem}
.wday.today{border-color:var(--text)}
.wday .dn{text-align:center;line-height:1.1}
.wday .dn small{display:block;font-size:.85rem;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.wday .dn b{font-size:1.7rem}
.mini{display:grid;grid-template-columns:3rem minmax(0,1fr);gap:.4rem;align-items:center;font-size:.9rem;padding:.2rem 0 .2rem .5rem;border-left:.35rem solid var(--cat);margin-bottom:.3rem}
.mini span:first-child{font-variant-numeric:tabular-nums;color:var(--muted)}
.mini .t{display:flex;gap:.3rem;align-items:center;overflow-wrap:anywhere}
.mini.done .t{color:var(--muted);text-decoration:line-through}
.free{color:var(--muted);align-self:center}

/* Untere Tasten */
#nav{position:fixed;left:0;right:0;bottom:0;z-index:10;background:var(--surface);border-top:2px solid var(--line);padding:.6rem max(16px,env(safe-area-inset-right,0px)) calc(.6rem + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px))}
#nav .in{max-width:30rem;margin:0 auto;display:grid;gap:.6rem}
#nav .in.n3{grid-template-columns:1fr 1.15fr 1fr}
#nav .in.n4{grid-template-columns:1fr 1.1fr 1fr 1fr}
.nb{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.15rem;min-height:4.3rem;border-radius:1rem;border:2px solid var(--line);background:var(--bg);font-weight:700;font-size:.9rem;padding:0 .2rem}
.nb[aria-current="page"]{background:var(--text);color:var(--bg);border-color:var(--text)}
.nb.plus{background:var(--ok-solid);border-color:var(--ok-solid);color:#fff}

/* Vollbild-Seiten */
#sheet{position:fixed;inset:0;z-index:20;background:var(--bg);overflow-y:auto;padding-top:env(safe-area-inset-top,0px)}
#sheet .in{max-width:30rem;margin:0 auto;padding:.8rem max(16px,env(safe-area-inset-right,0px)) calc(2rem + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px))}
.back{display:inline-flex;align-items:center;gap:.3rem;min-height:3.2rem;padding:0 1rem 0 .6rem;border-radius:.9rem;border:2px solid var(--line);background:var(--surface);font-weight:700;margin-bottom:.9rem}
.dhead{background:var(--cat);color:var(--on-cat);border-radius:1.1rem;padding:1.1rem}
.dcat{display:inline-flex;gap:.4rem;align-items:center;font-weight:700;background:rgba(255,255,255,.22);padding:.2rem .7rem;border-radius:99px;font-size:.9rem}
.dhead h1{font-size:1.9rem;line-height:1.15;margin:.6rem 0 .5rem;overflow-wrap:anywhere}
.dhead p{display:flex;gap:.4rem;align-items:flex-start;font-size:1.05rem;margin-top:.2rem}
.dhead p .ic{margin-top:.15rem}
.hint{display:flex;gap:.7rem;background:var(--hint-bg);color:var(--hint-text);border-radius:1rem;padding:.9rem 1rem;margin-top:.9rem}
.hint b{display:block}
.banner{display:flex;gap:.6rem;align-items:center;border-radius:1rem;padding:.8rem 1rem;margin-top:.9rem;font-weight:700}
.banner.ok{background:var(--ok-bg);color:var(--ok)} .banner.bad{background:var(--bad-bg);color:var(--bad)} .banner.part{background:var(--part-bg);color:var(--part)}
.field{display:block;margin-top:.9rem;font-weight:700}
.field textarea,.field input[type=text],.field select{display:block;width:100%;margin-top:.4rem;font:400 1.05rem/1.4 var(--font);color:var(--text);background:var(--surface);border:2px solid var(--line);border-radius:.9rem;padding:.8rem}
.field textarea{min-height:7rem;resize:vertical}
.photos{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.9rem}
.photos a{position:relative;display:block}
.photos img{width:5.5rem;height:5.5rem;object-fit:cover;border-radius:.8rem;border:2px solid var(--line);display:block}
.photos .wait{position:absolute;right:.3rem;bottom:.3rem;background:var(--part-bg);color:var(--part);border-radius:99px;padding:0 .35rem;font-size:.7rem;font-weight:700}
.notebox{background:var(--surface);border:2px solid var(--line);border-radius:1rem;padding:.8rem 1rem;margin-top:.9rem;overflow-wrap:anywhere;white-space:pre-wrap}
.notebox small{display:block;color:var(--muted);font-weight:700}
.hist{background:var(--surface);border:2px dashed var(--line);border-radius:1rem;padding:.8rem 1rem;margin-top:.9rem;overflow-wrap:anywhere}
.hist h2{font-size:1rem;color:var(--muted);margin-bottom:.4rem}
.hist .row{margin-top:.5rem;white-space:pre-wrap}
.hist .row b{display:block}
.acts{display:grid;grid-template-columns:1fr 1fr;gap:.8rem;margin-top:1.1rem}
.act{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.4rem;min-height:7.2rem;border-radius:1.1rem;border:2px solid var(--line);background:var(--surface);font-size:1.15rem;font-weight:700;padding:.6rem;text-align:center}
.act.ok{background:var(--ok-solid);border-color:var(--ok-solid);color:#fff}
.act.bad{background:var(--bad-solid);border-color:var(--bad-solid);color:#fff}
.act.part{background:var(--part-solid);border-color:var(--part-solid);color:#fff}
.act.wide{grid-column:1/-1;min-height:5rem;flex-direction:row;gap:.6rem}
.filing{display:flex;gap:.5rem;align-items:flex-start;color:var(--muted);font-size:.9rem;margin-top:1.1rem}
.filing b{color:var(--text)}
.who{color:var(--muted);font-size:.85rem;margin-top:.8rem}
.link{background:none;border:0;color:var(--muted);text-decoration:underline;padding:.6rem 0;font-size:.95rem}
.q{font-size:1.9rem;line-height:1.15;margin:.4rem 0 1rem}
.step{color:var(--muted);font-weight:700;margin-bottom:.2rem}
.opts{display:grid;gap:.7rem}
.opt{display:flex;gap:.8rem;align-items:center;min-height:4.6rem;width:100%;text-align:left;border-radius:1.1rem;border:2px solid var(--line);background:var(--surface);padding:.7rem 1rem;font-size:1.15rem;font-weight:700}
.opt small{display:block;font-weight:400;font-size:.9rem;opacity:.9}
.opt.cat{background:var(--cat);border-color:var(--cat);color:var(--on-cat)}
.opt.part{background:var(--part-solid);border-color:var(--part-solid);color:#fff}
.opt.bad{background:var(--bad-solid);border-color:var(--bad-solid);color:#fff}
.chips{display:flex;flex-wrap:wrap;gap:.5rem}
.pill{min-height:3.2rem;padding:0 1rem;border-radius:.9rem;border:2px solid var(--line);background:var(--surface);font-weight:700}
.pill[aria-pressed="true"]{background:var(--text);color:var(--bg);border-color:var(--text)}
.sub{font-weight:700;margin:1.1rem 0 .5rem}
.stepper{display:grid;grid-template-columns:4rem 1fr 4rem;gap:.6rem;align-items:center}
.stepper output{display:block;text-align:center;font-size:2.2rem;font-weight:700;font-variant-numeric:tabular-nums}
.stepper .sq{width:4rem;height:4rem}
.range{margin-top:.7rem;color:var(--muted);text-align:center}
.cta{display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%;min-height:4.2rem;border-radius:1.1rem;border:0;background:var(--ok-solid);color:#fff;font-size:1.25rem;font-weight:700;margin-top:1.3rem}
.cta:disabled{opacity:.4;cursor:default}
.cta.alt{background:var(--surface);color:var(--text);border:2px solid var(--line);margin-top:.7rem}
.cta.bad{background:var(--bad-solid)}
.bar{height:.5rem;border-radius:99px;background:var(--line);overflow:hidden;margin-bottom:.8rem}
.bar>span{display:block;height:100%;background:var(--accent)}
.hint2{color:var(--muted);margin-top:.5rem;font-size:.95rem}

/* Verwaltung */
.card{background:var(--surface);border:2px solid var(--line);border-radius:1rem;padding:1rem;margin-top:.8rem}
.card h2{font-size:1.2rem;margin-bottom:.3rem}
.card .row{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.7rem}
.sm{min-height:2.8rem;padding:0 .9rem;border-radius:.8rem;border:2px solid var(--line);background:var(--bg);font-weight:700;font-size:.95rem;display:inline-flex;align-items:center;gap:.4rem;text-decoration:none;color:var(--text)}
.sm.go{background:var(--ok-solid);border-color:var(--ok-solid);color:#fff}
.sm.warn{color:var(--bad);border-color:var(--bad)}
.muted{color:var(--muted);font-size:.9rem}
.code{font-size:1.5rem;font-weight:700;letter-spacing:.08em;margin:.4rem 0}
.linkbox{display:block;width:100%;font:400 .85rem/1.3 ui-monospace,Consolas,monospace;padding:.6rem;border:2px solid var(--line);border-radius:.7rem;background:var(--bg);color:var(--text);margin-top:.5rem;word-break:break-all}
.sect{margin:1.4rem 0 .2rem;font-size:1.3rem}
.dev{display:flex;justify-content:space-between;gap:.6rem;align-items:center;margin-top:.5rem;font-size:.9rem}

#toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(6.6rem + env(safe-area-inset-bottom,0px));z-index:30;background:var(--toast-bg);color:var(--toast-text);padding:.7rem 1.1rem;border-radius:99px;font-weight:700;pointer-events:none;max-width:90vw;text-align:center;opacity:0}
#toast.show{opacity:1}
@media (prefers-reduced-motion:no-preference){#toast{transition:opacity .2s}}