/* 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:"Be Vietnam Pro","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;
}