/* GIẢI TRÍ XÚC XẮC 888 - REWARD CLAIM UI PRO MAX */
:root{--bg-1:#050816;--bg-2:#0e1729;--panel:rgba(9,15,30,.90);--glass:rgba(255,255,255,.075);--text:#f8fafc;--muted:#c4cfdd;--soft:#94a3b8;--line:rgba(255,255,255,.14);--line-strong:rgba(255,255,255,.22);--gold:#fbbf24;--gold-light:#ffe9a8;--orange:#f97316;--red:#ef4444;--green:#22c55e;--blue:#38bdf8;--shadow:0 34px 110px rgba(0,0,0,.58);--radius-xl:32px;--radius-lg:24px;--radius-md:18px}
*{box-sizing:border-box}html,body{margin:0;min-height:100vh}body{font-family:"Open Sans","Segoe UI",Arial,sans-serif;color:var(--text);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden;background:radial-gradient(circle at 12% 10%,rgba(251,191,36,.25),transparent 26%),radial-gradient(circle at 86% 18%,rgba(239,68,68,.20),transparent 26%),radial-gradient(circle at 60% 85%,rgba(56,189,248,.12),transparent 35%),linear-gradient(135deg,var(--bg-1),var(--bg-2))}
body:before{content:"";position:fixed;inset:0;background:linear-gradient(rgba(0,0,0,.45),rgba(0,0,0,.78)),url("https://images.unsplash.com/photo-1606167668584-78701c57f13d?q=80&w=1600&auto=format&fit=crop");background-size:cover;background-position:center;opacity:.22;z-index:-4}
body:after{content:"";position:fixed;inset:0;background-image:linear-gradient(rgba(255,255,255,.028) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.028) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(to bottom,black,transparent 80%);z-index:-3}button,input{font:inherit}.bg-orb{position:fixed;width:340px;height:340px;border-radius:999px;filter:blur(70px);opacity:.34;z-index:-2;pointer-events:none}.orb-1{top:-90px;left:-90px;background:var(--gold)}.orb-2{right:-110px;top:100px;background:var(--red)}.orb-3{left:48%;bottom:-160px;background:var(--blue)}
.page{width:min(1220px,calc(100% - 28px));margin:0 auto;padding:18px 0 36px}.top-strip{display:flex;justify-content:space-between;align-items:center;gap:14px;margin:0 0 14px;padding:12px 16px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.055);backdrop-filter:blur(16px)}.top-status,.top-mini{display:flex;align-items:center;gap:10px}.top-status{color:#bbf7d0;font-weight:800}.top-mini{flex-wrap:wrap;color:var(--muted);font-size:13px;font-weight:700}.pulse-dot{width:10px;height:10px;border-radius:50%;background:var(--green);box-shadow:0 0 0 0 rgba(34,197,94,.7);animation:pulse 1.5s infinite}@keyframes pulse{70%{box-shadow:0 0 0 12px rgba(34,197,94,0)}100%{box-shadow:0 0 0 0 rgba(34,197,94,0)}}
.hero-card{display:grid;grid-template-columns:1.08fr .92fr;gap:28px;align-items:stretch;padding:28px;border:1px solid var(--line-strong);border-radius:var(--radius-xl);background:linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.026)),linear-gradient(135deg,rgba(251,191,36,.09),transparent 35%,rgba(56,189,248,.055));box-shadow:var(--shadow);backdrop-filter:blur(22px);position:relative;overflow:hidden}.hero-left,.form-card,.preview-panel{border:1px solid var(--line);background:var(--panel);border-radius:var(--radius-lg)}.hero-left{padding:32px;overflow:hidden;position:relative}.hero-left:after{content:"888";position:absolute;right:-18px;bottom:-44px;font-size:178px;line-height:1;font-weight:900;color:rgba(255,255,255,.035);pointer-events:none}
.brand-row{display:flex;align-items:center;gap:14px;margin-bottom:24px}.brand-logo{width:58px;height:58px;display:grid;place-items:center;border-radius:18px;font-size:28px;background:linear-gradient(135deg,var(--gold),var(--orange),var(--red));box-shadow:0 16px 42px rgba(251,191,36,.25);position:relative}.brand-logo:after{content:"";position:absolute;inset:-5px;border-radius:22px;border:1px solid rgba(251,191,36,.28)}.brand-title{font-weight:900;letter-spacing:.3px;font-size:19px;text-transform:uppercase}.brand-subtitle{color:var(--muted);font-size:13px;font-weight:600}
.hero-title{margin:0;max-width:650px;display:flex;flex-direction:column;gap:5px;line-height:1.08;letter-spacing:-.75px;font-weight:900}.hero-gift{display:block;font-size:clamp(44px,4.8vw,62px);line-height:1;margin-bottom:2px;filter:drop-shadow(0 10px 18px rgba(0,0,0,.28))}.hero-line{display:block;white-space:normal;word-break:keep-all;text-wrap:balance}.hero-line-white{color:#fff;font-size:clamp(38px,4.35vw,56px);text-shadow:0 10px 30px rgba(0,0,0,.28)}.hero-line-gold{background:linear-gradient(90deg,#fbbf24,#ffe9a8,#f97316);-webkit-background-clip:text;color:transparent;font-size:clamp(30px,3.55vw,46px)}.hero-line-cream{color:var(--gold-light);font-size:clamp(29px,3.38vw,44px)}
.hero-desc{margin:20px 0 0;color:var(--muted);line-height:1.75;font-size:16.5px;max-width:590px;font-weight:600}.benefit-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:24px 0}.benefit-item{display:flex;align-items:flex-start;gap:12px;min-height:78px;padding:15px 16px;border-radius:18px;background:linear-gradient(145deg,rgba(255,255,255,.105),rgba(255,255,255,.045));border:1px solid var(--line);color:#f8fafc;box-shadow:0 18px 44px rgba(0,0,0,.12)}.benefit-icon{font-size:22px;margin-top:2px}.benefit-item b{display:block;font-size:15px;font-weight:900;margin-bottom:4px}.benefit-item small{display:block;color:var(--muted);font-size:12.5px;line-height:1.4;font-weight:600}
.notice-box{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;padding:14px 16px;border-left:4px solid var(--gold);border-radius:18px;background:linear-gradient(135deg,rgba(251,191,36,.16),rgba(249,115,22,.09)),rgba(255,255,255,.055);color:#fde68a}.notice-icon{font-size:24px}.notice-text{font-size:15px;line-height:1.55;font-weight:700}.notice-link-btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 18px;border-radius:14px;text-decoration:none;background:linear-gradient(135deg,var(--gold),var(--orange));color:#111827;font-weight:900;font-size:14px;box-shadow:0 12px 30px rgba(249,115,22,.20)}.security-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px;color:var(--muted);font-size:12.5px;font-weight:800}.security-row div{padding:8px 10px;border-radius:999px;background:rgba(255,255,255,.055);border:1px solid var(--line)}
.form-card{padding:26px;background:linear-gradient(180deg,rgba(15,23,42,.95),rgba(9,15,30,.92));box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}.form-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:18px}.form-head h2{margin:0;font-size:22px;font-weight:900}.form-head p{margin:6px 0 0;color:var(--muted);font-size:13px;font-weight:600}.reward-badge{white-space:nowrap;padding:10px 12px;border-radius:999px;background:rgba(251,191,36,.14);border:1px solid rgba(251,191,36,.35);color:#fde68a;font-size:12px;font-weight:900}.step-bar{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-bottom:20px}.step-pill{display:flex;align-items:center;justify-content:center;gap:7px;text-align:center;padding:11px 8px;border-radius:999px;border:1px solid var(--line);color:#d6ddea;font-size:13.5px;font-weight:900;background:rgba(255,255,255,.045);line-height:1.2}.step-pill span{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:999px;background:rgba(255,255,255,.085);font-size:12px}.step-pill.active{color:#111827;background:linear-gradient(135deg,var(--gold),#fef3c7);border-color:transparent}.step-pill.active span{background:rgba(17,24,39,.12)}
.form-block{display:grid;gap:15px}label span{display:block;font-size:13.5px;color:#d6ddea;font-weight:900;margin-bottom:8px}input{width:100%;height:54px;border-radius:16px;border:1px solid var(--line);outline:none;background:rgba(0,0,0,.25);color:var(--text);padding:0 16px;font-size:15.5px;font-weight:700;transition:.2s}input::placeholder{color:rgba(255,255,255,.38);font-weight:600}input:hover{border-color:rgba(255,255,255,.25)}input:focus{border-color:var(--gold);box-shadow:0 0 0 4px rgba(251,191,36,.12);background:rgba(0,0,0,.32)}
.primary-btn,.ghost-btn{width:100%;min-height:54px;padding:0 18px;border:none;border-radius:16px;font-weight:900;cursor:pointer;font-size:15px;letter-spacing:.05px;line-height:1.25;transition:transform .15s,filter .15s,box-shadow .15s}.primary-btn{color:#111827;background:linear-gradient(135deg,var(--gold),var(--orange));box-shadow:0 16px 36px rgba(249,115,22,.25)}.ghost-btn{color:var(--text);border:1px solid var(--line);background:rgba(255,255,255,.07)}.primary-btn:hover,.ghost-btn:hover,.notice-link-btn:hover{transform:translateY(-1px);filter:brightness(1.06)}.primary-btn:active,.ghost-btn:active,.notice-link-btn:active{transform:translateY(0)}.link-btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;margin:16px 0 10px}.message-box{margin-top:16px;padding:14px 16px;border-radius:16px;line-height:1.6;border:1px solid var(--line);background:rgba(255,255,255,.08);font-size:14px;font-weight:700}.message-box.error{border-color:rgba(239,68,68,.45);background:rgba(239,68,68,.12);color:#fecaca}.message-box.ok{border-color:rgba(34,197,94,.45);background:rgba(34,197,94,.12);color:#bbf7d0}
.success-box{text-align:center}.success-icon{font-size:58px;filter:drop-shadow(0 12px 22px rgba(0,0,0,.22))}.success-box h2{margin:8px 0;font-size:27px;font-weight:900}.success-box p{color:var(--muted);font-size:15px;line-height:1.6;font-weight:600}.result-list{display:grid;gap:10px;margin-top:18px}.result-list div{display:flex;justify-content:space-between;gap:14px;padding:14px 16px;border-radius:14px;background:rgba(255,255,255,.06);border:1px solid var(--line)}.result-list span{color:var(--muted);font-weight:600}.result-list b{font-weight:900}.green{color:var(--green)}.form-footer{margin-top:18px;padding-top:14px;border-top:1px solid var(--line);color:var(--soft);font-size:12px;font-weight:700}
.preview-panel{margin-top:18px;padding:20px 24px;display:flex;justify-content:space-between;align-items:center;gap:18px;background:rgba(9,15,30,.74)}.preview-panel h3{margin:0 0 8px;font-size:18px}.preview-panel p{margin:0;font-size:14px;line-height:1.7;color:var(--muted);font-weight:600}.preview-panel code{color:#fde68a}.color-samples{display:flex;gap:10px;flex-wrap:wrap}.sample{padding:9px 13px;border-radius:999px;font-weight:900;font-size:13px}.sample-gold{background:var(--gold);color:#111827}.sample-red{background:var(--red);color:white}.sample-blue{background:var(--blue);color:#082f49}.sample-dark{background:#020617;color:white;border:1px solid var(--line)}.hidden{display:none!important}
@media(max-width:1060px){.hero-card{grid-template-columns:1fr}.hero-title{max-width:780px}.preview-panel{align-items:flex-start;flex-direction:column}}
@media(max-width:720px){.page{width:min(100% - 14px,680px);padding:10px 0 22px}.top-strip{border-radius:18px;align-items:flex-start;flex-direction:column}.hero-card{gap:14px;padding:12px;border-radius:22px}.hero-left,.form-card,.preview-panel{padding:18px;border-radius:20px}.brand-logo{width:52px;height:52px;border-radius:16px}.brand-title{font-size:16px}.brand-subtitle{font-size:12px}.hero-title{max-width:100%;gap:5px;line-height:1.11;letter-spacing:-.35px}.hero-gift{font-size:42px}.hero-line-white{font-size:clamp(32px,9.2vw,42px)}.hero-line-gold{font-size:clamp(25px,7.1vw,34px)}.hero-line-cream{font-size:clamp(25px,7vw,34px)}.hero-desc,.notice-text,.success-box p{font-size:14px}.benefit-grid{grid-template-columns:1fr;margin:20px 0}.notice-box{grid-template-columns:auto 1fr}.notice-link-btn{grid-column:1/-1;width:100%}.security-row{display:none}.form-head{flex-direction:column}.step-bar{gap:6px}.step-pill{font-size:12px;padding:10px 6px}.step-pill span{width:20px;height:20px}input,.primary-btn,.ghost-btn{min-height:52px;font-size:14.5px}.result-list div{padding:13px 14px;font-size:14px}}

/* BRAND FOOTER PANEL - RUNNING MODE */
.brand-footer-panel {
  justify-content: center !important;
  text-align: center;
  background:
    linear-gradient(135deg, rgba(251, 191, 36, 0.12), rgba(56, 189, 248, 0.08)),
    rgba(9, 15, 30, 0.78) !important;
}

.brand-footer-panel h3 {
  margin: 0 0 10px !important;
  font-size: clamp(22px, 3vw, 34px) !important;
  font-weight: 900;
  color: #ffffff;
  letter-spacing: -0.4px;
}

.brand-footer-panel p {
  margin: 0 !important;
  font-size: clamp(16px, 2vw, 22px) !important;
  font-weight: 800 !important;
  color: #ffe9a8 !important;
  line-height: 1.7;
}

/* CONDITION BOX - NEW MEMBER CODE */
.benefit-condition {
  grid-column: 1 / -1;
  min-height: auto !important;
  align-items: flex-start;
  background:
    linear-gradient(135deg, rgba(251, 191, 36, 0.14), rgba(56, 189, 248, 0.08)),
    rgba(255, 255, 255, 0.055) !important;
  border: 1px solid rgba(251, 191, 36, 0.28) !important;
}

.benefit-condition b {
  color: #ffe9a8;
  font-size: 16px;
}

.benefit-condition small {
  margin-top: 6px;
  color: #f8fafc !important;
  font-size: 14px !important;
  line-height: 1.7 !important;
  font-weight: 700 !important;
}

@media (max-width: 720px) {
  .benefit-condition small {
    font-size: 13.5px !important;
  }
}

/* CONDITION BOX - NEW MEMBER CODE */
.benefit-condition {
  grid-column: 1 / -1;
  min-height: auto !important;
  align-items: flex-start;
  background:
    linear-gradient(135deg, rgba(251, 191, 36, 0.14), rgba(56, 189, 248, 0.08)),
    rgba(255, 255, 255, 0.055) !important;
  border: 1px solid rgba(251, 191, 36, 0.28) !important;
}

.benefit-condition b {
  color: #ffe9a8;
  font-size: 16px;
}

.benefit-condition small {
  margin-top: 6px;
  color: #f8fafc !important;
  font-size: 14px !important;
  line-height: 1.7 !important;
  font-weight: 700 !important;
}

@media (max-width: 720px) {
  .benefit-condition small {
    font-size: 13.5px !important;
  }
}
/* ===== FOOTER BRAND CENTER FIX ===== */
.mobile-brand-footer {
  width: 100%;
  margin: 18px auto 0;
  padding: 22px 16px;
  border-radius: 22px;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;

  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.03)),
    rgba(8, 18, 40, 0.88);

  border: 1px solid rgba(255, 255, 255, 0.10);
  box-shadow:
    0 10px 30px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.mobile-brand-title {
  width: 100%;
  text-align: center;
  font-size: 20px;
  line-height: 1.35;
  font-weight: 900;
  color: #f8fafc;
  letter-spacing: 0.3px;
  margin-bottom: 10px;
}

.mobile-brand-subtitle {
  width: 100%;
  text-align: center;
  font-size: 18px;
  line-height: 1.45;
  font-weight: 900;
  color: #f7d774;
  letter-spacing: 0.2px;
}

/* ===== MOBILE ===== */
@media (max-width: 768px) {
  .mobile-brand-footer {
    padding: 18px 14px;
    margin: 16px auto 0;
    border-radius: 18px;
  }

  .mobile-brand-title {
    font-size: 17px;
    line-height: 1.4;
    margin-bottom: 8px;
  }

  .mobile-brand-subtitle {
    font-size: 15px;
    line-height: 1.45;
  }
}

@media (max-width: 480px) {
  .mobile-brand-footer {
    padding: 16px 12px;
    border-radius: 16px;
  }

  .mobile-brand-title {
    font-size: 16px;
    line-height: 1.4;
  }

  .mobile-brand-subtitle {
    font-size: 14px;
    line-height: 1.45;
  }
}


/* ==========================================================
   V3 - START BOT PRIORITY ALERT
   Mục tiêu: đưa hướng dẫn Start BOT lên khu vực nổi bật nhất
   ========================================================== */
.start-bot-priority-alert {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 18px;
  padding: 22px 24px;
  margin-bottom: 4px;
  border-radius: 26px;
  position: relative;
  overflow: hidden;
  border: 2px solid rgba(251, 191, 36, 0.58);
  background:
    radial-gradient(circle at 12% 30%, rgba(255, 255, 255, 0.16), transparent 22%),
    linear-gradient(135deg, rgba(251, 191, 36, 0.32), rgba(249, 115, 22, 0.22) 48%, rgba(34, 197, 94, 0.16)),
    rgba(9, 15, 30, 0.92);
  box-shadow:
    0 20px 60px rgba(249, 115, 22, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.16);
}

.start-bot-priority-alert::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.12), transparent);
  transform: translateX(-120%);
  animation: startBotShine 3.8s infinite;
  pointer-events: none;
}

@keyframes startBotShine {
  0% { transform: translateX(-120%); }
  48%, 100% { transform: translateX(120%); }
}

.start-bot-priority-icon {
  width: 66px;
  height: 66px;
  display: grid;
  place-items: center;
  border-radius: 22px;
  font-size: 34px;
  background: rgba(0, 0, 0, 0.20);
  border: 1px solid rgba(255, 255, 255, 0.18);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
  z-index: 1;
}

.start-bot-priority-content { z-index: 1; }

.start-bot-priority-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 7px;
  padding: 7px 12px;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.24);
  border: 1px solid rgba(255, 255, 255, 0.14);
  color: #bbf7d0;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.7px;
}

