* { margin: 0; padding: 0; box-sizing: border-box; }
:root {
  --bg: #0a0e17; --bg2: #0e1522;
  --panel: rgba(255,255,255,0.04);
  --line: rgba(118,255,3,0.22);
  --green: #76ff03; --green-soft: #b9f6ca;
  --gold: #ffd75e;
  --text: #cfd8dc; --dim: #78909c;
}
body {
  background:
    radial-gradient(1200px 500px at 70% -10%, rgba(118,255,3,0.06), transparent 60%),
    radial-gradient(900px 500px at 10% 110%, rgba(79,195,247,0.06), transparent 60%),
    var(--bg);
  color: var(--text); font-family: 'Courier New', monospace; min-height: 100vh;
}
html { background: var(--bg); color-scheme: dark; scrollbar-width: thin; scrollbar-color: #1d2a3d var(--bg); }
input:-webkit-autofill, input:-webkit-autofill:hover,
input:-webkit-autofill:focus, textarea:-webkit-autofill, select:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px #0a0e17 inset !important;
  -webkit-text-fill-color: #eee !important;
  caret-color: #eee;
  transition: background-color 600000s 0s, color 600000s 0s;
}

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: var(--bg); }
::-webkit-scrollbar-thumb { background: #1d2a3d; border-radius: 5px; border: 2px solid var(--bg); }
::-webkit-scrollbar-thumb:hover { background: rgba(118,255,3,0.35); }
.wrap { max-width: 1060px; margin: 0 auto; padding: 0 20px; }
header {
  border-bottom: 1px solid rgba(255,255,255,0.07);
  background: rgba(10,14,23,0.8);
  position: sticky; top: 0; z-index: 10; backdrop-filter: blur(6px);
}
.header-inner { display: flex; align-items: center; gap: 18px; padding: 14px 0; }
.logo { font-size: 20px; font-weight: bold; letter-spacing: 5px; color: var(--green);
  text-shadow: 0 0 18px rgba(118,255,3,0.45); text-decoration: none; white-space: nowrap; }
.logo .dot { color: var(--dim); } .logo .tm { font-size: 9px; color: var(--dim); }
nav { margin-left: auto; display: flex; align-items: center; gap: 18px; }
nav a { color: var(--dim); text-decoration: none; font-size: 12px; letter-spacing: 2px; }
nav a:hover { color: var(--green-soft); }
nav a.here { color: var(--gold); }
.who {
  color: var(--green-soft); font-size: 12px; letter-spacing: 2px;
  border: 1px solid var(--line); border-radius: 12px; padding: 5px 12px;
}
.hbtn {
  font-family: 'Courier New', monospace; font-weight: bold; letter-spacing: 2px;
  font-size: 12px; text-transform: uppercase; cursor: pointer;
  border-radius: 6px; padding: 9px 18px; text-decoration: none; display: inline-block;
  transition: all 0.15s;
}
.hbtn.primary { background: var(--green); color: #0a0e17; border: 1px solid var(--green); }
.hbtn.primary:hover { background: #aed581; transform: translateY(-1px); box-shadow: 0 0 20px rgba(118,255,3,0.35); }
.hbtn.outline { background: rgba(118,255,3,0.07); color: var(--green-soft); border: 1px solid var(--line); }
.hbtn.outline:hover { background: rgba(118,255,3,0.16); }

.page-title { margin: 34px 0 6px; font-size: 26px; letter-spacing: 6px; color: var(--gold);
  text-shadow: 0 0 22px rgba(255,215,94,0.35); }
.subtitle { color: var(--dim); font-size: 13px; margin-bottom: 4px; }
.premium-note { color: var(--text); font-size: 12px; margin: 10px 0 22px; max-width: 720px; line-height: 1.6; }

.tabs { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 16px; }
.tab { font-family: inherit; font-size: 12px; letter-spacing: 2px; padding: 8px 14px; cursor: pointer;
  background: var(--panel); color: var(--dim); border: 1px solid rgba(255,255,255,0.1); }
.tab:hover { color: var(--green-soft); border-color: var(--line); }
.tab.on { color: var(--gold); border-color: rgba(255,215,94,0.5); background: rgba(255,215,94,0.06); }

.board { border: 1px solid rgba(255,255,255,0.1); background: var(--panel); overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 13px; min-width: 640px; }
th { text-align: left; color: var(--dim); font-size: 11px; letter-spacing: 2px; font-weight: normal;
  padding: 10px 12px; border-bottom: 1px solid rgba(255,255,255,0.1); white-space: nowrap; }
td { padding: 9px 12px; border-bottom: 1px solid rgba(255,255,255,0.05); white-space: nowrap; }
tr:last-child td { border-bottom: none; }
td.rank { color: var(--dim); width: 54px; }
tr.top1 td.rank, tr.top1 td.cs { color: var(--gold); }
td.pts { color: var(--green); }
tr.me td { background: rgba(255,215,94,0.07); }
tr.me td.rank::after { content: " ◄ YOU"; color: var(--gold); font-size: 10px; letter-spacing: 1px; }
.empty { padding: 26px 16px; color: var(--dim); font-size: 13px; }

.you-box { margin-top: 18px; border: 1px solid rgba(255,215,94,0.35); background: rgba(255,215,94,0.05);
  padding: 16px 18px; font-size: 13px; line-height: 1.7; }
.you-box .big { color: var(--gold); letter-spacing: 2px; font-size: 15px; }
.you-box.private { border-color: rgba(255,255,255,0.15); background: var(--panel); }
.btn { display: inline-block; margin-top: 10px; font-family: inherit; font-size: 12px; letter-spacing: 2px;
  padding: 10px 18px; cursor: pointer; text-decoration: none;
  background: rgba(255,215,94,0.12); color: var(--gold); border: 1px solid rgba(255,215,94,0.5); }
.btn:hover { background: rgba(255,215,94,0.22); }

footer { margin: 46px 0 30px; color: var(--dim); font-size: 11px; line-height: 1.8; }
footer .rule { color: var(--text); }
footer a { color: var(--dim); } footer a:hover { color: var(--green-soft); }
.s6b99de.s6b99de.s6b99de{display:none}
.scfe9ca.scfe9ca.scfe9ca{display:inline-block;width:1.25em;color:#ffd75e;text-shadow:0 0 8px rgba(255,215,94,0.55);}
.s112f7e.s112f7e.s112f7e{vertical-align:middle;margin-right:6px;}
.s4d4aa1.s4d4aa1.s4d4aa1{color:var(--dim)}
.s82c087.s82c087.s82c087{text-decoration:none;cursor:pointer;}
.s6170d9.s6170d9.s6170d9{margin-left:8px;}
.s714723.s714723.s714723{color:var(--gold);}
@media (max-width: 700px) { .header-inner { flex-wrap: wrap; gap: 10px; padding: 12px 16px; } nav { margin-left: 0; flex-wrap: wrap; gap: 12px 16px; } .logo { font-size: 17px; letter-spacing: 4px; } }
