:root{
  --bg:#030502;--panel:rgba(12,18,8,.82);--accent:#BEEE11;--accent2:#8fd400;--text:#f7ffe8;--muted:#d4e4b8;--line:rgba(190,238,17,.22);--ok:#BEEE11;--bad:#ff496e;--pending:#ffd166;--shadow:0 28px 90px rgba(0,0,0,.58);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;color:var(--text);min-height:100vh;overflow-x:hidden;background:linear-gradient(rgba(0,0,0,.22),rgba(0,0,0,.45)),url('/los-santos-bg.png') center center/cover fixed no-repeat}
body:before{content:"";position:fixed;inset:0;pointer-events:none;background:linear-gradient(rgba(190,238,17,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(190,238,17,.025) 1px,transparent 1px);background-size:72px 72px;z-index:0}
body:after{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 35%,rgba(190,238,17,.08),rgba(0,0,0,.18) 60%,rgba(0,0,0,.55) 100%);z-index:0}
body>*{position:relative;z-index:1}
a{color:inherit;text-decoration:none}
.nav{position:sticky;top:0;z-index:50;min-height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 7%;background:rgba(0,0,0,.55);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
.brand{display:flex;gap:12px;align-items:center;font-weight:950}.brand img{width:54px;height:54px;object-fit:cover;border-radius:14px;box-shadow:0 0 30px rgba(190,238,17,.42)}.brand span{color:#efffca}.links{display:flex;gap:18px;align-items:center;flex-wrap:wrap}.links>a{color:#e7ffc0;font-weight:900;font-size:14px;text-transform:uppercase}.links>a:hover{color:var(--accent)}
.btn,button{border:0;border-radius:14px;padding:14px 24px;background:linear-gradient(135deg,var(--accent),var(--accent2));color:#071000;font-weight:950;cursor:pointer;box-shadow:0 0 32px rgba(190,238,17,.36);transition:.22s}.btn:hover,button:hover{transform:translateY(-2px);filter:brightness(1.08)}
.ghost{background:rgba(0,0,0,.45);color:var(--text);box-shadow:none;border:1px solid rgba(190,238,17,.35)}.small{padding:10px 16px;border-radius:999px}.mini{padding:8px 11px;margin-left:5px;font-size:12px;border-radius:999px}
.hero{min-height:calc(100vh - 76px);display:grid;grid-template-columns:1fr 1fr;gap:54px;align-items:center;padding:62px 7% 86px;position:relative}
.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.65),rgba(0,0,0,.38),rgba(0,0,0,.2),rgba(0,0,0,.42));pointer-events:none;z-index:0}
.heroCopy,.heroArt{position:relative;z-index:2}
.badge{display:inline-flex;border:1px solid rgba(190,238,17,.4);background:rgba(0,0,0,.35);color:#efffb9;border-radius:999px;padding:9px 13px;font-weight:950;font-size:13px}.badge.ok{background:rgba(190,238,17,.18);color:var(--accent)}
.hero h1{font-size:clamp(48px,6vw,88px);line-height:.86;margin:20px 0 22px;letter-spacing:-5px}.gradient{background:linear-gradient(90deg,#fff,#ecffc0,var(--accent),var(--accent2));-webkit-background-clip:text;background-clip:text;color:transparent}.hero p{font-size:20px;line-height:1.65;color:var(--muted);max-width:730px;text-shadow:0 2px 12px rgba(0,0,0,.8)}
.actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px}.logoHero{width:min(540px,100%);filter:drop-shadow(0 0 42px rgba(190,238,17,.45));border-radius:18px}.glow{position:absolute;width:70%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(190,238,17,.22),transparent 66%);filter:blur(30px)}
.stats{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}.statPill{border:1px solid rgba(190,238,17,.22);background:rgba(0,0,0,.32);border-radius:999px;padding:10px 14px;color:#eaffbf;font-weight:900;font-size:13px}
.featureWrap{padding:0 7% 92px}.sectionTitle{font-size:clamp(34px,4vw,56px);margin:0 0 26px}.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.card,.form{background:rgba(8,10,5,.76);border:1px solid var(--line);border-radius:28px;padding:28px;box-shadow:var(--shadow);backdrop-filter:blur(10px)}.card{transition:.25s}.card:hover{transform:translateY(-6px);border-color:rgba(190,238,17,.7);box-shadow:0 0 44px rgba(190,238,17,.18),var(--shadow)}.card p,.muted{color:var(--muted);line-height:1.65}
.discordPanel{margin:42px 7% 90px;padding:34px;border:1px solid rgba(190,238,17,.32);border-radius:34px;background:rgba(3,5,2,.82);box-shadow:0 0 55px rgba(190,238,17,.12);backdrop-filter:blur(12px)}
.wrap{max-width:1120px;margin:auto;padding:58px 7%}.narrow{max-width:780px}.pageHead h1{font-size:clamp(44px,6vw,76px);line-height:.9;margin:16px 0 14px;letter-spacing:-3px}
.form{display:grid;gap:15px}label{font-weight:950;color:#f0ffcc}input,select,textarea{width:100%;padding:16px;border-radius:16px;border:1px solid rgba(190,238,17,.2);background:rgba(2,3,2,.84);color:var(--text);outline:none}input:focus,select:focus,textarea:focus{border-color:rgba(190,238,17,.78);box-shadow:0 0 0 4px rgba(190,238,17,.12)}input[readonly]{background:rgba(190,238,17,.08);color:#efffb9}textarea{min-height:118px;resize:vertical}.grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}
.statusList{display:grid;gap:18px}.status{display:inline-block;padding:7px 12px;border-radius:999px;font-weight:950;text-transform:uppercase;font-size:12px}.pending{background:rgba(255,209,102,.13);color:var(--pending)}.approved{background:rgba(190,238,17,.14);color:var(--accent)}.denied{background:rgba(255,85,119,.13);color:var(--bad)}
pre{white-space:pre-wrap;background:rgba(0,0,0,.42);border:1px solid rgba(190,238,17,.13);border-radius:16px;padding:16px;overflow:auto;color:#f7ffe8}.adminTop{display:flex;justify-content:space-between;gap:16px}.joinBox{margin:18px 0;padding:18px;border:1px solid rgba(190,238,17,.26);border-radius:22px;background:rgba(190,238,17,.08)}.footer{text-align:center;color:var(--muted);padding:34px;border-top:1px solid rgba(190,238,17,.08);background:rgba(0,0,0,.45)}
@media(max-width:980px){.hero{grid-template-columns:1fr;text-align:center}.hero p{margin:auto}.actions,.stats{justify-content:center}.logoHero{width:min(480px,100%)}}
@media(max-width:860px){.nav{height:auto;padding:12px 4%;align-items:flex-start}.links{justify-content:flex-end;gap:8px}.links>a{font-size:12px}.cards,.grid{grid-template-columns:1fr}.wrap{padding:38px 5%}.brand span{display:none}.hero{padding:44px 6% 70px}.hero h1{letter-spacing:-3px}.featureWrap{padding:0 5% 60px}.discordPanel{margin:28px 5% 60px}.card,.form{border-radius:24px;padding:22px}}

.premiumPanel{
  display:flex;
  align-items:center;
  justify-content:center;
}

.serverCard{
  width:min(520px,100%);
  background:
    linear-gradient(180deg,rgba(10,16,6,.92),rgba(0,0,0,.78));
  border:1px solid rgba(190,238,17,.28);
  border-radius:32px;
  padding:30px;
  box-shadow:
    0 0 70px rgba(190,238,17,.16),
    0 30px 90px rgba(0,0,0,.65);
  backdrop-filter:blur(16px);
}

.serverTop{
  display:flex;
  justify-content:space-between;
  gap:18px;
  align-items:flex-start;
  margin-bottom:26px;
}

.miniLabel{
  display:block;
  color:var(--accent);
  font-size:12px;
  font-weight:950;
  letter-spacing:1.5px;
  margin-bottom:8px;
}

.serverTop h2{
  font-size:42px;
  line-height:1;
  margin:0;
}

.onlineDot{
  border:1px solid rgba(190,238,17,.4);
  color:var(--accent);
  border-radius:999px;
  padding:8px 12px;
  font-size:12px;
  font-weight:950;
  background:rgba(190,238,17,.08);
}

.serverStats{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  margin-bottom:22px;
}

.serverStats div{
  background:rgba(255,255,255,.045);
  border:1px solid rgba(190,238,17,.14);
  border-radius:18px;
  padding:16px;
}

.serverStats strong{
  display:block;
  color:#fff;
  font-size:14px;
}

.serverStats span{
  display:block;
  color:var(--muted);
  font-size:13px;
  margin-top:6px;
}

.serverFeatures{
  display:grid;
  gap:12px;
  margin:22px 0;
}

.serverFeatures div{
  background:rgba(0,0,0,.32);
  border:1px solid rgba(190,238,17,.13);
  border-radius:18px;
  padding:16px;
}

.serverFeatures b{
  display:block;
  color:#f7ffe8;
  margin-bottom:4px;
}

.serverFeatures span{
  color:var(--muted);
  font-size:14px;
}

.fullBtn{
  display:block;
  text-align:center;
  width:100%;
  margin-top:18px;
}

@media(max-width:980px){
  .serverCard{
    margin-top:20px;
  }

  .serverStats{
    grid-template-columns:1fr;
  }
}

.heroTagline{
  font-size:22px;
  font-weight:900;
  color:var(--accent);
  margin-bottom:18px;
  text-transform:uppercase;
  letter-spacing:2px;
}
