*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#0a0d12;color:#e8edf5;font-family:Arial,Helvetica,sans-serif;line-height:1.62}
a{color:#7dd3fc;text-decoration:none}
a:hover{text-decoration:underline}
.topbar{position:sticky;top:0;z-index:10;background:rgba(10,13,18,.95);border-bottom:1px solid #223044}
.nav{max-width:1120px;margin:0 auto;padding:14px 20px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.brand{font-weight:800;letter-spacing:.5px;color:#fbbf24}
.links{display:flex;gap:14px;flex-wrap:wrap;font-size:14px}
.hero{background:radial-gradient(circle at 50% 10%,#18324a 0,#0a0d12 54%);border-bottom:1px solid #1f2c3f}
.hero-inner{max-width:1120px;margin:0 auto;padding:64px 20px 48px;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr);gap:34px;align-items:center}
h1{font-size:46px;line-height:1.05;margin:0 0 16px;color:#fbbf24}
h2{font-size:28px;line-height:1.2;margin:0 0 14px;color:#f8fafc}
h3{font-size:20px;margin:0 0 10px;color:#fbbf24}
p{margin:0 0 16px;color:#cbd5e1}
.lead{font-size:18px;color:#dbeafe}
.cta-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:12px 18px;border:2px solid #fbbf24;background:#fbbf24;color:#111827;font-weight:800;text-transform:uppercase;letter-spacing:.4px}
.btn.secondary{background:transparent;color:#fbbf24}
.frame{border:2px solid #334155;background:#111827;padding:14px}
.arena-preview{aspect-ratio:16/10;background:
linear-gradient(90deg,transparent 0 31px,rgba(148,163,184,.08) 31px 32px),
linear-gradient(0deg,transparent 0 31px,rgba(148,163,184,.08) 31px 32px),#10151f;background-size:32px 32px;position:relative;overflow:hidden}
.block{position:absolute;width:72px;height:24px;background:#b45309;border:2px solid #f97316}
.tank{position:absolute;width:28px;height:28px;background:#fbbf24;border:3px solid #fde68a;box-shadow:0 0 0 3px #111827}
.tank:after{content:"";position:absolute;left:10px;top:-18px;width:8px;height:22px;background:#fde68a}
.t1{left:18%;top:58%}.t2{right:18%;top:30%;background:#38bdf8;border-color:#bae6fd}.t2:after{background:#bae6fd;transform:rotate(90deg);left:-15px;top:7px}
.b1{left:36%;top:28%}.b2{left:52%;top:56%}.b3{right:8%;bottom:12%}
.section{max-width:1120px;margin:0 auto;padding:48px 20px;border-bottom:1px solid #1f2c3f}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.card{border:1px solid #334155;background:#111827;padding:20px}
.article{max-width:850px}
.article ul,.article ol{color:#cbd5e1;margin:0 0 18px;padding-left:22px}
.note{border-left:4px solid #fbbf24;background:#111827;padding:16px 18px;margin:22px 0;color:#dbeafe}
.footer{max-width:1120px;margin:0 auto;padding:28px 20px;color:#94a3b8;font-size:14px}
@media(max-width:780px){
  .hero-inner{grid-template-columns:1fr;padding-top:42px}
  h1{font-size:36px}
  .grid{grid-template-columns:1fr}
  .nav{align-items:flex-start;flex-direction:column}
}