@import url('/fonts/fonts.css');

/* ══════════════════════════════════════════════════════════════
   THE NIGHT CARNIVAL — "Marquee Poster" UI (thiết kế gốc)
   Tokens theo skill: Midnight Purple / Neon Magenta / Marquee Gold
   ══════════════════════════════════════════════════════════════ */
:root{
  --night:#12042A; --plum:#28084A;
  --bg:#1A0638; --bg2:#2D0958; --bg3:#451078;
  --violet:#5B1DA8; --royal-indigo:#381478; --electric-blue:#2C22C7;
  --magenta:#E8289E; --hot-pink:#F73B8A; --neon-pink:#FF2BB5;
  --gold:#F5B738; --bulb:#FFF4D0; --carnival-red:#E5253A;
  --text:#FFFFFF; --muted:#E0CEF2;
  --warm-white:#FFF8FB; --muted-lilac:#D2BEEC;
  --card:rgba(38,9,68,.78); --card-soft:rgba(48,11,84,.85);
  --line:rgba(245,183,56,.38); --line-soft:rgba(224,206,242,.22);
  --r-card:18px; --r-btn:14px; --max:1200px;
  --ease-out:cubic-bezier(.22,1,.36,1);
  --shadow-neon:0 4px 24px rgba(232,40,158,.35),0 0 35px rgba(245,183,56,.25);
  --fd:'Be Vietnam Pro',system-ui,sans-serif;
  --fb:'Be Vietnam Pro',system-ui,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:clip}
