:root{
    --bg:#090710;
    --panel:rgba(27,18,43,.72);
    --panel2:rgba(45,26,72,.66);
    --border:rgba(255,255,255,.12);
    --text:#f6f2ff;
    --muted:#aaa1ba;
    --pink:#ff4fa3;
    --purple:#9c3cff;
    --orange:#ff914d;
    --cyan:#48e5f4;
    --shadow:0 24px 80px rgba(0,0,0,.35);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
    margin:0; min-height:100vh; color:var(--text); background:var(--bg);
    font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
button,input{font:inherit}
.ambient{position:fixed;pointer-events:none;filter:blur(90px);opacity:.38;z-index:-2;border-radius:999px}
.ambient-a{width:540px;height:540px;left:-220px;top:-180px;background:#5420d6}
.ambient-b{width:480px;height:480px;right:-220px;bottom:-150px;background:#9e1c69}
.ambient-c{width:260px;height:260px;left:28%;top:45%;background:#5c2d8e;opacity:.13}
body:before{
    content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;
    background:radial-gradient(circle at 50% 20%,rgba(139,62,220,.09),transparent 38%),
               linear-gradient(180deg,rgba(255,255,255,.015),transparent 35%);
}
.shell{width:min(1180px,calc(100% - 40px));margin:auto}
.topbar{height:78px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand,.nav-pill,.store-btn,.glass{
    border:1px solid var(--border);
    background:rgba(17,13,27,.64);
    box-shadow:0 10px 45px rgba(0,0,0,.18);
    backdrop-filter:blur(18px);
}
.brand{display:flex;align-items:center;gap:10px;padding:10px 15px;border-radius:28px;font-weight:800}
.brand-mark{
    display:grid;place-items:center;width:28px;height:28px;border-radius:9px;
    background:linear-gradient(135deg,#9c3cff,#ff4fa3);font-size:9px;letter-spacing:-.5px;
}
.nav-pill{display:flex;align-items:center;gap:4px;padding:7px;border-radius:32px}
.nav-pill a{padding:10px 20px;border-radius:25px;color:#a9a1b8;font-size:14px;font-weight:600}
.nav-pill a:hover{color:#fff}
.nav-pill a.active{color:#fff;background:linear-gradient(100deg,#9e42ef,#f34fa2);box-shadow:0 8px 25px rgba(190,60,220,.25)}
.store-btn,.primary-btn,.secondary-btn{
    display:inline-flex;align-items:center;justify-content:center;gap:10px;border:0;cursor:pointer;
    border-radius:15px;padding:14px 24px;font-weight:800;color:white;transition:.2s ease;
}
.store-btn{padding:11px 22px;background:linear-gradient(100deg,var(--orange),var(--pink));color:#160d19;border-color:transparent}
.primary-btn{background:linear-gradient(100deg,#a23ff0,#ff4fa3);box-shadow:0 15px 35px rgba(211,57,226,.25)}
.secondary-btn{background:rgba(255,255,255,.045);border:1px solid var(--border);color:#eee9f6}
.primary-btn:hover,.secondary-btn:hover,.store-btn:hover{transform:translateY(-2px)}
.home{padding-top:92px}
.hero-grid{display:grid;grid-template-columns:1.35fr .85fr;gap:74px;align-items:center;min-height:650px}
.hero-copy{padding-bottom:20px}
.eyebrow{
    display:inline-flex;align-items:center;gap:8px;padding:8px 13px;border:1px solid var(--border);
    border-radius:20px;color:#aaa2b9;font-size:13px;background:rgba(255,255,255,.035)
}
.pulse,.live-badge span,.status-pill span{
    width:7px;height:7px;border-radius:50%;display:inline-block;background:var(--cyan);box-shadow:0 0 12px rgba(72,229,244,.9)
}
.kicker{margin:58px 0 12px;color:#aaa2b9;font-size:16px}
h1,h2,p{margin-top:0}
.hero-copy h1{
    font-size:clamp(44px,6vw,72px);line-height:1.02;margin:0 0 22px;font-weight:800;letter-spacing:-2.5px;
    background:linear-gradient(90deg,#ff4fa3,#ff8e52);-webkit-background-clip:text;background-clip:text;color:transparent;
}
.lead{max-width:650px;color:#bcb3c9;line-height:1.7;font-size:16px}
.lead.small{margin-top:25px}
.actions{display:flex;gap:13px;margin-top:30px;flex-wrap:wrap}
.server-card{padding:29px;border-radius:27px;background:linear-gradient(150deg,rgba(64,30,104,.68),rgba(23,18,35,.76))}
.card-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}
.live-badge{font-size:11px;padding:6px 10px;border:1px solid rgba(72,229,244,.35);border-radius:20px;color:#62e7ef;background:rgba(72,229,244,.08)}
.live-badge span{margin-right:6px}
.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.stat-box{min-height:140px;padding:18px;border:1px solid rgba(255,255,255,.11);border-radius:18px;background:rgba(255,255,255,.045)}
.stat-icon{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;margin-bottom:14px;background:linear-gradient(135deg,#a33fe7,#ff4fa3)}
.stat-icon.blue{background:linear-gradient(135deg,#4fe4f1,#8c55ee)}
.stat-icon.orange{background:linear-gradient(135deg,#ff9b4d,#ff5c75)}
.stat-icon.purple{background:linear-gradient(135deg,#ff4fa3,#9655ef)}
.stat-box strong{display:block;font-size:27px;margin-bottom:4px}
.stat-box span{display:block;color:#a69caf;font-size:12px}
.info-row{margin-top:10px;padding:12px 14px;border-radius:13px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09);display:flex;justify-content:space-between;color:#c7c0d0;font-size:13px}
.info-row b{color:#f1edf7}
.info-section{margin:100px 0;padding:38px;border-radius:27px;border:1px solid var(--border);background:rgba(20,15,30,.65);display:flex;justify-content:space-between;align-items:center;gap:30px}
.info-section h2{font-size:30px;margin:10px 0}
.info-section p{color:var(--muted);max-width:650px;line-height:1.6}
.footer{padding:28px 0 45px;color:#70697d;font-size:12px;display:flex;justify-content:space-between}
.ban-page{padding:74px 0 80px}
.page-heading{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:28px}
.page-heading h1{font-size:54px;letter-spacing:-2px;margin:14px 0 8px}
.page-heading p{color:var(--muted);margin:0}
.ban-count{padding:18px 24px;border-radius:20px;text-align:right}
.ban-count strong{font-size:28px;display:block}
.ban-count span{font-size:12px;color:var(--muted)}
.searchbar{display:flex;align-items:center;gap:12px;padding:8px 9px 8px 18px;border-radius:18px;margin-bottom:22px}
.searchbar>span{font-size:23px;color:#988ca7}
.searchbar input{flex:1;background:transparent;border:0;outline:0;color:#fff;min-width:0}
.searchbar input::placeholder{color:#766d80}
.searchbar a{color:#8f8698}
.searchbar button{border:0;background:linear-gradient(100deg,#9c3cff,#ff4fa3);color:#fff;padding:11px 18px;border-radius:12px;font-weight:700;cursor:pointer}
.ban-list{display:grid;gap:13px}
.ban-card{display:flex;gap:18px;padding:18px;border-radius:22px;background:linear-gradient(110deg,rgba(28,21,40,.78),rgba(39,24,60,.68))}
.ban-avatar{width:68px;height:68px;flex:0 0 68px;border-radius:17px;overflow:hidden;display:grid;place-items:center;background:linear-gradient(135deg,#9c3cff,#ff4fa3);border:1px solid rgba(255,255,255,.13)}
.ban-avatar img{width:100%;height:100%;image-rendering:auto}
.ban-avatar span{font-size:24px}
.ban-main{flex:1;min-width:0}
.ban-top{display:flex;align-items:start;justify-content:space-between;gap:20px}
.ban-top h2{font-size:18px;margin:2px 0 5px}
.uuid{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;color:#7e7489}
.status-pill{white-space:nowrap;padding:7px 10px;border-radius:20px;background:rgba(75,220,164,.09);border:1px solid rgba(75,220,164,.25);color:#74e9b9;font-size:11px}
.status-pill span{background:#68e4ac;box-shadow:0 0 12px rgba(75,220,164,.7);margin-right:5px}
.reason{margin:14px 0;color:#ddd6e4;font-size:14px}
.meta{display:flex;gap:18px;flex-wrap:wrap;color:#8f8799;font-size:11px}
.empty{text-align:center;padding:70px 20px;border-radius:22px}
.empty-icon{width:50px;height:50px;border-radius:16px;display:grid;place-items:center;margin:0 auto 15px;background:rgba(75,220,164,.1);color:#71e5b7}
.empty h2{margin-bottom:7px}
.empty p{color:var(--muted)}
.alert{padding:22px;border-radius:18px;display:flex;flex-direction:column;gap:7px;color:#f2d9ff}
.alert span,.alert small{color:var(--muted)}
.pagination{display:flex;justify-content:center;gap:7px;margin-top:28px}
.pagination a{min-width:40px;height:40px;display:grid;place-items:center;border-radius:12px;background:rgba(255,255,255,.045);border:1px solid var(--border);color:#aaa1b1}
.pagination a.active{color:#fff;background:linear-gradient(100deg,#9c3cff,#ff4fa3);border-color:transparent}
@media (max-width:900px){
    .topbar{height:auto;padding-top:15px;flex-wrap:wrap}
    .nav-pill{order:3;width:100%;justify-content:center}
    .hero-grid{grid-template-columns:1fr;gap:30px;padding-top:20px}
    .server-card{max-width:620px}
    .home{padding-top:40px}
}
@media (max-width:620px){
    .shell{width:min(100% - 24px,1180px)}
    .brand{padding:8px 12px}
    .store-btn{padding:10px 14px}
    .nav-pill a{padding:9px 12px;font-size:12px}
    .hero-copy h1{font-size:45px}
    .kicker{margin-top:38px}
    .stat-box{min-height:120px}
    .info-section{flex-direction:column;align-items:flex-start}
    .page-heading{align-items:flex-start;flex-direction:column}
    .page-heading h1{font-size:43px}
    .ban-count{text-align:left}
    .ban-card{padding:14px}
    .ban-avatar{width:54px;height:54px;flex-basis:54px;border-radius:14px}
    .ban-top{flex-direction:column;gap:10px}
    .footer{flex-direction:column;gap:8px}
}