
:root{
  --bg:#0c1424;--panel:#1b2538;--panel2:#222d44;--text:#f1f4f9;
  --muted:#b7c0cf;--blue:#2367bd;--blue2:#3480dd;--yellow:#ffbd27;
  --green:#43b87b;--line:#2c3850;
}
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;background:linear-gradient(180deg,#0d1525,#09111f);color:var(--text);
font-family:Arial,Helvetica,sans-serif;line-height:1.75}
a{color:#7fb2ff;text-decoration:none} a:hover{text-decoration:underline}
.container{width:min(1120px,calc(100% - 32px));margin:auto}
header{position:sticky;top:0;z-index:50;background:rgba(10,17,31,.96);border-bottom:1px solid var(--line);backdrop-filter:blur(10px)}
.nav{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.logo{font-weight:900;font-size:28px;color:#fff;text-decoration:none;text-shadow:2px 2px 0 #12509c}.logo span{color:var(--yellow)}
nav{display:flex;align-items:center;gap:18px}nav a{color:#dce5f3;font-weight:700;font-size:14px}
.menu-btn{display:none;background:none;border:0;color:#fff;font-size:25px}
.hero{padding:70px 0 35px}.hero-box{display:grid;grid-template-columns:1.2fr .8fr;gap:35px;align-items:center;
background:linear-gradient(135deg,#2b294d,#202b42);border:1px solid #34415a;border-radius:24px;padding:48px;box-shadow:0 20px 55px rgba(0,0,0,.25)}
h1{font-size:48px;line-height:1.15;margin:0 0 18px;letter-spacing:.2px}h2{font-size:31px;line-height:1.25;margin-top:0}
h3{font-size:20px;margin-bottom:8px}.lead{font-size:18px;color:var(--muted);margin-bottom:25px}
.btns{display:flex;flex-wrap:wrap;gap:14px}.btn{display:inline-block;padding:13px 25px;border-radius:14px;font-weight:800;text-decoration:none;border:1px solid transparent}
.btn-blue{background:linear-gradient(135deg,var(--blue),var(--blue2));color:#fff}.btn-yellow{background:var(--yellow);color:#172033}.btn-outline{border-color:var(--green);color:#fff;background:transparent}
.hero-art{min-height:270px;border-radius:20px;background:radial-gradient(circle at 50% 35%,#4c82ce 0,#25456f 25%,#131c2c 66%);
display:flex;align-items:center;justify-content:center;overflow:hidden}.phone{width:145px;height:250px;border:8px solid #111;border-radius:28px;background:linear-gradient(160deg,#152443,#080c14);box-shadow:0 20px 35px #0008;padding:16px}.phone .screen-title{color:var(--yellow);font-weight:900;font-size:18px}.game-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:7px;margin-top:15px}.game-grid i{height:45px;border-radius:7px;background:linear-gradient(135deg,#c88b29,#8b3a29);display:block}
.section{padding:25px 0}.card{background:linear-gradient(145deg,var(--panel),#1a2335);border:1px solid #26334a;border-radius:22px;padding:32px;margin:24px 0;box-shadow:0 12px 30px #0002}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.feature{padding:22px;border-radius:16px;background:#151f31;border:1px solid var(--line)}
.feature h3{color:#fff}.muted{color:var(--muted)}.toc{display:inline-block;background:#202b41;padding:12px 20px;border-radius:12px;font-weight:700}
table{width:100%;border-collapse:collapse;margin-top:15px;overflow:hidden;border-radius:14px}th{background:#2862ad}th,td{padding:15px;border-bottom:1px solid var(--line);text-align:left}tr:nth-child(even){background:#182235}
.faq{border-top:1px solid var(--line);padding:18px 0}.faq:last-child{border-bottom:1px solid var(--line)}
.article-list{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.article{background:#151f31;border:1px solid var(--line);padding:22px;border-radius:16px}
footer{margin-top:45px;background:#2057a0;padding:18px 0;color:#dbe8ff}footer .container{display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap}
.notice{font-size:13px;color:#aeb9c9;background:#111a2a;border-left:3px solid var(--yellow);padding:13px 16px;border-radius:8px}
.breadcrumb{font-size:13px;color:#aeb9c9;margin:18px 0}.page-title{padding:48px 0 12px}.page-title h1{font-size:40px}
form{display:grid;gap:15px}input,textarea{width:100%;padding:14px;border-radius:10px;border:1px solid #3a4760;background:#101827;color:#fff}textarea{min-height:150px}
@media(max-width:820px){.hero-box{grid-template-columns:1fr;padding:28px}.hero-art{min-height:230px}h1{font-size:36px}.grid,.article-list{grid-template-columns:1fr}nav{display:none;position:absolute;top:72px;left:0;right:0;background:#101827;padding:15px 24px;flex-direction:column;align-items:flex-start;border-bottom:1px solid var(--line)}nav.open{display:flex}.menu-btn{display:block}.page-title h1{font-size:34px}.card{padding:23px}th,td{padding:10px;font-size:13px}}
