:root{
  --bg:#0a0c10;
  --bg-2:#0f1218;
  --panel:#12161d;
  --panel-2:#161b24;
  --line:#1f2632;
  --line-2:#2a3444;
  --txt:#e8edf5;
  --muted:#7d8899;
  --accent:#00e5a0;
  --accent-2:#00b8ff;
  --warn:#ffb020;
  --danger:#ff4d5e;
  --radius:12px;
  --ease:cubic-bezier(.4,0,.2,1);
}
*{margin:0;padding:0;box-sizing:border-box}
body{
  background:radial-gradient(1200px 600px at 80% -10%,rgba(0,184,255,.08),transparent 60%),
             radial-gradient(900px 500px at 10% 0%,rgba(0,229,160,.07),transparent 55%),
             var(--bg);
  color:var(--txt);
  font-family:"Segoe UI",system-ui,-apple-system,sans-serif;
  font-size:14px;
  min-height:100vh;
}

/* ---------- Topbar ---------- */
.topbar{
  position:sticky;top:0;z-index:20;
  display:flex;align-items:center;justify-content:space-between;
  gap:16px;padding:14px 28px;
  background:rgba(10,12,16,.85);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
}
.brand{display:flex;align-items:center;gap:12px}
.logo-mark{
  width:36px;height:36px;border-radius:10px;
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
  color:#04120c;font-weight:800;font-size:19px;
  display:grid;place-items:center;
  box-shadow:0 4px 16px rgba(0,229,160,.3);
}
.logo-text{display:flex;flex-direction:column;line-height:1.15}
.logo-text strong{font-size:15px}
.logo-text span{font-size:11px;color:var(--muted);letter-spacing:.14em;text-transform:uppercase}

