:root{
  --bg:#0e0a1f; --fg:#f5f3ff; --muted:#a99fd1;
  --c1:#ff2d9b; --c2:#7b2dff; --c3:#00d4c8; --c4:#ff8a00;
  --grad:linear-gradient(120deg,var(--c1),var(--c2) 40%,var(--c3) 75%,var(--c4));
}
*{box-sizing:border-box} body{margin:0;background:var(--bg);color:var(--fg);
  font:16px/1.5 system-ui,Segoe UI,Roboto,sans-serif}
a{color:inherit;text-decoration:none}
.nav{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.5rem;
  border-bottom:1px solid #ffffff1a;position:sticky;top:0;background:#0e0a1fcc;backdrop-filter:blur(8px)}
.nav nav a{margin-left:1.1rem;color:var(--muted)} .nav nav a:hover{color:#fff}
.brand{font-weight:800;font-size:1.2rem}
.cta,.btn-big{background:var(--grad);color:#fff!important;padding:.5rem .9rem;border-radius:999px;font-weight:700}
.hero{padding:5rem 1.5rem 3rem;text-align:center;max-width:900px;margin:auto}
.hero h1{font-size:clamp(2.2rem,6vw,4rem);margin:.2rem 0;font-weight:900;letter-spacing:-1px}
.grad{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{color:var(--muted);font-size:1.2rem;max-width:620px;margin:1rem auto}
.btn-big{display:inline-block;margin-top:1.5rem;padding:1rem 2rem;font-size:1.15rem}
.features{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem;padding:2rem 1.5rem;max-width:1100px;margin:auto}
.card{background:#ffffff0d;border:1px solid #ffffff1a;border-radius:16px;padding:1.3rem}
.card h3{margin:.2rem 0}
.livestrip,.dash{max-width:1100px;margin:auto;padding:2rem 1.5rem}
.match-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:.7rem}
.match{background:#ffffff0d;border:1px solid #ffffff1a;border-radius:12px;padding:.8rem 1rem}
.match.live{border-color:var(--c1)}
.dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--c1);margin-right:.5rem;animation:pulse 1.3s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 var(--c1)}70%{box-shadow:0 0 0 8px transparent}100%{box-shadow:0 0 0 0 transparent}}
.cols{display:grid;grid-template-columns:2fr 1fr;gap:1.5rem}
@media(max-width:760px){.cols{grid-template-columns:1fr}}
.ticker{list-style:none;padding:0;margin:0} .ticker li{padding:.6rem .8rem;border-bottom:1px solid #ffffff14}
.table{width:100%;border-collapse:collapse;margin:.5rem 0 1.5rem;background:#ffffff08;border-radius:12px;overflow:hidden}
.table caption{font-weight:800;text-align:left;padding:.4rem;background:var(--grad)}
.table th,.table td{padding:.45rem .6rem;text-align:left;border-bottom:1px solid #ffffff12}
.groups{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1rem}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem}
.stat{background:var(--grad);border-radius:16px;padding:1.4rem;text-align:center}
.stat .num{display:block;font-size:2.4rem;font-weight:900}
.muted{color:var(--muted)} .foot{padding:2rem 1.5rem;color:var(--muted);text-align:center}