:root{--bg:#f6f7f9;--card:#fff;--fg:#1d2329;--muted:#66717c;--line:#e2e6ea;--accent:#2563eb;
--red:#c62828;--orange:#d97706;--green:#15803d;--radius:10px;color-scheme:light dark}
@media (prefers-color-scheme:dark){:root{--bg:#14171a;--card:#1d2226;--fg:#e8ecef;--muted:#9aa5ae;
--line:#2d3439;--accent:#60a5fa;--red:#f87171;--orange:#fbbf24;--green:#4ade80}}
*{box-sizing:border-box}
body{margin:0;font:16px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif;background:var(--bg);color:var(--fg)}
a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}
header{background:var(--card);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}
header .wrap{display:flex;gap:.25rem 1rem;align-items:center;flex-wrap:wrap;padding:.6rem 1rem}
header strong{margin-right:auto}
header nav a{padding:.25rem .5rem;border-radius:6px;color:var(--fg)}
header nav a.on{background:var(--bg);font-weight:600}
.wrap{max-width:900px;margin:0 auto;padding:1rem}
h1{font-size:1.4rem;margin:.5rem 0 1rem}h2{font-size:1.1rem;margin:1.5rem 0 .5rem}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:1rem;margin-bottom:.75rem}
.row{display:flex;gap:.75rem;align-items:center;flex-wrap:wrap}.row .grow{flex:1;min-width:12rem}
.muted{color:var(--muted);font-size:.9rem}
.flash{background:color-mix(in srgb,var(--green) 15%,var(--card));border-color:var(--green)}
.error{background:color-mix(in srgb,var(--red) 15%,var(--card));border-color:var(--red)}
.badge{display:inline-block;padding:.05rem .5rem;border-radius:99px;font-size:.8rem;border:1px solid var(--line)}
.ueberfaellig{color:var(--red);border-color:var(--red)}.heute,.bald{color:var(--orange);border-color:var(--orange)}
.spaeter{color:var(--green);border-color:var(--green)}
form.inline{display:inline}
label{display:block;margin:.6rem 0 .2rem;font-weight:500}
input,select,textarea{width:100%;padding:.55rem .6rem;border:1px solid var(--line);border-radius:8px;
background:var(--bg);color:var(--fg);font:inherit}
input[type=checkbox]{width:auto}
textarea{min-height:5rem}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:0 1rem}
button,.btn{display:inline-block;padding:.5rem .9rem;border-radius:8px;border:1px solid var(--accent);
background:var(--accent);color:#fff;font:inherit;cursor:pointer}
button.ghost,.btn.ghost{background:transparent;color:var(--accent)}
button.danger{background:transparent;border-color:var(--red);color:var(--red)}
button.done{background:var(--green);border-color:var(--green);font-weight:600}
table{width:100%;border-collapse:collapse}td,th{padding:.45rem .4rem;border-bottom:1px solid var(--line);
text-align:left;vertical-align:top}th{font-size:.85rem;color:var(--muted)}
details summary{cursor:pointer;color:var(--accent)}
.table-scroll{overflow-x:auto}
@media (max-width:600px){header nav{width:100%;overflow-x:auto;white-space:nowrap}}