:root { --bg:#0d0f14; --panel:#161a22; --panel2:#1c212c; --line:#2a3140;
  --text:#d8dce6; --dim:#8892a4; --gold:#e0b45c; --green:#5cb87a; --red:#d06060;
  --purple:#b06ae0; --blue:#6a9de0; }
* { margin:0; padding:0; box-sizing:border-box; }
body { background:var(--bg); color:var(--text); font:15px/1.6 "Segoe UI",system-ui,sans-serif; }
a { color:var(--gold); text-decoration:none; } a:hover { text-decoration:underline; }
.layout { display:flex; min-height:100vh; }
nav { width:230px; flex-shrink:0; background:var(--panel); border-right:1px solid var(--line);
  padding:24px 0; position:sticky; top:0; height:100vh; overflow-y:auto; }
nav .brand { font-size:19px; letter-spacing:2px; color:var(--gold); font-weight:600;
  padding:0 20px 16px; display:block; }
nav .brand small { display:block; color:var(--dim); font-size:11px; letter-spacing:1px; }
nav a.item { display:block; padding:7px 20px; color:var(--text); font-size:14px; }
nav a.item:hover { background:var(--panel2); text-decoration:none; }
nav a.item.active { color:var(--gold); border-left:3px solid var(--gold); background:var(--panel2); }
main { flex-grow:1; padding:36px 44px 80px; max-width:1000px; }
h1 { font-size:28px; color:var(--gold); letter-spacing:1px; margin-bottom:6px; }
.sub { color:var(--dim); margin-bottom:26px; }
h2 { font-size:19px; color:var(--gold); margin:30px 0 10px; }
h3 { font-size:16px; margin:20px 0 8px; }
p { margin-bottom:12px; }
ul { margin:0 0 12px 22px; }
li { margin-bottom:4px; }
.panel { background:var(--panel); border:1px solid var(--line); border-radius:10px;
  padding:16px 18px; margin-bottom:14px; }
.tablewrap { overflow-x:auto; margin-bottom:16px; }
table { width:100%; border-collapse:collapse; background:var(--panel);
  border:1px solid var(--line); border-radius:10px; overflow:hidden; font-size:14px; }
th, td { padding:8px 12px; text-align:left; vertical-align:top; }
th { background:var(--panel2); color:var(--dim); font-weight:500; font-size:12px;
  text-transform:uppercase; letter-spacing:1px; }
tr + tr td { border-top:1px solid var(--line); }
td.num { text-align:right; font-variant-numeric:tabular-nums; }
.tag { display:inline-block; background:var(--panel2); border:1px solid var(--line);
  border-radius:999px; padding:1px 10px; margin:1px 2px; font-size:12px; }
.dim { color:var(--dim); } .gold { color:var(--gold); } .red { color:var(--red); }
.cardgrid { display:grid; grid-template-columns:repeat(auto-fill,minmax(290px,1fr)); gap:14px; margin-bottom:16px; }
.hero { background:linear-gradient(135deg,#1a1030,#161a22); border:1px solid #3a2a50;
  border-radius:12px; padding:26px 28px; margin-bottom:26px; }
footer { color:var(--dim); font-size:12px; margin-top:50px; border-top:1px solid var(--line); padding-top:14px; }
@media (max-width:800px) { .layout { flex-direction:column; } nav { width:100%; height:auto; position:static; } main { padding:22px; } }