html.rm *,html.rm *::before,html.rm *::after{animation:none!important;transition:none!important}
body{
  margin:0;color:var(--text);font-family:var(--fb);line-height:1.6;font-size:16px;
  background:
    radial-gradient(ellipse 90% 50% at 50% 0%, rgba(245,183,56,.18) 0%, transparent 60%),
    radial-gradient(circle 60vw at 15% 20%, rgba(232,40,158,.16), transparent 70%),
    radial-gradient(circle 60vw at 85% 25%, rgba(139,53,255,.2), transparent 70%),
    linear-gradient(180deg, rgba(26,6,56,.65) 0%, rgba(22,5,48,.5) 40%, rgba(18,4,42,.85) 100%),
    #180535;
  min-height:100svh;overflow-x:clip;
}
/* Starfield + aurora dịu nhẹ không chói */
.sky{position:fixed;inset:0;z-index:1;pointer-events:none;overflow:hidden}
/* Background particle layers are disabled on desktop and mobile. */
body .firefly-field,body .neon-twinkle,body .sky .stars,body .sky .bokeh,body .kv-sparkles{display:none!important}
body .sky::after{display:none;content:none;animation:none}
.sky .stars{position:absolute;inset:-40px;
  background-image:
    radial-gradient(1.2px 1.2px at 12% 22%,#fff,transparent 60%),
    radial-gradient(1px 1px at 32% 68%,#ffd9f4,transparent 60%),
    radial-gradient(1.4px 1.4px at 54% 14%,#fff,transparent 60%),
    radial-gradient(1px 1px at 71% 44%,#ffe5b5,transparent 60%),
    radial-gradient(1.2px 1.2px at 84% 76%,#fff,transparent 60%),
    radial-gradient(1px 1px at 44% 88%,#ffd2ea,transparent 60%);
  opacity:.5;animation:twinkle 8s ease-in-out infinite alternate}
@keyframes twinkle{from{opacity:.3}to{opacity:.65}}
/* Quầng cực quang trôi chậm, ấm áp dịu mắt */
.sky .aurora{position:absolute;border-radius:50%;filter:blur(90px);opacity:.35}
.sky .a1{width:56vw;height:56vw;left:-14vw;top:-18vw;background:radial-gradient(circle,rgba(232,40,158,.3),transparent 65%);animation:drift 24s ease-in-out infinite alternate}
.sky .a2{width:48vw;height:48vw;right:-12vw;top:4vh;background:radial-gradient(circle,rgba(245,183,56,.25),transparent 65%);animation:drift 28s ease-in-out infinite alternate-reverse}
.sky .a3{width:60vw;height:42vw;left:20vw;bottom:-18vw;background:radial-gradient(circle,rgba(232,40,158,.2),transparent 65%);animation:drift 32s ease-in-out infinite alternate}
@keyframes drift{from{transform:translate(0,0) scale(1)}to{transform:translate(3vw,2vh) scale(1.06)}}
/* Tia spotlight từ đỉnh dịu nhẹ */
.sky .beam{position:absolute;top:-12%;width:220px;height:70%;filter:blur(75px);opacity:.18;transform-origin:top center}
.sky .b1{left:14%;background:linear-gradient(180deg,rgba(232,40,158,.35),transparent 75%);transform:rotate(10deg);animation:sway 14s ease-in-out infinite alternate}
.sky .b2{left:46%;background:linear-gradient(180deg,rgba(245,183,56,.3),transparent 75%);transform:rotate(-6deg);animation:sway 16s ease-in-out infinite alternate-reverse}
.sky .b3{right:12%;background:linear-gradient(180deg,rgba(232,40,158,.28),transparent 75%);transform:rotate(8deg);animation:sway 15s ease-in-out infinite alternate}
@keyframes sway{from{transform:rotate(4deg)}to{transform:rotate(-4deg)}}
/* Bokeh lễ hội nhẹ nhàng */
.sky .bokeh{position:absolute;inset:0;
  background-image:
    radial-gradient(24px 24px at 8% 34%,rgba(232,40,158,.1),transparent 70%),
    radial-gradient(32px 32px at 20% 72%,rgba(245,183,56,.1),transparent 70%),
    radial-gradient(20px 20px at 38% 20%,rgba(245,183,56,.08),transparent 70%),
    radial-gradient(36px 36px at 60% 82%,rgba(232,40,158,.08),transparent 70%),
    radial-gradient(24px 24px at 80% 38%,rgba(245,183,56,.08),transparent 70%);
  animation:bokehFloat 20s ease-in-out infinite alternate}
@keyframes bokehFloat{from{transform:translateY(-8px)}to{transform:translateY(8px)}}
/* Vignette tạo chiều sâu */
.sky .vignette{position:absolute;inset:0;background:radial-gradient(120% 90% at 50% 38%,transparent 55%,rgba(6,1,12,.75) 100%)}
.wrap{position:relative;z-index:2;max-width:var(--max);margin:0 auto;padding:0 22px 70px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
img{max-width:100%;height:auto}
a{color:var(--gold)}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px;border-radius:6px}
::selection{background:var(--magenta);color:#fff}

/* ── Reveal on scroll (JS gắn .rv/.in) ── */
.rv{opacity:0;transform:translateY(16px);transition:opacity .5s ease var(--d,0ms),transform .5s ease var(--d,0ms)}
.rv.in{opacity:1;transform:none}
.flash-highlight{animation:flash 1.8s ease}
@keyframes flash{0%,60%{box-shadow:0 0 0 2px var(--gold)}100%{box-shadow:none}}

/* ── Masthead ── */
.masthead{
  position:sticky;top:0;z-index:50;
  /* background:var(--carnival-red); */
  -webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);
  border-bottom:1px solid rgba(255,214,79,.72);
  box-shadow:0 8px 30px rgba(91,12,99,.38),0 1px 0 rgba(255,255,255,.22) inset;
  transition:background .3s ease,border-color .3s ease,box-shadow .3s ease;
}
.masthead.scrolled{
  /* background:var(--carnival-red);
  border-bottom-color:rgba(255,224,113,.85);
  box-shadow:0 10px 36px rgba(65,7,79,.52); */
}
/* Animation thanh menu êm đềm */
.masthead::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:linear-gradient(100deg,transparent 15%,rgba(232,40,158,.14) 35%,rgba(245,183,56,.16) 50%,rgba(232,40,158,.14) 65%,transparent 85%);
  background-size:200% 100%;
  animation:mastSweep 14s ease-in-out infinite alternate;will-change:background-position}
@keyframes mastSweep{from{background-position:0% 0}to{background-position:100% 0}}
.mast-in{position:relative;z-index:1;max-width:var(--max);margin:0 auto;padding:12px 22px;display:flex;align-items:center;gap:18px}
html.rm .masthead::before,html.fx-paused .masthead::before,html.fx-low .masthead::before{animation:none;opacity:.3}
@media (prefers-reduced-motion:reduce){html:not(.fx-explicit) .masthead::before{animation:none}}
.brand{display:flex;align-items:center;gap:12px;background:none;border:0;cursor:pointer;color:var(--text);text-align:left;padding:0}
.brand img{height:38px;width:auto;border-radius:8px}
.brand-txt{font-family:var(--fd);font-weight:700;font-size:20px;letter-spacing:.06em;line-height:1.05;text-transform:uppercase}
.brand-txt small{display:block;font-family:var(--fb);font-weight:500;font-size:11px;letter-spacing:.02em;color:var(--muted);text-transform:none}
.masthead .brand-txt small{color:rgba(255,255,255,.9)}
.mainnav{display:flex;gap:6px;margin-left:auto;overflow-x:auto;scrollbar-width:none}
.mainnav::-webkit-scrollbar{display:none}
.nav-link{background:transparent;border:1px solid transparent;color:var(--muted);font-family:var(--fb);font-weight:600;font-size:14px;padding:8px 14px;border-radius:var(--r-btn);cursor:pointer;white-space:nowrap;transition:color .2s,background .2s}
.masthead .nav-link{color:#fff}
.nav-link:hover{color:#fff;background:rgba(255,43,194,.3);border-color:rgba(255,221,242,.5)}
.nav-link[aria-current="true"]{color:var(--gold);background:rgba(245,183,56,.14);border-color:rgba(245,183,56,.35)}
.btn-ticket{
  position:relative;
  font-family:var(--fd);
  font-weight:800;
  font-size:15px;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#fff;
  background:transparent;
  border:0;
  border-radius:14px;
  padding:10px 22px;
  cursor:pointer;
  box-shadow:0 6px 20px rgba(229,37,58,.45);
  transition:transform .18s ease,box-shadow .18s ease;
  white-space:nowrap;
  overflow:hidden;
  isolation:isolate;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.btn-ticket::before{content:"";position:absolute;inset:-160%;background:conic-gradient(from 0deg,transparent 0deg,transparent 280deg,rgba(255,43,194,.9) 320deg,#fff 345deg,#f5b738 360deg);animation:beamRotate 3.5s linear infinite;z-index:-2}
.btn-ticket::after{content:"";position:absolute;inset:2px;background:var(--carnival-red);border-radius:12px;z-index:-1;transition:background .2s ease}
.btn-ticket:hover{transform:translateY(-1px);box-shadow:0 8px 24px rgba(229,37,58,.62)}
.btn-ticket:hover::after{background:#ed3045}

/* ── Buttons chính ── */
.btn-primary{
  position:relative;font-family:var(--fd);font-weight:700;font-size:17px;letter-spacing:.04em;text-transform:uppercase;
  color:#fff;
  background:var(--carnival-red);
  border:1px solid rgba(255,255,255,.35);
  border-radius:14px;padding:13px 34px;cursor:pointer;
  box-shadow:0 6px 22px rgba(229,37,58,.45),0 0 20px rgba(245,183,56,.2);
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease;
}
.btn-primary:hover{background:#ed3045;transform:translateY(-2px);box-shadow:0 10px 30px rgba(229,37,58,.6),0 0 25px rgba(245,183,56,.3)}
.btn-ghostbtn{
  font-family:var(--fd);font-weight:700;font-size:16px;letter-spacing:.04em;text-transform:uppercase;
  color:#fff;
  background:var(--carnival-red);
  border:1.5px solid rgba(255,239,184,.8);
  border-radius:var(--r-btn);padding:12px 28px;cursor:pointer;
  box-shadow:0 4px 16px rgba(0,0,0,.3);
  transition:.18s;
}
.btn-ghostbtn:hover{background:#ed3045;border-color:#fff0b5;color:#fff;box-shadow:0 6px 24px rgba(229,37,58,.48),0 0 20px rgba(245,183,56,.36)}
.lp-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin:24px 0}
.lp-act{overflow:visible}
.lp-act .bulbs{pointer-events:none}
.lp-act .lp-label{position:relative;z-index:1}
.bulbs b{position:absolute;width:6px;height:6px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff,var(--bulb) 45%,#D9962A 100%);box-shadow:0 0 6px 1px rgba(245,183,56,.5);animation:chase 3s linear infinite}
.bulbs b:nth-child(even){animation-delay:1.5s}
@keyframes chase{0%,100%{opacity:.9}50%{opacity:.4}}
.bulb-strip{height:10px;background-image:radial-gradient(circle at 50% 50%,var(--bulb) 0 2.5px,rgba(245,183,56,.45) 3px 4px,transparent 4.5px);background-size:24px 10px;background-repeat:repeat-x;opacity:.85}

/* ── Screens (SPA) ── */
.screen{display:none}
.screen.on{display:block;animation:screenIn .3s ease}
@keyframes screenIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.backlink{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.05);border:1px solid var(--line-soft);color:var(--text);border-radius:var(--r-btn);padding:8px 16px;font-size:14px;font-weight:600;cursor:pointer;margin:26px 0 6px}
.backlink:hover{border-color:var(--gold)}
.screen>h1,.screen>h2{font-family:var(--fd);text-transform:uppercase;letter-spacing:.04em;line-height:1.36;padding-top:.24em;padding-bottom:.1em;margin:14px 0 6px;overflow:visible;contain:none}
.screen>h1{font-size:clamp(30px,4.6vw,46px)} .screen>h2{font-size:clamp(26px,3.6vw,38px)}
.sub{color:var(--muted);margin:0 0 8px;max-width:70ch}

/* ══ HERO SPLIT — 2 col above-the-fold ══════════════════════ */
.hero-split{display:grid;grid-template-columns:1fr 1fr;gap:46px;align-items:center;min-height:calc(100svh - 68px);padding:20px 0;position:relative;isolation:isolate}
.hero-split::before{
  content:"";position:absolute;inset:-30px -40px;z-index:-1;pointer-events:none;
  background:
    radial-gradient(ellipse 50% 60% at 50% 0%,rgba(245,183,56,.12),transparent 70%),
    radial-gradient(ellipse 35% 45% at 10% 50%,rgba(232,40,158,.1),transparent 70%),
    radial-gradient(ellipse 35% 45% at 90% 50%,rgba(245,183,56,.08),transparent 70%);
  filter:blur(8px);
}

/* -- col left: sign marquee dịu mắt -- */
.hero-img-col{display:flex;align-items:center;justify-content:center}
.hero-sign-wrap{
  position:relative;width:100%;max-width:540px;aspect-ratio:1/1;
  background:radial-gradient(circle at 50% 50%, rgba(36,6,59,.4) 0%, transparent 70%);
  border-radius:20px;border:1px solid rgba(245,183,56,.25);
  box-shadow:0 12px 36px rgba(0,0,0,.5),inset 0 0 40px rgba(232,40,158,.08);
  overflow:hidden;display:flex;align-items:center;justify-content:center;padding:16px;
}
/* Dải viền bóng đèn êm đềm */
.hero-sign-wrap::before{
  content:"";position:absolute;left:8px;right:8px;top:8px;height:12px;z-index:3;pointer-events:none;
  background:radial-gradient(circle 4px at 50% 50%,rgba(255,255,255,.9) 0%,#f5b738 40%,rgba(245,183,56,.35) 60%,transparent 75%);
  background-size:24px 12px;background-repeat:repeat-x;
  opacity:.8;animation:bulbScroll 3s linear infinite;
}
.hero-sign-wrap::after{
  content:"";position:absolute;left:8px;right:8px;bottom:8px;height:12px;z-index:3;pointer-events:none;
  background:radial-gradient(circle 4px at 50% 50%,rgba(255,255,255,.9) 0%,#e8289e 40%,rgba(232,40,158,.35) 60%,transparent 75%);
  background-size:24px 12px;background-repeat:repeat-x;
  opacity:.75;animation:bulbScroll 3s linear infinite reverse;
}
@keyframes bulbScroll{from{background-position:0 0}to{background-position:24px 0}}

.hero-sign-img{
  width:100%;height:100%;object-fit:contain;display:block;position:relative;z-index:2;
  filter:drop-shadow(0 4px 18px rgba(232,40,158,.35)) drop-shadow(0 0 35px rgba(245,183,56,.18));
}
.hero-sign-aura{
  position:absolute;inset:12%;
  background:radial-gradient(circle,rgba(232,40,158,.14) 0%,rgba(245,183,56,.08) 50%,transparent 70%);
  filter:blur(36px);z-index:0;pointer-events:none;
}
/* Sóng hồng pulse nhẹ nhàng từ tâm */
.hero-sign-wrap .aura-ring{
  position:absolute;inset:0;border-radius:18px;pointer-events:none;z-index:1;overflow:hidden;
}
.hero-sign-wrap .aura-ring::before,
.hero-sign-wrap .aura-ring::after,
.aura-ring-3{
  content:"";position:absolute;border-radius:50%;
  background:radial-gradient(circle, rgba(232,40,158,.25) 0%, rgba(232,40,158,.08) 40%, transparent 70%);
  width:36%;height:36%;left:32%;top:32%;
  animation:pinkPulse 5s ease-out infinite;
}
.hero-sign-wrap .aura-ring::after{animation-delay:1.6s}
.aura-ring-3{animation-delay:3.2s;pointer-events:none;z-index:1}
@keyframes pinkPulse{
  0%  {transform:scale(.3);opacity:.4;filter:blur(2px)}
  60% {opacity:.12;filter:blur(16px)}
  100%{transform:scale(2.2);opacity:0;filter:blur(28px)}
}

/* -- col right -- */
.hero-info-col{display:flex;flex-direction:column;gap:0;text-align:left;container-type:inline-size}

/* eyebrow biên tập: gạch vàng + chữ tracking rộng, không pill */
.hero-kicker-pill{
  display:inline-flex;align-items:center;gap:10px;padding:0 0 0 14px;
  background:transparent;border:0;border-left:3px solid var(--gold);border-radius:0;
  font-family:var(--fd);font-size:15px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;
  color:var(--bulb);margin-bottom:14px;width:fit-content;max-width:100%;
}
.hero-kicker-pill svg{flex:none;stroke:var(--gold)}

/* title — 2 dòng cùng size, cùng gradient trắng→hồng→vàng như thiết kế */
.hero-title{
  display:flex;flex-direction:column;align-items:flex-start;
  margin:0 0 12px;font-family:var(--fd);font-weight:800;
  text-transform:uppercase;letter-spacing:.03em;line-height:.92;
}
/* Gradient chạy suốt 2 dòng — đặt trên wrapper để 2 span kế thừa */
.hero-title-the,
.hero-title-carnival{
  font-size:clamp(60px,9.5vw,122px);
  line-height:.92;
  background:linear-gradient(180deg,
    #ffffff  0%,
    #ffe8f5 18%,
    #ffb3e8 32%,
    #ff7ecb 42%,
    #ffd84a 58%,
    #ffc247 70%,
    #ff9c1a 84%,
    #ff5e00 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 4px 0 rgba(80,10,60,.85));
  animation:titleNeonFlicker 5s ease-in-out infinite;
}
/* "THE NIGHT" chiếm ~40% gradient (trên) */
.hero-title-the{
  background-size:100% 250%;
  background-position:0 0%;
}
/* "CARNIVAL" chiếm ~60% gradient (dưới) */
.hero-title-carnival{
  background-size:100% 250%;
  background-position:0 60%;
}
@keyframes titleNeonFlicker{
  0%,100%{ filter:drop-shadow(0 4px 0 rgba(80,10,60,.85)) drop-shadow(0 0 18px rgba(255,120,0,.5)) drop-shadow(0 0 50px rgba(255,43,194,.3)) }
  10%    { filter:drop-shadow(0 4px 0 rgba(80,10,60,.85)) drop-shadow(0 0  6px rgba(255,120,0,.2)) drop-shadow(0 0 14px rgba(255,43,194,.1)) }
  15%    { filter:drop-shadow(0 4px 0 rgba(80,10,60,.85)) drop-shadow(0 0 24px rgba(255,140,0,.75)) drop-shadow(0 0 65px rgba(255,43,194,.45)) }
  30%    { filter:drop-shadow(0 4px 0 rgba(80,10,60,.85)) drop-shadow(0 0  4px rgba(255,120,0,.15)) }
  32%    { filter:drop-shadow(0 4px 0 rgba(80,10,60,.85)) drop-shadow(0 0 20px rgba(255,140,0,.65)) drop-shadow(0 0 55px rgba(255,43,194,.38)) }
  82%    { filter:drop-shadow(0 4px 0 rgba(80,10,60,.85)) drop-shadow(0 0  4px rgba(255,120,0,.15)) }
  84%    { filter:drop-shadow(0 4px 0 rgba(80,10,60,.85)) drop-shadow(0 0 18px rgba(255,140,0,.6))  drop-shadow(0 0 48px rgba(255,43,194,.32)) }
  86%    { filter:drop-shadow(0 4px 0 rgba(80,10,60,.85)) drop-shadow(0 0  4px rgba(255,120,0,.15)) }
}
@keyframes carnivalNeon{
  0%  {filter:drop-shadow(0 0 14px rgba(255,194,71,.85)) drop-shadow(0 5px 0 rgba(80,20,0,.9)) drop-shadow(0 0 44px rgba(255,120,0,.5))}
  10% {filter:drop-shadow(0 0  4px rgba(255,194,71,.25)) drop-shadow(0 5px 0 rgba(80,20,0,.9)) drop-shadow(0 0 10px rgba(255,120,0,.1))}
  15% {filter:drop-shadow(0 0 20px rgba(255,194,71,.98)) drop-shadow(0 5px 0 rgba(80,20,0,.9)) drop-shadow(0 0 60px rgba(255,140,0,.65))}
  30% {filter:drop-shadow(0 0  3px rgba(255,194,71,.2))  drop-shadow(0 5px 0 rgba(80,20,0,.9)) drop-shadow(0 0  8px rgba(255,120,0,.1))}
  32% {filter:drop-shadow(0 0 17px rgba(255,194,71,.92)) drop-shadow(0 5px 0 rgba(80,20,0,.9)) drop-shadow(0 0 50px rgba(255,140,0,.58))}
  70% {filter:drop-shadow(0 0 11px rgba(255,194,71,.72)) drop-shadow(0 5px 0 rgba(80,20,0,.9)) drop-shadow(0 0 34px rgba(255,120,0,.4))}
  84% {filter:drop-shadow(0 0 14px rgba(255,194,71,.85)) drop-shadow(0 5px 0 rgba(80,20,0,.9)) drop-shadow(0 0 44px rgba(255,120,0,.5))}
  86% {filter:drop-shadow(0 0  3px rgba(255,194,71,.2))  drop-shadow(0 5px 0 rgba(80,20,0,.9)) drop-shadow(0 0  8px rgba(255,120,0,.1))}
  100%{filter:drop-shadow(0 0 14px rgba(255,194,71,.85)) drop-shadow(0 5px 0 rgba(80,20,0,.9)) drop-shadow(0 0 44px rgba(255,120,0,.5))}
}
/* tagline */
.hero-tagline{font-size:clamp(13px,1.25vw,16px);color:var(--muted);font-weight:500;margin:0 0 16px;line-height:1.55}
.hero-tagline b{color:var(--gold)}

/* ── Hero: phòng vé — quầy booth tối, viền vàng đôi, số condensed oversize ── */
.hero-stock{
  margin:0 0 14px;background:linear-gradient(180deg,rgba(37,8,63,.92),rgba(16,5,31,.94));
  border:1px solid var(--line);border-top:3px double var(--gold);border-radius:4px 4px var(--r-card) var(--r-card);
  padding:16px 18px 14px;box-shadow:0 18px 44px rgba(0,0,0,.5);
}
.hero-stock-title{font-family:var(--fd);font-weight:700;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);margin:0 0 2px}
.hero-stock-num{display:flex;align-items:baseline;gap:8px;line-height:1}
.hero-stock-num b{font-family:var(--fd);font-weight:800;font-size:clamp(44px,6.8vw,86px);letter-spacing:.01em;
  background:linear-gradient(180deg,#fff 0%,#ffe8f5 22%,#ffb3e8 38%,#ffd84a 62%,#ffc247 78%,#ff9c1a 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 3px 0 rgba(80,10,60,.85)) drop-shadow(0 0 20px rgba(255,194,71,.55))}
.hero-stock-num span{font-family:var(--fd);font-weight:700;font-size:clamp(16px,2vw,24px);letter-spacing:.08em;text-transform:uppercase;color:var(--text);white-space:nowrap}
.hero-stock-row{display:flex;gap:6px;flex-wrap:nowrap;margin-top:10px}
.hero-stock-row>div{flex:1 1 0;min-width:0;text-align:center;background:rgba(0,0,0,.45);border:1px solid rgba(255,196,79,.22);border-top:2px solid rgba(255,196,79,.55);border-radius:6px;padding:6px 2px}
.hero-stock-row span{display:block;font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.hero-stock-row .stock-tier-name{text-transform:none;letter-spacing:0}
.hero-stock-row b{display:block;font-family:var(--fd);font-size:11px;color:var(--bulb);text-shadow:0 0 14px rgba(255,194,71,.6);line-height:1.15;white-space:nowrap}

/* 3 chips ngang */
.hero-chips-row{display:grid;grid-template-columns:1.2fr 0.95fr 1.2fr;gap:8px;margin-bottom:16px}
.hero-chips-row .hero-sponsor-logos{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;gap:5px;width:max-content;max-width:100%;margin:0 0 5px}
@media(min-width:641px){
 .hero-chips-row .hero-chip:last-child>div{flex:1;min-width:0}
 .hero-chips-row .hero-sponsor-logos{display:grid;grid-template-columns:88fr 70fr 74fr;gap:3px;width:100%;max-width:106px}
 .hero-chips-row .hero-sponsor-logos .sponsor-logo{width:100%;height:auto;min-width:0}
 .hero-chips-row .hero-sponsor-logos .sponsor-axe{aspect-ratio:88/34;background-size:321.97% 100%;background-position:left center}
 .hero-chips-row .hero-sponsor-logos .sponsor-lifebuoy{aspect-ratio:70/34;background-size:404.76% 100%;background-position:right center}
 .hero-chips-row .hero-sponsor-logos .sponsor-lux{aspect-ratio:74/34;background-size:382.88% 100%;background-position:51.59% center}
}
.hero-chip{display:flex;align-items:flex-start;gap:7px;padding:8px 8px;background:rgba(255,255,255,.04);border:1px solid rgba(200,184,216,.15);border-radius:12px}
.hero-chip svg{flex:none;width:14px;height:14px;stroke:var(--gold);margin-top:2px}
.hero-chip div{display:flex;flex-direction:column;gap:2px;min-width:0}
.hero-chip strong{font-family:var(--fd);font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--text);line-height:1.2;white-space:nowrap}
.hero-chip span{font-size:10.5px;color:var(--muted);line-height:1.35}
.hero-chip .nowrap{white-space:nowrap;font-size:9.5px}
.hero-chips-row .hero-event-time>div{display:flex;flex-direction:column;align-items:flex-start;gap:3px}
.hero-chips-row .hero-event-time .event-checkin,.hero-chips-row .hero-event-time .event-time{white-space:nowrap;overflow-wrap:normal}
@media(min-width:961px){
  .hero-chips-row{grid-template-columns:minmax(0,1fr) max-content minmax(0,.9fr)}
  .hero-event-time>div{display:grid;grid-template-columns:max-content max-content;align-items:baseline;gap:3px 6px}
  .hero-event-time strong{grid-column:1 / -1}
  .hero-event-time .event-time,.hero-event-time .event-checkin{font-size:10px;white-space:nowrap;overflow-wrap:normal}
  .hero-chips-row>.hero-chip:last-child strong{font-size:10px;letter-spacing:0}
  .hero-chips-row>.hero-chip:last-child>span,.hero-chips-row>.hero-chip:last-child div>span{font-size:10px}
}

/* countdown: vé xé đôi, chữ phụ, số là chính */
.hero-cd-block{
  background:linear-gradient(135deg,rgba(28,4,50,.97),rgba(12,2,26,.98));
  border:1px solid rgba(255,196,79,.3);border-radius:6px;
  padding:12px 14px;position:relative;overflow:hidden;margin-bottom:16px;
}
.hero-cd-block::before,.hero-cd-block::after{
  position:absolute;top:50%;width:18px;height:18px;border-radius:50%;
  background:var(--bg);border:1px solid rgba(255,194,71,.28);transform:translateY(-50%);
}
.hero-cd-block::before{left:-10px}.hero-cd-block::after{right:-10px}
.hero-cd-title{
  display:flex;align-items:center;gap:8px;font-family:var(--fd);font-size:10px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--gold);opacity:.85;margin:0 0 8px;
  white-space:nowrap;
}
.hero-cd-title::before,.hero-cd-title::after{flex:1;height:1px;background:linear-gradient(90deg,transparent,rgba(255,194,71,.4),transparent)}
.hero-cd-row{display:flex;align-items:center;gap:6px}
.hero-cd-cell{flex:1;text-align:center;background:rgba(0,0,0,.55);border:1px solid rgba(255,196,79,.2);border-bottom:2px solid rgba(255,196,79,.5);border-radius:6px;padding:6px 2px 5px}
.hero-cd-cell b{display:block;font-family:var(--fd);font-size:clamp(26px,3.2vw,40px);line-height:1;color:var(--bulb);text-shadow:0 0 18px rgba(255,194,71,.7);letter-spacing:.01em}
.hero-cd-cell span{font-size:8.5px;letter-spacing:.14em;color:var(--muted);text-transform:uppercase;white-space:nowrap}
.hero-cd-colon{font-family:var(--fd);font-size:24px;color:var(--gold);opacity:.6;line-height:1;margin-bottom:12px;flex:none}

/* CTA */
.hero-cta-row{display:flex;gap:12px}
.hero-cta-main{
  flex:1;text-align:center;font-size:16px;padding:12px 18px;
  background:transparent;
  border:0;
  border-radius:999px;
  position:relative;
  isolation:isolate;
  white-space:nowrap;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  box-shadow:0 6px 20px rgba(0,0,0,.4),0 0 25px rgba(229,37,58,.45);
  transition:transform .2s ease,box-shadow .2s ease;
  z-index:1;
}
/* Viền ánh sáng chạy xung quanh button (conic-gradient rotating beam) */
.hero-cta-main::before{
  content:"";
  position:absolute;
  inset:-150%;
  background:conic-gradient(from 0deg,
    transparent 0deg,
    transparent 280deg,
    rgba(245,183,56,.7) 320deg,
    #ffffff 345deg,
    #E5253A 360deg
  );
  animation:beamRotate 3.2s linear infinite;
  z-index:-2;
}
/* Lớp thân button bên trong nằm đè lên để tạo đường viền phát sáng chạy quanh */
.hero-cta-main::after{
  content:"";
  position:absolute;
  inset:2px;
  background:#E5253A;
  border-radius:999px;
  z-index:-1;
  transition:background .2s ease;
}
@keyframes beamRotate{
  0%  {transform:rotate(0deg)}
  100%{transform:rotate(360deg)}
}
.hero-cta-main:hover{
  transform:translateY(-2px) scale(1.02);
  box-shadow:0 12px 32px rgba(0,0,0,.5),0 0 35px rgba(229,37,58,.8),0 0 20px rgba(245,183,56,.6);
}
.hero-cta-main:hover::after{
  background:#ed3045;
}
.hero-cta-sec{
  flex:1;text-align:center;font-size:15px;padding:12px 18px;
  color:var(--bulb);font-family:var(--fd);font-weight:700;letter-spacing:.04em;
  background:linear-gradient(135deg,rgba(245,183,56,.16) 0%,rgba(232,40,158,.1) 100%);
  border:1.5px solid rgba(245,183,56,.65);border-radius:999px;cursor:pointer;
  box-shadow:0 4px 18px rgba(0,0,0,.3);transition:.2s ease;white-space:nowrap;
}
.hero-cta-sec:hover{
  background:rgba(245,183,56,.25);border-color:var(--gold);color:#fff;
  box-shadow:0 6px 22px rgba(245,183,56,.4);transform:translateY(-1px);
}

/* responsive */
@media(max-width:960px){
  .hero-split{grid-template-columns:1fr;min-height:unset;gap:20px;padding:20px 0 16px;text-align:center}
  .hero-img-col{justify-content:center}.hero-sign-wrap{max-width:380px}.hero-sign-wrap::before{background-image:url("/source/assets/neon_mb.jpg")}
  .hero-info-col{align-items:center}.hero-title{align-items:center}
  .hero-kicker-pill{margin:0 auto 12px}
  .hero-tagline{text-align:center}
  .hero-tagline b{display:block;margin:6px 0 4px}
  .hero-tagline br,.hero-tagline .tdash{display:none}
  .hero-chips-row{grid-template-columns:1fr}.hero-chip{text-align:left}
  .hero-cta-row{justify-content:center;width:100%}
  .hero-img-col::before,.hero-img-col::after{display:none}
}
@media(max-width:480px){
  .hero-sign-wrap{max-width:300px}
  .hero-title-the,.hero-title-carnival{font-size:52px}
  .hero-cd-cell b{font-size:30px}.hero-cd-colon{font-size:24px}
  .hero-chips-row{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){
  .hero-kicker-pill{font-size:12px;letter-spacing:.1em;padding-left:10px}
  .hero-kicker-pill svg{width:12px;height:12px}
}
/* ── Accordion danh mục sản phẩm ── */
.prod-catalog-toggle {
  display: inline-flex;
  align-items: center;
  gap: 10.08px;
  margin-left: 10px;
  padding: 7.2px 20.16px;
  background: rgba(79,227,245,.1);
  border: 1px solid rgba(79,227,245,.4);
  border-radius: var(--r-btn);
  color: #9df1fb;
  font-size: 18.72px;
  font-weight: 700;
  cursor: pointer;
  vertical-align: middle;
  transition: background .15s, border-color .15s;
}
.prod-catalog-toggle:hover { background: rgba(79,227,245,.18); border-color: #4FE3F5; }
.prod-catalog-toggle .ic { width: 20.16px; height: 20.16px; flex: none; }
.prod-catalog-chevron {
  font-size: 14.4px;
  transition: transform .25s ease;
  display: inline-block;
}
.prod-catalog-toggle[aria-expanded="true"] .prod-catalog-chevron { transform: rotate(180deg); }

.prod-catalog-drawer {
  margin-top: 20px;
  text-align: left;
}
.prod-catalog-inner {
  background: rgba(0,0,0,.28);
  border: 1px solid var(--line-soft);
  border-radius: var(--r-card);
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.prod-cat-group { display: flex; gap: 14px; align-items: flex-start; }
.prod-cat-brand {
  flex: none;
  font-family: var(--fd);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .1em;
  padding: 5px 12px;
  border-radius: var(--r-btn);
  min-width: 80px;
  text-align: center;
  margin-top: 2px;
}
.prod-cat-list { flex: 1; display: flex; flex-direction: column; gap: 6px; }
/* Product catalog grouped by brand and product type on desktop and mobile. */
.prod-catalog-inner:has(.product-catalog-showcase){background:none;border:1px solid rgba(224,175,255,.22);padding:28px 30px;border-radius:18px}
@media(min-width:641px){
 .prod-catalog-inner:has(.product-catalog-showcase){background:none;}
}
.product-catalog-showcase{display:grid;gap:28px;font-family:var(--fb,Arial,sans-serif)}
.product-catalog-showcase :is(h3,h4){font-family:inherit}
.catalog-brand-section{min-width:0}
.catalog-brand-section+.catalog-brand-section{border-top:1px solid rgba(226,183,255,.16);padding-top:25px}
.catalog-brand-section>.prod-cat-brand{display:table;margin:0 0 18px;min-width:0;font-size:20px;line-height:1.2;letter-spacing:0;padding:6px 18px;border:1px solid rgba(241,203,255,.22);border-radius:999px;background:rgba(188,139,214,.18);box-shadow:none}
.catalog-brand-axe>.prod-cat-brand{color:#90e9fa}
.catalog-brand-lfb>.prod-cat-brand{color:#abefc7}
.catalog-brand-lux>.prod-cat-brand{color:#f5c1e9}
.catalog-category+.catalog-category{margin-top:24px}
.catalog-category-title{display:flex;align-items:center;gap:12px;margin:0 0 18px;color:#f0deff;font-size:15px;line-height:1.5;font-weight:800}
.catalog-category-title::after{content:"";flex:1;height:1px;background:rgba(224,175,255,.15)}
.catalog-product-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px 18px}
.catalog-brand-lux .catalog-product-grid,.catalog-product-grid:has(>article:nth-child(3):last-child){grid-template-columns:repeat(3,minmax(0,1fr))}
.catalog-product-card{display:flex;flex-direction:column;align-items:center;gap:10px;min-width:0;padding:0;text-align:center;border:0;border-radius:0;background:none;box-shadow:none}
.catalog-product-visual{display:flex;align-items:flex-end;justify-content:center;flex:none;width:100%;max-width:155px;gap:6px}
.catalog-product-visual figure{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;min-width:0;margin:0;flex:1;padding:0 4px 12px;isolation:isolate}
.catalog-product-visual figure::before{content:none}
.catalog-product-visual img{position:relative;display:block;width:100%;height:155px;object-fit:contain;filter:drop-shadow(0 4px 6px rgba(0,0,0,.25))}
.catalog-product-edition{display:block;margin-top:3px;font-size:.8em;line-height:1.5;font-weight:600;color:#f2dcff}
.catalog-product-copy{min-width:0;width:100%;max-width:210px}
.catalog-product-copy h4{margin:0;color:#fff5ff;font-size:13px;line-height:1.5;font-weight:700;overflow-wrap:break-word}
.catalog-brand-lux .catalog-product-visual{max-width:190px;gap:8px}
.catalog-brand-lux .catalog-product-visual img{height:170px}
.catalog-brand-lux figure:nth-child(2) img{height:135px}
.catalog-product-sizes{display:flex;justify-content:center;gap:8px;margin-top:-4px}
.catalog-product-sizes span{font-size:10px;line-height:1.4;color:#f8dcff;background:rgba(191,93,207,.32);border:1px solid rgba(242,193,255,.25);border-radius:20px;padding:1px 7px;white-space:nowrap}
.catalog-brand-lux .catalog-product-card{padding-bottom:4px}
.catalog-brand-lux .catalog-product-copy{min-height:40px}
@media(max-width:640px){
 .prod-catalog-inner:has(.product-catalog-showcase){background:none;padding:20px 12px 30px;border-radius:14px}
 .product-catalog-showcase{gap:22px}
 .catalog-brand-section+.catalog-brand-section{padding-top:20px}
 .catalog-brand-section>.prod-cat-brand{font-size:15px;padding:4px 11px;margin-bottom:14px}
 .catalog-category+.catalog-category{margin-top:20px}
 .catalog-category-title{font-size:12px;gap:8px;margin-bottom:13px}
 .catalog-product-grid{gap:18px 6px}
 .catalog-product-card{gap:7px}
 .catalog-product-visual{max-width:95px}
 .catalog-product-visual figure{padding:0 2px 8px}
 .catalog-product-visual img{height:89px}
  .catalog-product-copy h4{font-size:9px;line-height:1.45}
 .catalog-brand-lux .catalog-product-grid{gap:10px}
 .catalog-brand-lux .catalog-product-visual{max-width:115px;gap:2px}
 .catalog-brand-lux .catalog-product-visual img{height:98px}
 .catalog-brand-lux figure:nth-child(2) img{height:78px}
 .catalog-brand-lux .catalog-product-copy h4{font-size:10px}
 .catalog-product-sizes{gap:6px}
 .catalog-product-sizes span{font-size:8px;padding:1px 5px}
 .catalog-brand-lux .catalog-product-copy{min-height:44px}
}
@media(max-width:359px){
 .catalog-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .catalog-product-copy h4{font-size:11px}
 .catalog-brand-lux .catalog-product-grid{gap:6px}
 .catalog-brand-lux .catalog-product-copy h4{font-size:9px}
}
.prod-cat-products-image{display:block;width:min(100%,320px);height:auto;object-fit:contain;align-self:center;margin:0 auto 14px}
@media(max-width:640px){
  .prod-cat-products-image{width:min(100%,240px);margin-bottom:10px}
}
.prod-cat-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 7px 12px;
  background: rgba(255,255,255,.04);
  border: 1px solid var(--line-soft);
  border-radius: 10px;
}
.prod-cat-name { font-size: 14px; color: var(--text); }
.prod-cat-pt {
  flex: none;
  font-family: var(--fd);
  font-size: 13px;
  font-weight: 700;
  color: var(--gold);
  letter-spacing: .05em;
  white-space: nowrap;
}
.prod-cat-note {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  padding: 12px 14px;
  background: rgba(255,194,71,.07);
  border: 1px solid rgba(255,194,71,.22);
  border-radius: 12px;
  font-size: 13px;
  color: var(--muted);
  line-height: 1.5;
}
.prod-cat-note .ic { flex: none; width: 16px; height: 16px; margin-top: 1px; }
.prod-cat-note b { color: var(--text); }
.box-office{margin:26px 0 0;border-radius:var(--r-card);border:1px solid var(--line);background:linear-gradient(180deg,rgba(59,7,92,.85),rgba(23,5,45,.9));padding:28px;box-shadow:0 18px 50px rgba(0,0,0,.4)}
.box-office h2{font-family:var(--fd);font-size:30px;text-transform:uppercase;letter-spacing:.05em;margin:0}
.box-office h2 em{font-style:normal;color:var(--magenta)}
.box-office .sub{margin:4px 0 18px}
.bo-grid{display:grid;grid-template-columns:1fr 1fr auto;gap:12px;align-items:end}
.field label{display:block;font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:7px}
.field input,.field select{width:100%;background:rgba(0,0,0,.4);border:1px solid var(--line-soft);border-radius:12px;color:var(--text);font-family:var(--fb);font-size:15px;padding:13px 14px;outline:none}
.field input:focus,.field select:focus{border-color:var(--magenta);box-shadow:0 0 0 3px rgba(255,43,194,.25)}
.bo-go{font-family:var(--fd);font-size:18px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#fff;background:var(--carnival-red);border:0;border-radius:12px;padding:14px 30px;cursor:pointer;box-shadow:0 6px 20px rgba(229,37,58,.4);white-space:nowrap;transition:background .18s ease,box-shadow .18s ease,transform .18s ease}
.bo-go:hover{background:#ed3045;box-shadow:0 8px 24px rgba(229,37,58,.55);transform:translateY(-1px)}
.bo-foot{margin-top:12px;color:var(--muted);font-size:13px}

/* ── Ticket preview (dùng chung class vé với kết quả tra cứu) ── */
.ticket-block{margin:30px 0 0}
.ticket-block-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.ticket-block-head h2{font-family:var(--fd);font-size:30px;text-transform:uppercase;margin:0}
.check-seal{width:38px;height:38px;flex:none;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:18px;font-weight:900;border:2px solid}
.seal-ok{background:linear-gradient(135deg,var(--magenta),var(--violet));border-color:#ffb9ea;color:#fff;box-shadow:var(--shadow-neon)}
.seal-bad{background:linear-gradient(135deg,#ff5b7f,#b31e45);border-color:#ff8ba3;color:#fff;box-shadow:0 0 14px rgba(255,91,127,.6)}
.seal-idle{background:rgba(255,194,71,.12);border-color:var(--gold);color:var(--bulb)}
.concert-ticket-wrap{position:relative}
.concert-ticket-pass{display:grid;grid-template-columns:200px 1fr 210px;background:linear-gradient(120deg,rgba(59,7,92,.95),rgba(35,4,63,.95));border:1px solid var(--line);border-radius:22px;overflow:hidden;box-shadow:0 24px 60px rgba(0,0,0,.5)}
.ticket-stub{padding:22px;position:relative}
.stub-art{padding:0}
.stub-art-cover{position:relative;height:100%;min-height:230px}
.stub-cover-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.stub-art-overlay{position:absolute;inset:0;background:linear-gradient(90deg,transparent 55%,rgba(35,4,63,.9))}
.ticket-brand-title{font-family:var(--fd);font-size:15px;letter-spacing:.3em;color:var(--gold);text-transform:uppercase}
.ticket-top-brand{font-family:var(--fd);font-size:15px;letter-spacing:.3em;color:var(--gold);text-transform:uppercase;display:flex;justify-content:space-between;align-items:center;gap:10px}
.brand-co{font-size:11px;letter-spacing:.14em;color:var(--muted)}
.ticket-guest-name{font-family:var(--fd);font-size:34px;font-weight:700;text-transform:uppercase;margin:2px 0 12px}
.ticket-guest-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.guest-lbl{font-size:11px;letter-spacing:.2em;color:var(--muted);text-transform:uppercase}
.ticket-meta-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:6px}
.meta-cell{background:rgba(0,0,0,.3);border:1px dashed rgba(255,194,71,.4);border-radius:12px;padding:10px 12px}
.meta-label{font-size:10px;letter-spacing:.2em;color:var(--muted);text-transform:uppercase}
.meta-value{font-weight:700;font-size:15px;margin-top:2px}
.mono-val,.mono-code{font-variant-numeric:tabular-nums;letter-spacing:.04em}
.stub-qr{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:rgba(0,0,0,.35);border-left:2px dashed rgba(255,194,71,.45)}
.qr-canvas-box{background:#fff;border-radius:14px;padding:10px;text-align:center;position:relative;overflow:hidden}
.ticket-qr-svg{display:block;width:120px;height:120px}
.qr-code-label{display:block;color:#333;font-size:11px;font-weight:700;margin-top:4px;word-break:break-all;max-width:120px}
.qr-laser-scanner{position:absolute;left:0;right:0;height:3px;background:var(--magenta);box-shadow:0 0 12px var(--magenta);animation:scan 2.6s ease-in-out infinite}
@keyframes scan{0%,100%{top:6%}50%{top:90%}}
.qr-sub-text{color:#555;font-size:11px}
.ticket-security-note{margin-top:12px;color:var(--muted);font-size:13px;display:flex;gap:8px;align-items:flex-start}
.ticket-div-line{display:none}
.ticket-action-btns{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.btn-download-ticket,.btn-wallet-add{border-radius:var(--r-btn);font-weight:700;font-size:13px;padding:9px 16px;cursor:pointer;border:1px solid var(--line);transition:background .18s ease,box-shadow .18s ease}
.btn-download-ticket{background:var(--carnival-red);color:#fff;border:0;box-shadow:0 4px 14px rgba(229,37,58,.35)}
.btn-download-ticket:hover{background:#ed3045;box-shadow:0 6px 18px rgba(229,37,58,.5)}
.btn-wallet-add{background:transparent;color:var(--text)}
.ticket-pending-btn-wrap .pending-sub-tag,.ticket-void-btn-wrap .void-warning-tag{display:inline-block;font-family:var(--fd);letter-spacing:.2em;font-size:14px;padding:8px 18px;border-radius:var(--r-btn)}
.pending-sub-tag{border:1px solid var(--gold);color:var(--gold)}
.void-warning-tag{background:#3d0a1e;border:1px solid #ff5b7f;color:#ff8ba3}
.stamp-voided-mark{font-family:var(--fd);color:#ff5b7f;border:3px double #ff5b7f;border-radius:10px;padding:6px 14px;transform:rotate(-8deg);text-transform:uppercase;letter-spacing:.15em}
.stamp-text{font-weight:800}.stamp-sub{color:var(--muted);font-size:13px}
/* Badge hạng vé (hero + kết quả) */
.badge-tier-fanzone,.badge-tier-vip1,.badge-tier-vip2,.badge-tier-ga,.tier{display:inline-block;font-family:var(--fd);font-weight:700;letter-spacing:.12em;text-transform:uppercase;font-size:14px;padding:5px 14px;border-radius:var(--r-btn)}
.badge-tier-fanzone,.t-fanzone{background:rgba(255,43,194,.18);border:1px solid var(--magenta);color:#ff9ade}
.badge-tier-vip1,.t-vip1{background:rgba(79,227,245,.14);border:1px solid #4FE3F5;color:#9df1fb}
.badge-tier-vip2,.t-vip2{background:rgba(139,53,255,.2);border:1px solid var(--violet);color:#cfa8ff}
.badge-tier-ga,.t-ga{background:rgba(255,194,71,.14);border:1px solid var(--gold);color:var(--bulb)}
.status-pill-badge{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;border-radius:var(--r-btn);padding:7px 16px;background:rgba(255,43,194,.14);border:1px solid var(--magenta);color:#ff9ade;box-shadow:0 0 10px rgba(255,43,194,.3)}
.status-pill-badge.badge-pending{background:rgba(255,194,71,.12);border-color:var(--gold);color:var(--bulb)}
.status-pill-badge.badge-processing{background:rgba(79,227,245,.12);border-color:#4FE3F5;color:#9df1fb}
.status-pill-badge.badge-void{background:rgba(255,91,127,.12);border-color:#ff5b7f;color:#ff8ba3}
.live-status-dot,.pending-dot,.process-dot,.void-dot{width:9px;height:9px;border-radius:50%;background:currentColor;box-shadow:0 0 8px currentColor;animation:chase 1.4s infinite}

/* ── Section titles ── */
.sec-head{text-align:center;margin:64px 0 24px}
.sec-head .kicker{margin-bottom:12px}
.sec-head h2{font-family:var(--fd);font-size:clamp(30px,4.6vw,50px);text-transform:uppercase;margin:0}
.sec-head h2.product-section-title{font-size:clamp(25.5px,3.91vw,42.5px)}
.product-brand-names{white-space:nowrap}
.product-purchase-guide{max-width:960px;margin:12px auto 0;color:var(--muted);line-height:1.7}
.sec-head .product-purchase-guide p{max-width:none;margin:8px 0;text-align:left}
.product-purchase-guide ol{padding-left:24px;margin:8px 0;text-align:left;list-style:decimal}
.product-purchase-guide li{margin:5px 0}
.product-purchase-guide .purchase-guide-link{color:var(--gold);font-weight:700;text-decoration:underline;text-underline-offset:3px}
.product-purchase-guide .purchase-guide-link:hover{color:#fff}
.product-purchase-guide button.purchase-guide-link{font:inherit;font-weight:700;background:none;border:0;padding:0;cursor:pointer;display:inline;text-align:inherit}
.purchase-guide-keep{white-space:nowrap}
@media(max-width:640px){
 #s-landing .product-purchase-guide{box-sizing:border-box;padding:16px 14px;margin-top:18px;border:1px solid rgba(200,184,216,.22);border-radius:14px;background:rgba(24,8,40,.8);font-size:12px;line-height:1.65;text-wrap:pretty}
 #s-landing .product-purchase-guide p{font-size:12px;line-height:1.65;margin:0;text-align:left;overflow-wrap:normal;word-break:normal}
 #s-landing .product-purchase-guide ol{list-style:none;counter-reset:purchase-mobile;display:grid;gap:10px;padding:0;margin:14px 0}
 #s-landing .product-purchase-guide ol>li{counter-increment:purchase-mobile;display:flex;align-items:flex-start;gap:8px;padding:10px;margin:0;border-radius:9px;background:rgba(255,255,255,.04);font-size:12px;line-height:1.65}
 #s-landing .product-purchase-guide ol>li::before{content:counter(purchase-mobile);flex:0 0 20px;height:20px;display:grid;place-items:center;border-radius:50%;background:#f5b7381f;color:var(--gold);font-size:11px;font-weight:700}
 #s-landing .product-purchase-guide ol>li>span{min-width:0}
 #s-landing .product-purchase-guide p:last-of-type{padding-top:12px;border-top:1px solid rgba(200,184,216,.16)}
 #s-landing .product-purchase-guide .product-brand-names{display:inline;white-space:nowrap}
}
@media(min-width:641px){
 .sec-head h2.product-section-title{max-width:1000px;margin:0 auto;font-size:clamp(27px,2.8vw,36px);line-height:1.45}
 .product-purchase-guide{box-sizing:border-box;max-width:960px;margin:24px auto 0;padding:24px 28px;border:1px solid rgba(200,184,216,.25);border-radius:18px;background:rgba(24,8,40,.8);box-shadow:0 12px 32px #10051f33;font-size:15px;line-height:1.7}
 .sec-head .product-purchase-guide p{font-size:15px;margin:0;line-height:1.7}
 .sec-head .product-purchase-guide p:first-child{color:#fff;font-weight:600}
 .product-purchase-guide ol{list-style:none;counter-reset:purchase-method;padding:0;margin:18px 0;display:grid;gap:10px}
 .product-purchase-guide ol>li{counter-increment:purchase-method;display:flex;align-items:flex-start;gap:12px;padding:12px 14px;margin:0;border:1px solid rgba(200,184,216,.12);border-radius:10px;background:rgba(255,255,255,.035);font-size:14px;text-align:left}
 .product-purchase-guide ol>li::before{content:counter(purchase-method);display:grid;place-items:center;flex:0 0 26px;height:26px;border-radius:50%;background:#f5b7381f;color:var(--gold);font-size:12px;font-weight:700}
 .sec-head .product-purchase-guide p:last-of-type{padding-top:16px;border-top:1px solid rgba(200,184,216,.16);font-size:13px;color:#d7c6e0}
 .product-purchase-guide .prod-catalog-toggle{margin-top:25px}
}
@media(max-width:640px){.product-brand-names{display:block}}
.sec-head h2 em{font-style:normal;color:var(--magenta)}
.sec-head p{color:var(--muted);max-width:64ch;margin:8px auto 0}
.sec-head .ticket-section-description{max-width:none}
.tier-benefits-sorted{width:100%;table-layout:fixed;min-width:760px;border-collapse:collapse;background:linear-gradient(125deg,#32153644,#17134344)}
.tier-benefits-sorted th,.tier-benefits-sorted td{width:20%;vertical-align:middle;padding:12px 16px;border-right:1px solid #ffffff14;border-bottom:1px solid #ffffff14;text-align:center;font-size:13px}
.tier-benefits-sorted th:first-child{width:22%;text-align:left}
.tier-benefits-sorted tbody th{font-weight:500;color:var(--text);text-transform:none;letter-spacing:0}
.tier-benefits-sorted thead{background:#321b3a88}
.tier-benefits-sorted thead th{padding-top:16px;padding-bottom:16px}
.tier-benefits-sorted .check{font-size:22px;color:#ff57c2;line-height:1}
.tier-benefits-sorted .benefit-group-start>*{border-top:2px solid #d9b0ed55}
.tier-benefits-sorted tbody tr:hover{background:#ffffff06}
@media(max-width:640px){
 #perks-table-drawer{min-width:0;max-width:100%}
 #perks-table-drawer>.scroll{display:block;width:100%;max-width:100%;box-sizing:border-box;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
 #perks-table-drawer .tier-benefits-sorted{width:860px;min-width:860px;max-width:none}
}
.ticket-section-description>span{display:block}
/* PC: ép 1 dòng cho câu tagline hạng vé */
@media(min-width:1024px){.nowrap-1line{white-space:nowrap;max-width:none}}
/* ── Track: timeline hành trình vé thật ── */
.tj{margin-top:18px}
.tj-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:6px}
.tj-order{font-family:var(--fd);font-weight:800;font-size:24px;letter-spacing:.06em}
.tj-tier{color:var(--muted);font-size:13px;margin-top:2px}
.tj-verified{color:#4ADE80;font-weight:700}
.tj-status{flex:none;font-family:var(--fd);font-weight:700;font-size:14px;letter-spacing:.08em;text-transform:uppercase;color:#2A0A12;background:linear-gradient(135deg,var(--gold),#FF9D5C);border-radius:999px;padding:8px 18px;box-shadow:0 4px 14px rgba(255,194,71,.35)}
.tj-steps{list-style:none;margin:14px 0 0;padding:0}
.tj-steps li{position:relative;display:flex;gap:12px;padding:0 0 18px 2px}
.tj-steps li:last-child{padding-bottom:2px}
.tj-steps li::before{content:"";position:absolute;left:13px;top:28px;bottom:0;width:2px;background:rgba(200,184,216,.22)}
.tj-steps li:last-child::before{display:none}
.tj-steps li.done::before{background:rgba(74,222,128,.5)}
.tj-dot{flex:none;width:26px;height:26px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:13px;font-weight:900;border:1.5px solid rgba(200,184,216,.35);color:var(--muted);background:rgba(0,0,0,.35);z-index:1}
.tj-steps li.done .tj-dot{background:rgba(74,222,128,.16);border-color:#4ADE80;color:#4ADE80}
.tj-steps li.current .tj-dot{background:rgba(255,194,71,.16);border-color:var(--gold);color:var(--gold);box-shadow:0 0 12px rgba(255,194,71,.55);animation:tjPulse 1.8s ease-in-out infinite}
@keyframes tjPulse{0%,100%{box-shadow:0 0 6px rgba(255,194,71,.35)}50%{box-shadow:0 0 16px rgba(255,194,71,.8)}}
.tj-steps li.todo{opacity:.55}
.tj-steps b{display:block;font-size:15px}
.tj-steps li.done b{color:var(--text)}
.tj-steps li.current b{color:var(--bulb)}
.tj-steps small{color:var(--muted);font-size:13px}
html.rm .tj-steps li.current .tj-dot{animation:none}
/* PC: thu nhỏ chữ + ép 1 dòng cho dòng thể lệ dài */
@media(min-width:1024px){.shrink-1line{font-size:13px;white-space:nowrap}}

/* ── Stock summary ── */
.stock-band{display:none!important;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between;background:rgba(0,0,0,.32);border:1px solid var(--line-soft);border-radius:16px;padding:14px 18px;margin-bottom:18px}
.stock-band b{color:var(--bulb)}
/* Ẩn cứng các khu vực theo yêu cầu: Phòng vé online / Thông tin vé / Cần giúp đỡ */
#ticket-ready-box[hidden]{display:none !important}
.box-office,.support-banner{display:none !important}
/* #track: ẩn tiến độ duyệt đơn, đặc quyền hạng vé, ô hỗ trợ/hotline trong kết quả */
.track-stepper-card,.track-perks-card{display:none !important}
.track-result-wrapper .alert-action-row,
.track-result-wrapper .btn-hotline-call{display:none !important}
.pulse-dot{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--magenta);box-shadow:0 0 10px var(--magenta);margin-right:8px;animation:chase 1.6s infinite}
.gauge{flex:1 1 220px;height:12px;border-radius:99px;background:rgba(255,255,255,.1);overflow:hidden;min-width:160px}
.gauge i{display:block;height:100%;background:var(--magenta);border-radius:99px;transition:width .6s ease}
.gauge-note{font-size:13px;color:var(--muted)}

/* ── Tier cards ── */
.tier-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.tier-card{position:relative;background:var(--card);border:1px solid var(--line-soft);border-radius:var(--r-card);overflow:hidden;display:flex;flex-direction:column;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
.tier-card:hover{transform:translateY(-6px);border-color:var(--magenta);box-shadow:var(--shadow-neon)}
.tier-rank{position:absolute;top:6px;right:12px;font-family:var(--fd);font-size:54px;font-weight:800;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.25);line-height:1}
.tier-photo{height:150px;overflow:hidden}
.tier-photo img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.tier-card:hover .tier-photo img{transform:scale(1.06)}
.tier-body{padding:16px 14px;display:flex;flex-direction:column;gap:8px;flex:1}
.tier-name{font-family:var(--fd);font-size:20px;letter-spacing:.02em;text-transform:uppercase;margin:0;display:flex;align-items:center;gap:6px;white-space:nowrap}
.tier-points{font-family:var(--fd);font-size:18px;font-weight:800;color:var(--gold)}
.tier-points-sub{font-size:12px;color:var(--muted);margin-top:-4px}
.tier-stock{font-size:12.5px;color:var(--muted)} .tier-stock b{color:var(--text)}
.tier-perks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:5px;font-size:11.5px;line-height:1.3}
.tier-perks li{display:flex;gap:6px;align-items:center;min-height:18px;padding:0;white-space:normal;overflow:visible}
.tick{flex:none;width:16px;height:16px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-family:"Segoe UI Symbol","Apple Symbols","Noto Sans Symbols 2",system-ui,sans-serif;font-size:10px;line-height:1;font-weight:700;background:rgba(255,43,194,.16);border:1px solid var(--magenta);color:#ff9ade;margin-top:0;overflow:visible;text-indent:0}
.tier-btn{
  margin-top:auto;font-family:var(--fd);font-weight:700;letter-spacing:.04em;text-transform:uppercase;
  font-size:13.5px;border-radius:12px;padding:11px 10px;cursor:pointer;
  background:var(--carnival-red);
  border:1.5px solid rgba(255,255,255,.35);
  color:#fff;
  box-shadow:0 4px 14px rgba(229,37,58,.35);
  white-space:nowrap;text-align:center;
  transition:all .2s ease;
}
.tier-btn:hover{
  background:#ed3045;
  border-color:#FFD54F;
  color:#fff;
  transform:translateY(-2px);
  box-shadow:0 6px 20px rgba(229,37,58,.55),0 0 16px rgba(245,183,56,.4);
}
/* Bảng so sánh */
.perks-toggle-row{text-align:center;margin:22px 0 0}
.toggle-perks-table-btn,.btn{font-family:var(--fb);font-weight:700;font-size:15px;color:var(--text);background:rgba(255,255,255,.07);border:1px solid var(--line-soft);border-radius:var(--r-btn);padding:12px 26px;cursor:pointer;display:inline-flex;align-items:center;gap:10px;transition:background .18s ease,transform .18s ease,box-shadow .18s ease}
.toggle-perks-table-btn:hover{border-color:var(--carnival-red)}
.toggle-perks-table-btn{font-size:19.8px;padding:17.28px 37.44px;gap:13.2px}
.toggle-perks-table-btn .ic{width:21.6px;height:21.6px}
.btn{background:var(--carnival-red);border:0;color:#fff;box-shadow:0 6px 20px rgba(229,37,58,.4)}
.btn:hover{background:#ed3045;color:#fff;box-shadow:0 8px 24px rgba(229,37,58,.55);transform:translateY(-1px)}
.btn.ghost{background:rgba(255,255,255,.07);border:1px solid var(--line-soft);box-shadow:none;color:var(--text)}
.btn.ghost:hover{border-color:var(--carnival-red);background:rgba(229,37,58,.15);color:#fff;transform:translateY(-1px)}
.btn.sm{font-size:13px;padding:8px 16px;font-weight:600}
.t-chevron{color:var(--gold)}
@media(max-width:640px){
  .toggle-perks-table-btn{font-size:clamp(11.88px,3.5vw,15.84px);padding:14.4px 11.52px;gap:6px;max-width:100%;box-sizing:border-box;white-space:nowrap;letter-spacing:0}
  .toggle-perks-table-btn>span:first-child{display:inline-flex;align-items:center;gap:6px;min-width:0}
  .toggle-perks-table-btn .ic{width:14.4px;height:14.4px;flex:none}
  .toggle-perks-table-btn .t-chevron{font-size:10.8px;flex:none}
}
.scroll{overflow-x:auto;margin-top:16px;border:1px solid var(--line-soft);border-radius:16px;background:rgba(0,0,0,.3)}
table{width:100%;border-collapse:collapse;font-size:14px;min-width:560px}
th,td{padding:11px 14px;text-align:left;border-bottom:1px solid rgba(200,184,216,.12)}
th{font-family:var(--fd);letter-spacing:.1em;text-transform:uppercase;font-size:14px;color:var(--gold);background:rgba(255,194,71,.06);white-space:nowrap}
td.num,.num{font-variant-numeric:tabular-nums}
.check{color:#ff7ad9;font-weight:900}
.time-main{font-family:var(--fd);font-size:17px;color:var(--bulb)} .time-unit{color:var(--muted);font-size:12px}

/* ── Products ledger ── */
.ledger{border:1px solid var(--line-soft);border-radius:var(--r-card);overflow:hidden;background:rgba(0,0,0,.28)}
.ledger-head{display:grid;grid-template-columns:1fr 1.4fr;gap:18px;padding:26px;align-items:center;background:linear-gradient(140deg,rgba(59,7,92,.7),transparent)}
.ledger-head img{border-radius:14px;width:100%}
.ledger-head h3{font-family:var(--fd);font-size:28px;text-transform:uppercase;margin:0 0 6px}
.ledger-head p{color:var(--muted);font-size:14px;margin:0}
.prod-row{display:grid;grid-template-columns:110px 1fr;gap:14px;padding:16px 26px;border-top:1px solid rgba(200,184,216,.12);align-items:start}
.prod-badge{font-family:var(--fd);font-weight:800;letter-spacing:.1em;text-align:center;font-size:15px;border-radius:10px;padding:8px 4px}
.axe-badge{background:rgba(79,227,245,.14);border:1px solid #4FE3F5;color:#9df1fb}
.lux-badge{background:rgba(255,43,194,.14);border:1px solid var(--magenta);color:#ff9ade}
.lfb-badge{background:rgba(43,217,124,.12);border:1px solid #2BD97C;color:#8ff0bd}
.prod-row strong{display:block;font-size:15px}
.prod-point-pill{display:inline-block;font-size:12px;font-weight:700;color:var(--bulb);border:1px dashed rgba(255,194,71,.6);border-radius:99px;padding:2px 12px;margin-top:5px}
.prod-sub{color:var(--muted);font-size:13px;margin:6px 0 0}
.channel-bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:16px 26px;border-top:1px solid rgba(200,184,216,.12);font-size:13px;color:var(--muted)}
.c-tag{border:1px solid var(--line-soft);border-radius:99px;padding:4px 13px;background:rgba(255,255,255,.05);color:var(--text)}

/* ── Steps timeline ── */
.flow{position:relative;margin-top:8px;padding-left:34px;display:flex;flex-direction:column;gap:6px}
.flow::before{content:"";position:absolute;left:11px;top:8px;bottom:8px;width:2px;background:linear-gradient(180deg,var(--magenta),var(--violet),var(--gold))}
.step{position:relative;background:var(--card);border:1px solid var(--line-soft);border-radius:16px;padding:16px 18px 16px 20px}
.step::before{content:"";position:absolute;left:-30px;top:22px;width:14px;height:14px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff,var(--bulb) 50%,#E8A33D);box-shadow:0 0 10px rgba(255,240,181,.8)}
.step-index{font-family:var(--fd);color:var(--gold);letter-spacing:.2em;font-size:13px}
.step h3{font-family:var(--fd);font-size:22px;text-transform:uppercase;letter-spacing:.05em;margin:2px 0;display:flex;align-items:center;gap:8px}
.step .step-icon{display:inline-flex;flex:none}
.step .step-icon svg{width:22px;height:22px}
.step p{margin:0;color:var(--muted);font-size:14px}
.step .step-icon{font-size:22px}
.foot-note{margin-top:16px;border:1px dashed rgba(255,194,71,.55);border-radius:14px;padding:13px 18px;font-size:14px;background:rgba(255,194,71,.06)}

/* ── Support banner ── */
.support-banner{margin-top:56px;border-radius:var(--r-card);border:1px solid var(--line);background:linear-gradient(120deg,rgba(255,43,194,.16),rgba(139,53,255,.16));padding:30px;display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between}
.support-banner h2{font-family:var(--fd);font-size:28px;text-transform:uppercase;margin:0}
.support-banner p{margin:4px 0 0;color:var(--muted)}

/* ── Cards / notes / forms ── */
.card{background:var(--card);border:1px solid var(--line-soft);border-radius:var(--r-card);padding:24px}
.card h3{font-family:var(--fd);font-size:22px;text-transform:uppercase;letter-spacing:.06em;margin:0 0 14px}
.note{background:rgba(79,227,245,.08);border:1px solid rgba(79,227,245,.4);border-radius:14px;padding:13px 17px;font-size:14px}
.note.warn{background:rgba(255,91,127,.08);border-color:rgba(255,91,127,.5)}
.muted{color:var(--muted)} .small{font-size:13px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:20px}
.form-grid .span2{grid-column:span 2}
.consent{display:flex;flex-direction:column;gap:12px}
.consent .row{display:flex;gap:12px;align-items:flex-start;background:rgba(0,0,0,.28);border:1px solid var(--line-soft);border-radius:12px;padding:12px 14px}
.consent input{width:20px;height:20px;margin-top:3px;accent-color:var(--magenta)}
.consent .t{font-weight:700;font-size:14px}
.req,.opt{font-size:10px;font-weight:800;letter-spacing:.1em;border-radius:99px;padding:2px 9px;margin-left:8px;vertical-align:2px}
.req{background:#ff5b7f;color:#fff} .opt{background:rgba(200,184,216,.2);color:var(--muted)}
.consent .d{color:var(--muted);font-size:13px}
.form-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px}
.form-actions-center{justify-content:center}
.form-actions-center .btn{min-width:260px;font-size:17px;padding:14px 40px;justify-content:center;text-align:center}
/* Form đổi vé căn giữa màn hình */
#s-form{max-width:1020px;margin-left:auto;margin-right:auto}
#s-form>h2,#s-form>.sub{text-align:center}
#s-form .form-grid{grid-template-columns:1fr}
.consent-bottom{margin-top:18px}
/* Tick đồng ý duy nhất thay 4 checkbox mặc định */
.consent-single{display:flex;gap:12px;align-items:flex-start;background:rgba(0,0,0,.28);border:1px solid var(--line-soft);border-radius:12px;padding:14px;cursor:pointer;font-size:14px;line-height:1.6}
.consent-single input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.consent-single .tickbox{flex:none;width:22px;height:22px;border-radius:7px;border:1.5px solid var(--magenta);background:rgba(255,43,194,.08);display:inline-flex;align-items:center;justify-content:center;color:#fff;font-size:14px;font-weight:900;margin-top:1px;transition:background .15s,box-shadow .15s}
.consent-single input:checked+.tickbox{background:var(--magenta);box-shadow:0 0 12px rgba(255,43,194,.6)}
.consent-single input:checked+.tickbox::after{content:"✓"}
.consent-single input:focus-visible+.tickbox{outline:2px solid var(--gold);outline-offset:2px}
.consent-single a{color:var(--gold);font-weight:700}
/* Done */
.okwrap{max-width:720px;margin:30px auto;text-align:center}
.okmark{width:74px;height:74px;margin:0 auto;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:34px;font-weight:900;color:#fff;background:linear-gradient(135deg,var(--magenta),var(--violet));box-shadow:var(--shadow-neon)}
.gradtext{font-family:var(--fd);font-size:clamp(34px,5vw,52px);text-transform:uppercase;background:linear-gradient(180deg,#fff,var(--magenta));-webkit-background-clip:text;background-clip:text;color:transparent;margin:14px 0 6px}
.oksum{display:grid;grid-template-columns:auto 1fr;gap:8px 18px;text-align:left;background:rgba(0,0,0,.32);border:1px solid var(--line-soft);border-radius:16px;padding:18px 22px;margin:22px 0}
.oksum dt{color:var(--muted);font-size:13px;text-transform:uppercase;letter-spacing:.08em}
.oksum dd{margin:0;font-weight:700}
.verified-pill{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:99px;background:rgba(255,43,194,.12);border:1px solid var(--magenta);color:#ff9ade;font-size:13px;font-weight:700}
.nextsteps{display:grid;grid-template-columns:1fr 1fr;gap:14px;text-align:left;margin-top:8px}
.nextsteps .ns{background:var(--card);border:1px solid var(--line-soft);border-radius:16px;padding:18px}
.nextsteps .h{font-family:var(--fd);color:var(--gold);letter-spacing:.2em;font-size:13px}
.nextsteps .t{font-weight:800;font-size:17px;margin:2px 0}
.nextsteps .d{color:var(--muted);font-size:14px}

/* ── Track ── */
.track-single{margin-top:20px}
.track-single .card{max-width:none}
.track-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:18px;margin-top:20px}
.search-row{display:flex;gap:10px}
.search-row input{min-width:0}
.search-row input{flex:1;background:rgba(0,0,0,.4);border:1px solid var(--line-soft);border-radius:12px;color:var(--text);font-size:15px;padding:13px 14px;font-family:var(--fb)}
.search-row input:focus{border-color:var(--magenta);box-shadow:0 0 0 3px rgba(255,43,194,.25);outline:none}
.try-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.try-chip{border-radius:var(--r-btn);border:1px solid var(--line-soft);background:rgba(255,255,255,.05);color:var(--text);font-size:13px;font-weight:600;padding:8px 15px;cursor:pointer}
.try-chip:hover{border-color:var(--magenta)}
.try-chip.active{background:linear-gradient(135deg,var(--magenta),var(--violet));border-color:transparent;color:#fff;box-shadow:var(--shadow-neon)}
.try-chip.st-void{border-style:dashed}
.support-list{display:flex;flex-direction:column}
.support-list .srow{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid rgba(200,184,216,.12);font-size:14px}
.support-list .srow:last-child{border-bottom:0}
.support-list .sic{font-size:20px}
#t-out{margin-top:22px}
#t-out:empty{display:none}
.track-empty-state,.track-notfound-card{text-align:center;border:1px dashed var(--line);border-radius:var(--r-card);padding:44px 24px;background:rgba(0,0,0,.25)}
.empty-icon,.nf-icon-box{font-size:44px}
.track-empty-state h3,.nf-title{font-family:var(--fd);font-size:26px;text-transform:uppercase;margin:10px 0 4px}
.track-empty-state p,.nf-desc{color:var(--muted);max-width:56ch;margin:0 auto}
.nf-tips{text-align:left;max-width:560px;margin:18px auto 0;font-size:14px}
.nf-tips code{background:rgba(0,0,0,.5);padding:2px 8px;border-radius:6px;color:var(--bulb)}
.track-alert-box{display:flex;gap:14px;border-radius:16px;padding:18px;margin-bottom:16px;border:1px solid;font-size:14px}
.alert-icon{font-size:26px}
.alert-success{background:rgba(255,43,194,.08);border-color:var(--magenta)}
.alert-info{background:rgba(79,227,245,.07);border-color:#4FE3F5}
.alert-warning{background:rgba(255,194,71,.08);border-color:var(--gold)}
.alert-danger{background:rgba(255,91,127,.08);border-color:#ff5b7f}
.alert-body strong{display:block;margin-bottom:4px}
.btn-hotline-call{background:var(--carnival-red);color:#fff;border:0;border-radius:var(--r-btn);padding:10px 22px;font-weight:700;cursor:pointer;box-shadow:0 4px 14px rgba(229,37,58,.35);transition:background .18s ease,box-shadow .18s ease}
.btn-hotline-call:hover{background:#ed3045;box-shadow:0 6px 18px rgba(229,37,58,.5)}
.track-result-wrapper{display:flex;flex-direction:column;gap:16px}
.my-ticket-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;margin:18px 0}
.my-ticket-card{background:var(--card);border:1px solid var(--line-soft);border-radius:var(--r-card);padding:18px}
.my-ticket-card b{display:block;font-size:18px}.my-ticket-card p{margin:6px 0 0;color:var(--muted);font-size:13px}
.track-stepper-card,.track-perks-card,.track-ticket-showcase-box{background:var(--card);border:1px solid var(--line-soft);border-radius:var(--r-card);padding:24px}
.stepper-kicker{font-size:12px;letter-spacing:.24em;color:var(--gold);text-transform:uppercase}
.stepper-order-title{font-family:var(--fd);font-size:24px;text-transform:uppercase;margin:2px 0 14px}
.stepper-header-row{display:flex;justify-content:space-between;font-size:13px;color:var(--muted);margin-bottom:6px}
.stepper-line-fill{height:6px;border-radius:99px;background:rgba(255,255,255,.1);margin-bottom:18px;overflow:hidden}
.stepper-line-fill i,.stepper-line-fill{display:block}
.stepper-line-fill{position:relative}
.stepper-line-fill::after{content:"";position:absolute;inset:0;width:var(--fill,50%);background:linear-gradient(90deg,var(--violet),var(--magenta));border-radius:99px}
.track-stepper-track,.stepper-nodes-row{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.stepper-connecting-line{display:none}
.node-circle-wrap{text-align:center;position:relative;padding-top:4px}
.node-circle{width:52px;height:52px;margin:0 auto;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:22px;background:rgba(255,255,255,.06);border:2px solid var(--line-soft);color:var(--muted)}
.node-svg-icon svg{width:24px;height:24px}
.node-step-badge{display:inline-block;font-size:10px;letter-spacing:.14em;color:var(--muted);text-transform:uppercase;margin-top:8px}
.node-title{font-weight:800;font-size:14px}
.node-desc{font-size:12px;color:var(--muted)}
.node-done .node-circle{background:rgba(255,43,194,.16);border-color:var(--magenta);color:#ff9ade}
.node-now .node-circle{background:linear-gradient(135deg,var(--magenta),var(--violet));border-color:#fff;color:#fff;box-shadow:var(--shadow-neon)}
.node-todo{opacity:.65}
.perks-head{margin-bottom:12px}
.p-kicker{font-size:12px;letter-spacing:.24em;color:var(--gold);text-transform:uppercase}
.p-title-wrap .p-title,.p-title{font-family:var(--fd);font-size:24px;text-transform:uppercase;margin:0}
.p-desc{color:var(--muted);font-size:14px;margin:4px 0 0}
.perks-list-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:12px}
.perk-cell{display:flex;gap:10px;align-items:flex-start;background:rgba(0,0,0,.28);border:1px solid var(--line-soft);border-radius:12px;padding:10px 12px;font-size:13px}
.p-ic-circle{flex:none;width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,194,71,.12);border:1px solid var(--gold)}
.sh-left{margin-bottom:6px}
/* ── Help accordion ── */
.iss{border:1px solid var(--line-soft);border-radius:14px;margin-bottom:10px;background:var(--card);overflow:hidden}
.iss>button{width:100%;display:flex;gap:12px;align-items:center;background:none;border:0;color:var(--text);font-family:var(--fb);font-size:15px;font-weight:700;text-align:left;padding:16px 18px;cursor:pointer}
.iss>button .tick{margin-top:0}
.iss .q{flex:1}
.iss .ans{display:none;padding:0 18px 18px 50px;font-size:14px}
.iss.open{border-color:var(--magenta)}
.iss.open .ans{display:block}
.ans .why{color:var(--text)}
.ans .do{color:var(--muted);margin-top:6px}
.help-keep{white-space:nowrap}
/* ── Rules ── */
.rule{display:flex;gap:16px;padding:18px 0;border-bottom:1px solid rgba(200,184,216,.12)}
.rule:last-child{border-bottom:0}
.rule .i{flex:none;width:44px;height:44px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-family:var(--fd);font-size:22px;font-weight:800;color:#2A0A12;background:linear-gradient(135deg,var(--gold),#FF9D5C)}
.rule .t{font-weight:800;font-size:17px}
.rule .d{color:var(--muted);font-size:14px;margin-top:2px}
.rule .q{font-size:13px;color:var(--bulb);margin-top:6px;border-left:3px solid var(--gold);padding-left:10px}
/* ── Admin ── */
.kpi{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:20px 0}
.kpi .k{background:var(--card);border:1px solid var(--line-soft);border-radius:16px;padding:16px;text-align:center}
.kpi .v{font-family:var(--fd);font-size:36px;line-height:1}
.kpi .l{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-top:4px}
.toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:6px}
.mode{display:inline-flex;align-items:center;gap:8px;font-size:14px}
.mode .dot{width:10px;height:10px;border-radius:50%;background:#2BD97C;box-shadow:0 0 8px #2BD97C}
.mode .dot.off{background:var(--gold);box-shadow:0 0 8px var(--gold)}
.pill{display:inline-block;font-size:12px;font-weight:700;border-radius:99px;padding:4px 13px;border:1px solid;white-space:nowrap}
.s-received{background:rgba(200,184,216,.12);border-color:var(--muted);color:var(--text)}
.s-matched{background:rgba(79,227,245,.12);border-color:#4FE3F5;color:#9df1fb}
.s-completed{background:rgba(255,194,71,.12);border-color:var(--gold);color:var(--bulb)}
.s-ticket_sent{background:rgba(255,43,194,.14);border-color:var(--magenta);color:#ff9ade}
.s-voided,.s-rejected{background:rgba(255,91,127,.12);border-color:#ff5b7f;color:#ff8ba3}
.log{background:#0D0218;border:1px solid var(--line-soft);border-radius:14px;padding:14px 18px;font-size:13px;max-height:260px;overflow:auto}
.log div{padding:3px 0;border-bottom:1px dotted rgba(200,184,216,.15)}
.log .ok{color:#8ff0bd}.log .no{color:#ff8ba3}
/* ── Footer ── */
.colophon{position:relative;z-index:2;margin-top:70px;border-top:1px solid var(--line-soft)}
.colophon .bulb-strip{opacity:.7}
.foot-in{max-width:var(--max);margin:0 auto;padding:34px 22px 40px;display:grid;grid-template-columns:1.2fr 1fr;gap:26px}
.foot-in,.foot-brand,.foot-brand>div,.foot-side{min-width:0}
.foot-brand{display:flex;gap:14px;align-items:flex-start}
.foot-brand img{height:48px;border-radius:10px;flex:none;max-width:100%}
.foot-brand strong{font-family:var(--fd);letter-spacing:.08em;font-size:19px;text-transform:uppercase;display:block}
.foot-brand p{color:var(--muted);font-size:13px;margin:4px 0 0;max-width:52ch;overflow-wrap:anywhere}
.footer-admin-link{color:var(--muted);font-size:12px}
.foot-side{display:flex;flex-direction:column;gap:14px;align-items:flex-end;min-width:0}
.foot-nav{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end}
.foot-cta-row{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.foot-help-btn{font-size:14px;padding:10px 22px}
.foot-socials{display:flex;gap:8px}
/* Khối thông tin liên hệ trong footer */
.foot-contact-h{display:flex;gap:8px 20px;flex-wrap:wrap;justify-content:flex-end;align-items:center}
.fch-item{display:inline-flex;gap:8px;align-items:center;font-size:13px}
.fc-ic{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:7px;background:rgba(255,194,71,.1);color:var(--gold);flex:none}
.fc-ic img{border-radius:4px;display:block}
.fc-label{color:var(--muted);min-width:64px;text-align:right;letter-spacing:.04em}
.fc-val{color:var(--text);font-weight:600;text-decoration:none;overflow-wrap:anywhere}
a.fc-val:hover{color:var(--gold);text-decoration:underline}
.social-btn{width:38px;height:38px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line-soft);color:var(--muted)}
.social-btn:hover{color:#fff;border-color:var(--magenta)}
.fx-btn{background:var(--carnival-red);border:1px solid rgba(255,220,244,.52);color:#fff;border-radius:var(--r-btn);padding:8px 18px;font-size:13px;font-weight:600;cursor:pointer;box-shadow:0 4px 14px rgba(229,37,58,.24)}
.fx-btn:hover{background:#ed3045;border-color:var(--gold)}

/* ── Ẩn stepper (tiến độ duyệt đơn) và perks (đặc quyền) khỏi kết quả tra cứu ── */
.track-stepper-card { display: none !important; }
.track-perks-card   { display: none !important; }

/* ── Ticket art: overlay + gradient nền đẹp hơn ── */
.stub-art-cover {
  background: linear-gradient(145deg, #2A0645 0%, #4B0E7A 30%, #1D0535 55%, #3B0060 80%, #17052D 100%);
}
.stub-art-overlay {
  background: linear-gradient(90deg, transparent 40%, rgba(35,4,63,.85) 100%),
              linear-gradient(0deg, rgba(10,1,24,.6) 0%, transparent 50%);
}
.stub-art-cover::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 80% 60% at 40% 35%, rgba(255,43,194,.22) 0%, transparent 65%),
    radial-gradient(ellipse 60% 80% at 60% 70%, rgba(139,47,214,.28) 0%, transparent 60%);
  pointer-events: none;
}
.stub-art-cover .stub-cover-img { mix-blend-mode: luminosity; opacity: .88; }

/* ── Responsive ── */
@media(max-width:1024px){
  .tier-grid{grid-template-columns:repeat(2,1fr)}
  .track-grid{grid-template-columns:1fr}
  .form-grid{grid-template-columns:1fr}
  .form-grid .span2{grid-column:auto}
  .concert-ticket-pass{grid-template-columns:170px 1fr 180px}
  .ledger-head{grid-template-columns:1fr}
  .hero-event-banner{grid-template-columns:1fr 1.4fr}
}
@media(max-width:860px){
  .mast-in{flex-wrap:wrap}
  .mainnav{order:3;width:100%;margin-left:0}
  .bo-grid{grid-template-columns:1fr}
  .track-stepper-track,.stepper-nodes-row{grid-template-columns:repeat(2,1fr)}
  .nextsteps{grid-template-columns:1fr}
  .foot-in{grid-template-columns:1fr}
  .foot-brand{flex-direction:column;gap:8px}
  .foot-brand img{height:auto;width:180px;max-width:100%}
  .foot-side{align-items:center;width:100%}
  .foot-contact-h{justify-content:center;width:100%}
  .foot-cta-row{justify-content:center;width:100%}
  .foot-nav{justify-content:center;width:100%}
  .kpi{grid-template-columns:repeat(2,1fr)}
  .hero-event-banner{grid-template-columns:1fr}
  .hero-event-sign{padding:16px}
  .hero-event-scene img{min-height:200px}
  .hero-countdown{padding:14px 22px;gap:12px}
  .hero-cd-label{font-size:14px}
}
@media(max-width:640px){
  .tier-grid{grid-template-columns:1fr}
  .concert-ticket-pass{grid-template-columns:1fr}
  .stub-art-cover{min-height:170px}
  .stub-qr{border-left:0;border-top:2px dashed rgba(255,194,71,.45)}
  .ticket-meta-grid{grid-template-columns:1fr 1fr}
  .perks-list-grid{grid-template-columns:1fr}
  .cd-cell{min-width:0;flex:1}
  .cd-cell b{font-size:30px}
  .prod-row{grid-template-columns:1fr}
  .brand-txt{font-size:17px}
  .btn-ticket{padding:9px 16px;font-size:15px}
  .foot-in{padding:26px 16px 34px;gap:20px}
  .foot-brand{flex-direction:column;gap:8px}
  .foot-brand img{height:auto;width:160px;max-width:100%}
  .foot-brand strong{font-size:17px}
  .foot-nav{display:flex;flex-wrap:nowrap;justify-content:center;gap:8px;width:100%}
  .foot-nav .nav-link{flex:1 1 0;min-width:0;text-align:center;padding:10px 4px;font-size:clamp(12.5px,3.6vw,14px);white-space:nowrap;background:rgba(255,255,255,.05);border:1px solid var(--line-soft);border-radius:var(--r-btn);color:var(--text)}
  .foot-nav .nav-link:hover{border-color:var(--carnival-red);color:#fff;background:rgba(229,37,58,.15)}
  .foot-cta-row{justify-content:center;flex-wrap:wrap;gap:8px;width:100%}
  .foot-cta-row .btn-ghostbtn,.foot-cta-row .fx-btn{flex:0 1 auto;padding:10px 14px;font-size:13px;white-space:nowrap;text-align:center}
  .foot-contact-h{justify-content:center;width:100%}
  .hero-countdown{flex-direction:column;gap:10px;padding:14px 16px}
  .hero-countdown::before,.hero-countdown::after{display:none}
  .hero-cd-label{font-size:13px;justify-content:center}
  .hero-cd-cell{min-width:56px}
  .hero-cd-cell b{font-size:28px}
  .hero-cd-sep{font-size:24px;padding-bottom:12px}
  .hero-event-banner{gap:10px}
  .hero-event-sign{padding:12px}
  .hero-event-scene img{min-height:160px}
}
@media (prefers-reduced-motion:reduce){
  /* Ngoại trừ khi user đã BẬT thủ công (html.fx-explicit): lựa chọn tường
   * minh thắng setting OS, nếu không nút toggle không bao giờ có tác dụng. */
  html:not(.fx-explicit) *,html:not(.fx-explicit) *::before,html:not(.fx-explicit) *::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
  html{scroll-behavior:auto}
}

/* ── Header mobile gọn: 1 hàng + hamburger ── */
.menu-toggle{display:none}
.panel-cta{display:none}
@media(max-width:860px){
  .mast-in{flex-wrap:nowrap;padding:10px 14px;gap:10px}
  .brand{flex:1;min-width:0}
  .brand img{height:32px;border-radius:8px}
  .brand-txt{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .brand-txt small{display:none}
  .header-cta{display:none}
  .menu-toggle{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:44px;height:44px;flex:none;background:rgba(255,255,255,.06);border:1px solid var(--line-soft);border-radius:12px;cursor:pointer}
  .menu-toggle span{display:block;width:20px;height:2px;background:var(--text);border-radius:2px;transition:transform .2s ease,opacity .2s ease}
  .masthead.menu-open .menu-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .masthead.menu-open .menu-toggle span:nth-child(2){opacity:0}
  .masthead.menu-open .menu-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .mainnav{display:none;position:absolute;top:100%;left:0;right:0;width:auto;margin:0;flex-direction:column;align-items:stretch;background:rgba(29,6,54,.97);border-bottom:1px solid rgba(255,222,112,.7);padding:10px 14px 16px;gap:4px;order:0}
  .masthead.menu-open .mainnav{display:flex}
  .mainnav .nav-link{text-align:left;padding:12px 14px;font-size:15px}
  .panel-cta{display:block;margin-top:8px;text-align:center}
}
/* Mobile shares the desktop transparent, blurred header surface. */
@media(max-width:860px){
  .masthead{background:transparent}
  .menu-toggle{background:rgba(255,255,255,.06);border-color:var(--line-soft);color:var(--text)}
}

/* ══════════════════════════════════════════════════════════════
   VISUAL ENHANCEMENTS — BG · Bulbs · Poster · Seal · H1 Neon
   ══════════════════════════════════════════════════════════════ */

/* ── 1. Body background animation — aurora shift ── */
/* ── 1. Body background animation — aurora overlay di chuyển ── */
body {
  background:
    linear-gradient(180deg,rgba(16,5,31,.72) 0%,rgba(16,5,31,.55) 30%,rgba(16,5,31,.88) 100%),
    linear-gradient(180deg, #1D0636 0%, var(--night) 34%, #0B0220 100%);
}

/* Lớp aurora 1 — trôi chậm sang phải + lên */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(ellipse 70vw 50vh at 20% 30%, rgba(139,53,255,.2)  0%, transparent 65%),
    radial-gradient(ellipse 60vw 60vh at 80% 10%, rgba(255,43,194,.15) 0%, transparent 60%),
    radial-gradient(ellipse 80vw 40vh at 50% 90%, rgba(122,20,110,.25) 0%, transparent 60%);
  animation: auroraFloat 12s ease-in-out infinite alternate;
}
/* Lớp aurora 2 — trôi ngược chiều */
body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(ellipse 55vw 45vh at 75% 55%, rgba(139,53,255,.14) 0%, transparent 60%),
    radial-gradient(ellipse 45vw 55vh at 15% 75%, rgba(255,43,194,.11) 0%, transparent 55%),
    radial-gradient(ellipse 50vw 35vh at 50% 10%, rgba(255,194,71,.08)  0%, transparent 55%);
  animation: auroraFloat2 16s ease-in-out infinite alternate-reverse;
}
@keyframes auroraFloat {
  0%   { transform: translate(0,    0)    scale(1) }
  30%  { transform: translate(3vw,  2vh)  scale(1.04) }
  60%  { transform: translate(-2vw, 4vh)  scale(1.02) }
  100% { transform: translate(4vw, -2vh)  scale(1.06) }
}
@keyframes auroraFloat2 {
  0%   { transform: translate(0,    0)    scale(1.02) }
  40%  { transform: translate(-4vw, 3vh)  scale(1) }
  70%  { transform: translate(2vw, -3vh)  scale(1.05) }
  100% { transform: translate(-2vw,-1vh)  scale(1.03) }
}
@keyframes bgAuroraShift {
  0%   { background-position: 0% 0%, 100% 0%, 50% 100%, 0% 0% }
  33%  { background-position: 8%  2%,  92% 4%,  46% 98%,  0% 0% }
  66%  { background-position: 14% 0%, 86% 2%, 54% 100%, 0% 0% }
  100% { background-position: 4%  4%,  96% 0%,  50%  96%,  0% 0% }
}

/* Thêm spark layer vào .sky — tia sáng lễ hội bắn ngang */
.sky::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(1px 30px at 22% 18%, rgba(255,240,181,.55), transparent 80%),
    radial-gradient(1px 22px at 61% 32%, rgba(255,43,194,.45),  transparent 80%),
    radial-gradient(1px 18px at 38% 55%, rgba(139,53,255,.4),   transparent 80%),
    radial-gradient(1px 26px at 78% 12%, rgba(255,194,71,.5),   transparent 80%),
    radial-gradient(1px 14px at 90% 68%, rgba(255,43,194,.35),  transparent 80%),
    radial-gradient(1px 20px at 8%  44%, rgba(79,227,245,.35),  transparent 80%);
  animation: sparkDrift 14s ease-in-out infinite alternate;
  pointer-events: none;
  opacity: .7;
}
@keyframes sparkDrift {
  from { transform: translateY(0) scaleX(1) }
  to   { transform: translateY(-18px) scaleX(1.04) }
}

/* ── 2. Footer .colophon — fix overflow + animated bg ── */
/* Override base rule: clip thay vì hidden để bulbs không bị cắt */
.colophon {
  overflow-x: clip;
  overflow-y: visible;            /* cho dây bóng nhô lên không bị cắt */
  /* background:var(--carnival-red); */
  border-top: 1.5px solid rgba(255,222,112,.75);
  box-shadow:none;
  animation:none;
  position: relative;
}
.colophon::before{display:none}
.colophon > * { position: relative; z-index: 1; }
.colophon .foot-bulb-strip span{animation:none!important}

@keyframes footerGlowPulse {
  from { opacity: .7 }
  to   { opacity: 1  }
}

/* ── 3. Footer bulb strip — dây đèn nổi lên trên border ── */
.foot-bulb-strip {
  display: flex;
  align-items: flex-end;
  justify-content: space-around;
  padding: 0 6px;
  height: 28px;          /* đủ chỗ cho dây + bóng */
  position: relative;
  z-index: 2;
  overflow: visible;     /* quan trọng: không clip dây bóng */
  margin-bottom: -2px;   /* overlap nhẹ lên border-top */
}
/* Dây ngang nối các bóng */
.foot-bulb-strip::before {
  content: "";
  position: absolute;
  top: 2px;
  left: 0;
  right: 0;
  height: 1px;
  background: rgba(200,184,216,.28);
}
.foot-bulb-strip span {
  display: inline-block;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #fff 0%, var(--bulb) 40%, #E8920A 100%);
  box-shadow: 0 0 6px 2px rgba(255,240,181,.9), 0 0 14px 3px rgba(255,194,71,.5);
  flex: none;
  animation: bulbFlicker 1.4s ease-in-out infinite;
  position: relative;
  margin-top: auto;
}
/* Dây treo từng bóng */
.foot-bulb-strip span::before {
  content: "";
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  width: 1px;
  height: 10px;
  background: rgba(200,184,216,.4);
}
.foot-bulb-strip span:nth-child(1)  { animation-delay: 0s;    animation-duration: 1.3s }
.foot-bulb-strip span:nth-child(2)  { animation-delay: .18s;  animation-duration: 1.7s }
.foot-bulb-strip span:nth-child(3)  { animation-delay: .36s;  animation-duration: 1.2s }
.foot-bulb-strip span:nth-child(4)  { animation-delay: .54s;  animation-duration: 1.9s }
.foot-bulb-strip span:nth-child(5)  { animation-delay: .72s;  animation-duration: 1.4s }
.foot-bulb-strip span:nth-child(6)  { animation-delay: .90s;  animation-duration: 1.6s }
.foot-bulb-strip span:nth-child(7)  { animation-delay: .08s;  animation-duration: 1.8s }
.foot-bulb-strip span:nth-child(8)  { animation-delay: .26s;  animation-duration: 1.1s }
.foot-bulb-strip span:nth-child(9)  { animation-delay: .44s;  animation-duration: 2.0s }
.foot-bulb-strip span:nth-child(10) { animation-delay: .62s;  animation-duration: 1.5s }
.foot-bulb-strip span:nth-child(11) { animation-delay: .80s;  animation-duration: 1.3s }
.foot-bulb-strip span:nth-child(12) { animation-delay: .98s;  animation-duration: 1.7s }
.foot-bulb-strip span:nth-child(13) { animation-delay: .14s;  animation-duration: 1.2s }
.foot-bulb-strip span:nth-child(14) { animation-delay: .32s;  animation-duration: 1.9s }
.foot-bulb-strip span:nth-child(15) { animation-delay: .50s;  animation-duration: 1.4s }
.foot-bulb-strip span:nth-child(16) { animation-delay: .68s;  animation-duration: 1.6s }
.foot-bulb-strip span:nth-child(17) { animation-delay: .86s;  animation-duration: 1.1s }
.foot-bulb-strip span:nth-child(18) { animation-delay: .04s;  animation-duration: 2.1s }
.foot-bulb-strip span:nth-child(19) { animation-delay: .22s;  animation-duration: 1.3s }
.foot-bulb-strip span:nth-child(20) { animation-delay: .40s;  animation-duration: 1.8s }
.foot-bulb-strip span:nth-child(even) {
  background: radial-gradient(circle at 35% 30%, #fff 0%, #FF9AE0 40%, var(--magenta) 100%);
  box-shadow: 0 0 6px 2px rgba(255,43,194,.85), 0 0 14px 3px rgba(255,43,194,.4);
  animation-name: bulbFlickerPink;
}

@keyframes bulbFlicker {
  0%,100% { opacity:1;   box-shadow:0 0 7px 3px rgba(255,240,181,.95),0 0 18px 5px rgba(255,194,71,.55) }
  20%     { opacity:.25; box-shadow:0 0 2px 1px rgba(255,240,181,.3) }
  22%     { opacity:1;   box-shadow:0 0 7px 3px rgba(255,240,181,.95),0 0 18px 5px rgba(255,194,71,.55) }
  55%     { opacity:.7;  box-shadow:0 0 5px 2px rgba(255,240,181,.7) }
  80%     { opacity:.1;  box-shadow:none }
  82%     { opacity:1;   box-shadow:0 0 7px 3px rgba(255,240,181,.95),0 0 18px 5px rgba(255,194,71,.55) }
}
@keyframes bulbFlickerPink {
  0%,100% { opacity:1;   box-shadow:0 0 7px 3px rgba(255,43,194,.9), 0 0 18px 5px rgba(255,43,194,.45) }
  30%     { opacity:.2;  box-shadow:0 0 2px 1px rgba(255,43,194,.25) }
  32%     { opacity:1;   box-shadow:0 0 7px 3px rgba(255,43,194,.9), 0 0 18px 5px rgba(255,43,194,.45) }
  60%     { opacity:.65; box-shadow:0 0 4px 2px rgba(255,43,194,.6) }
  75%     { opacity:.05; box-shadow:none }
  77%     { opacity:1;   box-shadow:0 0 7px 3px rgba(255,43,194,.9), 0 0 18px 5px rgba(255,43,194,.45) }
}

/* ── 4. Glow dưới ảnh sign.webp (.poster-frame::after) ── */
/* Glow ánh sáng dưới ảnh sign.webp – neon magenta to, nhanh. */
.poster-frame {
  position: relative;
}
.poster-frame::after {
  content: "";
  position: absolute;
  bottom: -24px;
  left: 5%;
  right: 5%;
  height: 80px;
  background: radial-gradient(ellipse 120% 140% at 50% 0%,
    rgba(255,43,194,.38) 0%,
    rgba(139,53,255,.22) 50%,
    transparent 80%);
  filter: blur(18px);
  pointer-events: none;
  z-index: -1;
  animation: posterGlow 2.2s ease-in-out infinite alternate;
}
@keyframes posterGlow {
  from { opacity: .6; transform: scaleX(1.0) }
  to   { opacity: .85; transform: scaleX(1.10) }
}

/* ── 5. .seal-ok dùng rule chính phía trên (magenta/violet theme) ── */

/* ── 6. H1 "The Night Carnival" — neon flicker ── */
.poster-hero h1 {
  animation: h1NeonFlicker 5s ease-in-out infinite;
  will-change: filter;
}
.poster-hero h1 em {
  animation: h1EmGlow 3s ease-in-out infinite alternate;
}
@keyframes h1NeonFlicker {
  0%,100% { filter: drop-shadow(0 3px 0 rgba(90,8,60,.9)) drop-shadow(0 0 30px rgba(255,43,194,.5)) drop-shadow(0 0 60px rgba(139,53,255,.25)) }
  10%     { filter: drop-shadow(0 3px 0 rgba(90,8,60,.9)) drop-shadow(0 0 10px rgba(255,43,194,.2)) }
  11%     { filter: drop-shadow(0 3px 0 rgba(90,8,60,.9)) drop-shadow(0 0 35px rgba(255,43,194,.65)) drop-shadow(0 0 70px rgba(255,43,194,.3)) }
  45%     { filter: drop-shadow(0 3px 0 rgba(90,8,60,.9)) drop-shadow(0 0 20px rgba(255,43,194,.35)) }
  46%     { filter: drop-shadow(0 3px 0 rgba(90,8,60,.9)) drop-shadow(0 0 0px rgba(255,43,194,0)) }
  47%     { filter: drop-shadow(0 3px 0 rgba(90,8,60,.9)) drop-shadow(0 0 40px rgba(255,43,194,.8)) drop-shadow(0 0 80px rgba(139,53,255,.4)) }
  80%     { filter: drop-shadow(0 3px 0 rgba(90,8,60,.9)) drop-shadow(0 0 22px rgba(255,194,71,.4)) drop-shadow(0 0 44px rgba(255,43,194,.2)) }
}
@keyframes h1EmGlow {
  from { filter: drop-shadow(0 0 12px rgba(255,194,71,.6)) drop-shadow(0 0 24px rgba(255,140,30,.3)) }
  to   { filter: drop-shadow(0 0 22px rgba(255,194,71,.9)) drop-shadow(0 0 44px rgba(255,194,71,.45)) }
}

/* ── 7. Footer title flicker ── */
.foot-title-flicker {
  font-family: var(--fd);
  letter-spacing: .08em;
  font-size: 19px;
  text-transform: uppercase;
  display: block;
  background: linear-gradient(135deg, #fff 10%, #FFD9F2 45%, var(--magenta) 72%, var(--gold) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: titleFlicker 4s ease-in-out infinite;
  will-change: filter, opacity;
}
@keyframes titleFlicker {
  0%,100% { opacity:1;   filter:drop-shadow(0 0 10px rgba(255,43,194,.9)) drop-shadow(0 0 22px rgba(255,43,194,.5)) }
  8%      { opacity:.85; filter:drop-shadow(0 0 4px rgba(255,43,194,.4)) }
  9%      { opacity:1;   filter:drop-shadow(0 0 10px rgba(255,43,194,.9)) drop-shadow(0 0 22px rgba(255,43,194,.5)) }
  43%     { opacity:.2;  filter:none }
  44%     { opacity:1;   filter:drop-shadow(0 0 14px rgba(255,43,194,1))  drop-shadow(0 0 28px rgba(139,53,255,.6)) }
  70%     { opacity:.95; filter:drop-shadow(0 0 8px rgba(255,194,71,.6))  drop-shadow(0 0 18px rgba(255,43,194,.4)) }
  88%     { opacity:.4;  filter:none }
  89%     { opacity:1;   filter:drop-shadow(0 0 12px rgba(255,43,194,.95)) drop-shadow(0 0 24px rgba(255,43,194,.5)) }
}

/* ── Reduced motion overrides ──
 * Ngoại trừ khi user đã BẬT thủ công (html.fx-explicit): lựa chọn tường
 * minh thắng setting OS, nếu không nút toggle không bao giờ có tác dụng. */
@media (prefers-reduced-motion: reduce) {
  html:not(.fx-explicit) body,
  html:not(.fx-explicit) body::before,
  html:not(.fx-explicit) body::after,
  html:not(.fx-explicit) .sky::after,
  html:not(.fx-explicit) .foot-bulb-strip span,
  html:not(.fx-explicit) .foot-title-flicker,
  html:not(.fx-explicit) .colophon,
  html:not(.fx-explicit) .colophon::before,
  html:not(.fx-explicit) .poster-frame::before,
  html:not(.fx-explicit) .poster-frame::after,
  html:not(.fx-explicit) .poster-hero h1,
  html:not(.fx-explicit) .poster-hero h1 em { animation: none !important }
  html:not(.fx-explicit) .foot-title-flicker {
    color: var(--text);
    background: none;
    -webkit-background-clip: unset;
    background-clip: unset;
    filter: none;
  }
}

/* ══ Đợt cập nhật trang chủ: countdown chớp đèn, viền chạy CTA, bước ngang ══ */

/* 1. Đồng hồ đếm ngược - nhịp thở êm dịu không chớp mắt */
.hero-cd-block{
  border: 1px solid rgba(245,183,56,.35);
  box-shadow: 0 4px 18px rgba(0,0,0,.4), inset 0 0 20px rgba(245,183,56,.04);
  animation: cdFrameGentle 6s ease-in-out infinite alternate;
}
@keyframes cdFrameGentle{
  0%{border-color:rgba(245,183,56,.3);box-shadow:0 4px 18px rgba(0,0,0,.4)}
  100%{border-color:rgba(232,40,158,.35);box-shadow:0 4px 22px rgba(232,40,158,.12)}
}
.hero-cd-cell b{
  color:var(--bulb);
  text-shadow:0 0 14px rgba(245,183,56,.45);
}
.hero-cd-colon{
  color:var(--gold);
  opacity:.6;
}

/* 2. Viền sáng nút Đổi vé ngay - quét chậm và tinh tế */
@property --cta-a{syntax:'<angle>';initial-value:0deg;inherits:false}
.hero-cta-main::before{
  content:"";position:absolute;inset:-2px;border-radius:inherit;padding:2px;pointer-events:none;
  background:conic-gradient(from var(--cta-a),transparent 0 75%,rgba(255,242,198,.8) 88%,var(--gold) 96%,transparent 100%);
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  animation:ctaBorderRun 5s linear infinite;
}
@keyframes ctaBorderRun{to{--cta-a:360deg}}

/* 3. Ngắt hàng cân đối, không gãy chữ */
.hero-title,.sec-head h2,.card h3{text-wrap:balance}
.hero-tagline,.sec-head p,.step p,.hero-chip span{overflow-wrap:break-word}
.rule .t,.rule .d,.rule .q,.mono-code,.mono-val,#t-out code{overflow-wrap:anywhere}

/* 4. Ẩn điểm trong danh mục sản phẩm */
.prod-cat-pt{display:none}

/* Kênh mua hàng hợp lệ */
a.c-tag{text-decoration:none}
a.c-tag:hover{border-color:var(--cyan);background:rgba(79,227,245,.12)}
a.c-tag:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
.prod-cat-list{min-width:0}
.prod-cat-name{overflow-wrap:anywhere}
@media(max-width:640px){
  .prod-cat-group{flex-direction:column;gap:8px}
  .prod-cat-list{width:100%}
  .channel-bar{padding:16px}
}

/* 7. 6 bước mua hàng dàn ngang */
.flow{padding-left:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
.flow::before{left:24px;right:24px;top:7px;bottom:auto;width:auto;height:2px;background:linear-gradient(90deg,var(--magenta),var(--violet),var(--gold))}
.step{padding:24px 12px 14px}
.step::before{left:calc(50% - 7px);top:0}
.flow .step h3{font-size:12px;font-weight:600;line-height:1.4;letter-spacing:0}
.flow .step p{font-size:13px}
/* PC 6 cột: card hẹp — thu nhỏ tiêu đề + icon để icon và chữ nằm gọn 1 hàng */
@media(min-width:1101px){
  .flow .step h3{font-size:12px;gap:4px;white-space:nowrap}
  .flow .step .step-icon svg{width:12px;height:12px}
}
@media(max-width:1100px){.flow{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:680px){
  .flow{grid-template-columns:repeat(2,minmax(0,1fr))}
  .flow::before,.step::before{display:none}
  .step{padding:14px 12px}
}
/* Mobile nhỏ: form 2 cột thành 1 cột, nút tra cứu gọn */
@media(max-width:560px){
  #s-form .card>div[style*="1fr 1fr"]{grid-template-columns:1fr !important}
  .search-row{flex-wrap:nowrap}
  .bo-go{padding:12px 16px;font-size:14px}
  .foot-cta-row .btn-ghostbtn,.foot-cta-row .fx-btn{overflow:hidden;text-overflow:ellipsis}
}

/* Tắt hiệu ứng mới khi giảm chuyển động */
html.rm .hero-cd-block,html.rm .hero-cd-cell b,html.rm .hero-cd-colon,
html.fx-paused .hero-cd-block,html.fx-paused .hero-cd-cell b,html.fx-paused .hero-cd-colon,
html.rm .hero-cta-main::before,html.fx-paused .hero-cta-main::before{animation:none}

/* Nền neon blur nhẹ bên dưới ảnh sign */
.hero-sign-wrap::before{
  content:"";position:absolute;inset:0;border-radius:inherit;z-index:0;pointer-events:none;
  background:url("/source/assets/neon_pc.png") center / cover no-repeat;
  filter:blur(6px);transform:scale(1.06);
}
/* Bỏ dãy đèn 2 viền đứng trái/phải, giữ viền trên + dưới */
.hero-img-col::before,.hero-img-col::after{display:none !important}
.hero-sign-wrap .bulb-strip.hero-bulb-top{
  position:absolute;top:10px;left:12px;right:12px;z-index:3;pointer-events:none;
  animation:chase 1.2s linear infinite;
}

/* ══ Header: chip user đã đăng nhập (avatar/tên, cạnh hamburger) ══ */
.user-chip{position:relative;flex:none;margin-left:0}
.user-chip-btn{position:relative;display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.06);border:1px solid var(--line-soft);border-radius:999px;padding:4px 12px 4px 4px;cursor:pointer;color:var(--text);font-family:var(--fb);min-height:44px;max-width:220px}
.user-chip-btn:hover{border-color:var(--magenta)}
.user-avatar{width:32px;height:32px;border-radius:50%;object-fit:cover;flex:none;border:2px solid rgba(255,194,71,.7);background:var(--bg2)}
.user-avatar-fallback{display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-size:15px;color:#fff;background:linear-gradient(135deg,var(--magenta),var(--violet))}
.user-name{max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;font-weight:600;color:var(--text)}
.user-dot{position:absolute;top:3px;left:27px;width:10px;height:10px;border-radius:50%;background:#4ADE80;border:2px solid #1D0636;pointer-events:none}
.user-menu{position:absolute;right:0;top:calc(100% + 8px);min-width:210px;background:rgba(20,4,38,.98);border:1px solid var(--line);border-radius:14px;padding:12px 14px;z-index:60;box-shadow:0 12px 32px rgba(0,0,0,.5)}
.user-menu-name{margin:0;font-weight:700;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.user-logout{width:100%;background:rgba(229,37,58,.18);border:1px solid rgba(229,37,58,.4);color:#fff;border-radius:999px;padding:9px 14px;font-size:14px;font-weight:600;cursor:pointer;font-family:var(--fb);transition:background .18s ease}
.user-logout:hover{background:var(--carnival-red)}
@media(max-width:860px){
  .user-chip{order:2}
  .menu-toggle{order:3}
  .user-name{display:none}
  .user-chip-btn{padding:4px;min-height:44px;min-width:44px;justify-content:center}
  .user-menu{position:fixed;top:64px;right:12px}
}
/* Màn hình vừa (laptop nhỏ): gọn chip + logo để nav không bị scroll ngang */
@media(max-width:1150px) and (min-width:861px){
  .mast-in{gap:12px}
  .brand img{height:32px}
  .nav-link{padding:9px 10px;font-size:13px}
  .user-name{display:none}
  .user-chip-btn{padding:4px;min-height:44px;min-width:44px;justify-content:center;max-width:none}
  .btn-ticket.header-cta{padding:10px 16px;font-size:15px}
}

/* ══ KV: ánh sáng bổ sung (giữ KV + chữ gốc) ══ */
/* A. Khung neon thở nhẹ: overlay opacity (GPU-friendly), không animate box-shadow */
.kv-frame-glow{position:absolute;inset:0;border-radius:inherit;z-index:1;pointer-events:none;
  background:radial-gradient(ellipse 70% 55% at 50% 0%,rgba(255,194,71,.20),transparent 70%),
    radial-gradient(ellipse 60% 60% at 8% 90%,rgba(255,43,194,.28),transparent 70%),
    radial-gradient(ellipse 60% 60% at 92% 90%,rgba(139,53,255,.30),transparent 70%);
  animation:kvFrameBreath 6s ease-in-out infinite alternate;will-change:opacity}
@keyframes kvFrameBreath{from{opacity:.45}to{opacity:1}}
/* C. Light sweep đã bỏ theo yêu cầu người dùng */
.kv-sweep{display:none !important}
/* D. Đốm sáng lấp lánh quanh KV (transform + opacity, không chặn click) */
.kv-sparkles{position:absolute;inset:-6%;z-index:0;pointer-events:none}
.kv-sparkles i{position:absolute;width:6px;height:6px;border-radius:50%;opacity:0;will-change:transform,opacity;
  background:radial-gradient(circle,#fff 0%,var(--bulb) 40%,transparent 70%);
  box-shadow:0 0 10px 2px rgba(255,240,181,.55);
  animation:kvSparkFloat 6s ease-in-out infinite}
.kv-sparkles i:nth-child(3n){background:radial-gradient(circle,#fff 0%,#ff8ad4 40%,transparent 70%);box-shadow:0 0 10px 2px rgba(255,43,194,.5)}
.kv-sparkles i:nth-child(3n+1){background:radial-gradient(circle,#fff 0%,#c9a6ff 40%,transparent 70%);box-shadow:0 0 10px 2px rgba(139,53,255,.5)}
.kv-sparkles i:nth-child(1){left:4%;top:14%;animation-delay:0s;animation-duration:5.5s}
.kv-sparkles i:nth-child(2){left:10%;top:76%;animation-delay:1.2s;animation-duration:6.8s}
.kv-sparkles i:nth-child(3){left:2%;top:50%;animation-delay:2.1s;animation-duration:6s}
.kv-sparkles i:nth-child(4){right:5%;top:18%;animation-delay:.6s;animation-duration:7.2s}
.kv-sparkles i:nth-child(5){right:9%;top:68%;animation-delay:1.8s;animation-duration:5.8s}
.kv-sparkles i:nth-child(6){right:3%;top:44%;animation-delay:2.8s;animation-duration:6.5s}
.kv-sparkles i:nth-child(7){left:48%;top:2%;animation-delay:3.4s;animation-duration:7s}
.kv-sparkles i:nth-child(8){left:44%;bottom:1%;animation-delay:4s;animation-duration:6.2s}
@keyframes kvSparkFloat{0%,100%{opacity:0;transform:translateY(8px) scale(.6)}30%{opacity:.95;transform:translateY(0) scale(1)}60%{opacity:.35;transform:translateY(-10px) scale(.85)}}
/* Tôn trọng giảm chuyển động / FX tắt / máy yếu */
html.rm .kv-frame-glow,html.rm .kv-sweep,html.rm .kv-sparkles,
html.fx-paused .kv-frame-glow,html.fx-paused .kv-sweep,html.fx-paused .kv-sparkles,
html:not(.fx-explicit) .kv-sweep,html:not(.fx-explicit) .kv-sparkles{animation:none}
html.rm .kv-sweep,html.fx-paused .kv-sweep,
html.rm .kv-sparkles,html.fx-paused .kv-sparkles,
html:not(.fx-explicit) .kv-sweep,html:not(.fx-explicit) .kv-sparkles{display:none}
html.rm .kv-frame-glow,html.fx-paused .kv-frame-glow{animation:none;opacity:.6}
html.fx-low .kv-sweep,html.fx-low .kv-sparkles{display:none}
html.fx-low .kv-frame-glow{animation:none;opacity:.6}
@media (prefers-reduced-motion:reduce){
  html:not(.fx-explicit) .kv-frame-glow,html:not(.fx-explicit) .kv-sweep,html:not(.fx-explicit) .kv-sparkles{animation:none}
  html:not(.fx-explicit) .kv-sweep,html:not(.fx-explicit) .kv-sparkles{display:none}
}
@media(max-width:640px){
  .kv-sparkles i:nth-child(7),.kv-sparkles i:nth-child(8){display:none}
}

/* ══ Nền neon_pc_1.png / neon_mb_1.jpg (.photo-bg): đốm đèn carnival nhấp nháy ══
   Ảnh nền đứng yên; chỉ animate đốm sáng (transform + opacity). */
.neon-twinkle{position:absolute;inset:0;z-index:1;pointer-events:none}
.neon-twinkle i{position:absolute;width:6px;height:6px;border-radius:50%;opacity:0;will-change:transform,opacity;
  background:radial-gradient(circle,#fff 0%,var(--bulb) 45%,transparent 70%);
  box-shadow:0 0 12px 3px rgba(255,240,181,.6);
  animation:neonTwinkle 3.6s ease-in-out infinite}
.neon-twinkle i:nth-child(3n){background:radial-gradient(circle,#fff 0%,#ff8ad4 45%,transparent 70%);box-shadow:0 0 12px 3px rgba(255,43,194,.55)}
.neon-twinkle i:nth-child(3n+1){background:radial-gradient(circle,#fff 0%,#c9a6ff 45%,transparent 70%);box-shadow:0 0 12px 3px rgba(139,53,255,.55)}
.neon-twinkle i:nth-child(1){left:8%;top:18%;animation-delay:0s}
.neon-twinkle i:nth-child(2){left:22%;top:64%;animation-delay:.7s;animation-duration:3s}
.neon-twinkle i:nth-child(3){left:36%;top:30%;animation-delay:1.4s;animation-duration:4.2s}
.neon-twinkle i:nth-child(4){left:52%;top:72%;animation-delay:.4s;animation-duration:3.2s}
.neon-twinkle i:nth-child(5){left:64%;top:22%;animation-delay:2.1s;animation-duration:4s}
.neon-twinkle i:nth-child(6){left:76%;top:58%;animation-delay:1.1s;animation-duration:2.9s}
.neon-twinkle i:nth-child(7){left:88%;top:34%;animation-delay:2.8s;animation-duration:3.8s}
.neon-twinkle i:nth-child(8){left:14%;top:84%;animation-delay:1.8s;animation-duration:3.4s}
.neon-twinkle i:nth-child(9){left:46%;top:12%;animation-delay:2.4s;animation-duration:4.4s}
.neon-twinkle i:nth-child(10){left:82%;top:82%;animation-delay:.9s;animation-duration:3.1s}
.neon-twinkle i:nth-child(11){left:5%;top:45%;animation-delay:1.5s;animation-duration:3.7s}
.neon-twinkle i:nth-child(12){left:30%;top:12%;animation-delay:2.6s;animation-duration:3s}
.neon-twinkle i:nth-child(13){left:58%;top:40%;animation-delay:.2s;animation-duration:4.1s}
.neon-twinkle i:nth-child(14){left:70%;top:88%;animation-delay:3.1s;animation-duration:3.3s}
.neon-twinkle i:nth-child(15){left:93%;top:60%;animation-delay:1.9s;animation-duration:3.9s}
.neon-twinkle i:nth-child(16){left:18%;top:38%;animation-delay:2.3s;animation-duration:2.8s}
.neon-twinkle i:nth-child(17){left:42%;top:55%;animation-delay:.5s;animation-duration:4.3s}
.neon-twinkle i:nth-child(18){left:66%;top:8%;animation-delay:3.5s;animation-duration:3.6s}
.neon-twinkle i:nth-child(19){left:85%;top:15%;animation-delay:1.3s;animation-duration:2.7s}
.neon-twinkle i:nth-child(20){left:28%;top:90%;animation-delay:2.9s;animation-duration:4.5s}
@keyframes neonTwinkle{0%,100%{opacity:0;transform:scale(.5)}50%{opacity:1;transform:scale(1.15)}}
/* Lớp phủ gradient thở nhẹ theo, chữ luôn đọc được */
.photo-bg::after{animation:neonBgBreathe 9s ease-in-out infinite alternate;will-change:opacity}
@keyframes neonBgBreathe{from{opacity:.82}to{opacity:1}}
/* Tôn trọng giảm chuyển động / FX tắt / máy yếu */
html.rm .photo-bg::after,html.rm .neon-twinkle,
html.fx-paused .photo-bg::after,html.fx-paused .neon-twinkle,
html:not(.fx-explicit) .neon-twinkle{animation:none}
html.rm .neon-twinkle,
html.fx-paused .neon-twinkle,
html:not(.fx-explicit) .neon-twinkle,
html.fx-low .neon-twinkle{display:none}
html.rm .photo-bg::after,html.fx-paused .photo-bg::after,html.fx-low .photo-bg::after{animation:none}
@media (prefers-reduced-motion:reduce){
  html:not(.fx-explicit) .photo-bg::after,html:not(.fx-explicit) .neon-twinkle{animation:none}
  html:not(.fx-explicit) .neon-twinkle{display:none}
}
@media(max-width:640px){
  .neon-twinkle i:nth-child(9),.neon-twinkle i:nth-child(10),.neon-twinkle i:nth-child(n+15){display:none}
}

/* ══════════════════════════════════════════════════════════════
   THE NIGHT CARNIVAL — SKILL.MD ENHANCEMENTS & ART DIRECTION
   ══════════════════════════════════════════════════════════════ */

/* 1. Hero Stock Head & Tier Pill Columns */
.hero-stock-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px;flex-wrap:wrap}
.hero-stock-badge{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);background:rgba(245,183,56,.1);border:1px solid rgba(245,183,56,.28);border-radius:999px;padding:3px 10px}
.tier-pill-col{transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
.tier-pill-col:hover{transform:translateY(-2px);border-color:var(--gold)}
.tier-col-fanzone{border-color:rgba(232,40,158,.3) !important;border-top-color:var(--magenta) !important}
.tier-col-vip1{border-color:rgba(245,183,56,.35) !important;border-top-color:var(--gold) !important}
.tier-col-vip2{border-color:rgba(232,40,158,.25) !important;border-top-color:var(--hot-pink) !important}
.tier-col-ga{border-color:rgba(245,183,56,.25) !important;border-top-color:rgba(245,183,56,.65) !important}

/* 2. Stock Band Layout */
.stock-band-info{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:center;width:100%;text-align:center}

/* 3. Tier Cards Art Direction - Hồng & Vàng Carnival */
.tier-card{
  background:linear-gradient(180deg,rgba(48,12,82,.88) 0%,rgba(24,6,46,.95) 100%);
  border:1px solid rgba(245,183,56,.3);
  box-shadow:0 12px 35px rgba(0,0,0,.45);
}
.tier-card-fanzone{border-color:rgba(232,40,158,.45);box-shadow:0 14px 40px rgba(232,40,158,.18)}
.tier-card-vip1{border-color:rgba(245,183,56,.5);box-shadow:0 14px 40px rgba(245,183,56,.18)}
.tier-card-vip2{border-color:rgba(232,40,158,.35);box-shadow:0 14px 40px rgba(232,40,158,.14)}
.tier-card-ga{border-color:rgba(245,183,56,.32);box-shadow:0 14px 40px rgba(245,183,56,.14)}

.tier-photo{position:relative}
.tier-photo-tag{
  position:absolute;bottom:8px;left:8px;
  font-family:var(--fd);font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  padding:4px 10px;border-radius:6px;-webkit-backdrop-filter: blur(8px); backdrop-filter:blur(8px);
}
.tier-tag-ga{background:rgba(13,3,26,.85);color:var(--bulb);border:1px solid rgba(245,183,56,.35)}
.tier-tag-vip2{background:rgba(13,3,26,.85);color:#ffb3ec;border:1px solid rgba(232,40,158,.35)}
.tier-tag-vip1{background:rgba(13,3,26,.85);color:var(--gold);border:1px solid rgba(245,183,56,.5)}
.tier-tag-fanzone{background:rgba(13,3,26,.85);color:#ff9ade;border:1px solid rgba(232,40,158,.5)}

.tier-price-row{display:flex;align-items:baseline;gap:8px;margin-top:2px}
.tier-points-label{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.tier-stock-badge{
  font-size:12px;color:var(--muted);background:rgba(0,0,0,.35);
  border:1px solid rgba(200,184,216,.14);border-radius:8px;padding:5px 10px;
  width:fit-content;
}
.tier-stock-badge b{color:var(--bulb)}

/* Product collection: quiet plum surfaces matching the shared button palette. */
.ledger{
  background:#20152e;border:1px solid #51405f;
  border-radius:18px;box-shadow:0 8px 24px rgba(0,0,0,.16);
}
.ledger-head{
  display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.25fr);
  gap:32px;padding:28px;align-items:center;background:transparent;
}
.ledger-img-wrap{
  position:relative;min-width:0;border-radius:12px;overflow:hidden;
  background:#271c35;border:1px solid #493653;box-shadow:none;
}
.ledger-img-wrap img{
  display:block;width:100%;height:auto;object-fit:contain;
  border-radius:0;transition:none;
}
.ledger:hover .ledger-img-wrap img{transform:none}
.ledger-content{min-width:0}
.ledger-content .kicker{
  display:block;margin:0 0 10px;font-size:11px;font-weight:700;
  line-height:1.5;letter-spacing:.1em;color:#d5afbb;text-shadow:none;
}
.ledger-content h3{
  font-family:var(--fd);font-size:clamp(20px,2vw,27px);font-weight:700;
  letter-spacing:-.02em;text-transform:uppercase;margin:0 0 14px;
  line-height:1.4;color:#f4edf6;text-wrap:balance;text-shadow:none;
}
.ledger-content p{font-size:13px;line-height:1.85;color:#c5b7ce;margin:0;max-width:58ch}
.ledger-badges-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.ledger .brand-tag{
  font-family:var(--fb);font-size:11px;font-weight:500;line-height:1.6;
  letter-spacing:0;padding:6px 10px;border-radius:8px;
  border:1px solid #5a4566;background:#30233f;color:#e1d5e8;
  text-transform:none;box-shadow:none;white-space:normal;
}
.ledger .channel-bar{border-top:1px solid #493653;background:#1c1328;padding:16px 28px;color:#c5b7ce;font-size:12px;gap:8px}
.ledger .c-tag{border-color:#51405f;background:#2a1e38;color:#e1d5e8;font-size:11px;line-height:1.6;padding:6px 10px;border-radius:8px}

/* 5. 6 Bước Hành trình Carnival Route Stops */
.step{
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
  background:linear-gradient(180deg,rgba(37,8,63,.7) 0%,rgba(16,5,31,.85) 100%);
}
.step:hover{
  transform:translateY(-4px);border-color:var(--gold);
  box-shadow:0 10px 26px rgba(255,196,79,.2);
}
.step h3{color:var(--bulb)}
.step-index{
  display:inline-block;padding:2px 8px;border-radius:4px;
  background:rgba(255,196,79,.12);border:1px solid rgba(255,196,79,.3);
  font-weight:700;margin-bottom:4px;
}

/* 6. Fix Responsive màn hình vừa và nhỏ */
@media(max-width:1024px){
  .ledger-head{grid-template-columns:1fr;gap:20px;padding:22px}
  .tier-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:640px){
  .hero-stock-head{flex-direction:column;align-items:flex-start}
  .ledger-head{padding:18px}
  .tier-grid{grid-template-columns:1fr}
}

/* ══════════════════════════════════════════════════════════════
   7. BLOCKS CHỌN HẠNG VÉ + Ô NHẬP SỐ LƯỢNG TRONG FORM ĐĂNG KÝ
   ══════════════════════════════════════════════════════════════ */
.form-tier-section{
  margin-bottom:16px;
}
.form-tier-title-row{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  margin-bottom:10px;
}
.form-tier-label{
  font-size:13px;
  font-weight:800;
  letter-spacing:.04em;
  color:var(--warm-white);
  text-transform:uppercase;
}
.form-tier-hint{
  font-size:11.5px;
  color:var(--muted-lilac);
}
.tier-blocks-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
}
.tier-pick-card{
  position:relative;
  background:linear-gradient(145deg,rgba(28,12,58,.85),rgba(14,5,32,.95));
  border:1.5px solid rgba(255,255,255,.12);
  border-radius:14px;
  padding:14px 12px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  cursor:pointer;
  transition:all .22s cubic-bezier(.2,.8,.2,1);
  box-shadow:0 6px 18px rgba(0,0,0,.45);
}
.tier-pick-card:hover{
  transform:translateY(-3px);
  border-color:rgba(255,87,222,.55);
  box-shadow:0 10px 24px rgba(0,0,0,.6),0 0 16px rgba(255,87,222,.25);
}
.tier-pick-card.active{
  background:linear-gradient(145deg,rgba(45,14,84,.95),rgba(24,6,54,.98));
  box-shadow:0 10px 28px rgba(0,0,0,.7),0 0 22px var(--card-glow,rgba(255,87,222,.5));
  border-color:var(--card-accent,#FF57DE);
}
.tier-pick-card.card-ga{
  --card-accent:#FFB347;
  --card-glow:rgba(255,179,71,.45);
}
.tier-pick-card.card-vip2{
  --card-accent:#B266FF;
  --card-glow:rgba(178,102,255,.45);
}
.tier-pick-card.card-vip1{
  --card-accent:#4FE3F5;
  --card-glow:rgba(79,227,245,.45);
}
.tier-pick-card.card-fanzone{
  --card-accent:#FF2B98;
  --card-glow:rgba(255,43,152,.5);
}

.tier-pick-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:6px;
  margin-bottom:8px;
}
.tier-pick-badge{
  display:inline-flex;
  align-items:center;
  gap:4px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.06em;
  padding:3px 9px;
  border-radius:999px;
  color:#fff;
  background:var(--card-accent,#FF57DE);
  box-shadow:0 2px 8px rgba(0,0,0,.4);
}
.tier-pick-radio{
  width:18px;
  height:18px;
  border-radius:50%;
  border:2px solid rgba(255,255,255,.35);
  display:flex;
  align-items:center;
  justify-content:center;
  transition:all .2s ease;
  flex:0 0 auto;
}
.tier-pick-card.active .tier-pick-radio{
  border-color:var(--card-accent,#FF57DE);
  background:var(--card-accent,#FF57DE);
}
.tier-pick-card.active .tier-pick-radio::after{
  content:"✓";
  font-size:11px;
  font-weight:900;
  color:#fff;
  line-height:1;
}

.tier-pick-price{
  font-size:16px;
  font-weight:900;
  color:var(--warm-white);
  letter-spacing:-.01em;
  line-height:1.2;
  margin-bottom:2px;
}
.tier-pick-desc{
  font-size:11px;
  color:var(--muted);
  line-height:1.3;
  margin-bottom:10px;
}
.tier-pick-card .tier-pick-price{display:none}
.tier-pick-money{display:inline-block;white-space:nowrap;font-size:14px;font-weight:800;color:var(--text)}
.tier-pick-card[role="checkbox"] .tier-pick-radio{border-radius:5px}

.tier-pick-qty-box{
  margin-top:auto;
  padding-top:10px;
  border-top:1px dashed rgba(255,255,255,.12);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:6px;
}
.tier-pick-qty-label{
  font-size:11px;
  font-weight:700;
  color:var(--muted-lilac);
}
.tier-qty-stepper{
  display:inline-flex;
  align-items:center;
  background:rgba(0,0,0,.4);
  border:1px solid rgba(255,255,255,.18);
  border-radius:8px;
  overflow:hidden;
}
.tier-qty-btn{
  width:28px;
  height:28px;
  background:transparent;
  border:none;
  color:#fff;
  font-size:15px;
  font-weight:800;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:background .15s ease;
  -webkit-user-select: none;
  user-select:none;
}
.tier-qty-btn:hover:not(:disabled){
  background:rgba(255,255,255,.18);
}
.tier-qty-btn:disabled{
  opacity:.35;
  cursor:not-allowed;
}
.tier-qty-input{
  width:36px;
  height:28px;
  background:transparent;
  border:none;
  text-align:center;
  font-size:13px;
  font-weight:800;
  color:#fff;
  padding:0;
  -moz-appearance:textfield;
  outline:none;
}
.tier-qty-input::-webkit-outer-spin-button,
.tier-qty-input::-webkit-inner-spin-button{
  -webkit-appearance:none;
  margin:0;
}

@media(max-width:860px){
  .tier-blocks-grid{
    grid-template-columns:repeat(2,1fr);
    gap:10px;
  }
}
@media(max-width:520px){
  .tier-blocks-grid{
    grid-template-columns:1fr;
    gap:9px;
  }
  .tier-pick-card{
    padding:12px;
  }
}

/* ══════════════════════════════════════════════════════════════
   8. TOOLTIP HƯỚNG DẪN MÃ ĐƠN HÀNG (i)
   ══════════════════════════════════════════════════════════════ */
.label-with-tip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  position:relative;
}
.help-tip-wrap{
  position:relative;
  display:inline-flex;
  align-items:center;
}
.help-tip-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:18px;
  height:18px;
  border-radius:50%;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.32);
  color:var(--cyan,#4FE3F5);
  font-size:11px;
  font-weight:900;
  cursor:help;
  padding:0;
  line-height:1;
  transition:all .2s ease;
  -webkit-user-select: none;
  user-select:none;
}
.help-tip-btn:hover,
.help-tip-btn:focus-visible{
  background:var(--cyan,#4FE3F5);
  color:#10031F;
  border-color:var(--cyan,#4FE3F5);
  box-shadow:0 0 10px rgba(79,227,245,.6);
  outline:none;
}
.help-tip-popup{
  position:absolute;
  bottom:calc(100% + 8px);
  left:50%;
  transform:translateX(-50%) translateY(6px);
  width:max-content;
  max-width:280px;
  background:linear-gradient(135deg,rgba(36,12,68,.96),rgba(18,5,38,.98));
  border:1px solid rgba(79,227,245,.4);
  box-shadow:0 10px 28px rgba(0,0,0,.7),0 0 18px rgba(79,227,245,.2);
  color:var(--warm-white,#fff);
  font-size:12px;
  font-weight:500;
  line-height:1.45;
  padding:9px 12px;
  border-radius:10px;
  z-index:99;
  pointer-events:none;
  opacity:0;
  visibility:hidden;
  transition:opacity .2s ease,transform .2s ease,visibility .2s ease;
  white-space:normal;
  text-align:left;
}
.help-tip-popup::after{
  content:"";
  position:absolute;
  top:100%;
  left:50%;
  transform:translateX(-50%);
  border-width:6px 6px 0;
  border-style:solid;
  border-color:rgba(36,12,68,.96) transparent transparent;
}
/* CHỈ HIỆN KHI RÊ CHUỘT VÀO NÚT (i) */
.help-tip-wrap:hover .help-tip-popup,
.help-tip-btn:hover + .help-tip-popup,
.help-tip-btn:focus-visible + .help-tip-popup{
  opacity:1;
  visibility:visible;
  transform:translateX(-50%) translateY(0);
}

/* ══════════════════════════════════════════════════════════════
   9. POPUP BANNER CẢNH BÁO GIÁ TRỊ ĐƠN HÀNG & FIELD GIÁ TRỊ ĐƠN
   ══════════════════════════════════════════════════════════════ */
.order-calc-banner{
  margin-top:12px;
  border-radius:12px;
  padding:12px 14px;
  font-size:13px;
  display:flex;
  align-items:center;
  gap:10px;
  line-height:1.45;
  transition:all .25s ease;
}
.order-calc-banner.banner-valid{
  background:rgba(74,222,128,.12);
  border:1px solid rgba(74,222,128,.4);
  color:#bbf7d0;
}
.order-calc-banner.banner-invalid{
  background:rgba(255,113,137,.14);
  border:1px solid rgba(255,113,137,.5);
  color:#ffcbd3;
}
.order-calc-banner .calc-ic{
  font-size:18px;
  flex:0 0 auto;
}

/* Modal Popup Banner Cảnh Báo */
.warn-popup-backdrop{
  position:fixed;
  inset:0;
  background:rgba(8,2,18,.82);
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
  z-index:99999;
  opacity:0;
  visibility:hidden;
  transition:opacity .25s ease,visibility .25s ease;
}
.warn-popup-backdrop.is-open{
  opacity:1;
  visibility:visible;
}
.warn-popup-card{
  background:linear-gradient(150deg,#2a0c44,#150528);
  border:1.5px solid #FF57DE;
  box-shadow:0 24px 60px rgba(0,0,0,.85),0 0 35px rgba(255,87,222,.45);
  border-radius:22px;
  max-width:460px;
  width:100%;
  padding:28px 24px 22px;
  text-align:center;
  transform:scale(.92);
  transition:transform .25s cubic-bezier(.2,.8,.2,1);
  color:#fff;
}
.warn-popup-backdrop.is-open .warn-popup-card{
  transform:scale(1);
}
.warn-popup-icon{
  width:60px;
  height:60px;
  border-radius:50%;
  background:rgba(255,87,222,.18);
  border:2px solid #FF57DE;
  color:#FF57DE;
  font-size:28px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-bottom:14px;
  box-shadow:0 0 20px rgba(255,87,222,.45);
}
.warn-popup-title{
  font-size:20px;
  font-weight:900;
  color:#fff;
  margin:0 0 10px;
  letter-spacing:-.01em;
}
.warn-popup-body{
  font-size:14px;
  color:#e2d9f8;
  line-height:1.55;
  margin:0 0 20px;
}
.warn-popup-body b{
  color:#ff94a6;
}
.warn-popup-calc-box{
  background:rgba(0,0,0,.45);
  border:1px solid rgba(255,255,255,.14);
  border-radius:12px;
  padding:10px 14px;
  margin-bottom:18px;
  font-size:12.5px;
  text-align:left;
  line-height:1.6;
}
.warn-popup-calc-box div{
  display:flex;
  justify-content:space-between;
}
.warn-popup-calc-box .diff-row{
  border-top:1px dashed rgba(255,255,255,.15);
  margin-top:6px;
  padding-top:6px;
  font-weight:800;
  color:#ff7189;
}
.warn-popup-btn{
  background:linear-gradient(92deg,#8B2FD6,#FF57DE);
  color:#fff;
  border:none;
  border-radius:999px;
  font-family:inherit;
  font-size:14px;
  font-weight:800;
  padding:11px 32px;
  cursor:pointer;
  box-shadow:0 4px 18px rgba(255,87,222,.5);
  transition:all .2s ease;
}
.warn-popup-btn:hover{
  filter:brightness(1.12);
  transform:translateY(-1px);
}

/* ══════════════════════════════════════════════════════════════
   10. LOGO & BRAND ADJUSTMENTS (NAVBAR & FOOTER)
   ══════════════════════════════════════════════════════════════ */
.brand-tnc-logo{
  height:40px;
  width:auto;
  max-width:180px;
  object-fit:contain;
  border-radius:6px;
  filter:drop-shadow(0 0 10px rgba(255,87,222,.3));
  transition:transform .2s ease;
}
.brand:hover .brand-tnc-logo{
  transform:scale(1.03);
}
@media(max-width:860px){
  .brand-tnc-logo{
    height:32px;
    max-width:140px;
  }
}
.foot-tnc-logo{
  height:42px;
  width:auto;
  object-fit:contain;
  margin-bottom:12px;
  display:block;
  filter:drop-shadow(0 0 12px rgba(255,87,222,.35));
}
.foot-official-sponsors{
  margin-top:10px;
  padding-top:10px;
  border-top:1px dashed rgba(255,255,255,.14);
}
.foot-sponsors-label{
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#FFC247;
  margin:0 0 8px;
}
.foot-brands-img{
  height:28px;
  width:auto;
  max-width:230px;
  object-fit:contain;
  display:block;
}

/* ══════════════════════════════════════════════════════════════
   11. HERO PRIMARY SLOGAN
   ══════════════════════════════════════════════════════════════ */
.hero-primary-slogan{
  text-align:center;
  align-self:center;
  width:100%;
  box-sizing:border-box;
  font-family:var(--fb);
  font-size:clamp(5px,.8vw,14px);
  font-size:clamp(5px,3.7cqi,14px);
  font-weight:800;
  line-height:1.6;
  padding-block:.15em;
  overflow:visible;
  letter-spacing:-.01em;
  text-transform:uppercase;
  color:#fff;
  background:linear-gradient(92deg,#FFFFFF 0%,#FFD7A8 45%,#FF57DE 100%);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  margin:18px 0 16px;
  text-shadow:0 0 30px rgba(255,87,222,.3);
}

/* ══════════════════════════════════════════════════════════════
   12. SEATMAP (SƠ ĐỒ CHỖ NGỒI) & MODAL ZOOM
   ══════════════════════════════════════════════════════════════ */
.seatmap-card{
  background:rgba(18,4,36,.88);
  border:1.5px solid rgba(255,87,222,.35);
  box-shadow:0 12px 36px rgba(0,0,0,.7),0 0 24px rgba(255,87,222,.2);
  border-radius:20px;
  padding:16px 16px 14px;
  position:relative;
  overflow:hidden;
}
.seatmap-card::before{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(ellipse 65% 50% at 50% 0%,rgba(255,87,222,.15),transparent 75%);
  pointer-events:none;
}
.seatmap-head{
  margin-bottom:12px;
}
.seatmap-title-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
}
.seatmap-badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#FF57DE;
}
.seatmap-zoom-btn{
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.2);
  color:#4FE3F5;
  border-radius:999px;
  padding:4px 12px;
  font-size:12px;
  font-weight:700;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  gap:5px;
  transition:all .2s ease;
}
.seatmap-zoom-btn:hover{
  background:rgba(79,227,245,.2);
  border-color:#4FE3F5;
  color:#fff;
  transform:scale(1.04);
}
.seatmap-venue{
  display:block;
  font-size:11px;
  color:var(--muted);
  letter-spacing:.04em;
  margin-top:3px;
}
.seatmap-viewport{
  position:relative;
  border-radius:14px;
  overflow:hidden;
  cursor:zoom-in;
  border:1px solid rgba(255,255,255,.1);
  box-shadow:inset 0 0 20px rgba(0,0,0,.6);
  background:#0C0219;
}
.seatmap-svg{
  width:100%;
  height:auto;
  display:block;
  transition:transform .25s ease;
}
.seatmap-viewport:hover .seatmap-svg{
  transform:scale(1.02);
}
.seatmap-hover-hint{
  position:absolute;
  bottom:8px;
  right:10px;
  background:rgba(8,2,18,.8);
  border:1px solid rgba(255,255,255,.18);
  color:#e2d9f8;
  font-size:11px;
  font-weight:700;
  padding:4px 10px;
  border-radius:999px;
  pointer-events:none;
  box-shadow:0 4px 12px rgba(0,0,0,.4);
  transition:opacity .2s ease;
}
.sm-zone{
  cursor:pointer;
  transition:filter .2s ease,opacity .2s ease;
}
.sm-zone:hover{
  filter:brightness(1.25) drop-shadow(0 0 8px rgba(255,255,255,.5));
}

/* Modal Zoom Seatmap */
.seatmap-modal-backdrop{
  position:fixed;
  inset:0;
  background:rgba(6,1,14,.88);
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
  z-index:99999;
  opacity:0;
  visibility:hidden;
  transition:opacity .25s ease,visibility .25s ease;
}
.seatmap-modal-backdrop.is-open{
  opacity:1;
  visibility:visible;
}
.seatmap-modal-card{
  background:linear-gradient(160deg,#24083a,#120320);
  border:1.5px solid #FF57DE;
  box-shadow:0 24px 64px rgba(0,0,0,.9),0 0 40px rgba(255,87,222,.4);
  border-radius:24px;
  width:100%;
  max-width:880px;
  max-height:92vh;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  color:#fff;
  transform:scale(.92);
  transition:transform .25s cubic-bezier(.2,.8,.2,1);
}
.seatmap-modal-backdrop.is-open .seatmap-modal-card{
  transform:scale(1);
}
.seatmap-modal-header{
  padding:16px 20px;
  border-bottom:1px solid rgba(255,255,255,.12);
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  background:rgba(0,0,0,.3);
}
.sm-modal-badge{
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
  color:#FF57DE;
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.seatmap-modal-controls{
  display:flex;
  align-items:center;
  gap:8px;
}
.sm-ctrl-btn{
  width:32px;
  height:32px;
  border-radius:8px;
  background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.22);
  color:#fff;
  font-weight:900;
  font-size:16px;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  transition:all .18s ease;
}
.sm-ctrl-btn#sm-zoom-reset{
  width:auto;
  padding:0 10px;
  font-size:12px;
}
.sm-ctrl-btn:hover{
  background:#FF57DE;
  border-color:#FF57DE;
  color:#120320;
}
.seatmap-modal-close{
  width:34px;
  height:34px;
  border-radius:50%;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.25);
  color:#fff;
  font-size:18px;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  transition:all .2s ease;
}
.seatmap-modal-close:hover{
  background:#FF2B55;
  border-color:#FF2B55;
  transform:rotate(90deg);
}
.seatmap-modal-scroll{
  flex:1 1 auto;
  overflow:auto;
  padding:20px;
  display:block;
  min-height:0;
  background:#090114;
}
.seatmap-modal-inner{
  width:100%;
  max-width:none;
  margin-inline:auto;
  -webkit-user-select: none;
  user-select:none;
}
.seatmap-modal-inner svg{
  width:100%;
  height:auto;
  border-radius:12px;
  box-shadow:0 10px 30px rgba(0,0,0,.6);
}
.seatmap-modal-legend{
  padding:12px 20px;
  border-top:1px solid rgba(255,255,255,.1);
  background:rgba(0,0,0,.35);
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  gap:8px 14px;
  font-size:11.5px;
  color:#dcd1f3;
}
.sm-leg-item{
  display:flex;
  align-items:center;
  gap:8px;
}
.sm-leg-dot{
  width:10px;
  height:10px;
  border-radius:3px;
  flex:0 0 auto;
}
.sm-leg-dot.leg-fanzone{background:#FF2B98;box-shadow:0 0 8px #FF2B98}
.sm-leg-dot.leg-vip1{background:#4FE3F5;box-shadow:0 0 8px #4FE3F5}
.sm-leg-dot.leg-vip2{background:#B266FF;box-shadow:0 0 8px #B266FF}
.sm-leg-dot.leg-ga{background:#FFB347;box-shadow:0 0 8px #FFB347}

/* ══════════════════════════════════════════════════════════════
   13. 3 MỨC RANGE VÉ & SOLD OUT BADGE
   ══════════════════════════════════════════════════════════════ */
.stock-range-label{
  font-size:11px;
  font-weight:900;
  letter-spacing:.04em;
  display:block;
}
.tier-stock-range-val{
  font-size:13px;
  font-weight:900;
  letter-spacing:.04em;
}
.range-soldout .stock-range-label,
.tier-card.is-soldout .tier-stock-range-val{
  color:#FF5B7F !important;
}
.range-under50 .stock-range-label{
  color:#FF94A6 !important;
}
.range-under100 .stock-range-label{
  color:#FFD466 !important;
}

/* Sold Out Overlay trên Card */
.tier-card{
  position:relative;
}
.tier-card.is-soldout{
  border-color:rgba(255,91,127,.5);
}
.tier-soldout-overlay{
  position:absolute;
  top:18px;
  right:14px;
  background:rgba(12,2,22,.9);
  -webkit-backdrop-filter:blur(3px);
  backdrop-filter:blur(3px);
  border-radius:inherit;
  z-index:20;
  display:flex;
  align-items:center;
  justify-content:center;
  pointer-events:none;
}
.tier-soldout-stamp{
  display:inline-block;
  padding:8px 14px;
  font-size:18px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#FF5B7F;
  border:3px solid #FF5B7F;
  border-radius:12px;
  transform:rotate(-12deg);
  background:rgba(255,91,127,.18);
  box-shadow:0 0 25px rgba(255,91,127,.6),inset 0 0 15px rgba(255,91,127,.3);
  text-shadow:0 0 10px rgba(255,91,127,.8);
  animation:stampPulse 2.5s ease-in-out infinite alternate;
}
@keyframes stampPulse{
  0%{transform:rotate(-12deg) scale(1)}
  100%{transform:rotate(-12deg) scale(1.04)}
}

/* ══════════════════════════════════════════════════════════════
   14. FLOATING CUSTOMER SUPPORT WIDGET (CS & HOTLINE)
   ══════════════════════════════════════════════════════════════ */
.float-cs-wrap{
  position:fixed;
  bottom:24px;
  right:22px;
  z-index:9990;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:10px;
}
.float-cs-toggle-btn{
  background:linear-gradient(135deg,#8B2FD6,#FF57DE);
  border:1.5px solid rgba(255,255,255,.3);
  color:#fff;
  border-radius:999px;
  padding:11px 18px 11px 14px;
  font-family:inherit;
  font-size:14px;
  font-weight:800;
  cursor:pointer;
  box-shadow:0 8px 26px rgba(139,47,214,.6),0 0 20px rgba(255,87,222,.4);
  display:flex;
  align-items:center;
  gap:8px;
  transition:all .22s cubic-bezier(.2,.8,.2,1);
  position:relative;
}
.float-cs-toggle-btn:hover{
  transform:translateY(-3px) scale(1.04);
  box-shadow:0 12px 32px rgba(139,47,214,.75),0 0 28px rgba(255,87,222,.6);
}
.float-cs-toggle-btn.is-active{
  background:linear-gradient(135deg,#FF2B55,#FF57DE);
  box-shadow:0 8px 28px rgba(255,43,85,.6);
}
.cs-btn-icon{
  display:flex;
  align-items:center;
  justify-content:center;
}
.cs-btn-text{
  letter-spacing:.02em;
}
.cs-pulse-dot{
  position:absolute;
  top:-2px;
  right:-2px;
  width:12px;
  height:12px;
  border-radius:50%;
  background:#4ADE80;
  border:2px solid #140426;
  box-shadow:0 0 8px #4ADE80;
  animation:csDotBreath 1.8s ease-in-out infinite;
}
@keyframes csDotBreath{
  0%,100%{transform:scale(1);opacity:1}
  50%{transform:scale(1.3);opacity:.75}
}
.float-cs-menu{
  background:linear-gradient(150deg,rgba(32,8,52,.97),rgba(16,3,28,.98));
  border:1.5px solid #FF57DE;
  box-shadow:0 20px 50px rgba(0,0,0,.85),0 0 25px rgba(255,87,222,.3);
  border-radius:18px;
  padding:14px 14px 12px;
  min-width:270px;
  max-width:320px;
  color:#fff;
  transform-origin:bottom right;
  animation:csMenuIn .22s cubic-bezier(.2,.8,.2,1);
}
@keyframes csMenuIn{
  from{opacity:0;transform:scale(.9) translateY(10px)}
  to{opacity:1;transform:scale(1) translateY(0)}
}
.float-cs-menu-header{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
  color:#FFC247;
  padding-bottom:10px;
  margin-bottom:10px;
  border-bottom:1px solid rgba(255,255,255,.12);
  text-transform:uppercase;
}
.float-cs-links{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.float-cs-item{
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 12px;
  border-radius:12px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.1);
  text-decoration:none;
  color:#fff;
  transition:all .18s ease;
}
.float-cs-item:hover{
  background:rgba(255,87,222,.18);
  border-color:#FF57DE;
  transform:translateX(3px);
}
.float-cs-item.cs-zalo .cs-icon{color:#0068FF}
.float-cs-item.cs-mail .cs-icon{color:#EA4335}
.float-cs-item.cs-phone .cs-icon{color:#4ADE80}
.cs-icon{
  width:36px;
  height:36px;
  border-radius:10px;
  background:rgba(255,255,255,.1);
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
}
.cs-info{
  flex:1 1 auto;
  min-width:0;
}
.cs-name{
  display:block;
  font-size:13px;
  font-weight:800;
  color:#fff;
  line-height:1.2;
}
.cs-sub,
.float-cs-menu .cs-desc{
  display:block;
  font-size:10.5px;
  color:var(--muted);
  line-height:1.3;
  margin-top:2px;
}
.cs-arrow{
  font-size:14px;
  font-weight:800;
  color:rgba(255,255,255,.4);
  transition:transform .18s ease;
}
.float-cs-item:hover .cs-arrow{
  transform:translateX(3px);
  color:#FF57DE;
}

@media(max-width:540px){
  .float-cs-wrap{
    bottom:18px;
    right:14px;
  }
  .float-cs-toggle-btn{
    padding:10px 14px;
    font-size:13px;
  }
  .float-cs-menu{
    min-width:250px;
  }
}


/* Ticket tracking timeline: quiet surfaces with clear state hierarchy. */
.track-step-journey{margin-top:24px;padding:28px;border:1px solid #51405f;border-radius:20px;background:#20152e;box-shadow:0 10px 30px rgba(0,0,0,.18)}
.tsj-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-bottom:20px;border-bottom:1px solid #42334e;margin-bottom:18px}
.tsj-order-meta,.tsj-badge-wrap{min-width:0}
.tsj-kicker{display:block;font-size:10px;letter-spacing:.1em;font-weight:600;color:#c5afcb;margin-bottom:10px}
.tsj-order-row{display:flex;gap:10px 16px;flex-wrap:wrap;align-items:center}
.tsj-order-code{font-size:14px;color:#c5b7ce;overflow-wrap:anywhere}
.tsj-order-code b{font-size:16px;color:#f4edf6;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.tsj-tier-pill{font-size:11px;line-height:1.5;padding:5px 10px;border-radius:8px;border:1px solid #594366;background:#30233f;color:#d8c9df}
.tsj-tier-pill b{color:#f2eaf5}
.tsj-status-pill{display:inline-flex;padding:8px 12px;font-size:10px;line-height:1.6;font-weight:600;letter-spacing:.02em;border:1px solid;border-radius:8px;overflow-wrap:anywhere}
.tsj-status-pill.badge-processing{background:#30243f;border-color:#756080;color:#e2d5eb}
.tsj-status-pill.badge-success{background:#30243f;border-color:#756080;color:#e2d5eb}
.tsj-status-pill.badge-void{background:#30243f;border-color:#756080;color:#e2d5eb}
.tsj-progress{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;margin:0 0 26px}
.tsj-progress span{height:4px;border-radius:8px;background:#45354e}
.tsj-progress .complete{background:#927da3}.tsj-progress .active{background:#b9a4ca}.tsj-progress .stopped{background:#927da3}
.tsj-timeline-list{display:flex;flex-direction:column;list-style:none;margin:0;padding:0;gap:0}
.tsj-step-card{position:relative;display:flex;gap:16px;padding:0 0 16px;min-width:0}
.tsj-step-card:last-child{padding-bottom:0}
.tsj-left-col{flex:0 0 36px;position:relative;display:flex;justify-content:center;align-items:flex-start;padding-top:14px}
.tsj-circle{position:relative;z-index:1;width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:1px solid #665373;background:#2b2038;color:#baabc4;font-size:11px;font-weight:600;box-shadow:none}
.tsj-line{display:none}
.tsj-step-card:not(:last-child)::before{content:"";position:absolute;left:17px;top:31px;bottom:-31px;width:2px;background:#756080;pointer-events:none}
.tsj-step-card.done .tsj-circle,.tsj-step-card.done-final .tsj-circle{background:#493957;border-color:#927da3;color:#eee4f4}
.tsj-step-card.done .tsj-line{background:#756080}
.tsj-step-card.current .tsj-circle{background:#675276;border-color:#b9a4ca;color:#fff}
.tsj-step-card.void .tsj-circle{background:#493957;border-color:#927da3;color:#eee4f4}
.tsj-pulse-dot{display:none}
.tsj-right-col{flex:1;min-width:0;border:1px solid #493850;border-radius:12px;padding:16px 18px;background:#261b34}
.tsj-step-card.current .tsj-right-col{background:#30243f;border-color:#927da3;box-shadow:inset 3px 0 #b9a4ca}
.tsj-step-card.done-final .tsj-right-col{background:#30243f;border-color:#927da3}
.tsj-step-card.todo .tsj-right-col{background:#23192f;border-color:#403149}
.tsj-title-row{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;margin-bottom:6px}
.tsj-step-badge{font-size:9px;font-weight:600;letter-spacing:.07em;color:#bfaecc;white-space:nowrap}
.tsj-step-title{font-size:14px;line-height:1.5;font-weight:600;color:#f0e8f4;margin:0;overflow-wrap:anywhere}
.tsj-step-card.todo .tsj-step-title{color:#c9bcd2}
.tsj-state-label{margin-left:auto;font-size:10px;color:#ae9db8;line-height:1.5}
.tsj-step-card.done .tsj-state-label{color:#c9b8d7}
.tsj-step-card.void .tsj-state-label{color:#c9b8d7}
.tsj-tag-current,.tsj-tag-ready{margin-left:auto;font-size:9px;letter-spacing:.02em;font-weight:600;line-height:1.6;border-radius:6px;padding:3px 7px}
.tsj-tag-current{background:#51405f;color:#eee4f4}.tsj-tag-ready{background:#51405f;color:#eee4f4}
.tsj-step-desc{font-size:12px;line-height:1.75;color:#bcaec6;margin:0;max-width:none}
.tsj-step-card.current .tsj-step-desc{color:#dfd1e7}
.tsj-callcenter-box{margin-top:12px;padding:12px 14px;border:1px solid #59435f;border-radius:8px;background:#2c2038}
.tsj-cc-head{display:flex;gap:7px;align-items:center;font-size:10px;line-height:1.6;color:#d8c5df;margin-bottom:4px}
.tsj-cc-head b{font-weight:600}.tsj-cc-icon{font-size:12px}
.tsj-cc-text{font-size:11px;line-height:1.7;color:#c2b1cc;margin:0}
.tsj-cancel-banner{display:flex;align-items:flex-start;gap:10px;background:#30243f;border:1px solid #756080;border-radius:10px;padding:14px;margin-bottom:18px}
.tsj-cancel-banner strong{color:#e2d5eb;font-size:13px}.tsj-cancel-banner p{font-size:12px;line-height:1.7;color:#d8c9e2;margin:5px 0 0}
.tsj-footer-note{display:flex;align-items:flex-start;gap:8px;margin-top:22px;padding-top:16px;border-top:1px solid #42334e;font-size:11px;line-height:1.8;color:#b8a7c3}
@media(max-width:640px){
 .track-step-journey{padding:18px 14px;border-radius:16px}
 .tsj-head{gap:12px;padding-bottom:16px}.tsj-order-code b{font-size:14px}
 .tsj-step-card{gap:10px}.tsj-left-col{flex-basis:28px;padding-top:13px}
 .tsj-circle{width:28px;height:28px;font-size:10px;box-shadow:none}
 .tsj-step-card:not(:last-child)::before{left:13px;top:27px;bottom:-27px}
 .tsj-right-col{padding:13px 12px}.tsj-title-row{gap:5px 8px}
 .tsj-step-title{font-size:13px;flex-basis:100%;order:1}
 .tsj-step-desc{font-size:11.5px}.tsj-state-label,.tsj-tag-current,.tsj-tag-ready{font-size:9px}
 .tsj-callcenter-box{padding:10px}.tsj-kicker{font-size:9px}
}
/* Ẩn các khối vé cũ trong tra cứu để tập trung 100% vào Step-by-Step */
.track-ticket-showcase-box{
  display: none !important;
}

/* Responsive layout for the seatmap, availability and support controls. */
.hero-split > *, .hero-info-col, .hero-img-col{min-width:0}
.seatmap-card{width:100%}
.hero-info-col .hero-stock{width:100%;box-sizing:border-box}
.hero-stock-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.hero-stock-row > div{padding:10px 8px;border-radius:10px}
.hero-stock-row b.stock-range-label{font-size:12px;line-height:1.5;white-space:normal;text-shadow:none;margin-top:4px}
.hero-stock-row span{font-size:11px}
.hero-primary-slogan{text-wrap:nowrap;white-space:nowrap}
.tier-grid .tier-body{min-width:0;container-type:inline-size;gap:8px}
.tier-grid .tier-body{padding-inline:12px}
.tier-grid .tier-perks{font-size:11px;line-height:1.6}
.tier-grid .tier-perks li{gap:4px;letter-spacing:-.015em;min-width:0}
.tier-grid .tier-perks li.tier-soundcheck-benefit{font-size:inherit;white-space:normal}
.tier-grid .tier-perks .tick{flex:0 0 12px;width:12px}
/* Equal ticket card widths, with consistent benefit typography. */
@media(min-width:861px){
  #s-landing .tier-grid{position:relative;left:50%;transform:translateX(-50%);width:calc(100vw - 48px);max-width:1440px;gap:16px}
}
@media(min-width:641px) and (max-width:1279px){
  #s-landing .tier-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(min-width:1280px){
  #s-landing .tier-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  #s-landing .tier-grid .tier-perks li{white-space:normal;align-items:flex-start}
  #s-landing .tier-grid .tier-perks li>span:last-child{min-width:0;text-wrap:pretty}
}
.tier-grid .tier-name{font-size:18px;line-height:1.35;letter-spacing:0;min-width:0}
.tier-grid .tier-name .ic{width:18px;height:18px;flex-shrink:0}
.tier-grid .tier-price-row{min-width:0;margin-top:0;gap:0}
.tier-grid .tier-points{font-size:12px;font-size:clamp(10px,5cqi,13px);font-weight:700;line-height:1.5;letter-spacing:-.02em;white-space:nowrap}
.float-cs-menu[hidden]{display:none}
.float-cs-menu{min-width:0;width:384px;max-width:calc(100vw - 32px);box-sizing:border-box;max-height:calc(100dvh - 190px);overflow:auto;transform-origin:top right}
.float-cs-wrap{right:max(16px,env(safe-area-inset-right));top:calc(104px + env(safe-area-inset-top));bottom:auto;flex-direction:column-reverse}
.float-cs-wrap .float-cs-toggle-btn{font-size:17px;padding:13px 22px 13px 17px;gap:10px}
.mobile-cs-slot{display:none}
@media(max-width:860px){
  .mobile-cs-slot{display:flex;align-items:center;flex:none;position:static}
  .mobile-cs-slot .float-cs-wrap{position:static;top:auto;right:auto;bottom:auto;padding:0;gap:0}
  .mobile-cs-slot .float-cs-wrap .float-cs-toggle-btn{font-size:11px;padding:8px;height:44px;box-sizing:border-box;gap:4px;white-space:nowrap}
  .mast-in .brand img.brand-tnc-logo{max-width:100%;object-fit:contain}
  .mobile-cs-slot .cs-btn-icon svg{width:16px;height:16px}
  .mobile-cs-slot .float-cs-menu{position:absolute;top:100%;right:14px;max-width:calc(100vw - 28px);max-height:calc(100dvh - 160px);transform-origin:top right}
}
@media(max-width:540px){
  .float-cs-wrap{top:calc(88px + env(safe-area-inset-top))}
  .float-cs-wrap .float-cs-toggle-btn{font-size:15.5px;padding:12px 17px}
  .float-cs-menu{max-height:calc(100dvh - 174px)}
}
.float-cs-menu .cs-info{min-width:0}
.float-cs-menu .cs-name{font-size:12px;font-weight:700;line-height:1.45;letter-spacing:-.02em;overflow-wrap:anywhere}
.float-cs-menu .cs-desc{font-size:10.5px;line-height:1.5;font-weight:400;letter-spacing:0}
.float-cs-menu .float-cs-item{gap:8px;padding:9px 10px}
.float-cs-menu .cs-icon{width:30px;height:30px;border-radius:8px}
.float-cs-menu .cs-icon img,.float-cs-menu .cs-icon svg{width:18px;height:18px}
.float-cs-menu .cs-arrow{flex:none;font-size:12px}
.float-cs-menu .float-cs-menu-header{font-size:10px;letter-spacing:.04em;line-height:1.5}
.seatmap-modal-card{max-height:92dvh}
.seatmap-modal-scroll{overscroll-behavior:contain;flex:1 1 auto}
.seatmap-modal-inner svg{display:block;max-width:none}
.seatmap-modal-controls{flex-shrink:0}
.sm-ctrl-btn,.seatmap-modal-close{min-width:44px;height:44px}
.sm-ctrl-btn:disabled{opacity:.4;cursor:default}
.seatmap-viewport:focus-visible,.seatmap-zoom-btn:focus-visible,.float-cs-toggle-btn:focus-visible,.sm-ctrl-btn:focus-visible,.seatmap-modal-close:focus-visible{outline:2px solid #4FE3F5;outline-offset:4px}
@media(max-width:860px){
  .hero-info-col{width:100%;align-items:stretch}
  .hero-primary-slogan{text-align:center;font-size:clamp(5px,1.7vw,14px);font-size:clamp(5px,1.7cqi,14px)}
  .seatmap-card{max-width:640px;margin-inline:auto}
}
@media(max-width:540px){
  .seatmap-card{padding:12px;border-radius:16px}
  .seatmap-badge{font-size:10px;letter-spacing:.04em}
  .seatmap-zoom-btn{padding:8px;font-size:11px;flex-shrink:0}
  .seatmap-venue{font-size:10px;line-height:1.6;margin-top:8px}
  .seatmap-hover-hint{position:static;text-align:center;border-radius:0;border:0;font-size:10px;padding:8px}
  .hero-chips-row{grid-template-columns:1fr}
  .hero-chip strong,.hero-chip .nowrap{white-space:normal}
  .seatmap-modal-backdrop{padding:10px}
  .seatmap-modal-card{border-radius:16px;max-height:94dvh}
  .seatmap-modal-header{flex-direction:column;align-items:stretch;padding:12px}
  .seatmap-modal-controls{justify-content:flex-end}
  .seatmap-modal-scroll{padding:10px}
  .seatmap-modal-legend{grid-template-columns:1fr;font-size:11px;padding:12px;gap:6px}
}
@media(prefers-reduced-motion:reduce){
  .tier-soldout-stamp,.cs-pulse-dot,.float-cs-menu{animation:none}
  .seatmap-svg,.seatmap-modal-backdrop,.seatmap-modal-card{transition:none}
}

.foot-brand{flex-direction:column;gap:10px;align-items:center;text-align:center}
.foot-brand .foot-official-sponsors{width:100%;text-align:center}
.foot-brand .foot-sponsors-label{max-width:none;width:100%;margin:0 0 8px;text-align:center}
.foot-sponsors-list{display:grid;grid-template-columns:52.8px 42px 52.8px;align-items:center;justify-content:center;justify-items:center;gap:10.8px}
.sponsor-logo{display:block;flex:none;height:20.4px;background-image:url('/source/assets/brands.webp');background-size:170px 20.4px;background-repeat:no-repeat}
.sponsor-axe{width:52.8px;background-position:left center}
.sponsor-lifebuoy{width:42px;background-position:right center}
.sponsor-lux{width:44.4px;background-position:-64.8px center}
.brand img.brand-tnc-logo{height:56px;max-width:180px;border-radius:0}
.foot-brand img.foot-tnc-logo{height:92.4px;width:auto;max-width:252px}
@media(max-width:640px){
  .brand img.brand-tnc-logo{height:46px;max-width:140px}
  .foot-sponsors-list{justify-content:center;gap:8.4px}
  .foot-official-sponsors{width:100%;text-align:center}
}

.hero-stock-row b[hidden],.tier-stock-range-val[hidden]{display:none}

/* Shared button palette: muted rose actions and quiet plum controls. */
:root{
  --button-primary:#a83e59;
  --button-primary-hover:#91334c;
  --button-secondary:#30233f;
  --button-secondary-hover:#40304f;
  --button-border:#665373;
  --button-text:#fff;
  --button-focus:#d9bddf;
}
body :is(.btn-ticket,.btn-primary,.hero-cta-main,.btn,.tier-btn,.bo-go,.btn-download-ticket,.btn-hotline-call,.warn-popup-btn,.float-cs-toggle-btn,.float-cs-toggle-btn.is-active){
  background:var(--button-primary);border:1px solid var(--button-primary);color:var(--button-text);
  box-shadow:0 3px 10px rgba(0,0,0,.18);text-shadow:none;filter:none;
  animation:none;transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease;
}
body :is(.btn-ticket,.btn-primary,.hero-cta-main,.btn,.tier-btn,.bo-go,.btn-download-ticket,.btn-hotline-call,.warn-popup-btn,.float-cs-toggle-btn,.float-cs-toggle-btn.is-active):hover{
  background:var(--button-primary-hover);border-color:var(--button-primary-hover);color:var(--button-text);
  box-shadow:0 4px 12px rgba(0,0,0,.22);transform:none;filter:none;
}
body :is(.btn-ticket,.hero-cta-main)::before,
body :is(.btn-ticket,.hero-cta-main)::after{content:none;animation:none}
body :is(.btn.ghost,.btn-ghostbtn,.hero-cta-sec,.btn-wallet-add,.fx-btn,.toggle-perks-table-btn,.prod-catalog-toggle,.seatmap-zoom-btn,.sm-ctrl-btn,.seatmap-modal-close,.tier-qty-btn,.help-tip-btn,.try-chip,.user-chip-btn){
  background:var(--button-secondary);border:1px solid var(--button-border);color:#eee7f2;
  box-shadow:none;text-shadow:none;filter:none;animation:none;
  transition:background-color .18s ease,border-color .18s ease,color .18s ease;
}
body :is(.btn.ghost,.btn-ghostbtn,.hero-cta-sec,.btn-wallet-add,.fx-btn,.toggle-perks-table-btn,.prod-catalog-toggle,.seatmap-zoom-btn,.sm-ctrl-btn,.seatmap-modal-close,.tier-qty-btn,.help-tip-btn,.try-chip,.user-chip-btn):hover{
  background:var(--button-secondary-hover);border-color:#927b9e;color:#fff;box-shadow:none;transform:none;filter:none;
}
body :is(.mainnav .nav-link,.foot-nav .nav-link):hover{background:var(--button-secondary-hover);border-color:var(--button-border);color:#fff;box-shadow:none}
body .nav-link[aria-current="true"]{background:var(--button-secondary);border-color:var(--button-border);color:#f2e8f5}
body a.c-tag:hover{background:var(--button-secondary-hover);border-color:var(--button-border);color:#fff}
body :is(button,a.c-tag):focus-visible{outline:2px solid var(--button-focus);outline-offset:3px;box-shadow:none}
body button:disabled{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none}
body .cs-pulse-dot{background:#87a992;box-shadow:none;animation:none}
body .float-cs-item:hover{background:var(--button-secondary-hover);border-color:var(--button-border);transform:none}
body .float-cs-item:hover .cs-arrow{color:#e5d3eb;transform:none}
body :is(.btn-ghostbtn,.prod-catalog-toggle,.seatmap-zoom-btn,.toggle-perks-table-btn) .ic{color:inherit;filter:none}

@media(max-width:860px){
  .ledger .ledger-head{grid-template-columns:minmax(0,1fr);gap:24px;padding:24px}
  .ledger .ledger-img-wrap{width:100%;max-width:420px;margin-inline:auto}
  .ledger .ledger-content h3{font-size:23px}
}
@media(max-width:540px){
  .ledger .ledger-head{padding:18px;gap:20px}
  .ledger .ledger-content h3{font-size:20px;line-height:1.45}
  .ledger .ledger-content p{font-size:12px;line-height:1.8}
  .ledger .ledger-badges-row{gap:6px;margin-top:16px}
  .ledger .brand-tag{font-size:10.5px;padding:5px 8px}
  .ledger .channel-bar{padding:14px 18px}
}

/* Keep the collection title on one line, sized to its own column. */
.ledger-content{container-type:inline-size}
body .ledger .ledger-content h3{
  font-size:clamp(10px,3.6cqi,24px);white-space:nowrap;
  text-wrap:nowrap;letter-spacing:-.025em;
}
/* Restore the seven-colour moving border on header ticket actions only. */
body .masthead button.btn-ticket{
  background:transparent;border:0;isolation:isolate;overflow:hidden;
  box-shadow:0 3px 10px rgba(0,0,0,.18);
}
body .masthead button.btn-ticket::before{
  content:"";position:absolute;inset:-300%;z-index:-2;
  background:var(--ticket-ring-gradient);
  animation:beamRotate 5s linear infinite;
}
body .masthead button.btn-ticket::after{
  content:"";position:absolute;inset:2px;z-index:-1;
  border-radius:12px;background:var(--button-primary);
  transition:background-color .18s ease;
}
body .masthead button.btn-ticket:hover::after{background:var(--button-primary-hover)}
@media(prefers-reduced-motion:reduce){
  html:not(.fx-explicit) body .masthead button.btn-ticket::before{animation:none}
}

#s-track > .track-intro{max-width:none;width:100%;font-size:clamp(11px,.95vw,13px);line-height:1.7;margin:0 0 20px;white-space:nowrap}
@media(max-width:860px){
  #s-track > .track-intro{font-size:12px;white-space:normal;text-wrap:pretty}
}

/* Bright event palette for the frame and fallback diagram; brand artwork stays unchanged. */
.seatmap-card{background:linear-gradient(145deg,#582a78,#351653);border:1px solid #b17ac5;box-shadow:0 8px 24px rgba(30,5,48,.22)}
.seatmap-card::before{display:none}
.seatmap-badge,.sm-modal-badge{color:#ffe2ac}
.seatmap-badge .pulse-dot,.sm-modal-badge .pulse-dot{background:#f0c783;box-shadow:none;animation:none}
.seatmap-viewport{background:#3d1c60;border-color:#9d6bbb;box-shadow:none}
.seatmap-svg > rect:first-of-type{fill:#3d1c60}
.seatmap-svg > rect:nth-of-type(2){display:none}
.seatmap-svg .sm-stage polygon{fill:url(#smStageGrad)}
.seatmap-svg .sm-zone path{fill:#683b8c;stroke:#d8a9ed;stroke-width:1.5}
.seatmap-svg .sm-zone text{fill:#fff7ff}
.seatmap-svg .sm-zone text:last-child{fill:#f0ddfa}
.seatmap-svg .sm-zone:hover{filter:none}
.seatmap-viewport:hover .seatmap-svg{transform:none}
.seatmap-hover-hint{background:#593078;border-color:#b78ccd;color:#fff2ff;box-shadow:none}
.seatmap-image{display:block;width:100%;height:auto;object-fit:contain;border-radius:12px}
.seatmap-modal-card{background:#421f62;border:1px solid #b17ac5;box-shadow:0 20px 50px rgba(0,0,0,.35)}
.seatmap-modal-header,.seatmap-modal-legend{background:#3d1c60;border-color:#9d6bbb}
.seatmap-modal-scroll{background:#32144f}
.seatmap-modal-inner svg,.seatmap-modal-inner .seatmap-image{box-shadow:none}
.seatmap-modal-legend[hidden]{display:none}
.seatmap-modal-legend .sm-leg-dot{background:#cf9ce5;box-shadow:none}

.seatmap-card .seatmap-venue{color:#efddf6}
.seatmap-svg #smStageGrad stop:nth-child(1){stop-color:#d96aaa}
.seatmap-svg #smStageGrad stop:nth-child(2){stop-color:#bd74ce}
.seatmap-svg #smStageGrad stop:nth-child(3){stop-color:#a178d7}
.seatmap-svg .sm-stage text:last-child{fill:#fff}
.seatmap-svg .sm-fanzone path{fill:#81458f}
.seatmap-svg .sm-vip1 path{fill:#754498}
.seatmap-svg .sm-vip2 path{fill:#683d91}
.seatmap-svg .sm-ga path{fill:#5d3687}

/* Lightweight background fireflies, behind content and never capturing input. */
.firefly-field{position:fixed;inset:0;z-index:1;overflow:hidden;pointer-events:none;contain:strict}
.firefly{position:absolute;left:var(--ff-x);top:var(--ff-y);width:var(--ff-size);height:var(--ff-size);border-radius:50%;background:#ffe9ac;box-shadow:0 0 6px 2px rgba(255,210,130,.25);opacity:0;animation:firefly-drift var(--ff-time) ease-in-out var(--ff-delay) infinite alternate;will-change:transform,opacity}
.firefly::after{content:"";position:absolute;inset:-4px;border-radius:50%;background:radial-gradient(circle,rgba(255,218,148,.23),transparent 70%)}
@keyframes firefly-drift{
  0%{transform:translate3d(0,20px,0);opacity:0}
  18%{opacity:.5}
  35%{transform:translate3d(var(--ff-dx),-40px,0);opacity:.2}
  55%{opacity:.75}
  75%{transform:translate3d(calc(var(--ff-dx) * -.5),-110px,0);opacity:.25}
  90%{opacity:.6}
  100%{transform:translate3d(var(--ff-dx),-160px,0);opacity:0}
}
.firefly:nth-child(1){--ff-x:38%;--ff-y:33%;--ff-size:3px;--ff-time:14s;--ff-delay:-1.7s;--ff-dx:-28px}
.firefly:nth-child(2){--ff-x:75%;--ff-y:56%;--ff-size:4px;--ff-time:15s;--ff-delay:-3.4s;--ff-dx:36px}
.firefly:nth-child(3){--ff-x:14%;--ff-y:79%;--ff-size:2px;--ff-time:16s;--ff-delay:-5.1s;--ff-dx:-44px}
.firefly:nth-child(4){--ff-x:51%;--ff-y:14%;--ff-size:3px;--ff-time:17s;--ff-delay:-6.8s;--ff-dx:52px}
.firefly:nth-child(5){--ff-x:88%;--ff-y:37%;--ff-size:4px;--ff-time:18s;--ff-delay:-8.5s;--ff-dx:-20px}
.firefly:nth-child(6){--ff-x:27%;--ff-y:60%;--ff-size:2px;--ff-time:19s;--ff-delay:-10.2s;--ff-dx:28px}
.firefly:nth-child(7){--ff-x:64%;--ff-y:83%;--ff-size:3px;--ff-time:20s;--ff-delay:-11.9s;--ff-dx:-36px}
.firefly:nth-child(8){--ff-x:3%;--ff-y:18%;--ff-size:4px;--ff-time:21s;--ff-delay:-13.6s;--ff-dx:44px}
.firefly:nth-child(9){--ff-x:40%;--ff-y:41%;--ff-size:2px;--ff-time:13s;--ff-delay:-15.3s;--ff-dx:-52px}
.firefly:nth-child(10){--ff-x:77%;--ff-y:64%;--ff-size:3px;--ff-time:14s;--ff-delay:-17.0s;--ff-dx:20px}
.firefly:nth-child(11){--ff-x:16%;--ff-y:87%;--ff-size:4px;--ff-time:15s;--ff-delay:-18.7s;--ff-dx:-28px}
.firefly:nth-child(12){--ff-x:53%;--ff-y:22%;--ff-size:2px;--ff-time:16s;--ff-delay:-20.4s;--ff-dx:36px}
.firefly:nth-child(13){--ff-x:90%;--ff-y:45%;--ff-size:3px;--ff-time:17s;--ff-delay:-22.1s;--ff-dx:-44px}
.firefly:nth-child(14){--ff-x:29%;--ff-y:68%;--ff-size:4px;--ff-time:18s;--ff-delay:-23.8s;--ff-dx:52px}
.firefly:nth-child(15){--ff-x:66%;--ff-y:91%;--ff-size:2px;--ff-time:19s;--ff-delay:-25.5s;--ff-dx:-20px}
.firefly:nth-child(16){--ff-x:5%;--ff-y:26%;--ff-size:3px;--ff-time:20s;--ff-delay:-27.2s;--ff-dx:28px}
.firefly:nth-child(17){--ff-x:42%;--ff-y:49%;--ff-size:4px;--ff-time:21s;--ff-delay:-28.9s;--ff-dx:-36px}
.firefly:nth-child(18){--ff-x:79%;--ff-y:72%;--ff-size:2px;--ff-time:13s;--ff-delay:-30.6s;--ff-dx:44px}
.firefly:nth-child(19){--ff-x:18%;--ff-y:95%;--ff-size:3px;--ff-time:14s;--ff-delay:-32.3s;--ff-dx:-52px}
.firefly:nth-child(20){--ff-x:55%;--ff-y:30%;--ff-size:4px;--ff-time:15s;--ff-delay:-34.0s;--ff-dx:20px}
.firefly:nth-child(21){--ff-x:92%;--ff-y:53%;--ff-size:2px;--ff-time:16s;--ff-delay:-35.7s;--ff-dx:-28px}
.firefly:nth-child(22){--ff-x:31%;--ff-y:76%;--ff-size:3px;--ff-time:17s;--ff-delay:-37.4s;--ff-dx:36px}
.firefly:nth-child(23){--ff-x:68%;--ff-y:11%;--ff-size:4px;--ff-time:18s;--ff-delay:-39.1s;--ff-dx:-44px}
.firefly:nth-child(24){--ff-x:7%;--ff-y:34%;--ff-size:2px;--ff-time:19s;--ff-delay:-40.8s;--ff-dx:52px}

html.fx-paused .firefly,html.fx-paused .firefly::after{animation-play-state:paused}
html.rm .firefly-field{display:none}
html.fx-low .firefly:nth-child(n+9){display:none}
@media(max-width:640px){.firefly:nth-child(n+13){display:none}}
@media(prefers-reduced-motion:reduce){html:not(.fx-explicit) .firefly-field{display:none}}

/* Desktop hero columns share the same height; the seatmap fills its column. */
.seatmap-desktop-hint{display:none}
@media(min-width:961px){
  .seatmap-viewport .seatmap-hover-hint{display:none}
  .seatmap-desktop-hint{display:inline-flex;align-self:center;align-items:center;justify-content:center;flex:none;margin:12px auto 0;padding:6px 12px;border:1px solid #b78ccd;border-radius:999px;background:#593078;color:#fff2ff;font:700 11px/1.5 var(--fb);cursor:pointer}
  .seatmap-desktop-hint:focus-visible{outline:2px solid #f3d6a6;outline-offset:3px}
  .hero-split{align-items:stretch;min-height:0}
  .hero-split .hero-img-col{align-items:stretch}
  .hero-split .seatmap-card{display:flex;flex-direction:column;flex:1;max-width:none;margin:0}
  .hero-split .seatmap-head{flex:none}
  .hero-split .seatmap-viewport{flex:1;min-height:360px}
  .hero-split .seatmap-viewport > .seatmap-svg,
  .hero-split .seatmap-viewport > .seatmap-image{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
}

:root{--ticket-ring-gradient:conic-gradient(#e26676,#e9a06b,#e5ce80,#87b78c,#77b8cf,#8c91d1,#be83bd,#e26676)}
@media(max-width:860px){
  body .masthead .panel-cta{display:flex;align-items:center;justify-content:center;min-height:44px}
}
html.fx-paused body .masthead button.btn-ticket::before{animation-play-state:paused}

/* Keep mobile border geometry fixed; animate only the gradient angle. */
@property --mobile-ticket-angle{syntax:'<angle>';initial-value:0deg;inherits:false}
@keyframes mobile-ticket-colours{to{--mobile-ticket-angle:360deg}}
@media(max-width:860px){
  body .hero-cta-row button.hero-cta-main,
  body .masthead button.btn-ticket{
    --mobile-ticket-fill:var(--button-primary);
    border:2px solid transparent;border-radius:14px;
    background:linear-gradient(var(--mobile-ticket-fill),var(--mobile-ticket-fill)) padding-box,
      conic-gradient(from var(--mobile-ticket-angle),#e26676,#e9a06b,#e5ce80,#87b78c,#77b8cf,#8c91d1,#be83bd,#e26676) border-box;
    animation:mobile-ticket-colours 5s linear infinite;
    transform:none;filter:none;transition:box-shadow .18s ease;
  }
  body .hero-cta-row button.hero-cta-main:hover,
  body .masthead button.btn-ticket:hover{
    --mobile-ticket-fill:var(--button-primary-hover);
    border-color:transparent;
    background:linear-gradient(var(--mobile-ticket-fill),var(--mobile-ticket-fill)) padding-box,
      conic-gradient(from var(--mobile-ticket-angle),#e26676,#e9a06b,#e5ce80,#87b78c,#77b8cf,#8c91d1,#be83bd,#e26676) border-box;
    transform:none;
  }
  body .hero-cta-row button.hero-cta-main::before,
  body .hero-cta-row button.hero-cta-main::after,
  body .masthead button.btn-ticket::before,
  body .masthead button.btn-ticket::after{content:none;display:none;animation:none}
  html.fx-paused body .hero-cta-row button.hero-cta-main,
  html.fx-paused body .masthead button.btn-ticket{animation-play-state:paused}
}
@media(max-width:860px) and (prefers-reduced-motion:reduce){
  html:not(.fx-explicit) body .hero-cta-row button.hero-cta-main,
  html:not(.fx-explicit) body .masthead button.btn-ticket{animation:none}
}

.tier-stock-badge[hidden]{display:none}

/* Temporarily hide the home product collection header. */
#s-landing .ledger-head{display:none !important}

/* Temporarily hide the entire home product collection panel. */
#s-landing .ledger.lp-box{display:none !important}

.prod-cat-note .purchase-channel-link{color:#f1d6a6;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;transition:color .18s ease}
.prod-cat-note .purchase-channel-link:hover{color:#fff}
.prod-cat-note .purchase-channel-link:focus-visible{outline:2px solid #d9bddf;outline-offset:3px;border-radius:3px}
.prod-cat-note button.purchase-channel-link{font:inherit;background:none;border:0;padding:0;cursor:pointer;text-align:inherit}
.purchase-dialog{width:min(680px,calc(100vw - 28px));max-width:none;max-height:calc(100dvh - 32px);box-sizing:border-box;margin:auto;padding:0;border:1px solid #715181;border-radius:20px;background:#241331;color:#fff9ff;box-shadow:0 24px 80px #0008;overflow:auto;font-family:var(--fb)}
.purchase-dialog::backdrop{background:rgba(9,2,20,.78);-webkit-backdrop-filter: blur(5px); backdrop-filter:blur(5px)}
.purchase-dialog-content{padding:26px}
.purchase-dialog-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.purchase-dialog-kicker{font-size:10px;color:#d5b0d9;letter-spacing:.12em}
.purchase-dialog h2{font-size:22px;line-height:1.5;margin:4px 0 0;letter-spacing:0}
.purchase-dialog-close{flex:none;width:40px;height:40px;border:1px solid #745780;border-radius:12px;background:#392343;color:#fff;font:28px/1 var(--fb);cursor:pointer}
.purchase-dialog-intro,.purchase-dialog-foot{font-size:12px;line-height:1.7;color:#d3c1db;margin:12px 0 0}
.purchase-channel-section{margin-top:20px}
.purchase-channel-section h3{font-size:15px;line-height:1.6;margin:0 0 9px;color:#f3d6e5}
.purchase-channel-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.purchase-channel-grid a{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 14px;border:1px solid #62466f;border-radius:12px;background:#33203f;color:#fff;text-decoration:none;min-width:0}
.purchase-channel-grid a:hover{background:#453050;border-color:#a480b4}
.purchase-channel-grid strong,.purchase-channel-grid small{display:block;line-height:1.6}
.purchase-channel-grid strong{font-size:13px;font-weight:600}
.purchase-channel-grid small{font-size:11px;color:#d0bcd8;overflow-wrap:anywhere}
.purchase-location-note{font-size:12px;line-height:1.7;padding:11px 13px;border:1px solid #846448;background:#3b2a2c;color:#f3dbb6;border-radius:10px;margin:10px 0 0}
.purchase-aeon p{font-size:12px;color:#d3c1db;margin:0;line-height:1.6}
.purchase-dialog-foot{padding-top:16px;border-top:1px solid #594164;margin-top:20px}
.purchase-dialog :is(a,button):focus-visible{outline:2px solid #f3d6a6;outline-offset:3px}
@media(max-width:540px){
 .purchase-dialog-content{padding:18px 16px}
 .purchase-dialog h2{font-size:18px}
 .purchase-channel-grid{grid-template-columns:1fr;gap:8px}
 .purchase-channel-grid a{padding:11px 12px}
 .purchase-channel-section{margin-top:16px}
}

#s-landing .carnival-journey-heading{display:block}

@media(max-width:640px){
  #s-landing .product-section-title em{display:block}
}

.hero-stock-example-note{font-size:10px;line-height:1.5;color:var(--muted);margin:10px 0 0;text-align:right;opacity:.8}

.tier-example-note{font-size:11px;color:var(--muted);font-weight:400}

/* Larger primary actions and the same continuous seven-colour support border. */
body .masthead button.btn-ticket{font-size:19.44px;padding:12.96px 28.51px}
body .hero-cta-row button.hero-cta-main{font-size:19.2px;padding:14.4px 21.6px}
body .float-cs-wrap .float-cs-toggle-btn{font-size:22.03px;padding:16.85px 28.51px 16.85px 22.03px;gap:12.96px;border:2px solid transparent;background:linear-gradient(var(--support-button-fill,var(--button-primary)),var(--support-button-fill,var(--button-primary))) padding-box,conic-gradient(from var(--mobile-ticket-angle),#e26676,#e9a06b,#e5ce80,#87b78c,#77b8cf,#8c91d1,#be83bd,#e26676) border-box;animation:mobile-ticket-colours 5s linear infinite;transform:none}
body .float-cs-wrap .float-cs-toggle-btn:hover{--support-button-fill:var(--button-primary-hover);transform:none}
body .float-cs-wrap .cs-btn-icon svg{width:28.51px;height:28.51px}
@media(min-width:861px){
 body .float-cs-wrap .float-cs-toggle-btn{font-size:19.83px;padding:15.17px 25.66px 15.17px 19.83px;gap:11.66px}
 body .float-cs-wrap .cs-btn-icon svg{width:25.66px;height:25.66px}
}
html.fx-paused body .float-cs-wrap .float-cs-toggle-btn{animation-play-state:paused}
@media(max-width:860px){
 body .masthead button.btn-ticket{font-size:19.44px;padding:11.66px 20.74px}
 body .mobile-cs-slot .float-cs-wrap .float-cs-toggle-btn{font-size:14.26px;height:57.02px;padding:10.37px;gap:5.18px}
 body .mobile-cs-slot .cs-btn-icon svg{width:20.74px;height:20.74px}
}
@media(prefers-reduced-motion:reduce){html:not(.fx-explicit) body .float-cs-wrap .float-cs-toggle-btn{animation:none}}

/* Alternating six-step journey: odd steps left, even steps right. */
#s-landing .flow.carnival-timeline{display:grid;grid-template-columns:minmax(0,1fr) 2px minmax(0,1fr);column-gap:32px;row-gap:10px;position:relative;left:auto;transform:none;width:100%;max-width:1000px;margin:24px auto 0;padding:0}
#s-landing .carnival-timeline::before{content:"";display:block;position:absolute;left:calc(50% - 1px);right:auto;top:26px;bottom:26px;width:2px;height:auto;background:#765685}
#s-landing .carnival-timeline .step{min-width:0;padding:14px 20px;border-color:#644372;container-type:normal;content-visibility:visible;contain-intrinsic-size:none;overflow:visible}
#s-landing .carnival-timeline .step:nth-child(odd){grid-column:1}
#s-landing .carnival-timeline .step:nth-child(even){grid-column:3}
#s-landing .carnival-timeline .step:nth-child(1){grid-row:1}
#s-landing .carnival-timeline .step:nth-child(2){grid-row:2}
#s-landing .carnival-timeline .step:nth-child(3){grid-row:3}
#s-landing .carnival-timeline .step:nth-child(4){grid-row:4}
#s-landing .carnival-timeline .step:nth-child(5){grid-row:5}
#s-landing .carnival-timeline .step:nth-child(6){grid-row:6}
#s-landing .carnival-timeline .step::before{display:none}
#s-landing .carnival-timeline .step:nth-child(even)::before{left:-40px;right:auto}
#s-landing .carnival-timeline .journey-dot-rings{display:block;position:absolute;width:14px;height:14px;right:-40px;top:26px;pointer-events:none;overflow:visible;z-index:2}
#s-landing .carnival-timeline .journey-dot-rings::before{content:"";position:absolute;inset:0;border-radius:50%;background:#e8c888;border:2px solid #2b1739;box-sizing:border-box;box-shadow:0 0 8px rgba(232,200,136,.45);z-index:1}
#s-landing .carnival-timeline .step:nth-child(even) .journey-dot-rings{left:-40px;right:auto}
.journey-dot-rings i{display:block;position:absolute;inset:0;border:1.5px solid #e8c888;border-radius:50%;box-sizing:border-box;background:transparent;box-shadow:0 0 4px rgba(232,200,136,.22);transform-origin:center;animation:journeyDotRipple 3s linear infinite;opacity:0;pointer-events:none}
.journey-dot-rings i:nth-child(1){animation-delay:0s}
.journey-dot-rings i:nth-child(2){animation-delay:-1s}
.journey-dot-rings i:nth-child(3){animation-delay:-2s}
@keyframes journeyDotRipple{0%{transform:scale(.9);opacity:.85}65%{opacity:.4}100%{transform:scale(3.6);opacity:0}}
html.fx-paused .journey-dot-rings i{animation-play-state:paused}
html.rm .journey-dot-rings i{display:none}
@media(prefers-reduced-motion:reduce){html:not(.fx-explicit) .journey-dot-rings i{display:none}}
#s-landing .carnival-timeline .step::after{content:"";position:absolute;right:-33px;top:32px;width:32px;height:2px;background:#765685}
#s-landing .carnival-timeline .step:nth-child(even)::after{left:-33px;right:auto}
#s-landing .carnival-timeline .step-index{font-size:11px;letter-spacing:.06em}
#s-landing .carnival-timeline .step h3{font-size:14px;font-weight:600;letter-spacing:0;line-height:1.5;white-space:normal;gap:7px;margin:7px 0 5px}
#s-landing .carnival-timeline .step .step-icon svg{width:16px;height:16px;flex:none}
#s-landing .carnival-timeline .step p{font-size:12px;line-height:1.6;letter-spacing:0;word-break:normal;overflow-wrap:normal}
#s-landing .carnival-timeline .journey-keep{white-space:nowrap}
@media(min-width:641px){
 #s-landing .carnival-timeline .step p{width:100%;max-width:none;text-wrap:wrap}
 #s-landing .carnival-timeline .step:nth-child(4){container-type:inline-size}
 #s-landing .carnival-timeline .step:nth-child(4) p{font-size:clamp(6px,3.35cqi,12px);white-space:nowrap;text-wrap:nowrap}
}
@media(max-width:640px){
 #s-landing .flow.carnival-timeline{grid-template-columns:minmax(0,1fr);gap:14px;padding-left:28px;box-sizing:border-box}
 #s-landing .carnival-timeline::before{left:7px;top:26px;bottom:26px}
 #s-landing .carnival-timeline .step:nth-child(n){grid-column:1;grid-row:auto;padding:12px 16px}
 #s-landing .carnival-timeline .step:nth-child(n)::before{left:-28px;right:auto;top:26px}
 #s-landing .carnival-timeline .step:nth-child(n) .journey-dot-rings{left:-28px;right:auto;top:26px}
 #s-landing .carnival-timeline .step:nth-child(n)::after{left:-21px;right:auto;width:20px;top:32px}
 #s-landing .carnival-timeline .step h3{font-size:12px}
 #s-landing .carnival-timeline .step p{font-size:12px}
 #s-landing .carnival-timeline .step:nth-child(-n+2){padding-inline:14px}
 #s-landing .carnival-timeline .step:nth-child(-n+2) p{font-size:11px;line-height:1.5;text-wrap:pretty}
 #s-landing .carnival-timeline .journey-desktop-break{display:none}
}

@media(max-width:640px){
  #s-landing .product-section-intro{font-size:14px;line-height:1.7;text-wrap:pretty}
  #s-landing .product-section-intro .prod-catalog-toggle{display:flex;width:fit-content;max-width:100%;margin:15px auto 0;font-size:15.84px;line-height:1.5;gap:8.64px;padding:8.64px 17.28px;box-sizing:border-box}
  #s-landing .product-section-intro .prod-catalog-toggle .ic{width:17.28px;height:17.28px}
}

#tier-blocks-wrap .tier-pick-card[hidden],#ticket-unavailable-message[hidden]{display:none !important}

/* Keep the full seating artwork visible in previews and the zoom dialog. */
#seatmap-viewport > .seatmap-image{object-fit:contain;object-position:center;border-radius:inherit}
.ticket-benefits-image-link{display:block;width:100%}
.ticket-benefits-image{display:block;width:100%;max-width:100%;height:auto}
.seatmap-blur-backdrop{display:none}
@media(min-width:961px){
  #seatmap-viewport{isolation:isolate}
  #seatmap-viewport > .seatmap-blur-backdrop{display:block;position:absolute;inset:-24px;width:calc(100% + 48px);height:calc(100% + 48px);max-width:none;object-fit:cover;object-position:center;filter:blur(18px);opacity:.65;pointer-events:none;z-index:0}
  #seatmap-viewport > .seatmap-image{object-fit:contain;object-position:center;z-index:1}
}
#seatmap-modal-inner > .seatmap-image{object-fit:contain;height:auto}
.seatmap-modal-image-crop{overflow:hidden;border-radius:12px}
.seatmap-modal-image-crop > .seatmap-image{width:100%;height:auto;margin-top:-10%;object-fit:contain;border-radius:0}

@media(max-width:640px){
  .hero-event-time > div{display:grid;grid-template-columns:max-content max-content;align-items:baseline;gap:3px 6px}
  .hero-event-time strong{grid-column:1 / -1}
  .hero-event-time strong,.hero-event-time .event-time,.hero-event-time .event-checkin{white-space:nowrap;line-height:1.5}
  .hero-event-time .event-time,.hero-event-time .event-checkin{font-size:10px}
  .hero-event-time .event-checkin{grid-column:auto}
}

/* Native popover stays above the scrolling benefits table and supports tap/Escape. */
.soundcheck-note{display:inline-block;vertical-align:baseline;white-space:normal}
.soundcheck-note-trigger{border:0;background:transparent;color:var(--gold);font:inherit;font-size:12px;padding:2px 6px;cursor:pointer;text-decoration:underline}
.soundcheck-note-trigger:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.soundcheck-note-popup[popover]{box-sizing:border-box;width:min(620px,calc(100vw - 32px));max-height:calc(100dvh - 48px);overflow:auto;padding:20px 24px;border:1px solid #af7dc3;border-radius:14px;background:#251133;color:#fff;font:400 14px/1.7 var(--fb);text-align:left;white-space:normal;box-shadow:0 14px 60px #0009;margin:auto}
.soundcheck-note-popup strong{font-size:15px;color:var(--gold)}
.soundcheck-note-popup ol{margin:12px 0 0;padding-left:22px;list-style:decimal}
.tier-grid .tier-perks .soundcheck-note-popup li,.soundcheck-note-popup li{display:list-item;white-space:normal;font-size:14px;line-height:1.7;margin:0 0 10px;padding:0;letter-spacing:0}
@media(max-width:640px){.soundcheck-note-popup[popover]{padding:16px;font-size:13px}.tier-grid .tier-perks .soundcheck-note-popup li{font-size:13px}}

/* Each purchase channel has its own horizontal, six-stop journey. */
.channel-journey{margin:24px 0 32px;min-width:0}
.channel-journey-title{margin:0 0 8px;color:var(--gold);font-size:20px;text-align:center}
.channel-journey-scroll{overflow-x:auto;max-width:100%;padding:42px 12px 16px;box-sizing:border-box;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:#c99564 #321640}
.channel-journey-scroll::-webkit-scrollbar{height:6px}
.channel-journey-scroll::-webkit-scrollbar-track{background:#321640;border-radius:99px}
.channel-journey-scroll::-webkit-scrollbar-thumb{background:linear-gradient(90deg,#a169b3,#e6bd76);border-radius:99px}
.channel-journey-scroll::-webkit-scrollbar-thumb:hover{background:#e6bd76}
.channel-journey-track{--journey-card-width:220px;--journey-gap:14px;display:grid;grid-template-columns:repeat(var(--journey-count,6),minmax(0,1fr));gap:var(--journey-gap);width:calc(var(--journey-count,6) * (var(--journey-card-width) + var(--journey-gap)) - var(--journey-gap));min-width:100%;list-style:none;padding:0;margin:0;position:relative;isolation:isolate}
.channel-journey-track::before{content:"";position:absolute;top:-11px;left:0;right:0;height:2px;background:linear-gradient(90deg,#e926a0,#b78be4,#f5b738);z-index:-1}
.channel-journey-step{position:relative;box-sizing:border-box;padding:16px 14px;border:1px solid #644372;border-radius:14px;background:linear-gradient(180deg,#25083fe6,#10051feF);scroll-snap-align:start;min-width:0}
.channel-journey-step h4{font-size:13px;line-height:1.5;color:#fff3d4;margin:8px 0;font-weight:700}
.channel-journey-step p{font-size:12px;line-height:1.7;color:var(--muted);margin:0;word-break:normal;overflow-wrap:normal}
.channel-journey-keep{white-space:nowrap}
.channel-journey-dot{position:absolute;top:-16px;left:26px;width:10px;height:10px;border:2px solid #ffe6a7;box-sizing:border-box;border-radius:50%;background:#f6ce83;box-shadow:0 0 7px #f5b73888}
.channel-journey-dot i{position:absolute;inset:0;border:1px solid #f5c66c;border-radius:50%;animation:journeyDotRipple 3s linear infinite;pointer-events:none}
.channel-journey-dot i:nth-child(2){animation-delay:-1s}.channel-journey-dot i:nth-child(3){animation-delay:-2s}
@media(max-width:640px){.channel-journey-title{font-size:17px}.channel-journey-track{--journey-card-width:250px;--journey-gap:14px}.channel-journey-step{padding:16px}.channel-journey-step h4{font-size:13px}}
@media(prefers-reduced-motion:reduce){.channel-journey-dot i{animation:none}}
@media(min-width:1200px){
 .channel-journey-track{--journey-gap:12px}
 .channel-journey-step{padding:14px 12px}
 .channel-journey-step h4{font-size:12px;min-height:54px}
 .channel-journey-step p{font-size:11.5px}
}

.channel-journey-title{max-width:1000px;margin-left:auto;margin-right:auto;line-height:1.6;font-size:clamp(16px,1.7vw,20px)}
.channel-journey-step h4{text-transform:uppercase}
.journey-retailer-line{display:block;white-space:normal}
@media(max-width:640px){.journey-retailer-line{display:block}}
.channel-journey-step p{overflow-wrap:break-word}

/* Increase the event-information heading by 8px on mobile. */
@media(max-width:860px){
  #s-landing .hero-primary-slogan{font-size:calc(clamp(5px,1.7vw,14px) + 8px);font-size:calc(clamp(5px,1.7cqi,14px) + 8px)}
}

@media(min-width:861px){
  #s-landing .hero-primary-slogan{font-size:calc(clamp(5px,.8vw,14px) + 7px);font-size:calc(clamp(5px,3.7cqi,14px) + 7px)}
}

/* Event information: time, venue, official sponsors in reading order. */
#s-landing .hero-chips-row{grid-template-columns:minmax(0,.7fr) minmax(0,1.4fr) minmax(0,1fr)}
#s-landing .hero-chips-row .hero-chip{min-width:0}
#s-landing .hero-chip-label{font-size:10px;font-weight:600;text-transform:none;letter-spacing:0;margin-bottom:3px}
#s-landing .hero-event-location strong{font-size:10px;letter-spacing:0;white-space:normal;line-height:1.5}
#s-landing .hero-event-location .hero-location-district{white-space:nowrap;overflow-wrap:normal;word-break:normal}
#s-landing .hero-event-sponsors>div{flex:1;min-width:0}
#s-landing .hero-event-sponsors .hero-sponsor-logos{margin:3px 0 0}
@media(min-width:861px){
 #s-landing .hero-chips-row{grid-template-columns:max-content max-content minmax(134px,1fr)}
 #s-landing .hero-event-location>div>span:last-child{font-size:10px;white-space:nowrap;overflow-wrap:normal;letter-spacing:-.02em}
 #s-landing .hero-event-sponsors{gap:5px;padding-inline:7px}
 #s-landing .hero-event-sponsors .hero-chip-label{font-size:9px;white-space:nowrap}
 #s-landing .hero-event-sponsors .hero-sponsor-logos{max-width:160px}
}
@media(max-width:640px){#s-landing .hero-chips-row{grid-template-columns:1fr}}

.consent-combined>.consent-single+.consent-single{margin-top:12px}


.catalog-product-copy .catalog-name-line{display:block;white-space:nowrap}
@media(max-width:640px){
 .catalog-brand-lfb .catalog-product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 10px}
 .catalog-brand-lfb .catalog-product-copy{max-width:none}
 .catalog-brand-lfb .catalog-product-copy h4{font-size:clamp(9px,2.5vw,11px)}
}

/* Keep form feedback reachable on short mobile and desktop screens. */
.ticket-email-note{margin:8px 0 0;font-size:12px;line-height:1.5;color:#e2d9f8}
.warn-popup-backdrop{overflow-y:auto;overscroll-behavior:contain}
.warn-popup-card{max-height:calc(100vh - 40px);max-height:calc(100dvh - 40px);overflow-y:auto;overscroll-behavior:contain}
.warn-popup-backdrop.is-open,.warn-popup-btn{pointer-events:auto}

/* AXE shower gel pairs use the same large/small presentation as LUX. */
.catalog-axe-shower .catalog-product-visual{max-width:190px;gap:8px}
.catalog-axe-shower .catalog-product-visual img{height:170px}
.catalog-axe-shower figure:nth-child(2) img{height:135px}
@media(max-width:640px){
 .catalog-axe-shower .catalog-product-visual{max-width:115px;gap:2px}
 .catalog-axe-shower .catalog-product-visual img{height:98px}
 .catalog-axe-shower figure:nth-child(2) img{height:78px}
}

/* Long terms sections must remain visible without waiting for reveal thresholds. */
.programme-terms .rv{opacity:1;transform:none;transition:none}

/* Full journey steps wrap into rows, with no hidden text or horizontal carousel. */
.channel-journey-scroll{overflow:visible;padding:16px 0;max-height:none}
.channel-journey-track{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;width:100%;min-width:0;align-items:stretch}
.channel-journey-track::before{display:none}
.channel-journey-step{height:auto;max-height:none;overflow:visible;padding:18px 16px}
.channel-journey-step h4{font-size:13px;line-height:1.55;min-height:0;margin:8px 0 12px;white-space:normal;overflow-wrap:break-word;word-break:normal}
.channel-journey-step p{font-size:12px;line-height:1.75;margin:0 0 10px;white-space:normal;overflow-wrap:break-word;word-break:normal;max-height:none;-webkit-line-clamp:unset}
.channel-journey-step p:last-child{margin-bottom:0}
.channel-journey-title{overflow-wrap:break-word;word-break:normal}
.channel-journey-keep{white-space:normal}
@media(max-width:1000px){.channel-journey-track{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.channel-journey-track{grid-template-columns:minmax(0,1fr);gap:14px}.channel-journey-step{padding:16px 14px}.channel-journey-step p{font-size:12px}.channel-journey-step h4{font-size:12px}.channel-journey-title{font-size:14px;line-height:1.6}}

.channel-journey-step h4{ text-wrap:balance }
.channel-journey-step p{ text-wrap:pretty }