*{box-sizing:border-box;margin:0;padding:0}
html,body{width:100%;min-height:100%;background:#000;color:#fff;font-family:Arial,"Helvetica Neue",sans-serif;overflow-x:hidden;-webkit-text-size-adjust:100%}
a{color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}
img{display:block;max-width:100%;user-select:none;-webkit-user-drag:none}
body{display:flex;justify-content:center;background:radial-gradient(circle at top,#2a1500 0,#050100 45%,#000 100%)}

.float-nav{position:fixed;left:50%;top:env(safe-area-inset-top,0);z-index:999;width:min(100vw,750px);transform:translateX(-50%);padding:10px 15px 0;pointer-events:none}
.float-nav-inner{height:66px;display:flex;align-items:center;gap:12px;padding:7px 10px;border:1px solid rgba(255,204,69,.55);border-radius:18px;background:linear-gradient(180deg,rgba(24,10,0,.74),rgba(2,0,0,.66));box-shadow:0 0 22px rgba(255,168,0,.42),inset 0 0 18px rgba(255,207,75,.16);backdrop-filter:blur(5px);animation:navBreath 3.2s ease-in-out infinite;pointer-events:auto;transform-origin:center top}
.nav-logo{width:76px;filter:drop-shadow(0 0 8px rgba(255,210,70,.8))}
.nav-title{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:22px;font-weight:800;color:#ffcd45;text-shadow:0 2px 4px #000,0 0 8px rgba(255,171,0,.55)}
.nav-download{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;flex:0 0 118px;height:42px;line-height:1;text-align:center;border-radius:12px;border:0;background:url('../img/landing/nav-download-btn.jpg') center center/210% auto no-repeat;font-size:0;color:transparent;text-shadow:none;white-space:nowrap;box-shadow:0 0 12px rgba(255,194,35,.6)}

.page-canvas{position:relative;width:min(100vw,750px);aspect-ratio:750/2100;min-height:2100px;overflow:hidden;background:#000;box-shadow:0 0 35px rgba(255,178,20,.18)}
.bg-layer{position:absolute;inset:0;background:url('../img/landing/bg-gold.png') center top/cover no-repeat,radial-gradient(circle at 50% 9%,#4b2500 0,#090100 40%,#000 100%)}
.bg-layer:before{content:"";position:absolute;left:0;right:0;top:0;height:620px;background:url('../img/landing/bg-hero.jpg') center top/cover no-repeat;opacity:.62;mix-blend-mode:screen}
.bg-layer:after{content:"";position:absolute;left:0;right:0;bottom:0;height:620px;background:radial-gradient(circle at 50% 35%,rgba(255,184,36,.22),transparent 42%),linear-gradient(180deg,transparent,#020000 65%)}
.canvas-layer{position:absolute;left:0;top:0;width:100%;height:auto;z-index:30;pointer-events:none}

.firework{position:absolute;z-index:3;pointer-events:none;opacity:.82;mix-blend-mode:screen;animation:floatSlow 6.5s ease-in-out infinite}
.firework-a{left:-5%;top:72px;width:35%;animation-duration:5.8s}
.firework-b{right:-17%;top:62px;width:62%;animation-duration:7.2s;animation-delay:-1.1s}
.firework-c{left:20%;top:0;width:64%;opacity:.58;animation-duration:8s;animation-delay:-2s}
.coin-particle{position:absolute;z-index:18;width:44px;height:44px;background:url('../img/landing/coin.webp') center/contain no-repeat;filter:drop-shadow(0 0 8px rgba(255,197,38,.85));pointer-events:none;animation:coinFloat 5s ease-in-out infinite}
.coin-a{left:7%;top:505px;animation-delay:-.2s}.coin-b{left:67%;top:375px;animation-delay:-1.4s;width:36px}.coin-c{left:82%;top:430px;animation-delay:-2.2s;width:42px}.coin-d{left:34%;top:465px;animation-delay:-.8s;width:34px}.coin-e{left:49%;top:595px;animation-delay:-3s;width:30px}

.hero-zone{position:absolute;left:0;top:0;width:100%;height:100%;z-index:20;pointer-events:none}
.hero-logo{position:absolute;left:32px;top:18px;width:143px;z-index:22;filter:drop-shadow(0 0 12px rgba(255,218,78,.9))}
.hero-subtitle{position:absolute;left:198px;right:150px;top:66px;font-size:22px;font-weight:700;color:#ffc53d;text-shadow:0 2px 4px #000,0 0 10px rgba(255,180,0,.65);white-space:nowrap;z-index:22}
.hero-crown{position:absolute;left:319px;top:105px;width:126px;z-index:21;filter:drop-shadow(0 0 8px rgba(255,206,71,.72));animation:floatSmall 4.6s ease-in-out infinite}
.hero-title{position:absolute;left:40px;top:145px;width:670px;z-index:24;filter:drop-shadow(0 10px 9px rgba(0,0,0,.9)) drop-shadow(0 0 10px rgba(255,180,0,.55));animation:titlePulse 4.4s ease-in-out infinite}
.hero-roulette{position:absolute;left:352px;top:354px;width:220px;z-index:23;filter:drop-shadow(0 5px 8px rgba(0,0,0,.75))}
.hero-dice{position:absolute;left:120px;top:404px;width:128px;z-index:28;filter:drop-shadow(0 5px 8px rgba(0,0,0,.75))}
.float-decor{animation:jump 2.6s ease-in-out infinite}.delay-1{animation-delay:-1s}
.jump-item{animation:jump 2.4s ease-in-out infinite;transform-origin:center center}
.jump-dealer{z-index:34;animation-duration:2.7s}.jump-shark{z-index:37;animation-duration:2.25s;animation-delay:-.4s}.jump-plinko{z-index:33;animation-duration:2.9s;animation-delay:-.8s}
.convert-buttons{z-index:55;filter:drop-shadow(0 10px 14px rgba(0,0,0,.55))}
/* 三个下载转化按钮的流光：不要用整张图 mask，部分安卓 WebView 会导致流光不显示。
   这里把流光直接放在每个按钮热区里，并用 overflow/clip-path 裁切，保证位置和按钮对齐。 */
.shine-hit{position:absolute;z-index:80;display:block;overflow:hidden;background:transparent;pointer-events:auto}
.shine-hit:after{content:"";position:absolute;top:-35%;left:-58%;width:32%;height:175%;pointer-events:none;background:linear-gradient(100deg,transparent 0,rgba(255,224,83,.10) 18%,rgba(255,248,186,.72) 38%,rgba(255,255,255,.96) 50%,rgba(255,225,77,.68) 62%,rgba(255,204,31,.12) 82%,transparent 100%);filter:blur(.15px);transform:skewX(-24deg);animation:buttonShineMove 2.25s linear infinite;will-change:left}
.shine-gold:after{content:"";position:absolute;top:-40%;left:-65%;width:38%;height:180%;background:linear-gradient(100deg,transparent 0,rgba(255,245,169,.18) 24%,rgba(255,255,255,.85) 50%,rgba(255,215,77,.26) 76%,transparent 100%);transform:skewX(-24deg);animation:shineMove 2.25s linear infinite;pointer-events:none}
.btn-android{left:4%;top:25.71%;width:43%;height:4.38%;border-radius:18px;clip-path:polygon(10% 0,92% 0,100% 50%,92% 100%,10% 100%,0 50%)}.btn-ios{left:53.85%;top:25.62%;width:40.7%;height:4.38%;border-radius:24px}.btn-h5{left:7.33%;top:30.76%;width:85.87%;height:5.1%;border-radius:28px}


/* 按钮下方模块的上下间距已重新校准：
   1) GAME HOT 与 Chơi Ngay 按钮之间留出间隔；
   2) 安全说明、支付图标、中奖 GIF 与底部标语之间避免贴边/重叠。 */
.hot-panel{position:absolute;left:4.6%;top:36.45%;z-index:40;width:90.8%;height:14.45%;padding:18px 14px 13px;border:2px solid #d9b020;border-radius:16px;background:linear-gradient(180deg,rgba(0,0,0,.88),rgba(0,0,0,.96));box-shadow:inset 0 0 24px rgba(255,189,27,.12),0 0 16px rgba(255,184,20,.18)}
.hot-head{position:relative;display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:14px}
.hot-head h2{font-size:33px;line-height:1;font-weight:1000;letter-spacing:-1px;color:#ffd155;text-shadow:0 3px 0 #7a3600,0 0 10px rgba(255,180,0,.5);white-space:nowrap}
/* 右上角倒计时：按框内缩放，不再放大裁切 */
.countdown-wrap{width:120px;height:42px;overflow:hidden;border:3px solid #e2bd2d;border-radius:8px;background:#b40004;box-shadow:inset 0 0 8px #3a0000,0 0 8px rgba(255,197,48,.38);padding:4px 6px;display:flex;align-items:center;justify-content:center}
.countdown-wrap img{width:100%;height:100%;max-width:100%;object-fit:contain;transform:none;mix-blend-mode:normal;filter:contrast(1.45) brightness(.85)}
.game-gif-wrap{width:100%;height:226px;overflow:hidden;border-radius:9px;background:#020202}
.game-gif-wrap img{width:108.8%;height:auto;max-width:none;transform:translate(-6.4%,-33.75%)}

/* 安全说明模块：收紧右侧中奖文案，避免金额和游戏名挤出边框 */
.safe-panel{position:absolute;left:4.6%;top:52.35%;z-index:42;width:90.8%;height:13.75%;padding:21px 18px;border:2px solid #d9b020;border-radius:18px;background:linear-gradient(180deg,rgba(0,0,0,.90),rgba(0,0,0,.96));box-shadow:inset 0 0 25px rgba(255,190,36,.10),0 0 14px rgba(255,185,25,.16)}
.safe-panel h2{text-align:center;font-size:37px;line-height:1;font-weight:1000;color:#ffd45a;text-shadow:0 3px 0 #7c3a00,0 0 10px rgba(255,184,30,.55);margin-bottom:16px;white-space:nowrap}
.safe-grid{display:grid;grid-template-columns:1.06fr .94fr;gap:12px}
.safe-left,.safe-right{min-width:0}
.safe-row{display:flex;gap:14px;align-items:center;margin-bottom:15px}
.safe-icon{flex:0 0 68px;height:68px;line-height:68px;text-align:center;font-size:52px;color:#ffcf42;filter:drop-shadow(0 0 7px rgba(255,197,45,.55))}
.safe-row strong,.safe-right h3{font-size:21px;color:#ffd563;text-shadow:0 1px 2px #000;white-space:nowrap}
.safe-row p{margin-top:6px;font-size:15px;line-height:1.3;color:#fff7d2}
.safe-right{padding-right:4px}
.safe-right h3{margin-bottom:10px;text-align:center;font-size:19px}
.winner{display:flex;align-items:flex-start;gap:11px;margin-bottom:8px}
.avatar{width:56px;height:56px;flex:0 0 56px;border-radius:50%;border:4px solid #f4c633;background-color:#1b0b02;background-position:center;background-size:cover;background-repeat:no-repeat;box-shadow:0 0 8px rgba(255,198,48,.45);overflow:hidden}
.avatar-a{background-image:url('../img/landing/winner-avatar-linh.png')}
.avatar-b{background-image:url('../img/landing/winner-avatar-hai.png')}
.winner p{flex:1;min-width:0;font-size:18px;line-height:1.05;color:#e9e1b8;font-weight:800}
.winner b{display:block;margin-top:3px;font-size:21px;line-height:1.05;color:#d5d0a7;letter-spacing:-.8px;white-space:nowrap}
.winner small{display:block;margin-top:2px;text-align:left;font-size:12px;line-height:1;color:#c9c0aa;font-weight:400}
.payment-icons{z-index:43;top:-.65%;filter:drop-shadow(0 3px 6px rgba(0,0,0,.5))}

.win-panel{position:absolute;left:5.4%;top:73.95%;z-index:40;width:89.3%;height:14.35%;padding:0;border:1px solid rgba(228,184,39,.85);border-radius:16px;background:rgba(0,0,0,.72);overflow:hidden;box-shadow:0 0 18px rgba(255,176,19,.22)}
.win-panel img{width:107.7%;height:auto;max-width:none;transform:translate(-3.2%,-31.8%);animation:winGlow 3s ease-in-out infinite}
.bottom-slogan{position:absolute;left:8.1%;top:88.34%;z-index:44;width:83.8%;filter:drop-shadow(0 10px 10px rgba(0,0,0,.9)) drop-shadow(0 0 12px rgba(255,180,0,.45));animation:titlePulse 4.2s ease-in-out infinite}

@keyframes navBreath{0%,100%{transform:scale(1)}50%{transform:scale(1.035)}}
@keyframes floatSlow{0%,100%{transform:translateY(-8px) scale(1)}50%{transform:translateY(14px) scale(1.02)}}
@keyframes coinFloat{0%,100%{transform:translateY(-10px) rotate(-8deg);opacity:.65}50%{transform:translateY(18px) rotate(10deg);opacity:1}}
@keyframes floatSmall{0%,100%{transform:translateY(-5px)}50%{transform:translateY(10px)}}
@keyframes jump{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
@keyframes titlePulse{0%,100%{transform:scale(1)}50%{transform:scale(1.018)}}
@keyframes shineMove{0%{left:-70%}100%{left:135%}}
@keyframes buttonShineMove{0%{left:-58%}100%{left:126%}}
@keyframes winGlow{0%,100%{filter:brightness(1)}50%{filter:brightness(1.12)}}

@media (max-width:750px){
    .page-canvas{min-height:auto}
    .float-nav{padding:1.33vw 2vw 0}.float-nav-inner{height:8.8vw;min-height:48px;border-radius:2.4vw;padding:.9vw 1.3vw;gap:1.6vw}.nav-logo{width:10.1vw;min-width:52px}.nav-title{font-size:2.93vw}.nav-download{flex-basis:15.7vw;height:5.6vw;min-height:34px;line-height:1;font-size:0;border-radius:1.6vw;background-size:210% auto}.hero-logo{left:4.27%;top:0.86%;width:19.1%}.hero-subtitle{left:26.4%;right:20%;top:3.14%;font-size:2.93vw}.hero-crown{left:42.5%;top:5%;width:16.8%}.hero-title{left:5.33%;top:6.9%;width:89.3%}.hero-roulette{left:46.9%;top:16.85%;width:29.3%}.hero-dice{left:16%;top:19.24%;width:17.1%}.coin-particle{width:5.86vw;height:5.86vw}.coin-a{top:24.05%}.coin-b{top:17.86%}.coin-c{top:20.48%}.coin-d{top:22.14%}.coin-e{top:28.33%}.hot-panel{padding:2.4vw 1.86vw 1.73vw;border-radius:2.13vw}.hot-head{margin-bottom:1.86vw}.hot-head h2{font-size:4.4vw}.countdown-wrap{width:16vw;height:5.6vw;border-width:.4vw;border-radius:1.06vw;padding:.53vw .8vw}.countdown-wrap img{width:100%;height:100%;transform:none}.game-gif-wrap{height:30.13vw}.safe-panel{padding:2.8vw 2.4vw;border-radius:2.4vw}.safe-panel h2{font-size:4.9vw;margin-bottom:2.13vw}.safe-grid{grid-template-columns:1.04fr .96fr;gap:1.6vw}.safe-row{gap:1.6vw;margin-bottom:1.86vw}.safe-icon{flex-basis:8.8vw;height:8.8vw;line-height:8.8vw;font-size:6.9vw}.safe-row strong,.safe-right h3{font-size:2.72vw}.safe-row p{font-size:2vw;margin-top:.8vw;line-height:1.28}.safe-right h3{font-size:2.46vw;margin-bottom:1.2vw}.winner{gap:1.46vw;margin-bottom:1.06vw}.avatar{width:7.46vw;height:7.46vw;flex-basis:7.46vw;border-width:.53vw}.winner p{font-size:2.26vw;line-height:1.02}.winner b{font-size:2.8vw;letter-spacing:-.08vw}.winner small{font-size:1.6vw;margin-top:.26vw}.shine-hit{border-radius:2.66vw}.btn-h5{border-radius:3.33vw}
}
@media (max-width:420px){.nav-title{font-size:12px}.nav-download{flex-basis:70px;font-size:0;line-height:1;white-space:nowrap;background-size:220% auto}.safe-panel{height:13.95%;padding:2.5vw 2.1vw}.safe-panel h2{font-size:4.65vw;margin-bottom:1.6vw}.safe-grid{grid-template-columns:1.03fr .97fr;gap:1.2vw}.safe-right{padding-right:0}.safe-row{gap:1.15vw;margin-bottom:1.35vw}.safe-icon{flex-basis:7.7vw;height:7.7vw;line-height:7.7vw;font-size:6.05vw}.safe-row strong{font-size:2.35vw}.safe-row p{font-size:1.72vw;line-height:1.2;margin-top:.45vw}.safe-right h3{font-size:2.1vw;margin-bottom:.8vw}.winner{gap:.95vw;margin-bottom:.7vw;align-items:flex-start}.avatar{width:6.65vw;height:6.65vw;flex-basis:6.65vw;border-width:.42vw}.winner p{font-size:1.9vw;line-height:1.03}.winner b{font-size:2.35vw;line-height:1.04;letter-spacing:-.1vw;white-space:nowrap}.winner small{font-size:1.33vw;line-height:1;margin-top:.15vw;text-align:left}.payment-icons{top:-.25%}}