:root{--bg:#0b1020;--fg:#e5e7eb;--muted:#9ca3af;--card:#111827;--border:#1f2937;--primary:#8b5cf6}
html.theme-light{--bg:#ffffff;--fg:#0f172a;--muted:#475569;--card:#f8fafc;--border:#e5e7eb;--primary:#4f46e5}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg);font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto}
.wrap{max-width:1100px;margin:0 auto;padding:1rem}
.bar{position:sticky;top:0;background:rgba(0,0,0,.2);backdrop-filter:blur(8px);border-bottom:1px solid var(--border)}
.brand{text-decoration:none;color:var(--fg);font-weight:800}
nav a{margin-right:1rem;color:var(--fg);text-decoration:none}
.btn{padding:.5rem 1rem;border-radius:.7rem;border:1px solid var(--border);background:var(--primary);color:#fff}
.btn.ghost{background:transparent;color:var(--fg)}
.grid{display:grid;gap:1rem}.two{grid-template-columns:2fr 1fr}.three{grid-template-columns:repeat(3,1fr)}
.card{background:var(--card);border:1px solid var(--border);border-radius:1rem;padding:1rem}
.input,select,textarea{width:100%;padding:.6rem;border:1px solid var(--border);border-radius:.6rem;background:transparent;color:var(--fg)}
.table{width:100%;border-collapse:collapse}.table th,.table td{padding:.6rem;border-bottom:1px solid var(--border);text-align:left}
.muted{color:var(--muted)} .foot{border-top:1px solid var(--border);margin-top:2rem}