:root{
  --bg:#0b0c0f; --fg:#e7e9ee; --muted:#98a2b3; --card:#141820; --border:#212636; --link:#66a3ff; --accent:#7c5cff;
}
@media (prefers-color-scheme: light){
  :root{ --bg:#ffffff; --fg:#0b0c0f; --muted:#475467; --card:#f8fafc; --border:#e5e7eb; --link:#1d4ed8; --accent:#7c3aed; }
}
*{ box-sizing:border-box }
html,body{ height:100% }
body{
  margin:0; background:var(--bg); color:var(--fg);
  font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,"Helvetica Neue",Arial,"Apple Color Emoji","Segoe UI Emoji";
  letter-spacing:.2px;
}
.wrap{ max-width:880px; margin:0 auto; padding:24px }
header{
  display:flex; align-items:flex-start; gap:16px;
  padding:18px 22px; border:1px solid var(--border); border-radius:18px; background:var(--card);
}
.brand{ display:flex; gap:12px }
.logo{
  width:40px; height:40px; border-radius:12px; background:
    radial-gradient(60% 80% at 30% 20%, var(--accent), transparent 60%),
    linear-gradient(135deg, var(--link), var(--accent));
  box-shadow:0 6px 18px rgba(124,92,255,.25), inset 0 0 0 1px rgba(255,255,255,.08);
  flex:0 0 auto;
}
h1{ font-size:1.3rem; margin:.1rem 0 0 }
.kicker{ font-size:.9rem; color:var(--muted); margin:.25rem 0 0 }
.badge{ display:inline-block; padding:2px 8px; border:1px solid var(--border); border-radius:999px; font-size:.78rem; color:var(--muted) }

main{
  margin-top:18px; display:grid; gap:16px;
  grid-template-columns: 1fr;
}
section{
  background:var(--card); border:1px solid var(--border); border-radius:18px; padding:22px;
}
h2{ margin:0 0 10px; font-size:1.1rem }
p, li{ color:var(--fg); margin:6px 0 }
.muted{ color:var(--muted) }
a{ color:var(--link); text-decoration:none }
a:hover{ text-decoration:underline }

.grid{ display:grid; gap:6px }
.two{ grid-template-columns: 1fr 1fr }
@media (max-width:700px){ .two{ grid-template-columns: 1fr } }

footer{ margin:16px 0 8px; color:var(--muted); font-size:.9rem; text-align:center }

/* Druck */
@media print{
  body{ background:#fff; color:#000 }
  header, section{ border:1px solid #aaa; background:#fff }
  a{ color:#000; text-decoration:underline }
  .logo{ background:#000 }
}
code{ background:rgba(0,0,0,.12); padding:.1em .4em; border-radius:6px }
