*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:Arial,Helvetica,sans-serif;background:#050812;color:#f4f7fb;line-height:1.6;overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-3;background:linear-gradient(125deg,#050812,#0a1720 35%,#071b14 70%,#050812);background-size:300% 300%;animation:bgMove 14s ease infinite}
body:after{content:"";position:fixed;inset:0;pointer-events:none;z-index:-2;opacity:.22;background-image:radial-gradient(circle at 15% 20%,#4ade80 0 1px,transparent 2px),radial-gradient(circle at 80% 35%,#60a5fa 0 1px,transparent 2px),radial-gradient(circle at 55% 80%,#fff 0 1px,transparent 2px);background-size:180px 180px,240px 240px,140px 140px;animation:stars 18s linear infinite}
@keyframes bgMove{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@keyframes stars{to{transform:translateY(-35px)}}
@keyframes pulse{50%{box-shadow:0 0 0 7px rgba(74,222,128,.08)}}
.credits{position:fixed;top:0;left:0;width:100%;z-index:50;text-align:center;padding:6px 10px;background:rgba(4,8,16,.88);backdrop-filter:blur(12px);color:#aab8c6;font-size:12px;letter-spacing:.5px;border-bottom:1px solid #1c2a38}
.credits strong{color:#68ef87}
nav{position:fixed;top:31px;width:100%;z-index:40;padding:13px 5%;display:flex;justify-content:space-between;align-items:center;background:rgba(5,9,17,.68);backdrop-filter:blur(16px);border-bottom:1px solid rgba(70,100,120,.3)}
.logo{font-weight:900;letter-spacing:2px;font-size:21px}.logo span{color:#48e06f}
.hamburger{width:45px;height:42px;border:1px solid #2a4050;background:#0c1822;color:#fff;border-radius:10px;font-size:24px;cursor:pointer;display:flex;align-items:center;justify-content:center}
.hero{min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;padding:145px 20px 70px;position:relative;overflow:hidden}
.hero:before,.hero:after{content:"";position:absolute;border-radius:50%;filter:blur(90px);pointer-events:none}
.hero:before{width:360px;height:360px;background:#22c55e;opacity:.16;left:5%;top:30%}
.hero:after{width:430px;height:430px;background:#3b82f6;opacity:.12;right:2%;top:15%}
.hero-content{position:relative;z-index:1;max-width:900px}
.badge{display:inline-block;border:1px solid #2d7042;background:rgba(16,35,25,.8);color:#68ef87;padding:7px 14px;border-radius:999px;font-size:13px;font-weight:800;margin-bottom:22px}
h1{font-size:clamp(48px,10vw,96px);line-height:.95;letter-spacing:-4px;text-shadow:0 0 35px #1a9b48}
.subtitle{margin:25px auto;color:#b4c1ce;font-size:18px;max-width:700px}
.ipbox{display:flex;justify-content:center;align-items:center;gap:10px;flex-wrap:wrap;margin:28px 0}
.ip{background:rgba(14,22,32,.8);border:1px solid #263849;padding:14px 20px;border-radius:10px;color:#8df6a4;font-weight:800}
button,.btn{border:0;border-radius:10px;padding:13px 20px;font-weight:900;cursor:pointer;text-decoration:none;display:inline-block;transition:.2s}
button:hover,.btn:hover{transform:translateY(-1px)}
.primary{background:#4ade80;color:#06100a}.primary:hover{background:#67ef96}.secondary{background:#121c27;color:#eaf2f8;border:1px solid #2a3b4c}.danger{background:#3b1720;color:#ffb4be;border:1px solid #7e2f3e}
section{padding:85px 5%;position:relative;scroll-margin-top:95px}.section-title{text-align:center;font-size:36px;margin-bottom:10px}.section-sub{text-align:center;color:#8f9eac;margin-bottom:30px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:1100px;margin:auto}
.card,.panel{background:linear-gradient(145deg,rgba(14,23,33,.9),rgba(7,14,23,.82));border:1px solid #1e3040;border-radius:16px;padding:25px;box-shadow:0 18px 50px rgba(0,0,0,.18)}
.card{transition:.25s}.card:hover{transform:translateY(-5px);border-color:#3fdc70;box-shadow:0 18px 60px rgba(40,220,110,.08)}
.card h3{margin-bottom:7px}.card p{color:#8f9eac}.icon{font-size:30px;margin-bottom:8px}
.rules{max-width:850px;margin:auto}.rule{padding:15px 18px;margin:9px 0;background:rgba(13,21,30,.82);border-left:3px solid #4ade80;border-radius:8px;color:#b9c6d2}
input,textarea,select{width:100%;padding:13px;margin:7px 0 12px;background:#08111a;color:#fff;border:1px solid #263849;border-radius:9px;outline:none;font:inherit}
input:focus,textarea:focus,select:focus{border-color:#4ade80}textarea{min-height:110px;resize:vertical}
label{display:block;color:#b9c6d2;font-size:13px;font-weight:700;margin-top:8px}.form{max-width:550px;margin:auto}.status{display:inline-block;padding:6px 10px;border-radius:20px;background:#12351f;color:#68ef87;font-size:12px;font-weight:800}.status.offline{background:#32151c;color:#ffabb7}
.qrbox{display:flex;flex-direction:column;align-items:center;gap:10px}.qr-preview{width:220px;height:220px;object-fit:contain;border:2px dashed #4ade80;border-radius:14px;background:#071019;padding:8px}.qr-placeholder{width:220px;height:220px;border:2px dashed #4ade80;border-radius:14px;display:flex;align-items:center;justify-content:center;text-align:center;color:#8f9eac;padding:20px}
.list{display:grid;gap:10px}.item{background:#0d1721;border:1px solid #203343;border-radius:10px;padding:14px}.item small{color:#8293a2}.item button{padding:8px 12px;font-size:12px;margin-top:9px}
.notice{padding:12px;background:#13251a;border:1px solid #2d7042;color:#a8efb8;border-radius:9px;margin-bottom:15px}
.cta{text-align:center;background:linear-gradient(180deg,rgba(11,18,27,.7),rgba(7,17,12,.75))}
footer{text-align:center;padding:35px 20px;color:#718090;border-top:1px solid #182531}
.auth-welcome{display:none;text-align:center}.auth-welcome.show{display:block}.auth-login.hide{display:none}
.tabs{display:flex;gap:8px;margin-bottom:18px}.tabs button{flex:1;padding:10px;background:#0b1720;color:#9cafbd;border:1px solid #203343}.tabs button.active{background:#163a24;color:#74ef91;border-color:#3a9455}
.auth-form{display:none}.auth-form.active{display:block}.muted{color:#8f9eac;font-size:13px}.account-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:20px;max-width:1050px;margin:auto}
.sidebar{position:fixed;top:0;right:-330px;width:min(330px,88vw);height:100vh;z-index:100;background:rgba(5,11,18,.97);backdrop-filter:blur(18px);border-left:1px solid #263b4b;padding:100px 22px 25px;transition:right .3s ease;box-shadow:-20px 0 70px rgba(0,0,0,.45);overflow-y:auto}
.sidebar.open{right:0}.sidebar h3{color:#68ef87;margin-bottom:15px}.sidebar a,.side-link{display:block;width:100%;text-align:left;color:#d7e0e8;text-decoration:none;padding:12px 13px;margin:5px 0;border-radius:9px;background:#0c1721;border:1px solid #172a38}.sidebar a:hover,.side-link:hover{background:#12261a;border-color:#3d8f58}
.close-side{position:absolute;right:18px;top:55px;background:#121e29;color:#fff;border:1px solid #294052;padding:8px 12px}
.overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:90}.overlay.show{display:block}
.user-chip{display:none;color:#8df6a4;font-size:13px;font-weight:800}.user-chip.show{display:block}
.server-stat{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:14px 0;border-bottom:1px solid #203343}.server-stat:last-child{border-bottom:0}.server-stat span:first-child{color:#8f9eac}
.pulse{animation:pulse 2s infinite}.center{text-align:center}.button-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}.button-row>*{flex:0 0 auto}.hidden{display:none!important}
@media(max-width:750px){.grid,.account-grid{grid-template-columns:1fr}section{padding:65px 5%}h1{letter-spacing:-2px}.hero{padding-top:150px}.user-chip{display:none}.section-title{font-size:30px}}
.dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:6px;vertical-align:middle;background:#94a3b8}
.status.online .dot{background:#22e36b;box-shadow:0 0 8px #22e36b}.status.offline .dot{background:#ff3b55;box-shadow:0 0 8px #ff3b55}
.status.checking{background:#1a2532;color:#cbd5e1}
.google-row{max-width:1050px;margin:20px auto 0;display:flex;gap:12px;align-items:center;justify-content:center;flex-wrap:wrap;text-align:center}
