:root { font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }
body { margin: 0; background: #0f1115; color: #e6e6e6; }
a { color: #9ad0ff; text-decoration: none; }
a:hover { text-decoration: underline; }

.topbar { display:flex; justify-content:space-between; align-items:center; padding:14px 18px; background:#151924; border-bottom:1px solid #252b3a; }
.topbar__brand { font-weight: 700; }
.topbar__nav a { margin-left: 14px; }

.container { max-width: 1100px; margin: 0 auto; padding: 18px; }
.card { background:#151924; border:1px solid #252b3a; border-radius:12px; padding:14px; }
.footer { padding: 18px; color:#9aa3b2; border-top:1px solid #252b3a; text-align:center; }

input, button { font: inherit; }
.input { width:100%; padding:10px 12px; border-radius:10px; border:1px solid #2b3245; background:#0f1115; color:#e6e6e6; }
.btn { padding:10px 12px; border-radius:10px; border:1px solid #2b3245; background:#1b2233; color:#e6e6e6; cursor:pointer; }
.btn:hover { filter: brightness(1.08); }

.grid { display:grid; gap:12px; }
.grid-2 { grid-template-columns: 1fr 1fr; }
.badge { display:inline-block; padding:4px 8px; border-radius:999px; border:1px solid #2b3245; color:#cdd6e5; font-size: 12px; }