/* ═══════════════════════════════════════════════════════════════
   Giao diện "sang trọng" — bật bằng nút ở chân trang.
   Không sửa file cũ. Chỉ đè token và bề mặt.
   ═══════════════════════════════════════════════════════════════ */

html[data-theme="luxe"]{
  --ink:#0B0A0D;
  --ink-2:#14121A;
  --ink-3:#1B1822;

  --bone:#F6F1E7;
  --bone-72:rgba(246,241,231,.78);
  --bone-52:rgba(246,241,231,.58);
  --bone-38:rgba(246,241,231,.4);

  --dim:#B6ADA0;
  --dim-2:#8A8276;

  --line:rgba(246,241,231,.14);
  --line-2:rgba(246,241,231,.26);

  --acid:#E9C77C;          /* vàng đồng */
  --pink:#C88A9B;          /* hồng tro */
  --cyan:#8FB3A6;          /* xanh ngọc xám */
  --blue:#7C86B8;          /* tím xám */
  --red:var(--acid);

  --f-display:"Fraunces",Georgia,serif;
  --ease-out:cubic-bezier(.22,.61,.24,1);
}

/* nền: hai quầng ấm, không còn tím/xanh neon */
html[data-theme="luxe"] body{
  background:
    radial-gradient(120% 70% at 8% -10%, #1A1520 0%, rgba(26,21,32,0) 60%),
    radial-gradient(90% 60% at 96% 4%, #20180F 0%, rgba(32,24,15,0) 55%),
    radial-gradient(120% 80% at 50% 118%, #12181A 0%, rgba(18,24,26,0) 60%),
    #0B0A0D;
}
html[data-theme="luxe"] body::before{opacity:.28;filter:blur(28px)}

/* tiêu đề: serif, không in hoa, giãn nhẹ */
html[data-theme="luxe"] .display,
html[data-theme="luxe"] .hero__title{
  font-family:var(--f-display);
  text-transform:none;
  letter-spacing:-.01em;
  line-height:1.02;
  background-image:linear-gradient(180deg,#FFFFFF,#F6F1E7 55%,#C9BFAC);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
html[data-theme="luxe"] .hero__title{font-size:clamp(52px,10vw,120px)}

/* bo góc mềm + bóng ấm */
html[data-theme="luxe"] .rates,
html[data-theme="luxe"] .ledger,
html[data-theme="luxe"] .plugs,
html[data-theme="luxe"] .qa-list,
html[data-theme="luxe"] .pay__panel,
html[data-theme="luxe"] .qr{
  border-radius:18px;
  border-color:rgba(246,241,231,.10);
  box-shadow:0 30px 80px -50px rgba(0,0,0,.95), inset 0 1px 0 rgba(255,255,255,.06);
}
html[data-theme="luxe"] .btn,
html[data-theme="luxe"] .rate__go,
html[data-theme="luxe"] .snd,
html[data-theme="luxe"] .live-pill,
html[data-theme="luxe"] .plug__name em{border-radius:999px}

html[data-theme="luxe"] .btn{border-radius:999px;padding-left:38px;padding-right:38px}
html[data-theme="luxe"] .rate__go{border-radius:50%}

/* vạch nhấn: mảnh, màu đồng */
html[data-theme="luxe"] .rate::before,
html[data-theme="luxe"] .plug::before{
  width:1px;
  background:linear-gradient(180deg,var(--acid),transparent);
}
html[data-theme="luxe"] .ledger__bar{
  height:2px;
  background:linear-gradient(90deg,var(--acid),rgba(233,199,124,.15));
}

/* nhãn chữ nhỏ: giãn rộng, kiểu tạp chí */
html[data-theme="luxe"] .kicker,
html[data-theme="luxe"] .rate__label,
html[data-theme="luxe"] .plug__role{
  letter-spacing:.28em;
  text-transform:uppercase;
  font-size:10px;
}
html[data-theme="luxe"] .rate__amount{
  font-family:var(--f-display);
  font-size:clamp(30px,3.6vw,44px);
  letter-spacing:-.01em;
}

/* chuyển động: chậm hơn, mượt hơn, ít bật */
html[data-theme="luxe"] .rate,
html[data-theme="luxe"] .plug,
html[data-theme="luxe"] .btn{transition-duration:420ms;transition-timing-function:cubic-bezier(.22,.61,.24,1)}
html[data-theme="luxe"] .rate:hover{padding-left:24px}
html[data-theme="luxe"] .rate__go{border-color:rgba(246,241,231,.2)}

/* bỏ các mảng neon, giữ vệt cọ nhưng nhuộm ấm */
html[data-theme="luxe"] .rate__film{filter:hue-rotate(200deg) saturate(.55) brightness(1.15)}
html[data-theme="luxe"] .btn__film{filter:hue-rotate(195deg) saturate(.5) brightness(1.2)}

/* nút thở: chậm hơn, ánh đồng */
@keyframes breatheLuxe{
  0%,100%{box-shadow:0 0 0 1px rgba(233,199,124,.35),0 0 10px 0 rgba(233,199,124,.08)}
  50%{box-shadow:0 0 0 1px rgba(233,199,124,.7),0 0 24px 3px rgba(233,199,124,.16)}
}
html[data-theme="luxe"] #cta-main{animation:breatheLuxe 6.5s ease-in-out infinite}

/* đếm ngược: số mảnh, không gradient chói */
html[data-theme="luxe"] .figure--count dd span#countdown{
  background:none;-webkit-background-clip:initial;background-clip:initial;
  color:var(--bone);
  font-family:var(--f-display);
  letter-spacing:.02em;
}

@media (prefers-reduced-motion:reduce){
  html[data-theme="luxe"] #cta-main{animation:none}
}