:root{
  --bg:#0b0f14;
  --panel:#0f1620cc;
  --text:#e6f2ff;
  --muted:#9bb3c7;
  --neon:#00f0ff;     /* ciano neon */
  --neon2:#ff2bd6;    /* magenta neon */
  --ok:#19f58d;
  --warn:#ffb020;
  --bad:#ff4d4d;
  --grid:#0e1a24;
  --card:#0e141acc;
  --border:#1e2a36;
  --shadow:0 8px 30px rgba(0,0,0,.45);
}

*{box-sizing:border-box}
html,body{height:100%}
body.theme-dark{
  margin:0; color:var(--text); background:
    radial-gradient(1200px 600px at 10% -10%, #112 0%, transparent 60%),
    radial-gradient(800px 500px at 100% 10%, #112 0%, transparent 50%),
    linear-gradient(transparent 0, transparent 100%),
    repeating-linear-gradient(0deg, var(--grid), var(--grid) 1px, transparent 1px, transparent 20px),
    linear-gradient(#080b10,#0b0f14);
  font-family: "Rajdhani", system-ui, sans-serif;
  letter-spacing:.2px;
}

/* scanlines CRT */
.scanlines{
  pointer-events:none; position:fixed; inset:0;
  background: repeating-linear-gradient(0deg, rgba(255,255,255,.035), rgba(255,255,255,.035) 1px, transparent 2px, transparent 3px);
  mix-blend-mode:soft-light; opacity:.15; z-index:0;
}

/* Topbar */
.topbar{
  position:sticky; top:0; z-index:10;
  display:flex; align-items:center; justify-content:space-between;
  padding:.75rem 1rem; background:backdrop-filter(12px);
  background:var(--panel); border-bottom:1px solid var(--border);
}
.brand{display:flex; align-items:baseline; gap:.6rem; font-weight:700}
.brand a{color:var(--text); text-decoration:none; font-weight:700; text-shadow:0 0 8px var(--neon)}
.brand .glyph{color:var(--neon2)}
.brand .beta{color:var(--muted); font-family:"Share Tech Mono", monospace}
.nav{display:flex; gap:1rem; flex-wrap:wrap}
.nav a{color:var(--muted); text-decoration:none; font-weight:600}
.nav a:hover{color:var(--neon); text-shadow:0 0 10px var(--neon)}
.nav .login{border:1px solid var(--neon); padding:.25rem .6rem; border-radius:10px}
.nav .login:hover{background:linear-gradient(90deg, transparent, #00f0ff22, transparent)}

/* Ticker */
.ticker{overflow:hidden; border-bottom:1px solid var(--border); background:#0b1118}
.ticker__track{display:inline-block; white-space:nowrap; padding:.5rem 0; animation:ticker 28s linear infinite}
.ticker__item{margin:0 2rem; color:var(--muted)}
@keyframes ticker{from{transform:translateX(0)} to{transform:translateX(-50%)}}

/* Layout */
.container{max-width:1000px; margin:2rem auto; padding:0 1rem}
.footer{padding:2rem 1rem; color:var(--muted); text-align:center}

/* Cards */
.card-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:1rem}
.card{
  background:var(--card); border:1px solid var(--border); border-radius:16px; padding:1rem; box-shadow:var(--shadow); position:relative; overflow:hidden;
}
.card:hover{border-color:var(--neon); box-shadow:0 0 0 1px #00f0ff55, 0 0 30px #00f0ff22}
.card h3{margin:.2rem 0 .6rem 0}
.card .meta{display:flex; gap:.6rem; flex-wrap:wrap; color:var(--muted); font-family:"Share Tech Mono", monospace; font-size:.9rem}
.badge{display:inline-block; padding:.18rem .5rem; border:1px solid var(--border); border-radius:999px; font-size:.75rem}
.badge--open{border-color:var(--ok); color:var(--ok)}
.badge--neg{border-color:var(--warn); color:var(--warn)}
.badge--closed{border-color:var(--bad); color:var(--bad)}
.payout{font-weight:700; color:var(--neon2)}
.progress{height:6px; border-radius:999px; background:#0c0f14; border:1px solid var(--border); margin-top:.6rem; overflow:hidden}
.progress > i{display:block; height:100%; background:linear-gradient(90deg, var(--neon2), var(--neon)); width:40%}

/* Search block */
.search{margin:1.5rem 0; padding:1rem; background:#0c131c; border:1px solid var(--border); border-radius:12px}