:root{ --gold:#D4AF37; --bg:#111315; --panel:#191b1f; --text:#f8f8f8; --muted:#b9c0c7; --danger:#c0392b; --ok:#27ae60; }
*{ box-sizing:border-box; }
body{ margin:0; font-family:Inter,system-ui,Segoe UI,Roboto,Arial; background:var(--bg); color:var(--text); }
.header{ display:flex; align-items:center; justify-content:space-between; padding:14px 20px; background:#0d0f10; border-bottom:1px solid #232628; position:sticky; top:0; z-index:5;}
.logo{ font-weight:900; letter-spacing:0.5px; font-size:18px; }
.logo .all,.logo .now{ color:var(--gold); }
.logo .bets{ color:#fff; }
.nav a{ color:#fff; text-decoration:none; margin:0 10px; font-size:14px; opacity:.9 }
.nav a:hover{ opacity:1 }
.btn{ background:var(--gold); border:none; padding:10px 14px; border-radius:10px; font-weight:700; cursor:pointer; color:#111; }
.btn.sec{ background:#232628; color:#fff; border:1px solid #2b2f31; }
.container{ max-width:1200px; margin:20px auto; padding:0 16px; }
.card{ background:var(--panel); border:1px solid #232628; border-radius:14px; padding:16px; margin-bottom:16px; }
.input, select{ width:100%; padding:10px 12px; border-radius:10px; border:1px solid #2b2f31; background:#0f1112; color:#fff; }
.grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap:14px; }
.grid2{ display:grid; grid-template-columns: repeat(2, 1fr); gap:14px; }
.table{ width:100%; border-collapse:collapse; }
.table th,.table td{ padding:10px; border-bottom:1px solid #2b2f31; text-align:left; font-size:14px; }
.badge{ display:inline-block; padding:4px 10px; background:#0f1112; border:1px solid #2b2f31; border-radius:999px; font-size:12px; }
.alert{ padding:10px 12px; border-radius:10px; font-size:14px; }
.alert.ok{ background:#0d2a18; border:1px solid #194d2f; color:#d5f4df; }
.alert.err{ background:#2f1616; border:1px solid #5c2222; color:#ffd6d6; }
footer{ color:#9aa2a9; text-align:center; padding:24px; margin-top:20px; }
@media(max-width:900px){ .grid{grid-template-columns:1fr;} .grid2{grid-template-columns:1fr;} }