:root{--bg:#080b14;--card:#12172a;--card2:#171e35;--text:#f6f7ff;--muted:#bac3e8;--line:rgba(255,255,255,.12);--hot:#8a5cff;--ok:#59ffab}
*{box-sizing:border-box} body{margin:0;background:radial-gradient(circle at 20% 0,#251852 0,#080b14 42%,#050713 100%);color:var(--text);font-family:Arial,Helvetica,sans-serif}
a{color:inherit}.wrap{width:min(1120px,calc(100% - 32px));margin:0 auto}
header{position:sticky;top:0;z-index:5;background:rgba(8,11,20,.82);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;padding:16px 0}.brand{font-size:24px;font-weight:900}.brand span{color:var(--ok)}
.links{display:flex;gap:14px;align-items:center}.links a,.lang button{border:1px solid var(--line);background:rgba(255,255,255,.05);color:var(--text);padding:9px 11px;border-radius:999px;text-decoration:none;cursor:pointer}
.hero{padding:82px 0 48px}.hero h1{font-size:clamp(38px,6vw,74px);line-height:.95;margin:0 0 18px}.hero p{font-size:20px;color:var(--muted);max-width:820px;line-height:1.5}
.ctas{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}.btn{display:inline-block;padding:14px 18px;border-radius:14px;text-decoration:none;background:linear-gradient(135deg,var(--hot),#22d3ee);font-weight:800}.btn.secondary{background:rgba(255,255,255,.08);border:1px solid var(--line)}
section{padding:42px 0}.section-title{font-size:34px;margin:0 0 10px}.intro{color:var(--muted);margin:0 0 22px;line-height:1.55}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.card{background:linear-gradient(180deg,var(--card),var(--card2));border:1px solid var(--line);border-radius:22px;padding:20px;min-height:150px}
.card h3{margin:0 0 10px;font-size:22px}.cmd{display:inline-block;font-family:Consolas,monospace;background:rgba(255,255,255,.1);padding:7px 10px;border-radius:10px;margin-top:10px;color:#d8e2ff}
.streamers{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.streamer{background:rgba(255,255,255,.06);border:1px solid var(--line);border-radius:18px;padding:15px}
.avatar{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#8a5cff,#22d3ee);font-weight:900;margin-bottom:10px}
.badge{display:inline-block;font-size:12px;background:#ffd166;color:#1c1300;border-radius:999px;padding:4px 8px;font-weight:900;margin-left:6px}
.obsbox{border:1px dashed rgba(255,255,255,.26);border-radius:22px;padding:22px;background:rgba(255,255,255,.05)}
.code{font-family:Consolas,monospace;background:#050713;border:1px solid var(--line);border-radius:12px;padding:14px;overflow:auto;color:#bfffd8}
footer{padding:34px 0;color:var(--muted);border-top:1px solid var(--line)}
@media(max-width:850px){.grid,.streamers{grid-template-columns:1fr}.links{display:none}.hero{padding-top:54px}}