/* BetLab Styles - FINAL */
:root{
  --bg: #0a0f12;
  --panel: #12181d;
  --panel-2:#0f1418;
  --text:#d9e1e8;
  --muted:#8a98a8;
  --neon:#14c8ff;
  --shadow: 0 10px 30px rgba(0, 229, 255, 0.15);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--text);
  background: radial-gradient(1100px 600px at 50% -100px, #1a222b 0%, #0f1216 40%, #0a0f12 100%);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

.page{max-width:900px;margin:0 auto;padding:40px 18px}

.hero{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:10px}
.hero-top{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px}
.logo-wrap{width:160px;height:160px;display:grid;place-items:center;background:radial-gradient(circle at 50% 40%, #0b1720 0%, #06090c 70%);border-radius:50%;box-shadow:inset 0 0 30px rgba(0,229,255,.05), 0 0 0 2px rgba(0,229,255,.15)}
.logo{width:120px;height:auto;filter:drop-shadow(0 0 18px rgba(0,229,255,.35))}
.vip-btn{padding:12px 18px;border-radius:12px;border:1px solid rgba(20,200,255,.35);background:linear-gradient(145deg, var(--panel), var(--panel-2));color:var(--text);text-decoration:none;font-weight:700;box-shadow:var(--shadow)}
.vip-btn:hover{transform:translateY(-1px);border-color:rgba(20,200,255,.6)}
.footer-vip{display:inline-block;margin-bottom:12px}

.brand{font-size:42px;line-height:1.1;margin:10px 0 0;font-weight:800;letter-spacing:.5px}
.handle{margin:0;color:var(--muted)}
.tagline{margin:4px 0 16px;color:#b3c0cf;text-align:center}

.mini-icons{display:flex;gap:16px;list-style:none;margin:8px 0 0;padding:0}
.icon{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:10px;background:linear-gradient(145deg, var(--panel), var(--panel-2));color:var(--neon);box-shadow:var(--shadow)}
.icon:hover{transform:translateY(-1px);box-shadow:0 12px 28px rgba(0,229,255,.25)}

.tabs{display:flex;justify-content:center;gap:12px;margin:26px 0 12px;flex-wrap:wrap}
.tab{padding:8px 18px;border-radius:999px;background:linear-gradient(145deg, var(--panel), var(--panel-2));color:#8ea0b2;border:1px solid rgba(20,200,255,.15);box-shadow:var(--shadow);text-transform:lowercase;letter-spacing:.08em;cursor:pointer}
.tab.active{color:var(--text);border-color:rgba(20,200,255,.35)}

.tabpanel{margin-top:10px}
.cards{display:flex;flex-direction:column;gap:16px}
.card{display:flex;align-items:center;gap:14px;padding:18px 16px;border-radius:18px;background:linear-gradient(145deg, var(--panel), var(--panel-2));border:1px solid rgba(20,200,255,.15);text-decoration:none;color:var(--text);box-shadow:var(--shadow)}
.card:hover{border-color:rgba(20,200,255,.35);transform:translateY(-1px)}
.card-icon{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:rgba(8,14,20,.6);color:var(--neon)}
.card-meta{display:flex;flex-direction:column}
.card-kicker{font-size:12px;letter-spacing:.18em;color:#87a0b6}
.card-title{font-size:20px;margin-top:2px}
.chev{margin-left:auto;color:var(--neon);font-size:28px;line-height:0}

.cta-wide{display:block;text-align:center;margin-top:8px;padding:16px;border-radius:16px;border:1px solid rgba(20,200,255,.35);background:linear-gradient(145deg, var(--panel), var(--panel-2));text-decoration:none;color:var(--text);font-weight:800;letter-spacing:.3px;box-shadow:var(--shadow)}
.cta-wide:hover{transform:translateY(-1px);border-color:rgba(20,200,255,.6)}

.about .panel, .contact .panel{padding:18px;border-radius:16px;background:linear-gradient(145deg, var(--panel), var(--panel-2));border:1px solid rgba(20,200,255,.15);box-shadow:var(--shadow)}
.about h2, .contact h2{margin:6px 0 10px}
.bullets{margin:8px 0 0}
.bullets li{margin:6px 0;color:#b3c0cf}

.form{display:grid;gap:12px;margin-top:6px}
.field{display:grid;gap:6px}
.field input, .field textarea{
  background:#0b1217;color:var(--text);border:1px solid rgba(20,200,255,.18);
  padding:12px 14px;border-radius:12px;outline:none
}
.field input:focus, .field textarea:focus{border-color:rgba(20,200,255,.38)}
.btn{
  padding:12px 16px;border-radius:12px;border:1px solid rgba(20,200,255,.35);
  background:linear-gradient(145deg, var(--panel), var(--panel-2));color:var(--text);
  cursor:pointer;box-shadow:var(--shadow);font-weight:600
}
.status{min-height:22px;font-size:14px;margin-top:4px}
.status.ok{color:#7bfca7}
.status.err{color:#ff7b7b}
.privacy{color:#8ea0b2;font-size:12px;margin-top:6px}

.footer{margin:40px 0 10px;border-top:1px solid rgba(20,200,255,.12);padding-top:20px}
.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px}
.footer h3{margin:0 0 6px;font-size:14px;color:#9eb3c8}
.footer ul{margin:0;padding-left:0;list-style:none}
.footer a{color:var(--neon);text-decoration:none}
.footer a:hover{text-decoration:underline}
.copy{color:#6f8297;text-align:center;margin-top:16px;font-size:12px}

@media (min-width:740px){
  .brand{font-size:48px}
  .logo-wrap{width:190px;height:190px}
  .logo{width:140px}
}