:root { --bg:#0b0f14; --card:#111826; --text:#e6edf3; --muted:#9aa4ad; --border:#223046; --accent:#3b82f6; }
body { font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; margin:0; background:#0b0f14; color:var(--text); }
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }
.container { max-width: 1200px; margin: 0 auto; padding: 18px; }
.nav { display:flex; gap:14px; flex-wrap:wrap; align-items:center; padding: 14px 18px; border-bottom:1px solid var(--border); background:#0f1623; position: sticky; top:0; }
.nav a { color: var(--text); opacity:0.9; }
.nav a.active { color: var(--accent); }
.nav .spacer { flex:1; }
.card { background: var(--card); border: 1px solid var(--border); border-radius: 12px; padding: 14px; margin-bottom: 12px; }
h1,h2,h3 { margin: 10px 0; }
table { width:100%; border-collapse: collapse; }
th, td { text-align:left; padding: 10px; border-bottom: 1px solid var(--border); vertical-align: top; }
th { color: var(--muted); font-weight: 600; }
input, textarea, select { width:100%; padding:10px; border-radius:10px; border:1px solid var(--border); background:#0f1623; color:var(--text); }
textarea { min-height: 120px; }
button { padding: 10px 14px; border-radius: 10px; border: 1px solid var(--border); background: #1b2a44; color:var(--text); cursor:pointer; }
button.primary { background: var(--accent); border-color: var(--accent); color:white; }
.badge { display:inline-block; padding:4px 8px; border:1px solid var(--border); border-radius:999px; font-size:12px; color:var(--muted); }
.row { display:flex; gap: 12px; flex-wrap: wrap; }
.col { flex:1; min-width: 260px; }
.muted { color: var(--muted); }
.small { font-size: 12px; }
hr { border:0; border-top: 1px solid var(--border); margin: 14px 0; }
pre { white-space: pre-wrap; word-break: break-word; background:#0f1623; border:1px solid var(--border); border-radius: 12px; padding: 12px; }