.start-bot-priority-kicker::before {
  content: "●";
  color: #22c55e;
  filter: drop-shadow(0 0 8px rgba(34, 197, 94, 0.85));
}

.start-bot-priority-title {
  color: #fff7ed;
  font-size: clamp(20px, 2.25vw, 32px);
  line-height: 1.22;
  font-weight: 900;
  letter-spacing: -0.35px;
  text-shadow: 0 8px 26px rgba(0, 0, 0, 0.35);
}

.start-bot-priority-title span {
  color: #fff;
  background: linear-gradient(90deg, #ffffff, #fef3c7, #ffffff);
  -webkit-background-clip: text;
  color: transparent;
}

.start-bot-priority-desc {
  margin-top: 7px;
  color: rgba(255, 255, 255, 0.86);
  font-size: 14.5px;
  font-weight: 700;
  line-height: 1.55;
}

.start-bot-priority-btn {
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 210px;
  min-height: 62px;
  padding: 0 24px;
  border-radius: 18px;
  text-decoration: none;
  color: #111827;
  background: linear-gradient(135deg, #fde047, #f97316);
  border: 1px solid rgba(255, 255, 255, 0.28);
  box-shadow: 0 16px 38px rgba(249, 115, 22, 0.32);
  font-size: 17px;
  font-weight: 1000;
  letter-spacing: 0.1px;
  white-space: nowrap;
  transition: transform .15s, filter .15s, box-shadow .15s;
}

.start-bot-priority-btn:hover {
  transform: translateY(-1px);
  filter: brightness(1.07);
  box-shadow: 0 18px 44px rgba(249, 115, 22, 0.42);
}

.start-bot-priority-btn:active { transform: translateY(0); }

@media (max-width: 720px) {
  .start-bot-priority-alert {
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 18px 16px;
    border-radius: 22px;
    text-align: center;
    margin-bottom: 2px;
  }

  .start-bot-priority-icon {
    width: 58px;
    height: 58px;
    border-radius: 18px;
    font-size: 30px;
    margin: 0 auto;
  }

  .start-bot-priority-kicker {
    justify-content: center;
    font-size: 11px;
    margin-left: auto;
    margin-right: auto;
  }

  .start-bot-priority-title {
    font-size: clamp(21px, 7vw, 30px);
    line-height: 1.25;
  }

  .start-bot-priority-desc {
    font-size: 13.5px;
  }

  .start-bot-priority-btn {
    width: 100%;
    min-height: 58px;
    font-size: 16px;
  }
}


/* AE888 FINAL: force Open Sans and clean text rendering */
html, body, input, button, textarea, select, label, div, span, p, a, small, strong, b, h1, h2, h3, h4, h5, h6 {
  font-family: "Open Sans", "Segoe UI", Arial, sans-serif !important;
  letter-spacing: normal;
}
.step-pill { min-width: 0; }
.step-bar { grid-template-columns: repeat(3, minmax(0, 1fr)); }

/* ==========================================================
   WHITE GOLD SUPPORT TOOLBAR - CODE ONLY FINAL V1
   Thanh hỗ trợ CSKH: nền trắng, chữ vàng, logo sáng/3D,
   bám cuối màn hình khi người dùng cuộn trang.
   ========================================================== */
body {
  padding-bottom: 116px;
}

.support-floating-dock.support-whitegold-final {
  position: fixed;
  left: 50%;
  bottom: 16px;
  transform: translateX(-50%);
  z-index: 9999;
  width: min(1120px, calc(100% - 28px));
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  pointer-events: none;
}

.support-floating-dock.support-whitegold-final > * {
  pointer-events: auto;
}

.support-whitegold-final .support-float-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 13px;
  min-height: 72px;
  padding: 12px 20px;
  text-decoration: none;
  color: #bf8a13;
  border-radius: 22px;
  border: 1.5px solid rgba(255, 203, 83, 0.62);
  background:
    radial-gradient(circle at 20% 10%, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0.92) 38%, rgba(247, 249, 255, 0.98) 100%);
  box-shadow:
    0 18px 48px rgba(0, 0, 0, 0.32),
    0 8px 18px rgba(255, 209, 87, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.96),
    inset 0 -1px 0 rgba(212, 154, 24, 0.12);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease;
}

