:root{
  --bg:#06070d;
  --panel:rgba(16,22,34,.72);
  --panel-strong:rgba(18,25,38,.92);
  --text:#eef6ff;
  --muted:#93a4bd;
  --cyan:#35f6ff;
  --red:#ff315e;
  --gold:#ffd166;
  --green:#38f28c;
  --border:rgba(255,255,255,.11);
  --shadow:0 25px 80px rgba(0,0,0,.45);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;background:var(--bg);color:var(--text);overflow-x:hidden;min-height:100vh}
a{color:inherit;text-decoration:none}
.noise{position:fixed;inset:0;pointer-events:none;z-index:1;background-image:radial-gradient(circle at 20% 10%,rgba(53,246,255,.13),transparent 25%),radial-gradient(circle at 80% 0%,rgba(255,49,94,.16),transparent 28%),linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:auto,auto,48px 48px,48px 48px;mask-image:linear-gradient(to bottom,#000 40%,transparent 100%)}
.skyline{position:fixed;inset:auto 0 0 0;height:38vh;z-index:0;opacity:.45;background:linear-gradient(to top,#05060b 0 16%,transparent 16%),repeating-linear-gradient(90deg,transparent 0 42px,rgba(53,246,255,.08) 42px 44px,transparent 44px 80px);clip-path:polygon(0 100%,0 45%,4% 45%,4% 33%,9% 33%,9% 53%,13% 53%,13% 28%,20% 28%,20% 48%,25% 48%,25% 22%,32% 22%,32% 58%,38% 58%,38% 36%,45% 36%,45% 16%,52% 16%,52% 46%,58% 46%,58% 26%,66% 26%,66% 56%,72% 56%,72% 34%,78% 34%,78% 50%,84% 50%,84% 18%,91% 18%,91% 42%,100% 42%,100% 100%)}
.cursor-glow{position:fixed;top:0;left:0;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(53,246,255,.15),rgba(255,49,94,.08) 45%,transparent 70%);pointer-events:none;z-index:2;transition:transform .08s linear;filter:blur(4px)}
.section-pad{position:relative;z-index:3;padding:110px min(7vw,96px)}
.nav,.dash-nav{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:18px min(7vw,96px);background:rgba(6,7,13,.62);backdrop-filter:blur(20px);border-bottom:1px solid var(--border)}
.brand{display:flex;align-items:center;gap:12px}.brand img{width:48px;height:48px;filter:drop-shadow(0 0 20px rgba(53,246,255,.35))}.brand strong{display:block;letter-spacing:.18em}.brand small{display:block;color:var(--muted);font-size:12px;margin-top:2px}.nav nav,.dash-nav nav{display:flex;align-items:center;gap:18px}.nav nav a,.dash-nav nav a{color:var(--muted);font-weight:700;font-size:14px}.nav nav a:hover,.dash-nav nav a:hover{color:var(--text)}.nav-cta{padding:11px 18px;border:1px solid rgba(53,246,255,.35);border-radius:999px;color:var(--text)!important;background:rgba(53,246,255,.08)}.nav-toggle{display:none;background:none;border:0;color:#fff;font-size:28px}
.hero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(340px,.75fr);gap:56px;align-items:center;min-height:calc(100vh - 86px)}
.eyebrow{display:inline-flex;align-items:center;gap:10px;color:var(--cyan);font-weight:900;letter-spacing:.18em;text-transform:uppercase;font-size:12px}.eyebrow:before{content:"";width:34px;height:2px;background:linear-gradient(90deg,var(--cyan),var(--red))}h1,h2,h3,p{margin-top:0}.hero h1,.auth-card h1,.welcome-panel h1{font-size:clamp(42px,6vw,92px);line-height:.92;margin:22px 0;text-transform:uppercase;letter-spacing:-.065em}.split h2,.feature-panel h2,.cta h2{font-size:clamp(34px,4vw,64px);line-height:1;margin:18px 0;letter-spacing:-.05em}.lead{font-size:20px;line-height:1.7;color:#c6d2e5;max-width:760px}.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin:30px 0}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 24px;border-radius:999px;border:1px solid var(--border);font-weight:900;letter-spacing:.04em;transition:.2s ease;cursor:pointer}.btn.primary{color:#051016;background:linear-gradient(135deg,var(--cyan),#fff 42%,var(--red));box-shadow:0 15px 45px rgba(53,246,255,.16)}.btn.ghost{background:rgba(255,255,255,.06);color:var(--text)}.btn.wide{width:100%}.server-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-width:760px}.server-strip div,.dash-card,.module-card,.role-card,.feature-panel,.timeline,.welcome-panel,.profile-card,.auth-card,.auth-side{border:1px solid var(--border);background:var(--panel);backdrop-filter:blur(24px);box-shadow:var(--shadow);border-radius:28px}.server-strip div{padding:16px}.server-strip span,.dash-card span{display:block;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.12em}.server-strip strong,.dash-card strong{display:block;margin-top:7px;font-size:18px}.hero-card{min-height:520px;border:1px solid rgba(53,246,255,.25);background:linear-gradient(145deg,rgba(10,18,33,.84),rgba(255,49,94,.08));border-radius:38px;padding:24px;box-shadow:0 40px 120px rgba(0,0,0,.65),inset 0 0 55px rgba(53,246,255,.06);position:relative;overflow:hidden}.hero-card:before{content:"";position:absolute;inset:-60%;background:conic-gradient(from 180deg,transparent,rgba(53,246,255,.18),transparent,rgba(255,49,94,.14),transparent);animation:spin 10s linear infinite}.hud-top,.city-orb,.mini-stats{position:relative;z-index:2}.hud-top{display:flex;justify-content:space-between;color:var(--muted);font-size:12px;font-weight:900;letter-spacing:.18em}.live-dot{color:var(--green)}.city-orb{height:330px;display:grid;place-items:center}.city-orb img{width:145px;height:145px;animation:float 4.5s ease-in-out infinite}.ring{position:absolute;border-radius:50%;border:1px solid rgba(53,246,255,.3)}.r1{width:250px;height:250px;animation:pulse 3s ease-in-out infinite}.r2{width:330px;height:330px;border-color:rgba(255,49,94,.28);animation:pulse 4s ease-in-out infinite reverse}.r3{width:190px;height:190px;border-style:dashed;animation:spin 18s linear infinite}.mini-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.mini-stats div{padding:16px;background:rgba(255,255,255,.05);border-radius:20px;text-align:center}.mini-stats strong{display:block;font-size:32px}.mini-stats span{display:block;color:var(--muted);font-size:12px}.ticker{position:relative;z-index:4;overflow:hidden;border-block:1px solid var(--border);background:#0d101a}.ticker-track{display:flex;gap:40px;width:max-content;animation:ticker 28s linear infinite;padding:18px 0}.ticker span{font-size:14px;font-weight:1000;color:#fff;letter-spacing:.22em;text-shadow:0 0 18px rgba(53,246,255,.55)}
.split{display:grid;grid-template-columns:.8fr 1fr;gap:70px;align-items:start}.split p,.feature-panel p,.cta p{font-size:18px;line-height:1.8;color:#bfcbdd}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;padding-top:30px}.role-card{min-height:310px;padding:28px;position:relative;overflow:hidden}.role-card:after{content:"";position:absolute;inset:auto -30% -45% -30%;height:180px;background:radial-gradient(circle,rgba(53,246,255,.2),transparent 62%)}.role-card.criminal:after{background:radial-gradient(circle,rgba(255,49,94,.22),transparent 62%)}.role-card.civilian:after{background:radial-gradient(circle,rgba(255,209,102,.2),transparent 62%)}.role-icon{display:grid;place-items:center;width:60px;height:60px;border-radius:20px;background:rgba(255,255,255,.08);font-size:26px}.role-card h3{font-size:34px;margin:28px 0 12px}.role-card p{color:#c2ccdc;line-height:1.7}.feature-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:24px}.feature-panel,.timeline{padding:34px}.timeline{display:grid;gap:14px}.timeline div{display:grid;grid-template-columns:50px 1fr;gap:8px 14px;padding:16px;border-radius:20px;background:rgba(255,255,255,.045)}.timeline span{grid-row:span 2;color:var(--cyan);font-weight:1000}.timeline small{color:var(--muted)}.cta{text-align:center}.cta .btn{margin-top:18px}.footer{position:relative;z-index:3;display:flex;justify-content:space-between;gap:20px;padding:28px min(7vw,96px);color:var(--muted);border-top:1px solid var(--border)}
.auth-body,.dash-body{background:radial-gradient(circle at top left,rgba(53,246,255,.13),transparent 30%),radial-gradient(circle at bottom right,rgba(255,49,94,.13),transparent 30%),var(--bg)}.back-home{position:fixed;top:24px;left:28px;z-index:5;color:var(--muted);font-weight:800}.auth-wrap{min-height:100vh;display:grid;grid-template-columns:minmax(320px,480px) minmax(280px,520px);gap:26px;align-items:center;justify-content:center;padding:80px 24px}.auth-card,.auth-side{padding:34px}.auth-logo{width:84px;height:84px;margin-bottom:18px}.auth-card h1{font-size:46px;line-height:1}.auth-card p,.auth-note,.auth-side li{color:var(--muted);line-height:1.7}.auth-form,.profile-form{display:grid;gap:16px;margin-top:26px}.auth-form label,.profile-form label{display:grid;gap:8px}.auth-form span,.profile-form span{color:#d8e8ff;font-weight:800;font-size:13px;text-transform:uppercase;letter-spacing:.1em}input,textarea{width:100%;border:1px solid var(--border);background:rgba(0,0,0,.25);color:var(--text);border-radius:16px;padding:15px 16px;outline:none;font:inherit}input:focus,textarea:focus{border-color:rgba(53,246,255,.65);box-shadow:0 0 0 4px rgba(53,246,255,.08)}textarea{min-height:150px;resize:vertical}.alert{padding:13px 15px;border-radius:16px;margin:18px 0;font-weight:800}.alert.error{background:rgba(255,49,94,.12);border:1px solid rgba(255,49,94,.35)}.alert.success{background:rgba(56,242,140,.12);border:1px solid rgba(56,242,140,.35)}.auth-side h2{font-size:42px;line-height:1;margin-bottom:22px}.auth-side ul{margin:0;padding-left:20px}.auth-side li{margin:12px 0}.dashboard{padding-top:50px}.welcome-panel{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:34px;margin-bottom:22px}.welcome-panel h1{font-size:52px}.welcome-panel p{color:#bfcbdd;line-height:1.7}.dash-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.dash-card{padding:24px}.dash-card strong{font-size:26px}.portal-modules{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:18px}.module-card{padding:26px}.module-card p{color:var(--muted);line-height:1.7}.profile-page{padding-top:50px;display:grid;place-items:center}.profile-card{width:min(980px,100%);padding:34px}.profile-card h1{font-size:54px;margin:16px 0}.profile-card p{color:var(--muted)}.profile-form{grid-template-columns:1fr 1fr}.profile-form .full{grid-column:1/-1}.profile-form button{justify-self:start}
.reveal{opacity:0;transform:translateY(30px);transition:opacity .8s ease,transform .8s ease}.reveal.visible{opacity:1;transform:translateY(0)}.delay-1{transition-delay:.13s}.delay-2{transition-delay:.26s}@keyframes spin{to{transform:rotate(360deg)}}@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}@keyframes pulse{0%,100%{transform:scale(.95);opacity:.48}50%{transform:scale(1.08);opacity:1}}@keyframes ticker{to{transform:translateX(-50%)}}
@media(max-width:920px){.hero,.split,.feature-grid,.auth-wrap{grid-template-columns:1fr}.hero{padding-top:60px}.cards,.dash-grid,.portal-modules{grid-template-columns:1fr}.server-strip{grid-template-columns:1fr}.nav nav{display:none;position:absolute;top:84px;left:18px;right:18px;flex-direction:column;background:var(--panel-strong);padding:18px;border:1px solid var(--border);border-radius:22px}.nav nav.open{display:flex}.nav-toggle{display:block}.hero-card{min-height:430px}.profile-form{grid-template-columns:1fr}.welcome-panel{display:grid}.footer{display:grid}.dash-nav{align-items:flex-start;gap:18px}.dash-nav nav{flex-wrap:wrap}.section-pad{padding:70px 22px}.hero h1{font-size:48px}}
