:root{--bg: #0f172a;--surface: #1e293b;--primary: #38bdf8;--text: #e2e8f0;--muted: #94a3b8;font-family:system-ui,Avenir,Helvetica,Arial,sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);min-height:100vh}.app{display:flex;flex-direction:column;min-height:100vh}.navbar{display:flex;align-items:center;justify-content:space-between;padding:1rem 2rem;background:var(--surface);border-bottom:1px solid #334155}.navbar-brand{font-weight:700;font-size:1.25rem;color:var(--primary)}.navbar-links{display:flex;gap:1.5rem}.navbar-links a{color:var(--muted);text-decoration:none;font-weight:500;transition:color .2s ease}.navbar-links a:hover{color:var(--text)}.navbar-links a.active{color:var(--primary)}.content{flex:1;width:100%;max-width:960px;margin:0 auto;padding:2rem}.hero{text-align:center;padding:3rem 1rem}.hero h1{font-size:2.5rem;margin-bottom:1rem}.hero p{color:var(--muted);max-width:600px;margin:0 auto}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.5rem;margin-top:2rem}.card{background:var(--surface);border:1px solid #334155;border-radius:12px;padding:1.5rem}.card h3{color:var(--primary);margin-bottom:.5rem}.card p{color:var(--muted)}.page h1{margin-bottom:1rem}.page h2{margin:1.5rem 0 .5rem;color:var(--primary)}.page p,.page li{color:var(--muted);line-height:1.6}.page ul{padding-left:1.5rem}.footer{text-align:center;padding:1.5rem;color:var(--muted);border-top:1px solid #334155;font-size:.875rem}