:root{--bg:#0b1020;--fg:#e5e7eb;--muted:#a3a3a3;--brand:#7c3aed;--card:#111827;--border:#1f2937}
:root.light{--bg:#ffffff;--fg:#0b1324;--muted:#475569;--brand:#6d28d9;--card:#f8fafc;--border:#e2e8f0}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;background:var(--bg);color:var(--fg);line-height:1.6}
img{max-width:100%;display:block}
.container{max-width:1000px;margin:0 auto;padding:1rem}
.header{display:flex;align-items:center;justify-content:space-between;gap:.5rem}
.brand{font-weight:700;color:var(--fg);text-decoration:none}
.nav a{color:var(--fg);text-decoration:none;margin-right:1rem}
.btn,.btn-secondary{display:inline-block;padding:.75rem 1rem;border-radius:.6rem;text-decoration:none}
.btn{background:var(--brand);color:#fff}
.btn-secondary{border:1px solid var(--border);color:var(--fg)}
.btn-ghost{background:transparent;border:1px solid var(--border);color:var(--fg);padding:.5rem .75rem;border-radius:.6rem}
.hero{padding:3rem 0}
.section{padding:2rem 0;border-top:1px solid var(--border)}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem}
.card{background:var(--card);border:1px solid var(--border);padding:1rem;border-radius:.8rem}
.tags{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;padding:0}
.tags li{border:1px solid var(--border);border-radius:999px;padding:.25rem .6rem;color:var(--fg)}
.footer{padding:2rem 0;color:var(--muted)}

@media (prefers-color-scheme: light){:root{--bg:#ffffff;--fg:#0b1324;--muted:#475569;--brand:#6d28d9;--card:#f8fafc;--border:#e2e8f0}}