.support-whitegold-final .support-float-btn:hover {
  transform: translateY(-3px);
  filter: brightness(1.025);
  box-shadow:
    0 24px 60px rgba(0, 0, 0, 0.36),
    0 0 28px rgba(255, 209, 87, 0.30),
    inset 0 1px 0 rgba(255, 255, 255, 1);
}

.support-whitegold-final .support-icon {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  max-width: 44px !important;
  min-height: 44px !important;
  max-height: 44px !important;
  flex: 0 0 44px !important;
  display: grid;
  place-items: center;
  overflow: visible;
  background: transparent !important;
  border-radius: 0 !important;
}

.support-whitegold-final .support-icon svg,
.support-whitegold-final .support-logo {
  display: block;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  max-width: 44px !important;
  min-height: 44px !important;
  max-height: 44px !important;
  object-fit: contain;
}

.support-whitegold-final .support-text {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
  text-align: left;
}

.support-whitegold-final .support-text b {
  margin: 0;
  color: #c89112 !important;
  font-size: 21px;
  font-weight: 900;
  line-height: 1.06;
  letter-spacing: -0.2px;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.95);
}

.support-whitegold-final .support-text small {
  margin: 0;
  color: #6b7280 !important;
  font-size: 12.5px;
  font-weight: 800;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (max-width: 980px) {
  body {
    padding-bottom: 220px;
  }

  .support-floating-dock.support-whitegold-final {
    left: 10px;
    right: 10px;
    bottom: 10px;
    width: auto;
    transform: none;
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .support-whitegold-final .support-float-btn {
    min-height: 62px;
    padding: 10px 16px;
    border-radius: 18px;
    justify-content: flex-start;
  }

  .support-whitegold-final .support-icon,
  .support-whitegold-final .support-icon svg,
  .support-whitegold-final .support-logo {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    max-width: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;
    flex-basis: 38px !important;
  }

  .support-whitegold-final .support-text b {
    font-size: 18px;
  }

  .support-whitegold-final .support-text small {
    font-size: 11.5px;
  }
}

/* === AE888 MOBILE TOOLBAR FORCE V3 START === */
/* PC giữ dạng nổi bật, mobile ép thành 1 hàng ngang nhỏ gọn */
@media (min-width: 981px) {
  .support-floating-dock.support-whitegold-final,
  .support-floating-dock {
    position: fixed !important;
    left: 50% !important;
    bottom: 16px !important;
    transform: translateX(-50%) !important;
    z-index: 9999 !important;
    width: min(1120px, calc(100% - 28px)) !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 14px !important;
    pointer-events: none !important;
  }
}

@media (max-width: 980px) {
  body {
    padding-bottom: 72px !important;
  }

  .support-floating-dock.support-whitegold-final,
  .support-floating-dock {
    position: fixed !important;
    left: 8px !important;
    right: 8px !important;
    bottom: calc(7px + env(safe-area-inset-bottom, 0px)) !important;
    transform: none !important;
    z-index: 99999 !important;
    width: auto !important;
    max-width: none !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 6px !important;
    pointer-events: none !important;
  }

  .support-floating-dock.support-whitegold-final > *,
  .support-floating-dock > * {
    pointer-events: auto !important;
  }

  .support-whitegold-final .support-float-btn,
  .support-floating-dock .support-float-btn {
    min-height: 46px !important;
    height: 46px !important;
    max-height: 46px !important;
    padding: 5px 6px !important;
    border-radius: 14px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    background: linear-gradient(180deg, #ffffff 0%, #f6f7fb 100%) !important;
    border: 1px solid rgba(255, 203, 83, 0.72) !important;
    box-shadow: 0 8px 20px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.95) !important;
    overflow: hidden !important;
  }

  .support-whitegold-final .support-icon,
  .support-floating-dock .support-icon {
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    max-width: 22px !important;
    min-height: 22px !important;
    max-height: 22px !important;
    flex: 0 0 22px !important;
    display: grid !important;
    place-items: center !important;
    overflow: hidden !important;
    background: transparent !important;
    border-radius: 0 !important;
  }

  .support-whitegold-final .support-icon svg,
  .support-whitegold-final .support-logo,
  .support-floating-dock .support-icon svg,
  .support-floating-dock .support-logo {
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    max-width: 22px !important;
    min-height: 22px !important;
    max-height: 22px !important;
    display: block !important;
    object-fit: contain !important;
  }

  .support-whitegold-final .support-text,
  .support-floating-dock .support-text {
    min-width: 0 !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 0 !important;
  }

  .support-whitegold-final .support-text b,
  .support-floating-dock .support-text b {
    display: block !important;
    color: #c89112 !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    letter-spacing: -0.2px !important;
    text-shadow: none !important;
  }

  .support-whitegold-final .support-text small,
  .support-floating-dock .support-text small {
    display: none !important;
  }
}

@media (max-width: 390px) {
  body {
    padding-bottom: 64px !important;
  }

  .support-floating-dock.support-whitegold-final,
  .support-floating-dock {
    left: 5px !important;
    right: 5px !important;
    bottom: calc(5px + env(safe-area-inset-bottom, 0px)) !important;
    gap: 4px !important;
  }

  .support-whitegold-final .support-float-btn,
  .support-floating-dock .support-float-btn {
    min-height: 42px !important;
    height: 42px !important;
    max-height: 42px !important;
    padding: 4px 4px !important;
    border-radius: 12px !important;
  }

  .support-whitegold-final .support-icon,
  .support-whitegold-final .support-icon svg,
  .support-whitegold-final .support-logo,
  .support-floating-dock .support-icon,
  .support-floating-dock .support-icon svg,
  .support-floating-dock .support-logo {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    max-width: 20px !important;
    min-height: 20px !important;
    max-height: 20px !important;
    flex-basis: 20px !important;
  }

  .support-whitegold-final .support-text b,
  .support-floating-dock .support-text b {
    font-size: 10px !important;
  }
}
/* === AE888 MOBILE TOOLBAR FORCE V3 END === */

