:root { --braun:#4A3B32; --hell:#F3EEE9; --text:#2b2b2b; --grau:#9a9a9a; --rand:#e2dcd5; }
* { box-sizing: border-box; }
body { margin:0; font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; color:var(--text); background:#faf8f6; }
header { background:var(--braun); color:#fff; padding:14px 24px; display:flex; align-items:center; justify-content:space-between; }
header h1 { font-size:20px; margin:0; font-weight:600; }
header .wer { font-size:14px; opacity:.9 }
header button { margin-left:12px; background:transparent; color:#fff; border:1px solid rgba(255,255,255,.5); border-radius:6px; padding:5px 10px; cursor:pointer; }
main { max-width:1100px; margin:32px auto; padding:0 24px; }
.kacheln { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:20px; }
.kachel { display:block; background:#fff; border:1px solid var(--rand); border-radius:12px; padding:24px; text-decoration:none; color:inherit; min-height:140px; transition:box-shadow .15s; }
.kachel:hover { box-shadow:0 4px 16px rgba(74,59,50,.15); }
.kachel h2 { margin:0 0 8px; font-size:20px; color:var(--braun); }
.kachel p { margin:0; font-size:14px; line-height:1.4; }
.kachel.aus { opacity:.5; pointer-events:none; }
.kachel .marke { display:inline-block; margin-top:14px; font-size:12px; background:var(--hell); border-radius:20px; padding:3px 10px; }
.hinweis { margin-top:28px; font-size:13px; color:var(--grau); }
.login { text-align:center; margin-top:80px; }
.login a { display:inline-block; background:var(--braun); color:#fff; padding:12px 22px; border-radius:8px; text-decoration:none; font-size:16px; }
.fehler { color:#b00020; margin-top:16px; }