*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Segoe UI',Roboto,Arial,sans-serif;background:#061227;color:#e8f0ff;line-height:1.6;padding-bottom:64px;-webkit-font-smoothing:antialiased}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
.site-header{position:sticky;top:0;z-index:100;background:linear-gradient(180deg,#0b3a7a,#072a5e);box-shadow:0 2px 12px rgba(0,0,0,.5)}
.header-inner{display:flex;align-items:center;gap:10px;padding:8px 12px;max-width:1100px;margin:0 auto}
.burger{background:#0a1e3c;border:2px solid #ffd34d;border-radius:10px;width:42px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer}
.logo{display:flex;align-items:center;gap:8px;margin:0 auto}
.logo-text{font-weight:800;font-size:26px;color:#fff;letter-spacing:1px}
.logo-text span{color:#ffd34d}
.header-cta{display:flex;align-items:center;gap:5px;background:linear-gradient(180deg,#13408a,#0a2a5e);border:2px solid #2e6fc4;border-radius:10px;padding:7px 10px;font-size:12px;font-weight:700;color:#ffd34d}
.marquee{background:#0a1f44;overflow:hidden;white-space:nowrap}
.marquee span{display:inline-block;padding:5px 0;color:#ffd34d;font-size:12px;font-weight:600;animation:scroll 22s linear infinite}
@keyframes scroll{0%{transform:translateX(100%)}100%{transform:translateX(-100%)}}
.cat-nav{display:flex;gap:6px;overflow-x:auto;padding:8px 12px;background:#072246;scrollbar-width:none}
.cat-nav::-webkit-scrollbar{display:none}
.cat-item{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:3px;min-width:62px;padding:6px 8px;border-radius:10px;font-size:11px;font-weight:600;color:#9fd0ff;background:#0a2a5e;border:1px solid #103a7a}
.cat-item.active{color:#ffd34d;border-color:#ffd34d;background:#0d3470}
.breadcrumbs{max-width:1100px;margin:0 auto;padding:8px 14px;font-size:12px;color:#9fd0ff}
.breadcrumbs ol{list-style:none;display:flex;gap:6px;flex-wrap:wrap}
.breadcrumbs li:not(:last-child)::after{content:'›';margin-left:6px;color:#5a82bd}
.breadcrumbs a{color:#ffd34d}
main{max-width:1100px;margin:0 auto;padding:0 12px}
.hero{border-radius:14px;overflow:hidden;background-size:cover;background-position:center;background-color:#0a2046;min-height:230px;margin-bottom:14px}
.hero-overlay{background:linear-gradient(120deg,rgba(6,18,39,.92),rgba(6,18,39,.45));padding:26px 20px;min-height:230px;display:flex;flex-direction:column;justify-content:center}
.hero-badge{display:inline-block;background:#ffd34d;color:#0a1e3c;font-weight:800;font-size:11px;padding:4px 10px;border-radius:20px;margin-bottom:12px;align-self:flex-start}
.hero-heading{font-size:28px;font-weight:800;color:#fff;line-height:1.2;text-shadow:0 2px 8px rgba(0,0,0,.6)}
.hero-sub{margin:10px 0 16px;font-size:14px;color:#cfe0ff;max-width:560px}
.btn-primary{display:inline-block;background:linear-gradient(180deg,#ffe066,#ffb700);color:#0a1e3c;font-weight:800;padding:12px 26px;border-radius:30px;font-size:15px;box-shadow:0 4px 14px rgba(255,179,0,.4);align-self:flex-start}
.hero-dots{display:flex;gap:6px;margin-top:14px}
.hero-dots span{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.35)}
.hero-dots span.active{background:#ffd34d}
.recommend{display:flex;align-items:center;gap:10px;background:linear-gradient(90deg,#0e2f60,#0a2348);border:1px solid #13408a;border-radius:12px;padding:12px 14px;margin-bottom:14px;flex-wrap:wrap}
.rec-stars{display:flex;gap:2px}
.rec-title{flex:1;display:flex;flex-direction:column;min-width:140px}
.rec-title strong{color:#fff;font-size:15px}
.rec-title span{font-size:11px;color:#9fd0ff}
.rec-cert{display:flex;align-items:center;gap:5px;color:#3fd17a;font-size:12px;font-weight:700;background:#08361f;border:1px solid #1b8a4a;border-radius:8px;padding:5px 10px}
.live-trans{background:#0a2348;border:1px solid #13408a;border-radius:12px;overflow:hidden;margin-bottom:14px}
.lt-head{display:flex;justify-content:space-between;align-items:center;background:linear-gradient(90deg,#0e3a78,#0b2c5c);padding:10px 14px;font-weight:800;font-size:13px;color:#fff}
.lt-live{background:#d62b2b;color:#fff;font-size:10px;padding:2px 9px;border-radius:4px}
.lt-scroll{overflow-x:auto}
.lt-table{width:100%;border-collapse:collapse;font-size:12px;min-width:520px}
.lt-table th{background:#0d3470;color:#ffd34d;padding:9px 10px;text-align:left;font-size:11px}
.lt-table td{padding:9px 10px;border-bottom:1px solid #103459;color:#cfe0ff}
.lt-table tr:nth-child(even) td{background:#0c2a55}
.promo-banner{display:flex;align-items:center;justify-content:space-between;gap:10px;background:linear-gradient(90deg,#7a1530,#3a0a18);border:2px solid #ff5a7a;border-radius:12px;padding:16px;margin-bottom:14px;flex-wrap:wrap}
.pb-text{display:flex;flex-direction:column}
.pb-text strong{font-size:18px;color:#fff}
.pb-text span{font-size:12px;color:#ffd0db}
.pb-btn{background:#fff;color:#7a1530;font-weight:800;padding:9px 18px;border-radius:6px;font-size:13px}
.commission{display:flex;gap:12px;margin-bottom:18px}
.comm-card{flex:1;background:linear-gradient(135deg,#0e2f60,#091d3c);border:1px solid #13408a;border-radius:12px;padding:16px;text-align:center}
.comm-num{display:block;font-size:26px;font-weight:800;color:#ffd34d}
.comm-label{font-size:12px;color:#9fd0ff}
.section-title{font-size:18px;font-weight:800;color:#fff;margin:6px 0 12px;padding-left:10px;border-left:4px solid #ffd34d}
.game-grid-section{margin-bottom:20px}
.game-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.game-card{background:#0a2348;border:1px solid #13408a;border-radius:12px;overflow:hidden;text-align:center;transition:transform .15s}
.game-card:hover{transform:translateY(-3px)}
.game-card img{aspect-ratio:1;object-fit:cover;background:#0c2a55}
.game-card span{display:block;padding:8px 4px;font-size:12px;font-weight:600;color:#cfe0ff}
.seo-content{background:#0a1f44;border:1px solid #103459;border-radius:14px;padding:20px 18px;margin-bottom:20px}
.seo-content h1{font-size:24px;color:#fff;margin-bottom:16px;line-height:1.25}
.seo-content h2{font-size:19px;color:#ffd34d;margin:22px 0 10px}
.seo-content h3{font-size:16px;color:#9fd0ff;margin:16px 0 8px}
.seo-content p{margin-bottom:12px;color:#d3e0f5;font-size:14.5px}
.seo-content ul,.seo-content ol{margin:0 0 14px 20px}
.seo-content li{margin-bottom:7px;color:#d3e0f5;font-size:14.5px}
.seo-content strong{color:#fff}
.seo-content em{color:#ffd34d;font-style:italic}
.table-wrap{overflow-x:auto;margin:0 0 16px;-webkit-overflow-scrolling:touch}
.seo-content table{width:100%;border-collapse:collapse;font-size:13.5px;min-width:340px}
.seo-content th{background:#0d3470;color:#ffd34d;padding:10px;text-align:left;border:1px solid #13408a}
.seo-content td{padding:10px;border:1px solid #13408a;color:#d3e0f5;word-break:break-word}
.seo-content tr:nth-child(even) td{background:#0c2a55}
.pay-logos{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:10px}
.pay-logos img{height:30px;width:auto;background:#fff;border-radius:5px;padding:3px 6px}
.faq-section{margin-bottom:24px}
.faq-item{background:#0a2348;border:1px solid #13408a;border-radius:10px;margin-bottom:8px;overflow:hidden}
.faq-q{width:100%;text-align:left;background:none;border:none;color:#fff;font-size:14.5px;font-weight:600;padding:14px 16px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:10px}
.faq-icon{position:relative;flex:0 0 16px;height:16px}
.faq-icon::before,.faq-icon::after{content:'';position:absolute;background:#ffd34d;transition:.2s}
.faq-icon::before{top:7px;left:0;width:16px;height:2px}
.faq-icon::after{top:0;left:7px;width:2px;height:16px}
.faq-item.open .faq-icon::after{transform:rotate(90deg);opacity:0}
.faq-a{max-height:0;overflow:hidden;transition:max-height .3s ease;padding:0 16px}
.faq-item.open .faq-a{max-height:340px;padding:0 16px 14px}
.faq-a p{color:#cfe0ff;font-size:14px}
.site-footer{background:#051022;border-top:1px solid #103459;padding:24px 16px;max-width:1100px;margin:0 auto}
.footer-cols{display:flex;gap:30px;flex-wrap:wrap;margin-bottom:20px}
.footer-h{font-size:15px;font-weight:800;color:#fff;margin-bottom:12px;letter-spacing:.5px}
.footer-col a{display:block;color:#9fd0ff;font-size:14px;margin-bottom:9px}
.footer-cert{border-top:1px solid #103459;padding-top:18px}
.footer-cert .footer-h{color:#ffd34d;margin-bottom:16px}
.cert-block{margin-bottom:16px}
.cert-label{display:block;font-size:11px;letter-spacing:1px;color:#7e9ec9;margin-bottom:8px}
.cert-logos{display:flex;flex-wrap:wrap;gap:8px}
.cert-pill{background:#0a2348;border:1px solid #13408a;border-radius:6px;padding:6px 12px;font-size:11px;color:#cfe0ff}
.footer-legal{border-top:1px solid #103459;padding-top:16px;margin-top:8px}
.footer-legal p{font-size:12px;color:#7e9ec9}
.bottom-nav{position:fixed;bottom:0;left:0;right:0;z-index:120;display:flex;background:linear-gradient(180deg,#0b3a7a,#062a5e);border-top:2px solid #ffd34d;height:64px}
.bn-item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:10px;font-weight:700;color:#9fd0ff;position:relative}
.bn-item.active{color:#ffd34d}
.bn-item.active svg{stroke:#ffd34d}
.bn-bonus svg{stroke:#ffd34d}
.bn-badge{position:absolute;top:6px;right:30%;background:#ff7a00;color:#fff;font-size:9px;font-weight:800;border-radius:50%;width:16px;height:16px;display:flex;align-items:center;justify-content:center}
.side-menu{position:fixed;top:0;left:-280px;width:270px;height:100%;background:#072246;z-index:200;transition:left .3s;padding:16px;overflow-y:auto}
.side-menu.open{left:0}
.sm-head{display:flex;justify-content:space-between;align-items:center;color:#ffd34d;font-weight:800;font-size:16px;margin-bottom:14px;border-bottom:1px solid #13408a;padding-bottom:10px}
.sm-head button{background:none;border:none;color:#fff;font-size:26px;cursor:pointer;line-height:1}
.side-menu a{display:block;padding:12px 8px;color:#cfe0ff;font-size:15px;border-bottom:1px solid #0e3261}
.sm-overlay{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:150;opacity:0;visibility:hidden;transition:.3s}
.sm-overlay.show{opacity:1;visibility:visible}
@media(min-width:768px){.game-grid{grid-template-columns:repeat(4,1fr)}.hero-heading{font-size:36px}.hero{min-height:300px}.hero-overlay{min-height:300px}.bottom-nav{display:none}body{padding-bottom:0}}
@media(min-width:1024px){.game-grid{grid-template-columns:repeat(6,1fr)}}