:root { --bg:#f6f6f4; --fg:#1d1d1b; --muted:#666; --card:#fff; --line:#d9d9d4; --acc:#2456c8; --ok:#1c7a3a; --err:#b3261e; }
@media (prefers-color-scheme: dark) {
  :root { --bg:#161616; --fg:#eee; --muted:#aaa; --card:#222; --line:#3a3a3a; --acc:#7aa2ff; --ok:#5fcf86; --err:#ff8a80; }
}
* { box-sizing: border-box; }
body { margin:0; font:16px/1.45 system-ui, sans-serif; background:var(--bg); color:var(--fg); }
header { background:var(--card); border-bottom:1px solid var(--line); padding:.5rem 1rem; }
nav { display:flex; flex-wrap:wrap; gap:.25rem .5rem; align-items:center; }
nav a, .tabs a { padding:.5rem .75rem; border-radius:6px; text-decoration:none; color:var(--acc); }
nav a:hover, .tabs a:hover, .tabs a.aktiv { background:var(--line); }
nav form { margin-left:auto; }
main { max-width:60rem; margin:0 auto; padding:1rem; }
h1 { font-size:1.4rem; margin:.5rem 0 1rem; } h2 { font-size:1.15rem; }
.card { background:var(--card); border:1px solid var(--line); border-radius:8px; padding:1rem; margin:0 0 1rem; }
.grid { display:grid; gap:1rem; grid-template-columns:repeat(auto-fill, minmax(16rem,1fr)); }
dl { display:grid; grid-template-columns:auto 1fr; gap:.25rem .75rem; margin:0; } dt { color:var(--muted); } dd { margin:0; }
label { display:block; margin:.75rem 0 .25rem; font-weight:600; }
input[type=text], input[type=number], input[type=password], select, textarea { width:100%; padding:.6rem; font:inherit; color:inherit; background:var(--bg); border:1px solid var(--line); border-radius:6px; }
textarea { min-height:6rem; }
button, .btn { font:inherit; padding:.6rem 1rem; border:1px solid var(--line); border-radius:6px; background:var(--card); color:var(--fg); cursor:pointer; min-height:2.75rem; }
button.primaer { background:var(--acc); color:#fff; border-color:var(--acc); }
button.gefahr { color:var(--err); }
.aktionen { display:flex; flex-wrap:wrap; gap:.5rem; margin-top:1rem; }
.flash { padding:.6rem .9rem; border-radius:6px; margin:0 0 .5rem; border:1px solid var(--line); }
.flash.ok { border-color:var(--ok); color:var(--ok); } .flash.fehler { border-color:var(--err); color:var(--err); }
.hinweis { border-left:4px solid var(--acc); padding:.5rem .75rem; background:var(--card); margin:0 0 1rem; }
.muted { color:var(--muted); font-size:.9rem; }
.tabs { display:flex; flex-wrap:wrap; gap:.25rem; margin:0 0 1rem; }
.bilder { display:grid; gap:.75rem; grid-template-columns:repeat(auto-fill, minmax(9rem,1fr)); }
.bild { background:var(--card); border:1px solid var(--line); border-radius:8px; padding:.5rem; }
.bild img { width:100%; aspect-ratio:1; object-fit:cover; border-radius:4px; display:block; }
.entwurf img { max-width:100%; max-height:20rem; border-radius:6px; }
.status { display:inline-block; padding:.1rem .5rem; border-radius:99px; border:1px solid var(--line); font-size:.85rem; }
.status.offen { border-color:var(--acc); } .status.freigegeben { border-color:var(--ok); color:var(--ok); } .status.verworfen { color:var(--muted); }
.check { display:flex; gap:.5rem; align-items:center; font-weight:400; } .check input { width:auto; }
.status.braucht_alex { border-color:var(--err); color:var(--err); } .status.beantwortet { border-color:var(--ok); color:var(--ok); } .status.ignoriert { color:var(--muted); }
.zitat { white-space:pre-wrap; border-left:4px solid var(--line); padding:.25rem .75rem; margin:.5rem 0; }