/* Farben und Grundformen aus dem Prototyp. Schrift bewusst ohne Google Fonts (Datenschutz). */
:root{--bg:#eef1f3;--surf:#fff;--ink:#16242d;--mute:#5b6b75;--line:#d3dbe0;--pri:#1d4e6e;--on:#fff;--ok:#2f7d4f;--warn:#a86a00;--bad:#b3392f;--sun:#f0b429;color-scheme:light}
@media (prefers-color-scheme:dark){:root{--bg:#10181d;--surf:#1a252c;--ink:#e6edf1;--mute:#9aaab4;--line:#2c3b44;--pri:#6fb0d6;--on:#0c1a22;--ok:#6fcf97;--warn:#e9b24f;--bad:#f08a80;color-scheme:dark}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif;padding-bottom:env(safe-area-inset-bottom,0px)}
h1,h2,h3{margin:0;line-height:1.2;font-weight:700}
header{background:var(--pri);color:var(--on);padding:calc(12px + env(safe-area-inset-top,0px)) 16px 12px;display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;justify-content:space-between;border-bottom:4px solid var(--sun)}
header h1{font-size:22px}
header h1 a{color:inherit;text-decoration:none}
.who{display:flex;align-items:center;gap:10px;font-size:14px;margin:0}
input,select,textarea,button{font:inherit}
input,select,textarea{background:var(--surf);color:var(--ink);border:1px solid var(--line);border-radius:6px;padding:8px 10px;width:100%}
main{max-width:860px;margin:0 auto;padding:16px}
.btn{background:var(--pri);color:var(--on);border:0;border-radius:6px;padding:9px 14px;font-weight:600;cursor:pointer}
a.btn{display:inline-block;text-decoration:none}
a{color:var(--pri)}
.btn.ghost{background:transparent;color:var(--pri);border:1px solid var(--pri)}
.btn.loeschen{background:var(--bad);color:var(--surf)}
.gefahr{color:var(--bad);font-size:14px}
.tag{display:inline-block;font-size:13px;padding:1px 8px;border-radius:10px;border:1px solid var(--line);color:var(--mute)}
.tag.ok{color:var(--ok);border-color:var(--ok)}
.tag.warn{color:var(--warn);border-color:var(--warn)}
.hinweis{margin:0}
input[type=checkbox]{width:auto;justify-self:start}
.dokument{display:flex;gap:12px;align-items:center;color:var(--ink);text-decoration:none;flex:1 1 240px;min-width:0;overflow-wrap:anywhere}
.vorschau{width:56px;height:56px;object-fit:cover;border-radius:4px;flex:none;background:var(--bg)}
.abstand{margin-bottom:10px}
.abstand-oben{margin-top:24px}
.crumb{display:inline-block;margin-bottom:8px;font-weight:500;text-decoration:none}
.kopf{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;justify-content:space-between;margin-bottom:12px}
.row{background:var(--surf);border:1px solid var(--line);border-radius:6px;padding:12px 14px;margin:0 0 8px;display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap;color:var(--ink);text-decoration:none}
.row.click:hover{border-color:var(--pri)}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px 16px}
.grid b{display:block;font-size:14px;color:var(--mute);font-weight:500}
.note{border-left:4px solid var(--sun);background:var(--surf);padding:10px 14px;margin:0 0 16px;font-size:14px}
.btn.hell{background:transparent;color:var(--on);border:1px solid var(--on)}
.btn.sm{padding:4px 10px;font-size:14px}
.btn:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--sun);outline-offset:2px}
.box{background:var(--surf);border:1px solid var(--line);border-radius:6px;padding:14px;margin:0 0 16px}
.schmal{max-width:380px;margin:32px auto}
.form{display:grid;gap:8px;margin-top:10px}
.form label{font-size:14px;color:var(--mute)}
.form .btn{margin-top:8px}
.mute{color:var(--mute);font-size:14px}
.fehler{color:var(--bad);font-size:14px;margin:10px 0 0}