.auth-area{display:flex;align-items:center;gap:12px}
.auth-hint{font-size:12px;color:var(--muted)}
.user-chip{display:flex;align-items:center;gap:10px}
.avatar{width:32px;height:32px;border-radius:50%;border:1px solid var(--line-2);background:var(--panel-2)}
.uname{font-size:13px;font-weight:600}
.account-badge{padding:4px 8px;border:1px solid var(--line-2);border-radius:20px;font-size:10px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.account-badge.premium{border-color:rgba(0,229,160,.45);background:rgba(0,229,160,.1);color:var(--accent)}
.account-badge.management{border-color:rgba(0,184,255,.45);background:rgba(0,184,255,.1);color:var(--accent-2)}
.account-badge.role-error{border-color:rgba(255,77,94,.45);background:rgba(255,77,94,.1);color:var(--danger)}

/* ---------- Buttons ---------- */
.btn{
  border:1px solid var(--line-2);border-radius:9px;
  background:var(--panel);color:var(--txt);
  font-family:inherit;font-size:13px;font-weight:600;
  padding:9px 16px;cursor:pointer;
  transition:all .16s var(--ease);
}
.btn:hover{border-color:#3a4658;transform:translateY(-1px)}
.btn.small{padding:6px 12px;font-size:12px}
.btn.primary{
  background:linear-gradient(135deg,var(--accent),#00c88a);
  color:#04120c;border-color:transparent;
  box-shadow:0 4px 16px rgba(0,229,160,.22);
}
.btn.primary:hover{box-shadow:0 6px 22px rgba(0,229,160,.32)}
.btn.ghost{background:transparent}
.btn.discord{
  background:#5865f2;border-color:transparent;color:#fff;
  box-shadow:0 4px 16px rgba(88,101,242,.3);
}
.btn.discord:hover{background:#4752c4}

/* ---------- Layout ---------- */
main{max-width:1080px;margin:0 auto;padding:36px 28px 80px}
.hidden{display:none !important}

.login-screen{min-height:calc(100vh - 65px);display:grid;place-items:center;padding:32px 18px}
.login-card{
  width:min(100%,440px);padding:34px;
  background:linear-gradient(160deg,var(--panel-2),var(--panel));
  border:1px solid var(--line);border-radius:16px;
  box-shadow:0 24px 80px rgba(0,0,0,.32);text-align:center;
}
.login-card>.logo-mark{margin:0 auto 18px}
.login-card h1{font-size:25px;letter-spacing:-.4px;margin-bottom:10px}
.login-card>p{color:var(--muted);line-height:1.55}
.login-discord{width:100%;margin-top:22px;padding:11px}
.login-divider{display:flex;align-items:center;gap:12px;margin:22px 0;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.09em}
.login-divider:before,.login-divider:after{content:"";height:1px;flex:1;background:var(--line)}
#bypassForm{text-align:left}
#bypassForm label{display:block;margin-bottom:8px;font-size:12px;font-weight:600;color:var(--txt)}
.bypass-controls{display:flex;gap:8px}
.bypass-controls input{
  flex:1;min-width:0;background:var(--bg-2);border:1px solid var(--line);
  border-radius:9px;padding:10px 12px;color:var(--txt);font:inherit;
}
.bypass-controls input:focus{outline:none;border-color:var(--accent)}
.bypass-controls button{white-space:nowrap}
.bypass-controls button:disabled{opacity:.6;cursor:wait}
.login-card .auth-hint,.login-error{min-height:18px;margin-top:9px;font-size:12px;color:var(--warn)}
.login-error{color:var(--danger)}
.login-card .login-note{margin-top:18px;font-size:11px}

.hero{margin-bottom:28px}
.hero h1{font-size:34px;line-height:1.15;letter-spacing:-.5px;margin-bottom:12px}
.lede{color:var(--muted);font-size:15px;line-height:1.6;max-width:760px}
.lede strong{color:var(--txt)}
.notice{
  margin-top:16px;padding:13px 16px;
  border:1px solid rgba(255,176,32,.28);
  background:rgba(255,176,32,.07);
  border-radius:var(--radius);
  font-size:13px;line-height:1.55;color:#f0d9a8;
}
.notice strong{color:var(--warn)}

/* ---------- Stats ---------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:24px}
.stat-card{
  background:linear-gradient(160deg,var(--panel-2),var(--panel));
  border:1px solid var(--line);border-radius:var(--radius);
  padding:16px 18px;display:flex;flex-direction:column;gap:2px;
}
.stat-label{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.stat-value{font-size:26px;font-weight:800;letter-spacing:-.5px}
.stat-value.accent{color:var(--accent)}
.stat-value.good{color:var(--accent-2)}
.stat-sub{font-size:11.5px;color:var(--muted)}

/* ---------- Toolbar ---------- */
.toolbar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:14px}
#searchInput{
  flex:1;min-width:220px;
  background:var(--panel);border:1px solid var(--line);
  border-radius:9px;padding:10px 14px;
  color:var(--txt);font-family:inherit;font-size:13px;
}
#searchInput:focus{outline:none;border-color:var(--accent)}
.filters{display:flex;gap:6px}
.chip{
  border:1px solid var(--line);border-radius:20px;
  background:var(--panel);color:var(--muted);
  font-family:inherit;font-size:12.5px;font-weight:600;
  padding:7px 15px;cursor:pointer;transition:all .16s var(--ease);
}
.chip:hover{color:var(--txt);border-color:var(--line-2)}
.chip.active{background:rgba(0,229,160,.12);border-color:var(--accent);color:var(--accent)}

.cat-nav{display:flex;flex-wrap:wrap;gap:6px;width:100%}
.cat-btn{
  border:1px solid var(--line);border-radius:8px;
  background:transparent;color:var(--muted);
  font-family:inherit;font-size:12.5px;font-weight:600;
  padding:7px 13px;cursor:pointer;transition:all .16s var(--ease);
}
.cat-btn:hover{color:var(--txt);border-color:var(--line-2)}
.cat-btn.active{background:var(--panel-2);border-color:var(--accent-2);color:var(--accent-2)}

/* ---------- Actions ---------- */
.actions{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:22px}

/* ---------- Tweak rows ---------- */
.tweak-list{display:flex;flex-direction:column;gap:10px}
.tweak{
  display:flex;align-items:flex-start;gap:14px;
  background:var(--panel);border:1px solid var(--line);
  border-radius:var(--radius);padding:16px 18px;
  transition:border-color .16s var(--ease),background .16s var(--ease);
}
.tweak:hover{border-color:var(--line-2)}
.tweak.on{border-color:rgba(0,229,160,.45);background:linear-gradient(160deg,rgba(0,229,160,.06),var(--panel))}
.tweak input[type="checkbox"]{
  width:17px;height:17px;margin-top:3px;
  accent-color:var(--accent);cursor:pointer;flex-shrink:0;
}
.tweak-info{flex:1;display:flex;flex-direction:column;gap:6px}
.tweak-info h3{font-size:14.5px;font-weight:650}
.tweak-desc{font-size:12.8px;line-height:1.55;color:var(--muted)}
.tweak-meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:2px}
.tag{
  font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  padding:3px 9px;border-radius:20px;
  border:1px solid var(--line-2);color:var(--muted);
}
.tag.safe{border-color:rgba(0,229,160,.4);color:var(--accent);background:rgba(0,229,160,.08)}
.tag.moderate{border-color:rgba(255,176,32,.4);color:var(--warn);background:rgba(255,176,32,.08)}
.tag.advanced{border-color:rgba(255,77,94,.4);color:var(--danger);background:rgba(255,77,94,.08)}
.tag.fps{border-color:rgba(0,184,255,.4);color:var(--accent-2);background:rgba(0,184,255,.08)}
.empty{color:var(--muted);padding:28px;text-align:center;border:1px dashed var(--line);border-radius:var(--radius)}

/* ---------- Profiles ---------- */
.profiles{
  margin-top:40px;padding:22px;
  background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
}
.profiles h2{font-size:18px;margin-bottom:6px}
.profiles .sub{font-size:13px;color:var(--muted);margin-bottom:16px}
.profile-save{display:flex;gap:10px;margin-bottom:16px}
.profile-save input{
  flex:1;background:var(--bg-2);border:1px solid var(--line);
  border-radius:9px;padding:9px 13px;color:var(--txt);font-family:inherit;font-size:13px;
}
.profile-save input:focus{outline:none;border-color:var(--accent)}
.profile-list{display:flex;flex-direction:column;gap:8px}
.profile-row{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:11px 14px;background:var(--bg-2);
  border:1px solid var(--line);border-radius:9px;
}
.profile-row .pname{font-weight:600;font-size:13.5px}
.profile-row .pmeta{font-size:11.5px;color:var(--muted)}
.profile-row .pacts{display:flex;gap:8px}
#premiumError{margin-bottom:10px}
#premiumGrantBtn:disabled{opacity:.6;cursor:wait}

/* ---------- Toast ---------- */
.toast{
  position:fixed;left:50%;bottom:26px;transform:translate(-50%,140%);
  background:var(--panel-2);border:1px solid var(--line-2);
  border-radius:10px;padding:12px 20px;
  font-size:13px;font-weight:600;
  box-shadow:0 12px 40px rgba(0,0,0,.5);
  transition:transform .28s var(--ease);
  z-index:50;max-width:90vw;
}
.toast.show{transform:translate(-50%,0)}
.toast.ok{border-color:rgba(0,229,160,.5);color:var(--accent)}
.toast.err{border-color:rgba(255,77,94,.5);color:var(--danger)}

@media (max-width:820px){
  .stats{grid-template-columns:repeat(2,1fr)}
  .hero h1{font-size:26px}
  .topbar{flex-wrap:wrap}
}