:root{
  --bg:#0a0818;
  --panel:#171033;
  --yellow:#ffd641;
  --cyan:#00ebff;
  --pink:#ff00dc;
  --green:#00ff88;
  --white:#ffffff;
  --muted:#c9c2ff;
  --ink:#101010;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--white);
  font-family:Verdana, Arial, sans-serif;
  line-height:1.55;
  background:
    radial-gradient(circle at 10% 10%,rgba(255,0,220,.25),transparent 25%),
    radial-gradient(circle at 90% 15%,rgba(0,235,255,.2),transparent 25%),
    linear-gradient(180deg,#0a0818,#181033 55%,#090711);
}
body:before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.12;
  background-image:linear-gradient(var(--cyan) 1px,transparent 1px),linear-gradient(90deg,var(--cyan) 1px,transparent 1px);
  background-size:34px 34px;
}
a{color:var(--yellow);font-weight:800}
img{max-width:100%;display:block}
.topbar{
  position:sticky;top:0;z-index:50;background:#000;color:#fff;text-align:center;
  padding:10px 14px;border-bottom:4px double var(--pink);font-size:14px;
}
.topbar a{color:#fff}
.wrap{width:min(1160px,94vw);margin:0 auto}
.header{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:20px 0}
.logo{font-weight:950;color:#fff;text-decoration:none;font-size:25px;text-shadow:2px 2px 0 var(--pink)}
.nav{display:flex;gap:12px;flex-wrap:wrap}
.nav a{color:#fff;text-decoration:none;background:#000;border:2px solid var(--cyan);padding:7px 10px;font-size:13px}
.hero{display:grid;grid-template-columns:1.08fr .92fr;gap:28px;align-items:center;padding:42px 0 54px}
.badge{display:inline-block;background:var(--yellow);color:#111;border:3px solid #000;box-shadow:5px 5px 0 var(--pink);padding:8px 12px;font-weight:950;transform:rotate(-1deg)}
h1{font-size:clamp(44px,8vw,98px);line-height:.88;letter-spacing:-4px;color:var(--yellow);text-shadow:4px 4px 0 var(--pink),8px 8px 0 #000;margin:24px 0 16px}
h2{font-size:clamp(30px,4.8vw,56px);line-height:1;color:var(--cyan);text-shadow:3px 3px 0 #000;margin:0 0 14px}
h3{color:var(--yellow);margin:0 0 8px}
.lead{font-size:clamp(18px,2.2vw,25px);color:var(--muted);margin:0 0 22px;max-width:780px}
.btnrow{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.btn{display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(180deg,var(--pink),#80006d);color:#fff;text-decoration:none;border:4px outset var(--yellow);padding:13px 18px;font-weight:950;box-shadow:6px 6px 0 #000;cursor:pointer}
.btn.alt{background:linear-gradient(180deg,var(--cyan),#008aa0);color:#000}
.btn.green{background:linear-gradient(180deg,var(--green),#007c44);color:#000}
.btn:hover{transform:translate(2px,2px);box-shadow:3px 3px 0 #000}
.card{background:rgba(23,16,51,.93);border:3px solid var(--cyan);box-shadow:10px 10px 0 rgba(0,0,0,.6);padding:22px;margin:22px 0}
.pricebox{background:#000;border:5px ridge var(--yellow);text-align:center}
.price{font-size:64px;color:var(--yellow);text-shadow:3px 3px 0 var(--pink);font-weight:950;letter-spacing:-3px}
.stats{display:grid;gap:10px;margin-top:18px}
.stat{display:flex;justify-content:space-between;gap:16px;border-top:1px dashed var(--cyan);padding-top:10px}
.stat span{color:var(--muted)}
.stat strong{text-align:right}
.marquee{overflow:hidden;white-space:nowrap;background:#000;border-block:3px dashed var(--yellow);padding:9px;color:var(--green);font-family:"Courier New",monospace}
.marquee span{display:inline-block;animation:mar 20s linear infinite}@keyframes mar{from{transform:translateX(100%)}to{transform:translateX(-100%)}}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.feature{background:#090711;border:3px dashed var(--pink);padding:18px;min-height:155px}
.feature p{color:var(--muted);margin:0}
.biggrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.usecase{background:#090711;border:2px solid var(--cyan);padding:18px}
.usecase .tag{font-family:"Courier New",monospace;color:var(--green);font-size:13px}
.player{background:#000;border:4px solid var(--yellow);padding:18px}
.eq{display:flex;align-items:end;gap:6px;height:120px;margin:18px 0}
.bar{flex:1;background:linear-gradient(180deg,var(--cyan),var(--pink));min-height:20px;animation:pulse 1.1s infinite alternate}
.bar:nth-child(2n){animation-delay:.15s}.bar:nth-child(3n){animation-delay:.3s}.bar:nth-child(4n){animation-delay:.45s}
@keyframes pulse{to{height:100%}}
.counter{background:#000;border:5px double var(--green);text-align:center;padding:24px}
#clickCount{font-size:76px;color:var(--green);font-weight:950;text-shadow:4px 4px 0 var(--pink)}
.counter button{font-size:22px;background:var(--yellow);color:#000;border:4px outset var(--pink);font-weight:950;padding:12px 18px;cursor:pointer}
.guestbook{display:grid;gap:10px;max-height:640px;overflow:auto}
.gb{background:#070510;border-left:6px solid var(--cyan);padding:12px}
.news-list{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.news-item{display:block;background:#090711;border:3px solid var(--pink);padding:16px;color:#fff;text-decoration:none}
.date{color:var(--green);font-family:"Courier New",monospace;font-size:13px}
.share{display:flex;flex-wrap:wrap;gap:12px}
form{display:grid;gap:12px}
input,textarea,select{width:100%;padding:14px;background:#05030b;color:#fff;border:3px solid var(--cyan);font-size:16px}
textarea{min-height:120px}
.footer{border-top:4px double var(--pink);padding:34px 0;margin-top:36px;color:var(--muted);text-align:center;background:#05030b}
@media(max-width:960px){.hero{grid-template-columns:1fr}.grid{grid-template-columns:repeat(2,1fr)}.biggrid,.news-list{grid-template-columns:1fr}.header{display:block}.nav{margin-top:14px}}
@media(max-width:620px){h1{letter-spacing:-2px}.grid{grid-template-columns:1fr}.price{font-size:46px}.btn{width:100%}.stat{display:block}}