/* GiveawayHub — Modern animated theme */
*,*:before,*:after{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:var(--font);color:#e6e9f2;background:#0b0d1a}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.container{max-width:1200px;margin:0 auto;padding:0 20px}
.narrow{max-width:640px}
.flex-between{display:flex;align-items:center;justify-content:space-between;gap:20px}
[data-theme="light"] body,body[data-theme="light"]{background:#f5f6fb;color:#12162a}
:root[data-theme="light"] {color-scheme: light}
:root[data-theme="dark"] {color-scheme: dark}

/* Header */
.site-header{position:sticky;top:0;z-index:50;background:rgba(11,13,26,.85);backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.08);padding:14px 0}
[data-theme="light"] .site-header{background:rgba(255,255,255,.85);border-color:rgba(0,0,0,.08)}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:20px;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.brand img{height:32px;width:auto}
.main-nav{display:flex;align-items:center;gap:20px;font-weight:500}
.main-nav a:hover{color:var(--c-primary)}
.btn-icon{background:none;border:1px solid rgba(255,255,255,.15);border-radius:10px;padding:6px 10px;cursor:pointer;color:inherit}

/* Loader */
#pageLoader{position:fixed;inset:0;background:#0b0d1a;display:flex;align-items:center;justify-content:center;z-index:9999;transition:opacity .5s}
#pageLoader.hidden{opacity:0;pointer-events:none}
.ldr{width:60px;height:60px;border-radius:50%;background:var(--grad);animation:pulse 1.2s infinite}
@keyframes pulse{0%,100%{transform:scale(.8);opacity:.6}50%{transform:scale(1.1);opacity:1}}
.loader-spin .ldr{border:4px solid rgba(255,255,255,.15);border-top-color:var(--c-primary);background:none;animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* Background animation */
body.bg-particles::before{content:'';position:fixed;inset:0;z-index:-1;background:radial-gradient(circle at 20% 20%,rgba(124,58,237,.25),transparent 40%),radial-gradient(circle at 80% 60%,rgba(236,72,153,.25),transparent 45%),radial-gradient(circle at 40% 90%,rgba(6,182,212,.2),transparent 40%);animation:bgshift 20s ease-in-out infinite alternate}
@keyframes bgshift{to{filter:hue-rotate(30deg)}}
body.bg-gradient::before{content:'';position:fixed;inset:0;z-index:-1;background:var(--grad);opacity:.15}

/* Flash */
.flash{max-width:900px;margin:14px auto;padding:12px 18px;border-radius:12px;font-weight:500}
.flash-success{background:rgba(16,185,129,.15);border:1px solid #10b981;color:#10b981}
.flash-error{background:rgba(239,68,68,.15);border:1px solid #ef4444;color:#ef4444}
.flash-info{background:rgba(59,130,246,.15);border:1px solid #3b82f6;color:#3b82f6}

/* Hero */
.hero{position:relative;padding:80px 0 60px;text-align:center;overflow:hidden}
.hero-title{font-size:clamp(28px,5vw,52px);font-weight:800;margin:0 0 14px;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;animation:fadeUp .8s}
.hero-sub{font-size:18px;opacity:.85;max-width:640px;margin:0 auto 26px;animation:fadeUp 1s}
@keyframes fadeUp{from{opacity:0;transform:translateY(20px)}}
.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 22px;border-radius:12px;font-weight:600;cursor:pointer;border:none;transition:transform .2s,box-shadow .2s}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 25px rgba(124,58,237,.35)}
.btn-primary,.btn-hero{background:var(--grad);color:#fff}
.btn-lg{padding:14px 26px;font-size:16px;width:100%;justify-content:center}
.btn-sm{padding:6px 12px;font-size:13px;background:rgba(255,255,255,.08);border-radius:8px;display:inline-block;margin-top:6px}

/* Sections */
.sec{padding:60px 0}
.sec-alt{background:rgba(255,255,255,.03)}
.sec-title{font-size:28px;font-weight:700;margin:0 0 30px;text-align:center}

/* Cards */
.gcard-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:22px}
.gcard{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:18px;overflow:hidden;transition:transform .3s,box-shadow .3s;display:block}
.gcard:hover{transform:translateY(-6px);box-shadow:0 20px 40px rgba(124,58,237,.25);border-color:var(--c-primary)}
.gcard-thumb{aspect-ratio:16/9;background-size:cover;background-position:center;background-color:rgba(255,255,255,.08);position:relative}
.gcard-status{position:absolute;top:10px;right:10px;padding:4px 10px;border-radius:20px;font-size:11px;font-weight:700;background:#000}
.status-live{background:#10b981;color:#fff;animation:blink 1.5s infinite}
@keyframes blink{50%{opacity:.6}}
.status-upcoming{background:#f59e0b;color:#000}
.status-ended{background:#6b7280;color:#fff}
.gcard-body{padding:16px}
.gcard-body h3{margin:0 0 6px;font-size:17px}
.gcard-prize{opacity:.85;font-size:14px;margin:0 0 10px}
.gcard-count{font-family:'JetBrains Mono',monospace;font-size:13px;color:var(--c-accent);font-weight:600}
[data-theme="light"] .gcard{background:#fff;border-color:rgba(0,0,0,.08)}

/* Stats */
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:20px;text-align:center}
.stat{padding:30px 20px;background:var(--grad);border-radius:20px;color:#fff}
.stat-n{font-size:36px;font-weight:800;margin-bottom:6px}

/* Winners */
.winner-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}
.wcard{display:flex;gap:12px;padding:14px;background:rgba(255,255,255,.05);border-radius:14px;align-items:center;border:1px solid rgba(255,255,255,.08)}
[data-theme="light"] .wcard{background:#fff}
.wavatar{width:50px;height:50px;border-radius:50%;background:var(--grad);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:22px}
.wcard .muted{font-size:12px;opacity:.7}
.wcard .prize{font-size:13px;color:var(--c-accent);margin-top:4px}
.wthumb{width:100%;height:120px;object-fit:cover;border-radius:10px}

/* YouTube */
.yt-wrap{position:relative;padding-top:56.25%;border-radius:16px;overflow:hidden;max-width:800px;margin:0 auto}
.yt-wrap iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* FAQ */
.faq-list{max-width:720px;margin:0 auto;display:flex;flex-direction:column;gap:10px}
.faq{background:rgba(255,255,255,.05);border-radius:12px;padding:14px 18px;border:1px solid rgba(255,255,255,.08)}
[data-theme="light"] .faq{background:#fff}
.faq summary{cursor:pointer;font-weight:600}

/* Sponsors */
.sponsor-grid{display:flex;flex-wrap:wrap;gap:20px;justify-content:center}
.sponsor{padding:14px 20px;background:rgba(255,255,255,.05);border-radius:12px;display:flex;align-items:center;gap:10px}

/* Two-col detail */
.two-col{display:grid;grid-template-columns:1.4fr 1fr;gap:24px;padding:30px 20px}
@media(max-width:900px){.two-col{grid-template-columns:1fr}}
.card{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:24px;margin-bottom:20px}
[data-theme="light"] .card{background:#fff;border-color:rgba(0,0,0,.08)}
.card h3{margin:0 0 14px}

/* Giveaway hero */
.giveaway-hero{padding:80px 0;color:#fff;background-size:cover;background-position:center;text-align:center}
.giveaway-hero h1{font-size:clamp(24px,4vw,42px);margin:10px 0}
.prize-big{font-size:20px;margin:0 0 20px}
.badge{padding:5px 14px;border-radius:20px;font-weight:700;font-size:12px}
.countdown-big{font-size:24px;font-weight:700;color:#fbbf24;font-family:'JetBrains Mono',monospace;margin:14px 0}

/* Forms */
label{display:block;margin:12px 0 4px;font-weight:500}
input[type=text],input[type=email],input[type=tel],input:not([type]),input[type=password],input[type=number],input[type=datetime-local],input[type=date],input[type=url],select,textarea{width:100%;padding:11px 14px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:10px;color:inherit;font-family:inherit;font-size:14px;margin-top:4px}
[data-theme="light"] input,[data-theme="light"] textarea,[data-theme="light"] select{background:#f5f6fb;border-color:#dfe1ec;color:#12162a}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--c-primary)}
.entry-card{position:sticky;top:80px}

/* Tasks */
.task-list{display:flex;flex-direction:column;gap:10px;margin-bottom:16px}
.task-item{padding:12px 14px;background:rgba(255,255,255,.04);border-radius:10px;border:1px solid rgba(255,255,255,.08)}
.task-head{display:flex;align-items:center;gap:10px;cursor:pointer;font-weight:400}
.task-type{margin-left:auto;font-size:11px;padding:2px 8px;background:var(--c-primary);border-radius:12px;color:#fff}
.task-item p{margin:6px 0 0;font-size:13px;opacity:.8}

/* Quiz */
.quiz-list{display:flex;flex-direction:column;gap:14px;margin-bottom:16px}
.quiz-q{padding:12px;background:rgba(255,255,255,.04);border-radius:10px;border:1px solid rgba(255,255,255,.08)}
.opt{display:block;padding:6px 0;cursor:pointer;font-weight:400}

/* Footer */
.site-footer{background:#080a15;color:#a3aac2;padding:50px 0 20px;margin-top:60px;border-top:1px solid rgba(255,255,255,.06)}
[data-theme="light"] .site-footer{background:#12162a;color:#a3aac2}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:30px;margin-bottom:30px}
@media(max-width:700px){.foot-grid{grid-template-columns:1fr}}
.site-footer h4{margin:0 0 10px;color:#fff}
.site-footer h5{margin:0 0 10px;color:#fff}
.site-footer a{display:block;padding:4px 0}
.foot-bottom{border-top:1px solid rgba(255,255,255,.08);padding-top:20px;text-align:center;font-size:13px}

.empty{text-align:center;padding:40px;opacity:.6}
.muted{opacity:.7;font-size:13px}

/* ===== v4 Professional polish (both themes) ===== */
:root{
  --c-primary:#7c3aed; --c-primary-2:#a855f7; --c-accent:#06b6d4;
  --c-gold:#fbbf24; --c-success:#10b981; --c-danger:#ef4444;
  --grad:linear-gradient(135deg,#7c3aed 0%,#ec4899 50%,#06b6d4 100%);
  --grad-gold:linear-gradient(135deg,#fbbf24,#f59e0b);
  --shadow-lg:0 20px 60px -15px rgba(124,58,237,.4);
  --radius:16px; --font:'Poppins','Hind Siliguri',system-ui,sans-serif;
}
[data-theme="light"]{--shadow-lg:0 15px 45px -12px rgba(124,58,237,.25)}

/* Smoother card design */
.card,.gcard,.wcard,.faq{border-radius:var(--radius)!important;transition:all .35s cubic-bezier(.4,0,.2,1)}
.gcard{background:rgba(255,255,255,.03);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.08);overflow:hidden;position:relative}
.gcard::before{content:'';position:absolute;inset:0;background:var(--grad);opacity:0;transition:opacity .35s;pointer-events:none;mix-blend-mode:overlay}
.gcard:hover::before{opacity:.08}
.gcard:hover{transform:translateY(-8px) scale(1.01);box-shadow:var(--shadow-lg);border-color:var(--c-primary)}

/* Light theme professional palette */
[data-theme="light"] body{background:linear-gradient(180deg,#fafbff 0%,#f0f2fb 100%)}
[data-theme="light"] .gcard{background:#fff;border:1px solid #e8eaf5;box-shadow:0 4px 14px rgba(20,25,60,.06)}
[data-theme="light"] .gcard:hover{border-color:var(--c-primary);box-shadow:0 20px 50px rgba(124,58,237,.18)}
[data-theme="light"] .card{background:#fff;border:1px solid #e8eaf5;box-shadow:0 2px 12px rgba(20,25,60,.05)}
[data-theme="light"] .wcard{background:#fff;box-shadow:0 4px 14px rgba(20,25,60,.06)}
[data-theme="light"] .site-header{backdrop-filter:blur(20px) saturate(180%);box-shadow:0 1px 0 rgba(0,0,0,.05)}
[data-theme="light"] .main-nav a{color:#3b4269}
[data-theme="light"] .main-nav a:hover{color:var(--c-primary)}
[data-theme="light"] .task-item,[data-theme="light"] .quiz-q{background:#f7f8fd;border:1px solid #e8eaf5}
[data-theme="light"] .btn{background:#eef0fa;color:#12162a}
[data-theme="light"] .badge{color:#fff}

/* Status badges — richer */
.badge{padding:5px 12px;border-radius:20px;font-size:11px;font-weight:700;letter-spacing:.5px;display:inline-block}
.badge.status-live{background:linear-gradient(135deg,#10b981,#059669);color:#fff;animation:pulseBadge 2s infinite}
.badge.status-upcoming{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff}
.badge.status-ended{background:linear-gradient(135deg,#6b7280,#4b5563);color:#fff}
@keyframes pulseBadge{0%,100%{box-shadow:0 0 0 0 rgba(16,185,129,.6)}50%{box-shadow:0 0 0 10px rgba(16,185,129,0)}}

/* Delivery info banner */
.delivery-info{margin:16px 0;padding:14px 18px;border-radius:12px;background:linear-gradient(135deg,rgba(6,182,212,.15),rgba(124,58,237,.12));border-left:4px solid var(--c-accent);font-size:15px}
.delivery-info.success{background:linear-gradient(135deg,rgba(16,185,129,.15),rgba(6,182,212,.1));border-left-color:var(--c-success)}
[data-theme="light"] .delivery-info{background:linear-gradient(135deg,#e0f7fa,#f3e8ff)}
[data-theme="light"] .delivery-info.success{background:linear-gradient(135deg,#d1fae5,#e0f7fa)}

/* Inline winner list */
.winner-list-inline{display:grid;gap:10px}
.winner-row{padding:12px 16px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);display:flex;gap:12px;align-items:center;transition:transform .2s}
.winner-row.win{background:linear-gradient(90deg,rgba(251,191,36,.18),rgba(236,72,153,.08));border-color:rgba(251,191,36,.4)}
.winner-row.wait{background:linear-gradient(90deg,rgba(96,165,250,.14),transparent);border-color:rgba(96,165,250,.3)}
.winner-row:hover{transform:translateX(4px)}
.winner-row .wrank{font-weight:700;min-width:120px;color:var(--c-gold)}
.winner-row.wait .wrank{color:#60a5fa}
[data-theme="light"] .winner-row{background:#f7f8fd;border-color:#e8eaf5;color:#12162a}
[data-theme="light"] .winner-row.win{background:linear-gradient(90deg,#fef3c7,#fce7f3)}
[data-theme="light"] .winner-row.wait{background:linear-gradient(90deg,#dbeafe,#eef2ff)}
[data-theme="light"] .winner-row .muted{color:#6b7280}

/* Status cards (ended/upcoming) */
.status-card{text-align:center;padding:32px 20px}
.status-card.ended{background:linear-gradient(135deg,rgba(107,114,128,.15),rgba(75,85,99,.08))}
.status-card.upcoming{background:linear-gradient(135deg,rgba(245,158,11,.18),rgba(217,119,6,.08))}
.status-card h3{font-size:22px;margin:0 0 10px}

/* Entry card — extra polish */
.entry-card{position:sticky;top:80px}
.btn-lg{padding:14px 24px;font-size:16px;font-weight:700;border-radius:14px;width:100%;margin-top:16px;box-shadow:0 8px 24px rgba(124,58,237,.4);transition:all .3s}
.btn-lg:hover{transform:translateY(-2px);box-shadow:0 12px 32px rgba(124,58,237,.55)}

/* Hero countdown professional */
.countdown-big{display:flex;gap:12px;justify-content:center;margin:20px 0;flex-wrap:wrap}
.countdown-big span{background:rgba(255,255,255,.15);backdrop-filter:blur(10px);padding:12px 18px;border-radius:12px;font-family:'JetBrains Mono',monospace;font-weight:700;font-size:22px;min-width:70px;border:1px solid rgba(255,255,255,.2)}

/* Fade animations */
@keyframes fadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.gcard,.card{animation:fadeUp .5s ease both}

.muted{opacity:.7;font-size:13px}

/* ============================================================
   V5 — PREMIUM UI, ANIMATIONS, TOASTS, RECEIPT & TRACK POLISH
   ============================================================ */
:root{
  --brand-1:#7c3aed; --brand-2:#ec4899; --brand-3:#f59e0b;
  --grad-main:linear-gradient(135deg,#7c3aed 0%,#ec4899 50%,#f59e0b 100%);
  --grad-cool:linear-gradient(135deg,#0ea5e9,#7c3aed);
  --glass-bg:rgba(255,255,255,.65);
  --glass-brd:rgba(255,255,255,.35);
  --shadow-xl:0 30px 80px -20px rgba(124,58,237,.35);
}
.dark{
  --glass-bg:rgba(30,20,60,.55);
  --glass-brd:rgba(255,255,255,.08);
}
html{scroll-behavior:smooth}
body{background:linear-gradient(180deg,#faf7ff 0%,#fdf2f8 100%);min-height:100vh}
.dark body{background:radial-gradient(ellipse at top,#1e1b4b 0%,#0b0722 60%,#050214 100%)}

/* animated blob background */
body::before{content:"";position:fixed;inset:-20% -20% auto auto;width:600px;height:600px;
  background:radial-gradient(closest-side,rgba(124,58,237,.25),transparent);filter:blur(60px);z-index:-1;animation:float1 18s ease-in-out infinite}
body::after{content:"";position:fixed;inset:auto auto -20% -20%;width:520px;height:520px;
  background:radial-gradient(closest-side,rgba(236,72,153,.22),transparent);filter:blur(60px);z-index:-1;animation:float2 22s ease-in-out infinite}
@keyframes float1{50%{transform:translate(-40px,60px) scale(1.1)}}
@keyframes float2{50%{transform:translate(40px,-60px) scale(1.15)}}

/* GLASS card */
.glass{background:var(--glass-bg);backdrop-filter:blur(18px) saturate(160%);
  -webkit-backdrop-filter:blur(18px) saturate(160%);
  border:1px solid var(--glass-brd);border-radius:20px;box-shadow:var(--shadow-xl)}

/* BUTTONS revamp */
.btn{position:relative;overflow:hidden;transition:transform .18s ease,box-shadow .2s ease}
.btn::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent,rgba(255,255,255,.35),transparent);
  transform:translateX(-120%);transition:transform .6s}
.btn:hover{transform:translateY(-2px);box-shadow:0 12px 30px -8px rgba(124,58,237,.35)}
.btn:hover::after{transform:translateX(120%)}
.btn-primary{background:var(--grad-main);color:#fff;border:0}
.btn-outline{background:transparent;border:2px solid var(--brand-1);color:var(--brand-1)}
.btn-ghost{background:transparent;color:inherit;border:1px solid rgba(120,80,200,.25)}
.btn-lg{padding:14px 26px;font-size:15px;font-weight:700;border-radius:14px}
.pulse-btn{animation:pulseBtn 1.4s ease-in-out infinite}
@keyframes pulseBtn{50%{box-shadow:0 0 0 12px rgba(236,72,153,.15)}}

/* Giveaway CARD polish (light+dark harmony) */
.giveaway-card,.g-card,.card{transition:transform .3s,box-shadow .3s}
.giveaway-card:hover,.g-card:hover{transform:translateY(-6px)}
.g-thumb{position:relative;overflow:hidden;border-radius:16px 16px 0 0}
.g-thumb::before{content:"";position:absolute;inset:0;background:var(--grad-main);opacity:0;transition:opacity .3s}
.g-card:hover .g-thumb::before{opacity:.15}
.g-card{border-radius:18px;overflow:hidden}
.badge-live{background:linear-gradient(135deg,#10b981,#059669);color:#fff;padding:4px 10px;border-radius:20px;
  font-size:11px;font-weight:700;display:inline-flex;gap:6px;align-items:center}
.badge-live::before{content:"";width:8px;height:8px;background:#fff;border-radius:50%;animation:pulseDot 1.2s ease-in-out infinite}
@keyframes pulseDot{50%{opacity:.3;transform:scale(1.5)}}

/* HERO enhancement */
.hero{background:var(--grad-main);position:relative;overflow:hidden;border-radius:0 0 32px 32px;padding:60px 20px}
.hero::before{content:"";position:absolute;inset:0;background:
  radial-gradient(circle at 20% 30%,rgba(255,255,255,.2),transparent 40%),
  radial-gradient(circle at 80% 70%,rgba(255,255,255,.15),transparent 40%)}
.hero h1{color:#fff;font-size:clamp(28px,5vw,54px);font-weight:800;text-shadow:0 4px 30px rgba(0,0,0,.2)}
.hero p{color:rgba(255,255,255,.9)}

/* Section titles */
.section-title{font-size:clamp(20px,3vw,32px);font-weight:800;margin:24px 0 20px;
  background:var(--grad-main);-webkit-background-clip:text;background-clip:text;color:transparent;display:inline-block}
.page-title{font-size:clamp(24px,4vw,36px);font-weight:800;text-align:center;margin:0 0 24px}

/* TOASTS / FLASH */
.flash-stack{position:fixed;top:20px;right:20px;z-index:9999;display:flex;flex-direction:column;gap:10px;max-width:360px}
.toast{padding:14px 18px;border-radius:14px;color:#fff;font-weight:600;font-size:14px;
  box-shadow:0 15px 40px rgba(0,0,0,.25);animation:toastIn .4s cubic-bezier(.2,.9,.3,1.4);
  display:flex;gap:10px;align-items:flex-start;position:relative;overflow:hidden}
.toast.success{background:linear-gradient(135deg,#10b981,#059669)}
.toast.error{background:linear-gradient(135deg,#ef4444,#b91c1c)}
.toast.info{background:linear-gradient(135deg,#3b82f6,#1e40af)}
.toast.warning{background:linear-gradient(135deg,#f59e0b,#b45309)}
.toast::after{content:"";position:absolute;left:0;bottom:0;height:3px;background:rgba(255,255,255,.55);width:100%;
  animation:toastBar 4.5s linear forwards;transform-origin:left}
@keyframes toastIn{from{transform:translateX(120%);opacity:0}to{transform:none;opacity:1}}
@keyframes toastBar{to{transform:scaleX(0)}}
.toast.hide{animation:toastOut .35s forwards}
@keyframes toastOut{to{transform:translateX(120%);opacity:0}}

/* Animate-in helpers */
.animate-in{animation:aIn .5s cubic-bezier(.2,.9,.3,1.2) both}
@keyframes aIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s,transform .7s}
.reveal.on{opacity:1;transform:none}

/* RECEIPT card */
.receipt-card{background:#fff;color:#0f172a;border-radius:24px;overflow:hidden;box-shadow:var(--shadow-xl);position:relative}
.dark .receipt-card{background:#141826;color:#f1f5ff}
.receipt-header{background:var(--grad-main);color:#fff;padding:22px 26px;display:flex;justify-content:space-between;align-items:center}
.receipt-brand{font-size:20px;font-weight:800}
.receipt-tag{font-size:12px;opacity:.9;letter-spacing:1px;text-transform:uppercase}
.receipt-title{text-align:center;padding:26px 24px 6px}
.receipt-title h1{margin:8px 0 4px;font-size:24px}
.badge-ring{width:64px;height:64px;border-radius:50%;background:var(--grad-main);color:#fff;font-size:32px;
  display:flex;align-items:center;justify-content:center;margin:0 auto;box-shadow:0 12px 30px rgba(124,58,237,.4);
  animation:ringPulse 1.6s ease-out}
@keyframes ringPulse{0%{transform:scale(0);opacity:0}70%{transform:scale(1.15)}100%{transform:scale(1);opacity:1}}
.receipt-body{display:grid;grid-template-columns:1fr 240px;gap:22px;padding:20px 26px}
@media(max-width:640px){.receipt-body{grid-template-columns:1fr}}
.rc-col{display:flex;flex-direction:column;gap:8px}
.rc-row{display:flex;justify-content:space-between;padding:10px 14px;background:rgba(124,58,237,.06);border-radius:10px;font-size:14px}
.dark .rc-row{background:rgba(255,255,255,.04)}
.rc-row.alert-row{background:linear-gradient(135deg,rgba(245,158,11,.15),rgba(236,72,153,.1));font-weight:600}
.rc-row.alert-row.ok{background:linear-gradient(135deg,rgba(16,185,129,.15),rgba(6,182,212,.1))}
.rc-qr{text-align:center;padding:16px;background:#f8fafc;border-radius:14px;border:2px dashed rgba(124,58,237,.3)}
.dark .rc-qr{background:rgba(255,255,255,.03)}
.rc-qr img{border-radius:10px;background:#fff;padding:4px}
.rc-qr-label{font-size:12px;opacity:.7;margin-top:8px}
.rc-qr-code{font-size:12px;letter-spacing:1px;margin-top:4px;color:var(--brand-1);font-weight:700}
.mono{font-family:'Courier New',monospace;letter-spacing:1px}
.receipt-footer{background:rgba(124,58,237,.06);padding:14px 24px;display:flex;justify-content:space-between;font-size:12px;opacity:.8}
.dark .receipt-footer{background:rgba(255,255,255,.04)}
.receipt-actions{display:flex;gap:10px;justify-content:center;margin-top:20px;flex-wrap:wrap}
@media print{.receipt-actions,.flash-stack,header,footer,.hero{display:none!important}body::before,body::after{display:none}}

/* ============ RECEIPT v2 — Premium mobile-first ============ */
.rcpt-v2{background:#fff;color:#0f172a;border-radius:26px;overflow:hidden;box-shadow:0 30px 80px -20px rgba(15,23,42,.25),0 0 0 1px rgba(255,255,255,.5) inset;position:relative;max-width:520px;margin:0 auto}
.dark .rcpt-v2{background:linear-gradient(180deg,#161a2b 0%,#0f1220 100%);color:#f1f5ff;box-shadow:0 30px 80px -20px rgba(0,0,0,.6),0 0 0 1px rgba(255,255,255,.06) inset}
.rcpt-hero{position:relative;background:var(--grad-main,linear-gradient(135deg,#06b6d4 0%,#2563eb 50%,#fbbf24 100%));color:#fff;padding:30px 22px 34px;text-align:center;overflow:hidden}
.rcpt-hero::before{content:"";position:absolute;inset:-40% -20% auto -20%;height:220%;background:radial-gradient(ellipse at top,rgba(255,255,255,.35),transparent 60%);pointer-events:none}
.rcpt-confetti{position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(circle,#fff 1.5px,transparent 2px),radial-gradient(circle,#fde68a 1.5px,transparent 2px);background-size:40px 40px,60px 60px;background-position:0 0,20px 20px;opacity:.18;animation:rcptDrift 12s linear infinite}
@keyframes rcptDrift{to{background-position:40px 60px,60px 80px}}
.rcpt-brand{position:relative;font-size:13px;letter-spacing:1.5px;text-transform:uppercase;opacity:.95;font-weight:700;margin-bottom:14px}
.rcpt-check{position:relative;width:88px;height:88px;margin:0 auto 14px;border-radius:50%;background:rgba(255,255,255,.14);display:grid;place-items:center;backdrop-filter:blur(8px);box-shadow:0 16px 40px rgba(0,0,0,.2),0 0 0 6px rgba(255,255,255,.08);animation:rcptPop .7s cubic-bezier(.34,1.56,.64,1)}
.rcpt-check svg path{stroke-dasharray:60;stroke-dashoffset:60;animation:rcptTick .6s .3s ease-out forwards}
@keyframes rcptPop{0%{transform:scale(0);opacity:0}70%{transform:scale(1.1)}100%{transform:scale(1);opacity:1}}
@keyframes rcptTick{to{stroke-dashoffset:0}}
.rcpt-title{position:relative;margin:6px 0 4px;font-size:22px;font-weight:800;line-height:1.3}
.rcpt-sub{position:relative;margin:0;font-size:13px;opacity:.92}
.rcpt-event{position:relative;margin-top:12px;display:inline-block;padding:8px 16px;border-radius:999px;background:rgba(0,0,0,.22);font-size:13px;font-weight:600;backdrop-filter:blur(6px);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.rcpt-qr-wrap{padding:22px 20px 8px;display:flex;flex-direction:column;align-items:center;gap:12px;position:relative}
.rcpt-qr-wrap::before,.rcpt-qr-wrap::after{content:"";position:absolute;top:-14px;width:28px;height:28px;border-radius:50%;background:var(--bg,#f6f7fb)}
.dark .rcpt-qr-wrap::before,.dark .rcpt-qr-wrap::after{background:#0f1220}
.rcpt-qr-wrap::before{left:-14px}
.rcpt-qr-wrap::after{right:-14px}
.rcpt-qr-card{position:relative;padding:14px;background:#fff;border-radius:18px;box-shadow:0 12px 30px -10px rgba(15,23,42,.2);display:grid;place-items:center}
.rcpt-qr-card img{display:block;border-radius:8px;width:min(240px,68vw);height:auto}
.rcpt-qr-corner{position:absolute;width:18px;height:18px;border:3px solid var(--brand-1,#2563eb)}
.rcpt-qr-corner.tl{top:6px;left:6px;border-right:none;border-bottom:none;border-top-left-radius:8px}
.rcpt-qr-corner.tr{top:6px;right:6px;border-left:none;border-bottom:none;border-top-right-radius:8px}
.rcpt-qr-corner.bl{bottom:6px;left:6px;border-right:none;border-top:none;border-bottom-left-radius:8px}
.rcpt-qr-corner.br{bottom:6px;right:6px;border-left:none;border-top:none;border-bottom-right-radius:8px}
.rcpt-code-block{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:center;background:linear-gradient(135deg,rgba(37,99,235,.08),rgba(6,182,212,.08));border:1px dashed rgba(37,99,235,.35);padding:10px 14px;border-radius:12px;width:100%;max-width:340px}
.dark .rcpt-code-block{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.15)}
.rcpt-code-label{font-size:11px;text-transform:uppercase;letter-spacing:1.2px;opacity:.7;font-weight:700}
.rcpt-code{font-family:'Courier New',monospace;font-size:18px;font-weight:800;color:var(--brand-1,#2563eb);letter-spacing:2px}
.dark .rcpt-code{color:#7dd3fc}
.rcpt-copy{border:0;background:var(--brand-1,#2563eb);color:#fff;font-size:12px;font-weight:700;padding:6px 12px;border-radius:8px;cursor:pointer;transition:transform .15s}
.rcpt-copy:hover{transform:translateY(-1px)}
.rcpt-qr-hint{font-size:12px;opacity:.75}

.rcpt-details{padding:8px 18px 16px;display:flex;flex-direction:column;gap:8px}
.rcpt-row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 14px;background:rgba(15,23,42,.04);border-radius:12px;font-size:14px}
.rcpt-row span{opacity:.72;font-weight:500}
.rcpt-row b{font-weight:700;text-align:right}
.dark .rcpt-row{background:rgba(255,255,255,.04)}

.rcpt-note{margin:6px 18px 14px;padding:12px 14px;border-radius:12px;font-size:13px;font-weight:600;text-align:center}
.rcpt-note.warn{background:linear-gradient(135deg,rgba(245,158,11,.18),rgba(236,72,153,.12));color:#92400e}
.dark .rcpt-note.warn{color:#fbbf24}
.rcpt-note.ok{background:linear-gradient(135deg,rgba(16,185,129,.18),rgba(6,182,212,.12));color:#065f46}
.dark .rcpt-note.ok{color:#34d399}

.rcpt-footer{background:rgba(15,23,42,.05);padding:14px 22px;display:flex;justify-content:space-between;align-items:center;font-size:12px;opacity:.85;font-weight:600}
.dark .rcpt-footer{background:rgba(255,255,255,.04)}

@media(max-width:420px){
  .rcpt-hero{padding:24px 16px 28px}
  .rcpt-title{font-size:19px}
  .rcpt-details{padding:6px 14px 14px}
  .rcpt-row{font-size:13px;padding:10px 12px}
}


/* TRACK page */
.track-form{padding:22px}
.track-form .btn{margin-top:10px}
.tr-head{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;margin-bottom:20px}
.badge-lg{padding:6px 14px;font-size:13px;border-radius:20px}
.timeline{display:flex;align-items:center;margin:24px 0 28px;padding:0 6px}
.tl-step{display:flex;flex-direction:column;align-items:center;gap:8px;flex-shrink:0}
.tl-dot{width:44px;height:44px;border-radius:50%;background:rgba(120,80,200,.15);color:var(--brand-1);
  display:flex;align-items:center;justify-content:center;font-weight:800;transition:.3s}
.tl-step.done .tl-dot{background:var(--grad-main);color:#fff;box-shadow:0 6px 20px rgba(124,58,237,.4);transform:scale(1.05)}
.tl-label{font-size:12px;font-weight:600;opacity:.75;text-align:center}
.tl-step.done .tl-label{opacity:1;color:var(--brand-1)}
.tl-line{flex:1;height:3px;background:rgba(120,80,200,.15);margin:0 -4px;position:relative;margin-bottom:20px;border-radius:2px}
.tl-line.done{background:var(--grad-main)}
.tr-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:20px 0}
.tr-card{background:rgba(120,80,200,.06);padding:12px 14px;border-radius:12px;display:flex;flex-direction:column;gap:4px}
.dark .tr-card{background:rgba(255,255,255,.04)}
.tr-card span{font-size:11px;opacity:.65;text-transform:uppercase;letter-spacing:.5px}
.tr-card b{font-size:16px}
.tr-card.gold{background:linear-gradient(135deg,#fbbf24,#f97316);color:#fff}
.tr-card.gold span{color:rgba(255,255,255,.85)}
.tr-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}

/* WINNER banner */
.winner-banner{margin-top:24px;padding:32px;text-align:center;border-radius:20px;
  background:linear-gradient(135deg,#fbbf24 0%,#f97316 50%,#ec4899 100%);color:#fff;
  box-shadow:0 20px 60px rgba(236,72,153,.35);position:relative;overflow:hidden}
.winner-banner::before{content:"";position:absolute;inset:-50%;
  background:conic-gradient(from 0deg,transparent,rgba(255,255,255,.15),transparent);animation:spin 6s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.wb-emoji{font-size:60px;animation:bounce 1.6s ease-in-out infinite}
@keyframes bounce{50%{transform:translateY(-14px)}}
.winner-banner h2{margin:8px 0;font-size:28px}
.winner-banner .btn{margin-top:14px}

/* ALERT */
.alert{padding:14px 18px;border-radius:12px;margin:16px 0;font-weight:500;border:1px solid transparent}
.alert-success{background:rgba(16,185,129,.12);border-color:rgba(16,185,129,.4);color:#059669}
.dark .alert-success{color:#34d399}
.alert-error{background:rgba(239,68,68,.12);border-color:rgba(239,68,68,.4);color:#dc2626}
.dark .alert-error{color:#f87171}

/* ============================================================
   GIB Store & Dual Hero (v7)
   Mobile-first, premium, animated
   ============================================================ */

/* Dual hero chooser */
.dual-hero{position:relative;padding:60px 0 40px;overflow:hidden}
.dual-hero .dual-bg{position:absolute;inset:0;background:
  radial-gradient(1200px 500px at 20% 0%, rgba(124,58,237,.25), transparent 60%),
  radial-gradient(1000px 500px at 80% 100%, rgba(236,72,153,.22), transparent 60%),
  radial-gradient(800px 400px at 50% 50%, rgba(6,182,212,.15), transparent 70%);
  animation:dualPulse 8s ease-in-out infinite alternate}
@keyframes dualPulse{from{opacity:.7;transform:scale(1)}to{opacity:1;transform:scale(1.05)}}
.dual-head{text-align:center;margin-bottom:28px;position:relative;z-index:1}
.dual-head h1{font-size:clamp(28px,6vw,52px);font-weight:800;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;margin:0 0 8px;letter-spacing:-.02em}
.dual-head p{font-size:clamp(14px,2.5vw,18px);opacity:.75;margin:0}
.dual-grid{display:grid;grid-template-columns:1fr;gap:18px;position:relative;z-index:1}
@media(min-width:768px){.dual-grid{grid-template-columns:1fr 1fr;gap:24px}}
.dual-card{position:relative;padding:32px 24px;border-radius:24px;text-decoration:none;color:#fff;overflow:hidden;
  display:flex;flex-direction:column;align-items:center;text-align:center;
  transition:transform .35s cubic-bezier(.2,.9,.3,1.4), box-shadow .35s;
  box-shadow:0 20px 45px -15px rgba(0,0,0,.35);min-height:230px}
.dual-card:hover{transform:translateY(-6px) scale(1.02);box-shadow:0 30px 60px -15px rgba(0,0,0,.5)}
.dc-giveaway{background:linear-gradient(135deg,#7c3aed 0%,#ec4899 60%,#f43f5e 100%)}
.dc-store{background:linear-gradient(135deg,#0ea5e9 0%,#06b6d4 50%,#10b981 100%)}
.dc-icon{font-size:56px;margin-bottom:10px;filter:drop-shadow(0 5px 15px rgba(0,0,0,.35));animation:dcBob 3s ease-in-out infinite}
@keyframes dcBob{50%{transform:translateY(-8px) rotate(-3deg)}}
.dual-card h2{font-size:28px;margin:8px 0;font-weight:800}
.dual-card p{opacity:.92;margin:0 0 18px;font-size:15px;max-width:320px}
.dc-btn{display:inline-block;padding:10px 22px;background:rgba(255,255,255,.22);border:1.5px solid rgba(255,255,255,.35);border-radius:100px;font-weight:700;backdrop-filter:blur(10px);margin-top:auto}
.dc-shine{position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.25) 50%,transparent 60%);transform:translateX(-100%);transition:transform .8s}
.dual-card:hover .dc-shine{transform:translateX(50%)}

/* Cart pill in header */
.cart-pill{position:relative;padding:6px 10px;border-radius:10px;background:rgba(0,0,0,.06);text-decoration:none;font-size:20px;line-height:1}
.dark .cart-pill{background:rgba(255,255,255,.1)}
.cart-badge{position:absolute;top:-6px;right:-6px;background:#ef4444;color:#fff;font-size:11px;font-weight:700;min-width:18px;height:18px;border-radius:10px;display:flex;align-items:center;justify-content:center;padding:0 5px}

/* Store hero */
.store-hero{padding:50px 0 30px;background:linear-gradient(135deg,#0ea5e9,#06b6d4,#10b981);color:#fff;position:relative;overflow:hidden}
.store-hero::before{content:"";position:absolute;inset:0;background:radial-gradient(600px 300px at 50% 0%, rgba(255,255,255,.2), transparent);pointer-events:none}
.sh-inner{max-width:640px;margin:0 auto;text-align:center;position:relative;z-index:1}
.sh-badge{display:inline-block;padding:6px 14px;background:rgba(255,255,255,.2);border-radius:100px;font-size:12px;font-weight:700;letter-spacing:.1em;margin-bottom:12px;backdrop-filter:blur(10px)}
.sh-inner h1{font-size:clamp(28px,5vw,44px);margin:0 0 8px;font-weight:800}
.sh-inner p{opacity:.92;margin:0 0 20px}
.store-search{display:flex;gap:8px;max-width:520px;margin:0 auto;background:#fff;padding:6px;border-radius:100px;box-shadow:0 15px 40px rgba(0,0,0,.15)}
.store-search input{flex:1;border:0;padding:10px 18px;font-size:15px;background:transparent;outline:none;color:#111}
.store-search .btn-primary{border-radius:100px;padding:10px 22px}

/* Cat scroll */
.store-cats{padding:20px 0;position:sticky;top:0;background:var(--c-bg,#fff);z-index:20;box-shadow:0 4px 15px rgba(0,0,0,.05)}
.dark .store-cats{background:#0f172a}
.cat-scroll{display:flex;gap:10px;overflow-x:auto;padding:4px 2px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.cat-scroll::-webkit-scrollbar{display:none}
.cat-chip{flex:0 0 auto;padding:10px 18px;background:rgba(0,0,0,.06);border-radius:100px;text-decoration:none;color:inherit;font-weight:600;font-size:14px;white-space:nowrap;transition:all .2s}
.dark .cat-chip{background:rgba(255,255,255,.08)}
.cat-chip:hover{transform:translateY(-2px)}
.cat-chip.active{background:var(--grad);color:#fff;box-shadow:0 8px 20px rgba(124,58,237,.35)}

/* Product grid */
.p-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
@media(min-width:640px){.p-grid{grid-template-columns:repeat(3,1fr);gap:18px}}
@media(min-width:960px){.p-grid{grid-template-columns:repeat(4,1fr);gap:22px}}
.p-grid-hero .p-card{background:linear-gradient(180deg,rgba(124,58,237,.05),transparent)}
.p-card{background:var(--c-card,#fff);border-radius:16px;overflow:hidden;text-decoration:none;color:inherit;box-shadow:0 8px 25px -10px rgba(0,0,0,.15);transition:all .35s cubic-bezier(.2,.9,.3,1.4);display:flex;flex-direction:column;border:1px solid rgba(0,0,0,.05)}
.dark .p-card{background:#1e293b;border-color:rgba(255,255,255,.05)}
.p-card:hover{transform:translateY(-6px);box-shadow:0 20px 45px -10px rgba(124,58,237,.3)}
.p-thumb{position:relative;aspect-ratio:1/1;background:#f1f5f9 center/cover no-repeat;overflow:hidden}
.p-thumb::after{content:"🎁";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:60px;opacity:.15}
.p-thumb[style*="background-image"]::after{display:none}
.p-badge{position:absolute;top:10px;left:10px;padding:4px 10px;background:linear-gradient(135deg,#f59e0b,#ef4444);color:#fff;font-size:11px;font-weight:700;border-radius:100px;letter-spacing:.05em;box-shadow:0 5px 15px rgba(239,68,68,.4)}
.p-badge.lg{padding:8px 16px;font-size:13px}
.p-off{position:absolute;top:10px;right:10px;padding:4px 10px;background:#10b981;color:#fff;font-size:12px;font-weight:800;border-radius:100px;box-shadow:0 5px 15px rgba(16,185,129,.4)}
.p-body{padding:12px;display:flex;flex-direction:column;gap:6px;flex:1}
.p-body h3{font-size:14px;margin:0;font-weight:700;line-height:1.35;min-height:2.7em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
@media(min-width:640px){.p-body h3{font-size:15px}}
.p-desc{font-size:12px;opacity:.7;margin:0;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.p-price-row{display:flex;align-items:center;gap:8px;margin-top:auto;padding-top:6px}
.p-price{font-size:18px;font-weight:800;color:#7c3aed}
.dark .p-price{color:#a78bfa}
.p-old{font-size:13px;opacity:.5;text-decoration:line-through}
.p-cart-btn{width:100%;padding:9px 12px;background:var(--grad);color:#fff;border:0;border-radius:10px;font-weight:700;font-size:13px;cursor:pointer;transition:all .2s;margin-top:6px}
.p-cart-btn:hover{transform:scale(1.03);box-shadow:0 8px 20px rgba(124,58,237,.4)}
.p-cart-btn:disabled{opacity:.7}

/* Product detail */
.pd-wrap{padding:24px 0 40px}
.crumb{font-size:13px;opacity:.7;margin-bottom:16px}
.crumb a{color:inherit;text-decoration:none}
.crumb a:hover{color:var(--c-primary)}
.pd-grid{display:grid;grid-template-columns:1fr;gap:24px}
@media(min-width:768px){.pd-grid{grid-template-columns:1fr 1fr;gap:36px}}
.pd-image{position:relative;aspect-ratio:1/1;background:#f1f5f9 center/cover no-repeat;border-radius:20px;box-shadow:0 15px 40px rgba(0,0,0,.15)}
.pd-image::after{content:"🎁";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:120px;opacity:.15}
.pd-image[style*="background-image"]::after{display:none}
.pd-info h1{font-size:clamp(22px,4vw,32px);margin:0 0 8px;font-weight:800}
.pd-short{opacity:.7;margin:0 0 18px;font-size:15px}
.pd-price{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:14px}
.pd-now{font-size:32px;font-weight:800;color:#7c3aed}
.dark .pd-now{color:#a78bfa}
.pd-old{font-size:18px;opacity:.5;text-decoration:line-through}
.pd-save{padding:4px 10px;background:#10b981;color:#fff;font-size:12px;font-weight:700;border-radius:100px}
.pd-stock{padding:8px 14px;background:rgba(16,185,129,.1);color:#059669;font-weight:600;border-radius:10px;display:inline-block;margin-bottom:16px;font-size:14px}
.pd-qty{margin-bottom:16px}
.pd-qty label{display:block;font-weight:600;margin-bottom:6px;font-size:14px}
.qty-ctrl{display:inline-flex;align-items:center;border:2px solid rgba(0,0,0,.1);border-radius:10px;overflow:hidden}
.dark .qty-ctrl{border-color:rgba(255,255,255,.15)}
.qty-ctrl button{width:38px;height:38px;background:transparent;border:0;font-size:18px;font-weight:700;cursor:pointer;color:inherit}
.qty-ctrl button:hover{background:rgba(0,0,0,.05)}
.qty-ctrl input{width:50px;text-align:center;border:0;background:transparent;font-weight:700;color:inherit;font-size:15px}
.qty-ctrl .qv{padding:0 14px;font-weight:700}
.pd-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pd-desc,.pd-related{margin-top:36px}
.pd-desc h3,.pd-related h3{font-size:20px;margin-bottom:12px}
.pd-desc-body{padding:20px;background:rgba(0,0,0,.03);border-radius:14px;line-height:1.7}
.dark .pd-desc-body{background:rgba(255,255,255,.03)}

/* Cart page */
.cart-wrap{padding:30px 0 50px}
.page-title{font-size:clamp(24px,4vw,34px);margin-bottom:24px;font-weight:800}
.empty-state{text-align:center;padding:60px 20px;background:rgba(0,0,0,.03);border-radius:20px}
.dark .empty-state{background:rgba(255,255,255,.03)}
.es-icon{font-size:64px;margin-bottom:16px;animation:dcBob 3s infinite}
.cart-grid{display:grid;grid-template-columns:1fr;gap:20px}
@media(min-width:900px){.cart-grid{grid-template-columns:1fr 340px}}
.cart-items{display:flex;flex-direction:column;gap:12px}
.cart-item{display:grid;grid-template-columns:80px 1fr auto;gap:14px;padding:14px;background:var(--c-card,#fff);border-radius:14px;box-shadow:0 5px 20px rgba(0,0,0,.06);align-items:center}
.dark .cart-item{background:#1e293b}
.ci-thumb{width:80px;height:80px;background:#f1f5f9 center/cover no-repeat;border-radius:10px}
.ci-body h4{margin:0 0 4px;font-size:15px}
.ci-price{font-size:13px;opacity:.7;margin-bottom:8px}
.ci-controls{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.ci-remove{background:transparent;border:0;color:#ef4444;font-weight:600;cursor:pointer;font-size:13px}
.ci-total{font-weight:800;font-size:16px;color:#7c3aed;text-align:right}
.cart-summary{background:var(--c-card,#fff);border-radius:16px;padding:20px;box-shadow:0 10px 30px rgba(0,0,0,.08);align-self:start;position:sticky;top:80px}
.dark .cart-summary{background:#1e293b}
.cart-summary h3{margin:0 0 14px;font-size:18px}
.cs-row{display:flex;justify-content:space-between;padding:8px 0;font-size:14px}
.cs-total{border-top:2px solid rgba(0,0,0,.08);padding-top:12px;margin-top:6px;font-size:18px;font-weight:800;color:#7c3aed}
.dark .cs-total{border-color:rgba(255,255,255,.1)}
.btn-block{display:block;width:100%;text-align:center;margin-top:8px}
.btn-ghost{background:transparent;border:2px solid rgba(0,0,0,.1);padding:10px 20px;border-radius:10px;text-decoration:none;color:inherit;text-align:center;font-weight:600}
.btn-secondary{background:#0ea5e9;color:#fff;padding:10px 22px;border-radius:10px;border:0;font-weight:700;cursor:pointer}
.btn-lg{padding:14px 24px;font-size:15px}

/* Checkout */
.checkout-wrap{padding:24px 0 50px}
.checkout-grid{display:grid;grid-template-columns:1fr;gap:20px}
@media(min-width:900px){.checkout-grid{grid-template-columns:1fr 360px}}
.co-card{background:var(--c-card,#fff);border-radius:16px;padding:20px;box-shadow:0 8px 25px rgba(0,0,0,.06);margin-bottom:16px}
.dark .co-card{background:#1e293b}
.co-card h3{margin:0 0 14px;font-size:17px;padding-bottom:10px;border-bottom:2px solid rgba(124,58,237,.15)}
.co-card .form-row{margin-bottom:12px}
.co-card label{display:block;font-weight:600;margin-bottom:6px;font-size:14px}
.co-card input,.co-card textarea,.co-card select{width:100%;padding:11px 14px;border:2px solid rgba(0,0,0,.08);border-radius:10px;font-size:15px;background:transparent;color:inherit;font-family:inherit;transition:border-color .2s}
.dark .co-card input,.dark .co-card textarea{border-color:rgba(255,255,255,.1)}
.co-card input:focus,.co-card textarea:focus{outline:none;border-color:var(--c-primary)}
.verify-card{background:linear-gradient(135deg,rgba(6,182,212,.05),rgba(16,185,129,.05));border:2px solid rgba(6,182,212,.15)}
.hint{font-size:13px;opacity:.75;margin:0 0 14px}
.verify-item{padding:14px;background:rgba(255,255,255,.5);border-radius:12px;margin-bottom:12px}
.dark .verify-item{background:rgba(0,0,0,.2)}
.v-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;flex-wrap:wrap;gap:8px}
.v-title{font-weight:700;font-size:15px}
.v-visit{padding:6px 14px;background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;text-decoration:none;border-radius:100px;font-size:13px;font-weight:600}
.v-question{display:flex;align-items:center;gap:14px;flex-wrap:wrap;font-size:14px;margin-bottom:8px}
.v-radio{display:inline-flex;align-items:center;gap:6px;cursor:pointer;padding:6px 12px;border-radius:8px;background:rgba(0,0,0,.05);font-weight:600}
.dark .v-radio{background:rgba(255,255,255,.08)}
.v-radio input{margin:0;width:auto}
.v-shot{margin-top:8px;padding:12px;background:rgba(16,185,129,.08);border-radius:10px;border:2px dashed #10b981}
.v-shot label{color:#059669}
.v-error{margin-top:8px;padding:12px;background:#fee2e2;color:#991b1b;border-radius:10px;font-weight:600;font-size:13px}
.dark .v-error{background:rgba(239,68,68,.15);color:#fca5a5}
.terms-box{padding:14px;background:rgba(0,0,0,.04);border-radius:10px;margin-bottom:12px;font-size:13px}
.dark .terms-box{background:rgba(255,255,255,.05)}
.terms-box ul{margin:0;padding-left:20px;line-height:1.8}
.terms-check{display:flex;gap:8px;align-items:flex-start;cursor:pointer;padding:12px;background:rgba(16,185,129,.08);border-radius:10px;font-weight:600;font-size:14px}
.terms-check input{margin-top:3px;width:auto}
.co-side .sticky{position:sticky;top:80px}
.co-items{margin-bottom:12px;max-height:200px;overflow-y:auto}
.co-line{display:flex;justify-content:space-between;padding:6px 0;font-size:13px;border-bottom:1px dashed rgba(0,0,0,.08)}
.dark .co-line{border-color:rgba(255,255,255,.08)}
.secure{text-align:center;margin:10px 0 0;font-size:12px;opacity:.7}
.alert-error{background:#fee2e2;color:#991b1b;padding:14px 18px;border-radius:12px;margin-bottom:16px;font-weight:600}

/* Order page */
.order-wrap{padding:30px 0 50px}
.order-hero{text-align:center;padding:30px 20px;background:linear-gradient(135deg,rgba(16,185,129,.1),rgba(6,182,212,.1));border-radius:20px;margin-bottom:20px}
.oh-icon{font-size:72px;margin-bottom:10px;animation:dcBob 2s infinite}
.oh-icon.success{filter:drop-shadow(0 10px 20px rgba(16,185,129,.4))}
.oh-icon.pending{filter:drop-shadow(0 10px 20px rgba(245,158,11,.4))}
.oh-icon.fail{filter:drop-shadow(0 10px 20px rgba(239,68,68,.4))}
.order-hero h1{font-size:26px;margin:0 0 6px}
.order-card{background:var(--c-card,#fff);padding:20px;border-radius:16px;box-shadow:0 10px 30px rgba(0,0,0,.08)}
.dark .order-card{background:#1e293b}
.oc-head{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;padding-bottom:12px;border-bottom:2px solid rgba(0,0,0,.08);margin-bottom:14px}
.dark .oc-head{border-color:rgba(255,255,255,.08)}
.oc-row{padding:6px 0;font-size:14px}
.ord-table{width:100%;border-collapse:collapse;margin:10px 0}
.ord-table td{padding:8px;border-bottom:1px dashed rgba(0,0,0,.08)}
.oc-totals{margin-top:12px}
.oc-totals>div{display:flex;justify-content:space-between;padding:6px 0;font-size:14px}
.oc-total{border-top:2px solid rgba(0,0,0,.1);padding-top:10px !important;font-size:18px !important;font-weight:800;color:#7c3aed}

/* Payment page */
.pay-wrap{padding:30px 0 50px}
.pay-card{max-width:480px;margin:0 auto;background:var(--c-card,#fff);padding:30px;border-radius:20px;box-shadow:0 20px 50px rgba(226,25,110,.15);text-align:center}
.dark .pay-card{background:#1e293b}
.pay-logo{font-size:22px;color:#e2196e;margin-bottom:16px;font-weight:800}
.pay-amount{font-size:44px;font-weight:800;color:#e2196e;margin:16px 0}
.pay-instructions{background:rgba(226,25,110,.08);padding:16px;border-radius:12px;margin:14px 0}
.pay-number{font-size:24px;font-weight:800;letter-spacing:.05em;color:#e2196e;padding:10px;background:#fff;border-radius:10px;border:2px dashed #e2196e;margin-top:8px}

/* Admin store additions */
.badge.b-new{background:#3b82f6;color:#fff}
.badge.b-confirmed{background:#10b981;color:#fff}
.badge.b-processing{background:#f59e0b;color:#fff}
.badge.b-shipped{background:#8b5cf6;color:#fff}
.badge.b-delivered{background:#059669;color:#fff}
.badge.b-cancelled{background:#ef4444;color:#fff}
.badge.b-pending{background:#f59e0b;color:#fff}
.badge.b-paid{background:#10b981;color:#fff}
.badge.b-failed{background:#ef4444;color:#fff}
.badge.b-active{background:#10b981;color:#fff}
.badge.b-inactive{background:#94a3b8;color:#fff}
.ver-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin-top:10px}
.filter-bar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.filter-bar .chip{padding:8px 14px;background:rgba(0,0,0,.06);border-radius:100px;text-decoration:none;color:inherit;font-size:13px;font-weight:600}
.filter-bar .chip.active{background:linear-gradient(135deg,#7c3aed,#ec4899);color:#fff}
.input-sm{padding:6px 10px;font-size:13px}
.form-grid-2{display:grid;grid-template-columns:1fr;gap:14px}
@media(min-width:768px){.form-grid-2{grid-template-columns:1fr 1fr;gap:20px}}

/* ============================================================
   v10 — Responsive Fix + Premium Header + Cart Animations
   ============================================================ */

/* Global anti-overflow — kills horizontal scroll */
html, body { max-width: 100%; overflow-x: hidden; }
*, *::before, *::after { box-sizing: border-box; }
img, video, iframe, canvas, svg { max-width: 100%; height: auto; }
.container { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 16px; }

/* --------- Premium Header --------- */
.site-header{
  position:sticky; top:0; z-index:100;
  backdrop-filter: saturate(160%) blur(14px);
  -webkit-backdrop-filter: saturate(160%) blur(14px);
  background: color-mix(in oklab, var(--c-primary) 6%, rgba(255,255,255,.75));
  border-bottom:1px solid color-mix(in oklab, var(--c-primary) 12%, transparent);
  transition: box-shadow .3s ease, background .3s ease, padding .3s ease;
}
html.dark .site-header{ background: color-mix(in oklab, #000 65%, rgba(20,20,30,.75)); }
.site-header.scrolled{ box-shadow: 0 10px 30px -12px rgba(0,0,0,.18); }
.hdr-inner{ display:flex; align-items:center; justify-content:space-between; gap:14px; padding:12px 16px; min-height:64px; }
.brand{ display:flex; align-items:center; gap:10px; text-decoration:none; color:inherit; font-weight:800; font-size:18px; min-width:0; }
.brand img{ height:36px; width:auto; }
.brand-mark{ display:inline-grid; place-items:center; width:38px; height:38px; border-radius:12px; background:var(--grad); color:#fff; box-shadow:0 8px 24px -8px var(--c-primary); }
.brand-name{ background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; white-space:nowrap; }
.main-nav{ display:flex; align-items:center; gap:6px; }
.main-nav a{
  position:relative; padding:10px 14px; border-radius:12px; text-decoration:none; color:inherit;
  font-weight:600; font-size:14.5px; transition:all .25s; letter-spacing:.1px;
}
.main-nav a::after{
  content:""; position:absolute; left:14px; right:14px; bottom:6px; height:2px; border-radius:2px;
  background:var(--grad); transform:scaleX(0); transform-origin:left; transition:transform .3s;
}
.main-nav a:hover{ background: color-mix(in oklab, var(--c-primary) 8%, transparent); }
.main-nav a:hover::after{ transform:scaleX(1); }

.hdr-actions{ display:flex; align-items:center; gap:8px; }
.btn-icon{
  width:42px; height:42px; border-radius:12px; border:1px solid color-mix(in oklab, var(--c-primary) 15%, transparent);
  background:transparent; cursor:pointer; display:grid; place-items:center; font-size:18px; color:inherit; transition:all .2s;
}
.btn-icon:hover{ background: color-mix(in oklab, var(--c-primary) 8%, transparent); transform:translateY(-1px); }
#themeToggle .ico-moon{ display:none; }
html.dark #themeToggle .ico-sun{ display:none; }
html.dark #themeToggle .ico-moon{ display:inline; }

.cart-pill{
  position:relative; display:grid; place-items:center; width:44px; height:44px; border-radius:12px;
  background: var(--grad); color:#fff; text-decoration:none; box-shadow:0 8px 22px -10px var(--c-primary);
  transition: transform .25s;
}
.cart-pill:hover{ transform: translateY(-2px) scale(1.05); }
.cart-pill.bump{ animation: cartBump .6s cubic-bezier(.2,.9,.3,1.4); }
@keyframes cartBump {
  0%{transform:scale(1)} 30%{transform:scale(1.25) rotate(-8deg)} 60%{transform:scale(.92)} 100%{transform:scale(1)}
}
.cart-badge{
  position:absolute; top:-6px; right:-6px; min-width:20px; height:20px; padding:0 6px; border-radius:999px;
  background:#ef4444; color:#fff; font-size:11px; font-weight:800; display:grid; place-items:center;
  box-shadow:0 0 0 2px var(--c-primary); animation: badgePop .4s ease-out;
}
.cart-badge[hidden]{ display:none !important; }
@keyframes badgePop { from{transform:scale(0)} to{transform:scale(1)} }

/* Hamburger */
.nav-toggle{ display:none; }
.nav-toggle span{ display:block; width:20px; height:2px; background:currentColor; margin:3px 0; border-radius:2px; transition:all .3s; }
.nav-toggle.on span:nth-child(1){ transform: translateY(5px) rotate(45deg); }
.nav-toggle.on span:nth-child(2){ opacity:0; }
.nav-toggle.on span:nth-child(3){ transform: translateY(-5px) rotate(-45deg); }
.nav-backdrop{ position:fixed; inset:0; background:rgba(0,0,0,.5); backdrop-filter:blur(4px); opacity:0; pointer-events:none; transition:opacity .3s; z-index:98; }
.nav-backdrop.on{ opacity:1; pointer-events:auto; }
body.nav-open{ overflow:hidden; }

/* Fly-to-cart projectile */
.fly-ball{
  position:fixed; z-index:9999; width:40px; height:40px; border-radius:50%;
  background:var(--grad); color:#fff; font-size:22px; display:grid; place-items:center;
  box-shadow:0 10px 30px -8px var(--c-primary); pointer-events:none;
  transition: transform .85s cubic-bezier(.55,.05,.6,.4), opacity .85s ease-in;
}

/* Add-to-cart button states */
.btn-primary.loading, .btn-primary.done{ pointer-events:none; }
.btn-primary.done{ background:#10b981 !important; }
.spin{ display:inline-block; width:14px; height:14px; border:2px solid rgba(255,255,255,.35); border-top-color:#fff; border-radius:50%; animation:spin 0.7s linear infinite; vertical-align:middle; margin-right:6px; }
@keyframes spin{ to{ transform:rotate(360deg) } }

/* Location choice on checkout */
.loc-choice{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:6px; }
.loc-opt{ position:relative; display:flex; align-items:center; justify-content:space-between; padding:14px; border:2px solid #e5e7eb; border-radius:12px; cursor:pointer; transition:all .2s; background:#fff; }
.loc-opt input{ position:absolute; opacity:0; pointer-events:none; }
.loc-opt span{ font-weight:600; }
.loc-opt b{ color:var(--c-primary); }
.loc-opt:hover{ border-color: var(--c-primary); }
.loc-opt.sel{ border-color: var(--c-primary); background: color-mix(in oklab, var(--c-primary) 8%, #fff); box-shadow: 0 8px 20px -14px var(--c-primary); }
html.dark .loc-opt{ background:#1a1a2a; border-color:#2b2b40; color:#eee; }
html.dark .loc-opt.sel{ background: color-mix(in oklab, var(--c-primary) 20%, #1a1a2a); }
.ship-note.ok{ padding:12px 14px; margin:10px 0; border-radius:12px; background: linear-gradient(135deg,#10b98120,#05966920); color:#065f46; border:1px dashed #10b981; font-weight:600; }
html.dark .ship-note.ok{ color:#a7f3d0; }

.bkash-btn img{ height:22px; vertical-align:middle; margin-right:8px; filter: drop-shadow(0 2px 4px rgba(0,0,0,.2)); }

/* --------- Responsive breakpoints (mobile-first) --------- */
@media (max-width: 900px){
  .nav-toggle{ display:grid; }
  .main-nav{
    position:fixed; top:0; right:-100%; height:100vh; height:100dvh; width:min(82vw, 320px);
    background: var(--c-primary); background:var(--grad); color:#fff;
    flex-direction:column; align-items:stretch; gap:6px; padding:80px 20px 24px; z-index:99;
    transition: right .35s cubic-bezier(.4,0,.2,1); box-shadow:-20px 0 40px rgba(0,0,0,.3);
  }
  .main-nav.open{ right:0; }
  .main-nav a{ color:#fff; font-size:16px; padding:14px 16px; border-radius:12px; }
  .main-nav a:hover{ background: rgba(255,255,255,.15); }
  .main-nav a::after{ display:none; }

  .checkout-grid, .cart-grid, .pd-grid{ display:block !important; }
  .co-side, .cart-summary{ margin-top:16px; }
  .co-side .sticky{ position:static; }
  .pd-image{ min-height:260px; }
  .p-grid{ grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap:10px; }
  .page-title, h1{ font-size:22px !important; }
  .foot-grid{ grid-template-columns:1fr !important; gap:20px; }
  .loc-choice{ grid-template-columns:1fr; }
  .form-grid-2{ grid-template-columns:1fr !important; }
}
@media (max-width: 480px){
  .container{ padding:0 12px; }
  .hdr-inner{ padding:10px 12px; min-height:58px; }
  .brand-name{ font-size:15px; }
  .brand img{ height:30px; }
  .btn-icon, .cart-pill{ width:40px; height:40px; }
  .p-grid{ grid-template-columns: 1fr 1fr !important; gap:8px; }
  .p-card{ padding:8px !important; }
  .p-card h4, .p-card .p-title{ font-size:13px; line-height:1.3; }
  .p-price, .pd-now{ font-size:16px; }
  .btn-primary, .btn-secondary, .btn-lg{ font-size:14px; padding:12px 14px; }
  .btn-block{ width:100%; }
  .cart-item{ grid-template-columns: 70px 1fr !important; }
  .ci-total{ grid-column: 1 / -1; text-align:right; padding-top:6px; border-top:1px dashed #eee; }
  .qty-ctrl button{ width:32px; height:32px; }
  table{ font-size:13px; }
  .co-card{ padding:14px !important; }
}

/* Cart layout safety */
.cart-item{ display:grid; grid-template-columns: 90px 1fr auto; gap:14px; align-items:center; padding:14px; border:1px solid #eee; border-radius:14px; margin-bottom:10px; background:#fff; }
html.dark .cart-item{ background:#1a1a2a; border-color:#2b2b40; }
.ci-thumb{ width:90px; height:90px; background-size:cover; background-position:center; border-radius:12px; background-color:#f4f4f8; }
.ci-body{ min-width:0; }
.ci-body h4{ margin:0 0 6px; font-size:15px; }
.ci-controls{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:8px; }

/* Product card safety */
.p-card{ min-width:0; }
.p-card .p-img{ aspect-ratio: 1 / 1; background-size:cover; background-position:center; border-radius:12px; }

/* Admin fix — remove horizontal scroll */
.admin-wrap, .main{ max-width:100%; overflow-x:hidden; }
@media (max-width: 900px){
  .admin-wrap{ display:block !important; }
  .sidebar{ position:sticky; top:0; width:100% !important; height:auto !important; }
  .sidebar nav{ display:flex; flex-wrap:wrap; gap:4px; }
  .sidebar nav a{ font-size:12px; padding:8px 10px; }
}

/* ============ v12: Home videos + giveaways page ============ */
.hero-mini{padding:60px 0 30px;text-align:center;background:linear-gradient(135deg,rgba(255,107,53,.12),rgba(0,78,137,.12));border-bottom:1px solid var(--border,#eee)}
.hero-mini h1{font-size:clamp(28px,5vw,44px);margin:0 0 8px;background:linear-gradient(135deg,#FF6B35,#F77F00);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-mini p{opacity:.75;margin:0}
.sec-videos{padding:56px 0}
.videos-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:22px}
.videos-head .sec-title{margin:0}
.yt-sub-btn{display:inline-flex;align-items:center;gap:8px;background:#ff0000;color:#fff;padding:10px 18px;border-radius:999px;font-weight:600;text-decoration:none;box-shadow:0 8px 22px rgba(255,0,0,.35);transition:transform .2s}
.yt-sub-btn:hover{transform:translateY(-2px)}
.yt-sub-btn .yt-ico{background:#fff;color:#ff0000;width:22px;height:22px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:10px}
.video-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}
.vcard{display:block;background:var(--card,#fff);border:1px solid var(--border,#eee);border-radius:16px;overflow:hidden;text-decoration:none;color:inherit;transition:transform .25s,box-shadow .25s;box-shadow:0 4px 14px rgba(0,0,0,.06)}
.vcard:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(0,0,0,.14)}
.vthumb{position:relative;aspect-ratio:16/9;overflow:hidden;background:#000}
.vthumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s}
.vcard:hover .vthumb img{transform:scale(1.06)}
.vplay{position:absolute;inset:0;margin:auto;width:56px;height:56px;border-radius:50%;background:rgba(255,0,0,.92);color:#fff;display:flex;align-items:center;justify-content:center;font-size:22px;opacity:.9;transition:transform .25s,opacity .25s}
.vcard:hover .vplay{transform:scale(1.15);opacity:1}
.vbody{padding:14px 16px 18px}
.vbody h3{margin:0 0 6px;font-size:15px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.vmeta{font-size:12px;opacity:.65}
@media(max-width:720px){.video-grid{grid-template-columns:1fr;gap:18px}.vbody h3{font-size:15px}}
.vcard{position:relative;border-radius:18px;overflow:hidden;transition:transform .35s cubic-bezier(.2,.9,.3,1.2),box-shadow .35s}
.vcard::before{content:"";position:absolute;inset:-2px;border-radius:20px;padding:2px;background:conic-gradient(from var(--a,0deg),#7c3aed,#ec4899,#f59e0b,#10b981,#7c3aed);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:vspin 6s linear infinite;opacity:.55;pointer-events:none}
.vcard:hover{transform:translateY(-6px) scale(1.01);box-shadow:0 20px 45px -12px rgba(124,58,237,.5)}
.vcard:hover::before{opacity:1}
@keyframes vspin{to{--a:360deg}}
@property --a{syntax:'<angle>';inherits:false;initial-value:0deg}
.vthumb img{transition:transform .6s}
.vcard:hover .vthumb img{transform:scale(1.08)}
.tr-head{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;margin-bottom:8px}
.tr-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px;margin-top:12px}
.tr-card{background:rgba(124,58,237,.08);padding:12px 14px;border-radius:12px;border:1px solid rgba(124,58,237,.18)}
.tr-card span{display:block;font-size:11px;opacity:.7;text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px}
.tr-card.gold{background:linear-gradient(135deg,rgba(245,158,11,.15),rgba(236,72,153,.1));border-color:rgba(245,158,11,.4)}
.status-new{background:#3b82f6;color:#fff}.status-confirmed{background:#8b5cf6;color:#fff}
.status-processing{background:#f59e0b;color:#fff}.status-shipped{background:#06b6d4;color:#fff}
.status-delivered{background:#10b981;color:#fff}.status-cancelled{background:#ef4444;color:#fff}
.badge-lg{padding:8px 16px;font-size:13px;border-radius:20px;font-weight:700}

/* ============ v13: YT skeleton + home mini header ============ */
.home-mini-hdr{position:absolute;top:0;left:50%;transform:translateX(-50%);width:100%;display:flex;align-items:center;justify-content:space-between;padding:18px 24px;z-index:10}
.home-mini-hdr .brand{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none;font-weight:800;font-size:20px;text-shadow:0 2px 12px rgba(0,0,0,.35)}
.home-mini-hdr .brand img{width:34px;height:34px;border-radius:10px;object-fit:cover}
.home-mini-hdr .brand-mark{font-size:26px}
.home-mini-hdr .btn-icon{background:rgba(255,255,255,.15);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.25);color:#fff;border-radius:12px;width:42px;height:42px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .2s}
.home-mini-hdr .btn-icon:hover{transform:scale(1.08)}
body.no-header main{padding-top:0}
.home-hero{position:relative;padding-top:80px}

/* Video skeleton shimmer */
.sk-shimmer{position:relative;overflow:hidden;background:linear-gradient(90deg,rgba(148,163,184,.15) 0%,rgba(148,163,184,.35) 50%,rgba(148,163,184,.15) 100%);background-size:200% 100%;animation:sk-shine 1.4s linear infinite;border-radius:12px}
@keyframes sk-shine{0%{background-position:200% 0}100%{background-position:-200% 0}}
.vcard-skeleton{pointer-events:none;border-radius:16px;overflow:hidden;background:var(--card-bg,rgba(255,255,255,.04));border:1px solid rgba(148,163,184,.15);padding:0}
.vcard-skeleton .vthumb{aspect-ratio:16/9;width:100%;border-radius:0}
.vcard-skeleton .vbody{padding:14px}
.sk-line{height:14px;border-radius:6px}

/* Video card entrance */
.vcard-in{opacity:0;transform:translateY(14px);animation:vc-in .5s cubic-bezier(.2,.9,.3,1.2) forwards}
@keyframes vc-in{to{opacity:1;transform:none}}

/* Empty / retry */
.yt-empty{text-align:center;padding:40px 20px;color:var(--muted,#94a3b8)}
.yt-empty-icon{font-size:44px;margin-bottom:8px;animation:pulse 1.8s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:.5;transform:scale(1)}50%{opacity:1;transform:scale(1.1)}}
.yt-empty .btn{margin-top:12px}

/* ============ v16: YT video card theming + strong animated border ============ */
/* Light mode (default) */
.vcard{background:#ffffff !important;color:#0f172a !important;border:1px solid rgba(15,23,42,.08)}
.vcard .vbody h3{color:#0f172a}
.vcard .vmeta{color:#475569;opacity:1}
.vcard-skeleton{background:#f1f5f9 !important;border-color:rgba(15,23,42,.06)}

/* Dark mode — high contrast, readable text */
.dark .vcard,[data-theme="dark"] .vcard{background:#111827 !important;color:#f8fafc !important;border-color:rgba(255,255,255,.10)}
.dark .vcard .vbody h3,[data-theme="dark"] .vcard .vbody h3{color:#f8fafc}
.dark .vcard .vmeta,[data-theme="dark"] .vcard .vmeta{color:#cbd5e1;opacity:1}
.dark .vcard-skeleton,[data-theme="dark"] .vcard-skeleton{background:#1e293b !important;border-color:rgba(255,255,255,.06)}
.dark .vcard:hover,[data-theme="dark"] .vcard:hover{box-shadow:0 25px 55px -12px rgba(124,58,237,.55)}

/* Guaranteed rotating gradient border (works everywhere; big square rotates uniformly) */
.vcard{position:relative;isolation:isolate;overflow:hidden}
.vcard::after{
  content:"";position:absolute;top:50%;left:50%;
  width:200%;padding-bottom:200%;
  transform:translate(-50%,-50%);
  background:conic-gradient(from 0deg,#7c3aed,#ec4899,#f59e0b,#10b981,#06b6d4,#7c3aed);
  animation:vrot 4s linear infinite;
  z-index:0;pointer-events:none;opacity:.9;
}
.vcard::before{content:"";position:absolute;inset:2px;border-radius:15px;background:inherit;z-index:1;pointer-events:none;
  -webkit-mask:none;mask:none;animation:none;padding:0;}
.vcard:hover::after{animation-duration:2s;opacity:1}
.vcard > *{position:relative;z-index:2}
@keyframes vrot{to{transform:translate(-50%,-50%) rotate(360deg)}}


/* Glow pulse */
.vcard{box-shadow:0 6px 20px rgba(124,58,237,.12),0 0 0 rgba(124,58,237,0)}
.dark .vcard{box-shadow:0 6px 20px rgba(0,0,0,.35)}

/* Cart item removal / update animation */
.cart-item{transition:opacity .3s,transform .3s,max-height .3s}
.cart-item.removing{opacity:0;transform:translateX(-30px);max-height:0;overflow:hidden;margin:0;padding:0;border:0}
.qv{transition:transform .15s}
.qv.bump{transform:scale(1.35);color:var(--c-primary)}


/* ============ v17: Animated Home Cards + Modern Product Cards ============ */
/* Dual card: animated conic bg, floating orbs, sparkles */
.dual-card{isolation:isolate}
.dual-card::before{content:"";position:absolute;inset:-2px;border-radius:26px;padding:2px;
  background:conic-gradient(from var(--dcAng,0deg),#fff,rgba(255,255,255,.2),#fff,rgba(255,255,255,.4),#fff);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  opacity:.55;animation:dcRing 6s linear infinite;pointer-events:none;z-index:0}
@property --dcAng{syntax:'<angle>';inherits:false;initial-value:0deg}
@keyframes dcRing{to{--dcAng:360deg}}
.dc-giveaway{background:linear-gradient(135deg,#7c3aed 0%,#ec4899 40%,#f43f5e 80%,#f59e0b 100%);background-size:200% 200%;animation:dcGrad 8s ease infinite}
.dc-store{background:linear-gradient(135deg,#0ea5e9 0%,#06b6d4 40%,#10b981 80%,#84cc16 100%);background-size:200% 200%;animation:dcGrad 8s ease infinite}
@keyframes dcGrad{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
.dc-orb{position:absolute;border-radius:50%;filter:blur(30px);opacity:.55;pointer-events:none;z-index:0;mix-blend-mode:screen}
.dc-orb1{width:180px;height:180px;background:#fff;top:-40px;left:-40px;animation:orbFloat1 10s ease-in-out infinite}
.dc-orb2{width:140px;height:140px;background:#fef08a;bottom:-30px;right:-30px;animation:orbFloat2 12s ease-in-out infinite}
.dc-orb3{width:100px;height:100px;background:#a78bfa;top:40%;right:20%;animation:orbFloat3 9s ease-in-out infinite}
.dc-giveaway .dc-orb2{background:#fbcfe8}
.dc-giveaway .dc-orb3{background:#fda4af}
.dc-store .dc-orb2{background:#a7f3d0}
.dc-store .dc-orb3{background:#7dd3fc}
@keyframes orbFloat1{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(30px,20px) scale(1.15)}}
@keyframes orbFloat2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-25px,-15px) scale(1.2)}}
@keyframes orbFloat3{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-20px,25px) scale(.85)}}
.dc-sparkles{position:absolute;inset:0;pointer-events:none;z-index:1}
.dc-sparkles span{position:absolute;color:#fff;text-shadow:0 0 12px rgba(255,255,255,.9);font-size:16px;animation:spark 3s ease-in-out infinite;opacity:0}
.dc-sparkles span:nth-child(1){top:15%;left:12%;animation-delay:0s;font-size:14px}
.dc-sparkles span:nth-child(2){top:70%;left:18%;animation-delay:.6s;font-size:20px}
.dc-sparkles span:nth-child(3){top:20%;right:15%;animation-delay:1.2s;font-size:12px}
.dc-sparkles span:nth-child(4){top:60%;right:10%;animation-delay:1.8s;font-size:18px}
.dc-sparkles span:nth-child(5){top:40%;left:50%;animation-delay:2.4s;font-size:16px}
@keyframes spark{0%,100%{opacity:0;transform:scale(.5) rotate(0)}50%{opacity:1;transform:scale(1.2) rotate(180deg)}}
.dc-icon,.dual-card h2,.dual-card p,.dc-btn{position:relative;z-index:2}
.dc-btn{transition:all .3s}
.dual-card:hover .dc-btn{background:rgba(255,255,255,.35);transform:translateY(-2px) scale(1.05);box-shadow:0 10px 25px rgba(0,0,0,.25)}

/* Modern product card */
.p-card-modern{padding:10px;background:var(--c-card,#fff);position:relative}
.dark .p-card-modern{background:#1e293b}
.p-card-modern .p-thumb-wrap{position:relative;border-radius:20px;overflow:hidden;isolation:isolate}
.p-card-modern .p-thumb{position:relative;aspect-ratio:1/1;border-radius:20px;overflow:hidden;background:linear-gradient(135deg,#f8fafc,#e2e8f0);display:flex;align-items:center;justify-content:center}
.dark .p-card-modern .p-thumb{background:linear-gradient(135deg,#334155,#1e293b)}
.p-card-modern .p-thumb::after{display:none}
.p-img-el{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s cubic-bezier(.2,.9,.3,1.2)}
.p-card-modern:hover .p-img-el{transform:scale(1.08) rotate(-1deg)}
.p-thumb-empty{font-size:60px;opacity:.35}
.p-thumb-glow{position:absolute;inset:-3px;border-radius:22px;background:conic-gradient(from var(--pAng,0deg),#7c3aed,#ec4899,#f59e0b,#10b981,#0ea5e9,#7c3aed);opacity:0;transition:opacity .4s;z-index:0;animation:pGlow 5s linear infinite;filter:blur(6px)}
@property --pAng{syntax:'<angle>';inherits:false;initial-value:0deg}
@keyframes pGlow{to{--pAng:360deg}}
.p-card-modern:hover .p-thumb-glow{opacity:.85}
.p-thumb-shine{position:absolute;top:0;left:-100%;width:60%;height:100%;background:linear-gradient(115deg,transparent,rgba(255,255,255,.5),transparent);transform:skewX(-20deg);pointer-events:none;transition:left .7s}
.p-card-modern:hover .p-thumb-shine{left:130%}
.p-quick-cart{position:absolute;bottom:10px;right:10px;width:38px;height:38px;border-radius:50%;border:0;background:rgba(255,255,255,.95);color:#7c3aed;font-size:17px;display:grid;place-items:center;cursor:pointer;opacity:0;transform:translateY(10px) scale(.8);transition:all .3s cubic-bezier(.2,.9,.3,1.4);box-shadow:0 8px 20px rgba(0,0,0,.2);z-index:3}
.p-card-modern:hover .p-quick-cart{opacity:1;transform:translateY(0) scale(1)}
.p-quick-cart:hover{background:#7c3aed;color:#fff;transform:scale(1.15) rotate(-8deg)}
.p-card-modern .p-badge,.p-card-modern .p-off{z-index:3;animation:pBadgeIn .5s ease .1s both}
@keyframes pBadgeIn{from{opacity:0;transform:translateY(-8px) scale(.7)}}
.p-card-modern .p-cart-btn{background:linear-gradient(135deg,#7c3aed,#ec4899);position:relative;overflow:hidden}
.p-card-modern .p-cart-btn::after{content:"";position:absolute;top:0;left:-100%;width:60%;height:100%;background:linear-gradient(115deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-20deg);transition:left .6s}
.p-card-modern:hover .p-cart-btn::after{left:120%}
.p-card-modern .p-cart-btn .pcb-ic{display:inline-block;transition:transform .3s}
.p-card-modern:hover .p-cart-btn .pcb-ic{transform:rotate(-15deg) scale(1.2)}
.fade-in{animation:fadeInUp .45s ease both}
@keyframes fadeInUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* Cart chip active bump */
.cat-chip{position:relative;overflow:hidden}
.cat-chip.active{animation:chipPop .35s cubic-bezier(.2,.9,.3,1.6)}
@keyframes chipPop{0%{transform:scale(.9)}60%{transform:scale(1.08)}100%{transform:scale(1)}}


/* ============================================================
   V18 — Gadget Insider Bangla brand theme + infinite video scroll
   ============================================================ */
:root{
  --gib-red:#ef2b2d; --gib-orange:#ff6a00; --gib-yellow:#ffd60a;
  --gib-cyan:#00d4ff; --gib-navy:#0b1220; --gib-dark:#111827;
  --grad: linear-gradient(135deg,#ef2b2d 0%,#ff6a00 60%,#ffd60a 100%);
  --grad-cool: linear-gradient(135deg,#00d4ff 0%,#3b82f6 100%);
  --shadow-lg: 0 20px 60px -15px rgba(239,43,45,.45);
}
[data-theme="light"] body{background:linear-gradient(180deg,#fff7f5 0%,#fff 60%,#f2f6ff 100%)}
[data-theme="dark"]  body{background:radial-gradient(ellipse at top,#1a1330 0%,#0b1220 55%,#04060d 100%)}
body::before{background:radial-gradient(closest-side,rgba(239,43,45,.28),transparent) !important}
body::after {background:radial-gradient(closest-side,rgba(0,212,255,.22),transparent) !important}

.btn-primary,.btn-hero,.btn-lg{background:var(--grad) !important;color:#fff}
.dual-card.dc-giveaway{background:linear-gradient(135deg,#ef2b2d,#ff6a00 55%,#ffd60a) !important}
.dual-card.dc-store   {background:linear-gradient(135deg,#0b1220,#1e3a8a 55%,#00d4ff) !important}
.store-hero{background:linear-gradient(135deg,#0b1220,#1e3a8a,#00d4ff) !important}

/* Infinite scroll loader */
.yt-sentinel{height:1px;width:100%}
.yt-loader{display:flex;align-items:center;justify-content:center;gap:12px;padding:26px 0;color:var(--gib-cyan);font-weight:600}
.yt-loader .yt-spin{width:26px;height:26px;border-radius:50%;border:3px solid rgba(0,212,255,.2);border-top-color:var(--gib-cyan);animation:spin 0.9s linear infinite}
.yt-end{text-align:center;padding:22px 0;opacity:.65;font-weight:600;letter-spacing:.3px}
@keyframes spin{to{transform:rotate(360deg)}}

/* ============================================================
   V19 — GADGET INSIDER BANGLA OFFICIAL BRAND (final override)
   Electric cyan + deep blue on jet-black, signal-yellow accent.
   This block MUST stay last to overpower legacy purple/red rules.
   ============================================================ */
:root{
  --gib-cyan:#00c8ff;
  --gib-cyan-2:#22e0ff;
  --gib-blue:#0057ff;
  --gib-blue-2:#003bd1;
  --gib-yellow:#ffd60a;
  --gib-ink:#050818;
  --gib-ink-2:#0a1030;
  --gib-line:rgba(0,200,255,.18);
  --brand-1:var(--gib-cyan); --brand-2:var(--gib-blue); --brand-3:var(--gib-yellow);
  --c-primary:var(--gib-cyan); --c-primary-2:var(--gib-blue); --c-accent:var(--gib-yellow);
  --c-gold:var(--gib-yellow);
  --grad:linear-gradient(135deg,var(--gib-cyan) 0%,var(--gib-blue) 100%);
  --grad-main:linear-gradient(135deg,var(--gib-cyan) 0%,var(--gib-blue) 55%,#001a66 100%);
  --grad-cool:linear-gradient(135deg,var(--gib-cyan),var(--gib-blue));
  --grad-gold:linear-gradient(135deg,#ffe066,var(--gib-yellow));
  --shadow-glow:0 20px 60px -18px rgba(0,200,255,.55), 0 0 0 1px rgba(0,200,255,.15) inset;
  --shadow-xl:0 30px 80px -22px rgba(0,87,255,.45);
  --shadow-lg:0 18px 50px -18px rgba(0,200,255,.45);
  --radius:18px;
}

/* Dark = default */
html,body{background:var(--gib-ink);color:#e6f2ff}
body{background:radial-gradient(1200px 800px at 15% -10%,rgba(0,200,255,.18),transparent 55%),
                 radial-gradient(1000px 700px at 110% 10%,rgba(0,87,255,.22),transparent 55%),
                 radial-gradient(900px 700px at 50% 120%,rgba(255,214,10,.10),transparent 60%),
                 var(--gib-ink)!important;min-height:100vh}
body::before,body::after{display:none!important}
body.bg-particles::before{content:'';display:block!important;position:fixed;inset:0;z-index:-1;
  background:
    linear-gradient(rgba(0,200,255,.05) 1px,transparent 1px) 0 0/40px 40px,
    linear-gradient(90deg,rgba(0,200,255,.05) 1px,transparent 1px) 0 0/40px 40px;
  mask-image:radial-gradient(ellipse at center,#000 30%,transparent 75%);
  animation:gridShift 30s linear infinite}
@keyframes gridShift{to{background-position:40px 40px,40px 40px}}

/* Light theme (crisp, tech-editorial) */
[data-theme="light"] body{background:linear-gradient(180deg,#f4f9ff 0%,#e9f2ff 100%)!important;color:#0a1030}
[data-theme="light"]{--gib-line:rgba(0,87,255,.14)}
[data-theme="light"] .site-header{background:rgba(255,255,255,.9)!important;border-bottom:1px solid var(--gib-line)}
[data-theme="light"] .card,[data-theme="light"] .gcard,[data-theme="light"] .wcard,[data-theme="light"] .faq,[data-theme="light"] .task-item,[data-theme="light"] .quiz-q{background:#fff;border:1px solid #dfeaff;box-shadow:0 6px 18px rgba(0,60,150,.06)}

/* Header — sleek carbon glass with cyan under-line */
.site-header{background:linear-gradient(180deg,rgba(5,8,24,.85),rgba(5,8,24,.6))!important;
  backdrop-filter:blur(16px) saturate(160%);border-bottom:1px solid var(--gib-line);
  box-shadow:0 1px 0 rgba(0,200,255,.15),0 20px 40px -30px rgba(0,200,255,.4)}
.brand{background:linear-gradient(135deg,var(--gib-cyan),#fff 60%,var(--gib-yellow))!important;
  -webkit-background-clip:text;background-clip:text;color:transparent!important;letter-spacing:.3px}
.main-nav a{position:relative;color:#cfe6ff;padding:6px 2px;transition:color .2s}
.main-nav a:hover{color:var(--gib-cyan)}
.main-nav a::after{content:'';position:absolute;left:0;right:0;bottom:-4px;height:2px;background:linear-gradient(90deg,var(--gib-cyan),var(--gib-yellow));transform:scaleX(0);transform-origin:right;transition:transform .3s}
.main-nav a:hover::after{transform:scaleX(1);transform-origin:left}

/* Buttons — cyan glow with yellow spark */
.btn,.btn-primary,.btn-hero,.btn-lg{background:var(--grad)!important;color:#00131f!important;font-weight:800;
  border:0;letter-spacing:.2px;box-shadow:0 12px 30px -10px rgba(0,200,255,.6),inset 0 0 0 1px rgba(255,255,255,.25)}
.btn:hover,.btn-primary:hover,.btn-hero:hover,.btn-lg:hover{transform:translateY(-2px);
  box-shadow:0 18px 40px -12px rgba(0,200,255,.75),inset 0 0 0 1px rgba(255,255,255,.35),0 0 0 3px rgba(255,214,10,.25)}
.btn-sm{background:rgba(0,200,255,.12);border:1px solid var(--gib-line);color:#cfe6ff!important}

/* Cards — jet-black glass with cyan halo on hover */
.card,.gcard,.wcard,.faq{background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.02))!important;
  border:1px solid var(--gib-line)!important;backdrop-filter:blur(10px);position:relative}
.gcard{overflow:hidden;isolation:isolate}
.gcard::before{background:conic-gradient(from 0deg,var(--gib-cyan),var(--gib-blue),var(--gib-yellow),var(--gib-cyan))!important;
  filter:blur(30px);opacity:0;transition:opacity .5s;mix-blend-mode:screen!important}
.gcard:hover::before{opacity:.35}
.gcard:hover{transform:translateY(-8px);border-color:var(--gib-cyan)!important;
  box-shadow:0 30px 60px -20px rgba(0,200,255,.5)!important}

/* Hero — dynamic gradient title */
.hero-title{background:linear-gradient(90deg,var(--gib-cyan),#fff 40%,var(--gib-yellow) 70%,var(--gib-cyan))!important;
  background-size:200% auto!important;-webkit-background-clip:text;background-clip:text;color:transparent!important;
  animation:shine 6s linear infinite}
@keyframes shine{to{background-position:200% center}}

/* Status badges — tech look */
.badge.status-live{background:linear-gradient(135deg,#00e07a,#00b25f)!important;color:#001a10!important;
  box-shadow:0 0 0 0 rgba(0,224,122,.6);animation:pulseBadge 1.8s infinite}
.badge.status-upcoming{background:linear-gradient(135deg,var(--gib-yellow),#f5a800)!important;color:#1a1400!important}
.badge.status-ended{background:linear-gradient(135deg,#6b7280,#374151)!important;color:#fff!important}

/* Countdown chips */
.countdown-big span{background:linear-gradient(180deg,rgba(0,200,255,.14),rgba(0,87,255,.08))!important;
  border:1px solid var(--gib-line)!important;color:var(--gib-cyan)!important;
  text-shadow:0 0 12px rgba(0,200,255,.5)}

/* Stat cards */
.stat{background:var(--grad-main)!important;color:#00131f!important;
  box-shadow:0 20px 40px -18px rgba(0,87,255,.55)}
.stat-n{text-shadow:0 2px 0 rgba(0,0,0,.15)}

/* Winners */
.wavatar{background:linear-gradient(135deg,var(--gib-cyan),var(--gib-blue))!important;color:#00131f!important}
.winner-row.win{background:linear-gradient(90deg,rgba(255,214,10,.18),rgba(0,200,255,.08))!important;
  border-color:rgba(255,214,10,.45)!important}
.winner-row.win .wrank{color:var(--gib-yellow)!important}

/* Loader — hex ring */
#pageLoader{background:var(--gib-ink)!important}
.ldr{background:conic-gradient(var(--gib-cyan),var(--gib-blue),var(--gib-yellow),var(--gib-cyan))!important;
  border-radius:50%;mask:radial-gradient(circle at center,transparent 55%,#000 56%);
  animation:spin 1.4s linear infinite!important}

/* Footer */
.site-footer{background:linear-gradient(180deg,#050818,#020410)!important;border-top:1px solid var(--gib-line)}
.site-footer h4,.site-footer h5{color:var(--gib-cyan)!important}
.site-footer a:hover{color:var(--gib-yellow)!important}

/* Home dual hero cards — GIB electric */
.dual-hero .card, .dual-card{background:linear-gradient(140deg,#0a1030 0%,#050818 60%)!important;
  border:1px solid var(--gib-line)!important;position:relative;overflow:hidden;isolation:isolate}
.dual-hero .card::before, .dual-card::before{content:'';position:absolute;inset:-2px;z-index:-1;
  background:conic-gradient(from 0deg,var(--gib-cyan),var(--gib-blue),var(--gib-yellow),var(--gib-cyan));
  filter:blur(30px);opacity:.45;animation:spin 12s linear infinite}

/* Product cards */
.p-card-modern:hover{box-shadow:0 25px 60px -15px rgba(0,200,255,.4)!important}

/* Track / timeline dots */
.timeline .dot,.track-step .dot{background:var(--grad)!important;box-shadow:0 0 0 4px rgba(0,200,255,.15)}

/* Video card border animation (masculine cyan/blue) */
.yt-card{border:1px solid var(--gib-line)!important;background:#080c22!important}
.yt-card,.yt-card *{color:#e6f2ff}
.yt-card .yt-title{color:#fff!important;text-shadow:0 1px 2px rgba(0,0,0,.6)}
[data-theme="light"] .yt-card{background:#fff!important;border:1px solid #dfeaff!important}
[data-theme="light"] .yt-card .yt-title{color:#0a1030!important;text-shadow:none}
.yt-card::before{background:conic-gradient(from 0deg,var(--gib-cyan),var(--gib-blue),var(--gib-yellow),var(--gib-cyan))!important}

/* Text selection */
::selection{background:var(--gib-cyan);color:#00131f}

/* Focus ring */
input:focus,textarea:focus,select:focus{border-color:var(--gib-cyan)!important;
  box-shadow:0 0 0 3px rgba(0,200,255,.2)!important}

/* Scrollbar */
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:linear-gradient(var(--gib-cyan),var(--gib-blue));border-radius:10px}

/* ===== v21 polish ===== */

/* Smoother global transitions — kill jarring theme/color jumps */
html, body { transition: background-color .35s ease, color .35s ease; }
.site-header, .dual-card, .p-card, .vcard, .card, .btn-primary, .btn-ghost, .cat-chip {
  transition: background-color .3s ease, border-color .3s ease, color .3s ease,
              box-shadow .35s ease, transform .25s ease;
}
* { -webkit-tap-highlight-color: transparent; }
img { transition: opacity .3s ease; }

/* Home popular products section */
.sec-home-products { padding: 56px 0 40px; }
.sec-home-products .hp-head {
  display: flex; align-items: end; justify-content: space-between;
  gap: 16px; margin-bottom: 24px; flex-wrap: wrap;
}
.sec-home-products .sec-sub {
  color: var(--muted, #94a3b8); margin: 6px 0 0; font-size: 14px;
}
.sec-home-products .hp-view-all {
  padding: 10px 18px; border-radius: 999px;
  background: var(--grad); color: #fff; font-weight: 700;
  text-decoration: none; box-shadow: 0 6px 20px rgba(0,120,255,.25);
  transition: transform .2s ease, box-shadow .3s ease;
}
.sec-home-products .hp-view-all:hover {
  transform: translateY(-2px); box-shadow: 0 10px 28px rgba(0,120,255,.35);
}
.p-grid-home {
  display: grid; gap: 20px;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
}
@media (max-width: 640px) {
  .p-grid-home { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .sec-home-products { padding: 36px 0 24px; }
  .sec-home-products .hp-head { align-items: center; }
  .sec-home-products .hp-view-all { padding: 8px 14px; font-size: 13px; }
}

/* Store — single unified grid (no featured split) */
.store-cats { position: sticky; top: 0; z-index: 20; }

/* ============ v22: Smooth navigation — no more black flash ============ */
/* Neutralize old full-screen loader (kept for any legacy include) */
#pageLoader{display:none!important}

/* YouTube-style top progress bar */
#navProgress{
  position:fixed; top:0; left:0; right:0; height:3px;
  background:transparent; z-index:99999; pointer-events:none;
  overflow:hidden;
}
#navProgress::before{
  content:""; display:block; height:100%; width:0%;
  background:linear-gradient(90deg, var(--gib-cyan,#00c8ff), var(--gib-blue,#0057ff), var(--gib-yellow,#ffd60a));
  box-shadow:0 0 12px rgba(0,200,255,.7), 0 0 24px rgba(0,87,255,.4);
  transition:width .35s ease-out, opacity .3s ease;
  opacity:0;
}
#navProgress.go::before{ width:85%; opacity:1; transition:width 8s cubic-bezier(.15,.85,.25,1); }
#navProgress.done::before{ width:100%; opacity:0; transition:width .25s ease-out, opacity .35s ease .1s; }

/* Page fade-in on load — replaces the black-screen loader */
.page-fade{ animation: pageIn .35s ease-out both; }
@keyframes pageIn{
  from{ opacity:0; transform:translateY(6px); }
  to  { opacity:1; transform:translateY(0); }
}

/* Prevent white/black flash between pages: honor theme background immediately */
html, body{ background:var(--gib-ink, #0b0d1a); }
html:not(.dark), html[data-theme="light"]{ background:#f5f7fb; }
html:not(.dark) body, html[data-theme="light"] body{ background:#f5f7fb; }

/* ===== v24: Separate Track chooser & switch ===== */
.track-switch{display:flex;gap:8px;justify-content:center;margin:0 auto 24px;flex-wrap:wrap}
.track-switch .ts-btn{padding:10px 18px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(0,200,255,.25);color:inherit;text-decoration:none;font-weight:600;transition:.25s}
.track-switch .ts-btn:hover{transform:translateY(-2px);border-color:#00c8ff;box-shadow:0 6px 20px rgba(0,200,255,.25)}
.track-switch .ts-btn.active{background:linear-gradient(135deg,#00c8ff,#0057ff);color:#fff;border-color:transparent;box-shadow:0 8px 24px rgba(0,87,255,.35)}
.track-choose{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;margin-top:24px}
.tc-card{position:relative;padding:32px 26px;border-radius:22px;text-decoration:none;color:inherit;overflow:hidden;background:rgba(255,255,255,.04);border:1px solid rgba(0,200,255,.2);transition:.35s cubic-bezier(.2,.9,.3,1.2);text-align:center}
.tc-card::before{content:"";position:absolute;inset:-2px;border-radius:22px;padding:2px;background:conic-gradient(from 0deg,#00c8ff,#0057ff,#ffd60a,#00c8ff);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:.4s;animation:spin 6s linear infinite}
.tc-card:hover::before{opacity:1}
.tc-card:hover{transform:translateY(-6px) scale(1.02);box-shadow:0 20px 50px rgba(0,200,255,.25)}
.tc-card .tc-icon{font-size:56px;margin-bottom:10px;filter:drop-shadow(0 4px 12px rgba(0,200,255,.4))}
.tc-card h2{margin:8px 0 10px;font-size:1.4rem}
.tc-card p{opacity:.75;margin-bottom:18px;font-size:.95rem}
.tc-card.store .tc-icon{filter:drop-shadow(0 4px 12px rgba(255,214,10,.5))}
@keyframes spin{to{transform:rotate(360deg)}}

/* ========= v25 PREMIUM TRACKING UI ========= */
.track-hero{position:relative;text-align:center;padding:56px 20px 40px;margin-bottom:28px;border-radius:28px;overflow:hidden;
  background:radial-gradient(1200px 400px at 50% -10%,rgba(0,200,255,.28),transparent 60%),radial-gradient(800px 300px at 90% 110%,rgba(255,214,10,.18),transparent 60%),linear-gradient(135deg,rgba(10,15,30,.85),rgba(20,30,55,.75));
  border:1px solid rgba(0,200,255,.22);box-shadow:0 30px 80px -30px rgba(0,87,255,.5),inset 0 1px 0 rgba(255,255,255,.06)}
.track-hero::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(0,200,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(0,200,255,.06) 1px,transparent 1px);background-size:36px 36px;mask-image:radial-gradient(ellipse at center,#000 40%,transparent 75%);pointer-events:none;animation:gridDrift 22s linear infinite}
@keyframes gridDrift{to{background-position:36px 36px}}
.track-hero .th-eyebrow{display:inline-block;padding:6px 14px;border-radius:999px;background:rgba(0,200,255,.12);border:1px solid rgba(0,200,255,.35);font-size:.78rem;letter-spacing:.15em;text-transform:uppercase;font-weight:700;color:#00c8ff;margin-bottom:14px}
.track-hero h1{font-size:clamp(1.8rem,4vw,2.6rem);margin:0 0 10px;background:linear-gradient(135deg,#fff 20%,#00c8ff 60%,#ffd60a 100%);-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:800;letter-spacing:-.02em}
.track-hero p{opacity:.85;max-width:560px;margin:0 auto;font-size:1rem}
.track-hero .th-stats{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:22px;position:relative;z-index:2}
.th-stat{padding:10px 16px;border-radius:14px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);backdrop-filter:blur(10px);font-size:.85rem}
.th-stat b{color:#00c8ff;margin-right:6px}

/* Chooser cards refresh */
.track-choose{margin-top:8px}
.tc-card{padding:38px 28px;border-radius:26px}
.tc-card .tc-icon{width:88px;height:88px;margin:0 auto 14px;display:flex;align-items:center;justify-content:center;font-size:44px;border-radius:24px;background:linear-gradient(135deg,rgba(0,200,255,.18),rgba(0,87,255,.12));border:1px solid rgba(0,200,255,.3);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 10px 30px -12px rgba(0,200,255,.4)}
.tc-card.store .tc-icon{background:linear-gradient(135deg,rgba(255,214,10,.2),rgba(255,120,0,.15));border-color:rgba(255,214,10,.35);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 10px 30px -12px rgba(255,214,10,.45)}
.tc-features{list-style:none;padding:0;margin:0 0 20px;text-align:left;display:grid;gap:8px}
.tc-features li{display:flex;align-items:center;gap:10px;font-size:.9rem;opacity:.88}
.tc-features li::before{content:"✓";width:22px;height:22px;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:linear-gradient(135deg,#00c8ff,#0057ff);color:#fff;font-weight:800;font-size:.7rem;box-shadow:0 4px 10px -2px rgba(0,200,255,.5)}
.tc-card.store .tc-features li::before{background:linear-gradient(135deg,#ffd60a,#ff7a00);box-shadow:0 4px 10px -2px rgba(255,180,0,.5)}

/* Premium track form */
.track-form{padding:28px !important;border-radius:24px !important;background:linear-gradient(135deg,rgba(15,20,40,.6),rgba(10,15,30,.4)) !important;border:1px solid rgba(0,200,255,.2) !important;box-shadow:0 20px 60px -20px rgba(0,87,255,.35),inset 0 1px 0 rgba(255,255,255,.05) !important;position:relative;overflow:hidden}
.track-form::before{content:"";position:absolute;top:0;left:-100%;width:100%;height:2px;background:linear-gradient(90deg,transparent,#00c8ff,transparent);animation:shimmer 3s ease-in-out infinite}
@keyframes shimmer{50%{left:100%}}
.track-form .form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:16px}
@media(max-width:640px){.track-form .form-row{grid-template-columns:1fr}}
.track-form label{display:block;font-size:.82rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;opacity:.75;margin-bottom:6px}
.track-form input{width:100%;padding:14px 16px;margin-top:6px;background:rgba(0,0,0,.35);border:1.5px solid rgba(0,200,255,.2);border-radius:14px;color:inherit;font-size:1rem;font-family:inherit;transition:.25s}
.track-form input:focus{outline:none;border-color:#00c8ff;background:rgba(0,0,0,.5);box-shadow:0 0 0 4px rgba(0,200,255,.15)}
.track-form .btn-lg{width:100%;padding:16px;font-size:1.05rem;font-weight:700;letter-spacing:.02em;border-radius:14px;background:linear-gradient(135deg,#00c8ff 0%,#0057ff 100%);border:none;color:#fff;cursor:pointer;box-shadow:0 12px 30px -8px rgba(0,87,255,.6);transition:.3s}
.track-form .btn-lg:hover{transform:translateY(-2px);box-shadow:0 18px 40px -8px rgba(0,87,255,.75)}

/* Result card premium */
.track-result{padding:32px !important;border-radius:26px !important;background:linear-gradient(135deg,rgba(15,20,40,.75),rgba(10,15,30,.55)) !important;border:1px solid rgba(0,200,255,.25) !important;box-shadow:0 30px 80px -30px rgba(0,87,255,.5),inset 0 1px 0 rgba(255,255,255,.06) !important;position:relative;overflow:hidden;margin-top:20px}
.track-result::after{content:"";position:absolute;top:-100px;right:-100px;width:300px;height:300px;background:radial-gradient(circle,rgba(0,200,255,.15),transparent 70%);pointer-events:none;animation:float 8s ease-in-out infinite}
@keyframes float{50%{transform:translate(-30px,30px) scale(1.1)}}
.tr-head{padding-bottom:20px;border-bottom:1px dashed rgba(0,200,255,.2);margin-bottom:24px !important}
.tr-head h2{font-size:1.5rem;font-weight:700;background:linear-gradient(135deg,#fff,#00c8ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.badge-lg{padding:8px 18px;font-size:.85rem;font-weight:700;letter-spacing:.08em;border-radius:999px;text-transform:uppercase;box-shadow:0 8px 20px -6px rgba(0,0,0,.3)}

/* Timeline refresh */
.timeline{margin:32px 0 !important;padding:24px 12px !important;background:rgba(0,0,0,.2);border-radius:18px;border:1px solid rgba(255,255,255,.05);overflow-x:auto}
.tl-step{flex:1;min-width:80px}
.tl-dot{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;background:rgba(255,255,255,.06);border:2px solid rgba(255,255,255,.1);transition:.4s;font-size:1rem}
.tl-step.done .tl-dot{background:linear-gradient(135deg,#00c8ff,#0057ff) !important;color:#fff;border-color:transparent;box-shadow:0 8px 24px -4px rgba(0,200,255,.6),0 0 0 6px rgba(0,200,255,.12);transform:scale(1.08);animation:pulseDot 2s ease-in-out infinite}
@keyframes pulseDot{50%{box-shadow:0 8px 24px -4px rgba(0,200,255,.8),0 0 0 10px rgba(0,200,255,.05)}}
.tl-label{font-size:.78rem;font-weight:600;opacity:.6;text-align:center}
.tl-step.done .tl-label{opacity:1;color:#00c8ff}
.tl-line{flex:1;height:3px;background:rgba(255,255,255,.08);border-radius:2px;margin:0 4px;position:relative;overflow:hidden;align-self:center;margin-top:-22px}
.tl-line.done{background:linear-gradient(90deg,#00c8ff,#0057ff);box-shadow:0 0 12px rgba(0,200,255,.5)}
.tl-line.done::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.6),transparent);animation:flow 2s linear infinite}
@keyframes flow{to{transform:translateX(200%)}}

/* Info cards */
.tr-grid{grid-template-columns:repeat(auto-fit,minmax(160px,1fr)) !important;gap:14px !important}
.tr-card{padding:16px 18px;border-radius:16px;background:linear-gradient(135deg,rgba(255,255,255,.04),rgba(255,255,255,.01));border:1px solid rgba(255,255,255,.08);display:flex;flex-direction:column;gap:6px;transition:.25s;position:relative;overflow:hidden}
.tr-card:hover{transform:translateY(-3px);border-color:rgba(0,200,255,.35);box-shadow:0 12px 30px -12px rgba(0,200,255,.35)}
.tr-card span{font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;opacity:.6;font-weight:600}
.tr-card b{font-size:1.05rem;font-weight:700;color:#fff;word-break:break-word}
.tr-card.gold{background:linear-gradient(135deg,rgba(255,214,10,.15),rgba(255,120,0,.08));border-color:rgba(255,214,10,.4)}
.tr-card.gold b{background:linear-gradient(135deg,#ffd60a,#ff7a00);-webkit-background-clip:text;background-clip:text;color:transparent}

/* Winner banner premium */
.winner-banner{padding:40px 32px !important;border-radius:26px !important;background:linear-gradient(135deg,#ffd60a 0%,#ff7a00 50%,#e94560 100%) !important;color:#0a0f1e !important;box-shadow:0 30px 80px -20px rgba(255,120,0,.5) !important}
.winner-banner .wb-emoji{font-size:80px;line-height:1;margin-bottom:10px;animation:bounce 1.5s ease-in-out infinite}
@keyframes bounce{50%{transform:translateY(-14px) rotate(-8deg)}}
.winner-banner h2{color:#0a0f1e;font-weight:900;letter-spacing:-.02em}
.winner-banner p{color:rgba(10,15,30,.85);font-size:1.05rem}
.pulse-btn{animation:pulseBtn 1.8s ease-in-out infinite;background:#0a0f1e !important;color:#ffd60a !important;padding:16px 32px !important;font-size:1.1rem !important;font-weight:800 !important;border-radius:16px !important}
@keyframes pulseBtn{50%{transform:scale(1.04);box-shadow:0 0 0 12px rgba(10,15,30,.15)}}

/* Bottom actions */
.tr-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px;padding-top:20px;border-top:1px dashed rgba(0,200,255,.2)}
.tr-actions .btn{flex:1;min-width:160px;padding:12px 18px;border-radius:12px;text-align:center;font-weight:600;transition:.25s}
.btn-outline{border:1.5px solid rgba(0,200,255,.4);color:#00c8ff;background:transparent}
.btn-outline:hover{background:rgba(0,200,255,.1);border-color:#00c8ff;transform:translateY(-2px)}
.btn-ghost{background:rgba(255,255,255,.05);color:inherit}
.btn-ghost:hover{background:rgba(255,255,255,.1);transform:translateY(-2px)}

/* Track switch premium */
.track-switch{padding:6px;background:rgba(0,0,0,.3);border-radius:999px;display:inline-flex;gap:4px;margin:0 auto 28px !important;border:1px solid rgba(0,200,255,.15);box-shadow:inset 0 2px 8px rgba(0,0,0,.3)}
.track-switch{display:flex}
.ts-btn{padding:12px 22px !important;border:none !important;background:transparent !important;border-radius:999px !important}
.ts-btn.active{background:linear-gradient(135deg,#00c8ff,#0057ff) !important;box-shadow:0 8px 20px -4px rgba(0,87,255,.5)}

/* ==========================================================
   v26 — PROFESSIONAL OVERHAUL (global)
   High-end tech aesthetic · GIB brand · refined type & spacing
   ========================================================== */
:root{
  --ink-0:#05070f; --ink-1:#0a0e1c; --ink-2:#0f1424; --ink-3:#161c33;
  --line:rgba(255,255,255,.08); --line-2:rgba(255,255,255,.14);
  --text:#e8ecf5; --text-dim:#a3adc7; --text-mute:#6b7593;
  --brand:#00c8ff; --brand-2:#0057ff; --brand-3:#ffd60a;
  --grad-brand:linear-gradient(135deg,#00c8ff 0%,#0057ff 100%);
  --grad-warm:linear-gradient(135deg,#ffd60a 0%,#ff7a00 100%);
  --shadow-sm:0 2px 8px -2px rgba(0,0,0,.25);
  --shadow-md:0 8px 24px -8px rgba(0,0,0,.35);
  --shadow-lg:0 24px 60px -20px rgba(0,87,255,.35);
  --radius-sm:10px; --radius:14px; --radius-lg:20px; --radius-xl:26px;
}
html,body{background:var(--ink-0);color:var(--text);font-feature-settings:"cv02","cv03","cv04","ss01";-webkit-font-smoothing:antialiased;letter-spacing:-.005em}
[data-theme="light"] body{background:#f6f8fc;color:#0a0e1c}
[data-theme="light"]{--text:#0a0e1c;--text-dim:#4a5878;--text-mute:#8892b0;--line:rgba(10,14,28,.08);--line-2:rgba(10,14,28,.14)}
::selection{background:rgba(0,200,255,.35);color:#fff}

/* ---- Typography scale ---- */
h1,h2,h3,h4{font-weight:800;letter-spacing:-.025em;line-height:1.15;margin:0 0 .6em}
h1{font-size:clamp(1.8rem,3.4vw,2.6rem)}
h2{font-size:clamp(1.4rem,2.4vw,1.9rem)}
h3{font-size:1.15rem}
p{line-height:1.65;color:var(--text-dim)}
.mono{font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.02em}
.eyebrow{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:999px;background:rgba(0,200,255,.1);border:1px solid rgba(0,200,255,.28);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--brand)}

/* ---- Header refresh ---- */
.site-header{background:color-mix(in oklab,var(--ink-0) 78%,transparent);backdrop-filter:blur(20px) saturate(1.4);border-bottom:1px solid var(--line);padding:12px 0}
[data-theme="light"] .site-header{background:color-mix(in oklab,#fff 82%,transparent)}
.hdr-inner{display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{font-size:1.15rem;font-weight:900;letter-spacing:-.02em;display:flex;align-items:center;gap:10px}
.brand-mark{width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;border-radius:10px;background:var(--grad-brand);color:#fff;font-size:16px;box-shadow:0 6px 18px -4px rgba(0,87,255,.6),inset 0 1px 0 rgba(255,255,255,.25)}
.main-nav{display:flex;gap:6px;align-items:center}
.main-nav a{padding:9px 14px;border-radius:10px;font-weight:500;font-size:.92rem;color:var(--text-dim);transition:.2s;position:relative}
.main-nav a:hover{color:var(--text);background:rgba(255,255,255,.05)}
.main-nav a.active{color:var(--brand);background:rgba(0,200,255,.08)}
[data-theme="light"] .main-nav a:hover{background:rgba(10,14,28,.05)}
.btn-icon{width:40px;height:40px;padding:0;display:inline-flex;align-items:center;justify-content:center;border-radius:10px;background:rgba(255,255,255,.05);border:1px solid var(--line);cursor:pointer;color:inherit;transition:.2s}
.btn-icon:hover{background:rgba(0,200,255,.1);border-color:rgba(0,200,255,.3);color:var(--brand)}
.cart-pill{position:relative;width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;border-radius:10px;background:rgba(255,255,255,.05);border:1px solid var(--line);color:inherit;transition:.2s}
.cart-pill:hover{background:rgba(0,200,255,.1);border-color:rgba(0,200,255,.3);color:var(--brand)}
.cart-badge{position:absolute;top:-6px;right:-6px;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--grad-warm);color:#0a0e1c;font-size:.7rem;font-weight:800;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 4px 10px -2px rgba(255,180,0,.5)}

/* ---- Buttons refined ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 20px;border-radius:12px;font-weight:600;font-size:.94rem;letter-spacing:.005em;cursor:pointer;border:1px solid transparent;transition:transform .2s,box-shadow .2s,background .2s,border-color .2s;text-decoration:none;font-family:inherit;line-height:1}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:var(--grad-brand);color:#fff;box-shadow:0 10px 24px -8px rgba(0,87,255,.55),inset 0 1px 0 rgba(255,255,255,.2)}
.btn-primary:hover{box-shadow:0 16px 32px -8px rgba(0,87,255,.7),inset 0 1px 0 rgba(255,255,255,.25)}
.btn-secondary{background:rgba(255,255,255,.06);color:var(--text);border-color:var(--line-2)}
.btn-secondary:hover{background:rgba(0,200,255,.1);border-color:rgba(0,200,255,.3);color:var(--brand)}
.btn-outline{background:transparent;color:var(--brand);border-color:rgba(0,200,255,.4)}
.btn-outline:hover{background:rgba(0,200,255,.08);border-color:var(--brand)}
.btn-ghost{background:transparent;color:var(--text-dim);border-color:transparent}
.btn-ghost:hover{color:var(--text);background:rgba(255,255,255,.05)}
.btn-warm{background:var(--grad-warm);color:#0a0e1c;box-shadow:0 10px 24px -8px rgba(255,180,0,.5);font-weight:700}
.btn-lg{padding:14px 26px;font-size:1rem;border-radius:14px}
.btn-sm{padding:7px 14px;font-size:.82rem;border-radius:8px}

/* ---- Cards ---- */
.card{background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.01));border:1px solid var(--line);border-radius:var(--radius-lg);padding:24px;box-shadow:var(--shadow-md);transition:.3s}
[data-theme="light"] .card{background:#fff;border-color:rgba(10,14,28,.08);box-shadow:0 1px 3px rgba(10,14,28,.06),0 8px 24px -12px rgba(10,14,28,.08)}
.card:hover{border-color:var(--line-2)}
.glass{backdrop-filter:blur(20px) saturate(1.3);background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.02))}

/* ---- Hero refined ---- */
.hero{padding:90px 0 70px;position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle at 20% 10%,rgba(0,200,255,.15),transparent 50%),radial-gradient(circle at 80% 90%,rgba(255,214,10,.1),transparent 50%);pointer-events:none}
.hero-title{background:linear-gradient(135deg,var(--text) 20%,var(--brand) 55%,var(--brand-3) 100%);-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:900}
.hero-sub{color:var(--text-dim);font-size:1.05rem;max-width:600px;margin:0 auto 32px}

/* ---- Sections ---- */
.sec{padding:72px 0}
.sec-title{font-size:clamp(1.5rem,2.6vw,2rem);font-weight:800;letter-spacing:-.02em;margin:0 0 12px;text-align:center}
.sec-sub{text-align:center;color:var(--text-dim);max-width:560px;margin:0 auto 40px;font-size:1rem}

/* ---- Grid cards (giveaway/store) ---- */
.gcard-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:24px}
.gcard{background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.01));border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;transition:.35s cubic-bezier(.2,.9,.3,1.2);position:relative}
.gcard:hover{transform:translateY(-6px);border-color:rgba(0,200,255,.4);box-shadow:0 24px 60px -20px rgba(0,87,255,.45)}
.gcard-thumb{aspect-ratio:16/10}
.gcard-body{padding:20px}
.gcard-body h3{margin:0 0 6px;font-size:1.05rem;font-weight:700;letter-spacing:-.015em}
.gcard-prize{color:var(--text-dim);font-size:.88rem;margin:0 0 12px}
.gcard-count{font-family:'JetBrains Mono',monospace;font-size:.82rem;color:var(--brand);font-weight:600;padding:6px 10px;border-radius:6px;background:rgba(0,200,255,.08);display:inline-block}

/* ---- Forms ---- */
label{font-size:.82rem;font-weight:600;color:var(--text-dim);text-transform:uppercase;letter-spacing:.06em;margin:14px 0 6px}
input:not([type=checkbox]):not([type=radio]),textarea,select{background:rgba(0,0,0,.25);border:1.5px solid var(--line);border-radius:12px;padding:12px 14px;font-size:.94rem;color:var(--text);font-family:inherit;transition:.2s;width:100%}
[data-theme="light"] input:not([type=checkbox]):not([type=radio]),[data-theme="light"] textarea,[data-theme="light"] select{background:#f8fafc;border-color:#e2e8f0;color:#0a0e1c}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 4px rgba(0,200,255,.14);background:rgba(0,0,0,.35)}
[data-theme="light"] input:focus,[data-theme="light"] textarea,[data-theme="light"] select:focus{background:#fff}

/* ---- Badges ---- */
.badge{padding:5px 12px;border-radius:999px;font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;display:inline-flex;align-items:center;gap:6px}
.status-live{background:linear-gradient(135deg,#10b981,#059669);color:#fff;box-shadow:0 4px 12px -3px rgba(16,185,129,.5)}
.status-upcoming{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff}
.status-ended{background:rgba(107,114,128,.25);color:var(--text-dim);border:1px solid var(--line-2)}

/* ---- Footer ---- */
.site-footer{margin-top:80px;padding:60px 0 30px;background:linear-gradient(180deg,transparent,rgba(0,87,255,.05));border-top:1px solid var(--line);color:var(--text-dim);font-size:.9rem}
.site-footer a{color:var(--text-dim);transition:.2s}
.site-footer a:hover{color:var(--brand)}

/* ---- Product cards (store) ---- */
.pcard{background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.01));border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;transition:.35s cubic-bezier(.2,.9,.3,1.2);display:flex;flex-direction:column}
[data-theme="light"] .pcard{background:#fff;border-color:rgba(10,14,28,.08)}
.pcard:hover{transform:translateY(-6px);border-color:rgba(0,200,255,.35);box-shadow:0 24px 60px -20px rgba(0,87,255,.35)}
.pcard-img{aspect-ratio:1/1;overflow:hidden;position:relative;background:rgba(0,0,0,.2)}
.pcard-img img{width:100%;height:100%;object-fit:cover;transition:.5s}
.pcard:hover .pcard-img img{transform:scale(1.08)}
.pcard-body{padding:16px 18px;flex:1;display:flex;flex-direction:column;gap:6px}
.pcard-body h3{font-size:1rem;font-weight:600;line-height:1.35;margin:0}
.pcard-price{font-size:1.15rem;font-weight:800;color:var(--brand);margin-top:auto}
.pcard-price .old{font-size:.85rem;color:var(--text-mute);text-decoration:line-through;margin-left:8px;font-weight:500}

/* ---- Alerts / toasts ---- */
.alert{padding:14px 18px;border-radius:12px;font-weight:500;margin:12px 0;border:1px solid transparent}
.alert-error{background:rgba(239,68,68,.1);border-color:rgba(239,68,68,.3);color:#fca5a5}
.alert-success{background:rgba(16,185,129,.1);border-color:rgba(16,185,129,.3);color:#6ee7b7}
.alert-info{background:rgba(0,200,255,.08);border-color:rgba(0,200,255,.25);color:var(--brand)}

/* ---- Nav progress bar ---- */
#navProgress{position:fixed;top:0;left:0;height:3px;width:0;background:var(--grad-brand);z-index:99999;transition:width .3s ease;box-shadow:0 0 12px var(--brand);border-radius:0 2px 2px 0}
#navProgress.active{width:70%}
#navProgress.done{width:100%;opacity:0;transition:width .3s,opacity .5s .2s}

/* ---- Page transitions ---- */
.page-fade{animation:pageFade .5s cubic-bezier(.2,.9,.3,1.2)}
@keyframes pageFade{from{opacity:0;transform:translateY(8px)}}

/* ---- Admin polish ---- */
.admin-body{background:var(--ink-0)}
.admin-card{background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.01));border:1px solid var(--line);border-radius:var(--radius-lg);padding:24px;margin-bottom:20px}
.admin-table{width:100%;border-collapse:separate;border-spacing:0;background:linear-gradient(180deg,rgba(255,255,255,.03),transparent);border-radius:14px;overflow:hidden;border:1px solid var(--line)}
.admin-table th{background:rgba(0,200,255,.06);color:var(--brand);font-weight:700;font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;padding:14px 16px;text-align:left;border-bottom:1px solid var(--line)}
.admin-table td{padding:14px 16px;border-bottom:1px solid var(--line);font-size:.92rem}
.admin-table tr:last-child td{border-bottom:none}
.admin-table tr:hover td{background:rgba(0,200,255,.03)}

/* ---- Mobile ---- */
@media(max-width:768px){
  .container{padding:0 16px}
  .hero{padding:60px 0 40px}
  .sec{padding:48px 0}
  .main-nav{display:none}
  .main-nav.open{display:flex;position:fixed;top:70px;left:0;right:0;flex-direction:column;padding:20px;background:var(--ink-1);border-bottom:1px solid var(--line);z-index:40}
  .main-nav.open a{padding:14px;border-radius:10px}
}

/* Kill legacy pink/purple defaults still lingering */
.btn-primary,.btn-hero{background:var(--grad-brand)!important}
body.bg-particles::before{background:radial-gradient(circle at 15% 10%,rgba(0,200,255,.18),transparent 45%),radial-gradient(circle at 85% 80%,rgba(0,87,255,.14),transparent 45%),radial-gradient(circle at 50% 50%,rgba(255,214,10,.06),transparent 55%)}

/* ============ Professional Entry Form (Phase 15) ============ */
.entry-card-pro{position:relative;overflow:hidden;padding:28px;border-radius:22px;background:linear-gradient(180deg,var(--surface-1),var(--surface-0));border:1px solid var(--border);box-shadow:0 20px 60px -30px color-mix(in oklab,var(--brand) 40%,transparent)}
.entry-glow{position:absolute;inset:-2px;border-radius:24px;background:conic-gradient(from 0deg,transparent,color-mix(in oklab,var(--brand) 60%,transparent),transparent 30%);animation:spin 8s linear infinite;z-index:0;opacity:.35;filter:blur(20px);pointer-events:none}
.entry-card-pro > *{position:relative;z-index:1}
@keyframes spin{to{transform:rotate(360deg)}}
.entry-head{text-align:center;margin-bottom:22px}
.entry-badge{display:inline-block;padding:6px 14px;border-radius:999px;background:linear-gradient(90deg,var(--brand),var(--accent));color:#fff;font-size:12px;font-weight:700;letter-spacing:.5px;margin-bottom:10px;animation:pulseGlow 2s ease-in-out infinite}
@keyframes pulseGlow{0%,100%{box-shadow:0 0 0 0 color-mix(in oklab,var(--brand) 50%,transparent)}50%{box-shadow:0 0 0 8px transparent}}
.pf-step{margin:22px 0;padding:18px;border-radius:16px;background:color-mix(in oklab,var(--surface-1) 60%,transparent);border:1px solid var(--border);animation:slideUp .5s ease both}
@keyframes slideUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.pf-step-head{display:flex;align-items:center;gap:12px;font-weight:700;font-size:15px;margin-bottom:14px;text-transform:uppercase;letter-spacing:.4px;color:var(--ink-1)}
.pf-num{width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,var(--brand),var(--accent));color:#fff;display:grid;place-items:center;font-size:13px;box-shadow:0 4px 12px -4px var(--brand)}
.pf-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.pf-field label{display:block;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--ink-2);margin-bottom:6px}
.pf-field input,.pf-field textarea{width:100%;padding:12px 14px;border-radius:10px;border:1.5px solid var(--border);background:var(--surface-0);color:var(--ink-0);font-size:14px;transition:all .2s}
.pf-field input:focus,.pf-field textarea:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 4px color-mix(in oklab,var(--brand) 15%,transparent)}
.pf-full{grid-column:1/-1}
@media(max-width:640px){.pf-grid{grid-template-columns:1fr}}
.verify-list-pro{display:grid;gap:12px}
.verify-card{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;padding:14px 16px;border-radius:14px;background:var(--surface-0);border:1.5px solid var(--border);transition:all .25s}
.verify-card:hover{border-color:var(--brand);transform:translateY(-2px);box-shadow:0 8px 20px -12px var(--brand)}
.vc-icon{font-size:28px;width:48px;height:48px;display:grid;place-items:center;border-radius:12px;background:color-mix(in oklab,var(--brand) 12%,var(--surface-1))}
.vc-title{font-weight:700;font-size:14px;margin-bottom:2px}
.vc-visit{font-size:12px;color:var(--brand);text-decoration:none;font-weight:600}
.vc-choice{display:flex;gap:6px}
.vc-opt{cursor:pointer;padding:8px 12px;border-radius:8px;border:1.5px solid var(--border);font-size:13px;font-weight:600;transition:all .2s}
.vc-opt input{display:none}
.vc-opt:has(input:checked){background:var(--brand);color:#fff;border-color:var(--brand);transform:scale(1.05)}
.vc-yes:has(input:checked){background:#16a34a;border-color:#16a34a}
.vc-no:has(input:checked){background:#dc2626;border-color:#dc2626}
@media(max-width:520px){.verify-card{grid-template-columns:1fr;text-align:center}.vc-choice{justify-content:center}}
.pf-submit{width:100%;margin-top:20px;padding:16px;font-size:16px;font-weight:700;display:flex;align-items:center;justify-content:center;gap:10px;letter-spacing:.5px}
.pf-arrow{transition:transform .3s}
.pf-submit:hover .pf-arrow{transform:translateX(6px)}
/* IP block card */
.ip-blocked-card{text-align:center;padding:36px;border:2px solid #dc2626;background:linear-gradient(180deg,color-mix(in oklab,#dc2626 8%,var(--surface-1)),var(--surface-0))}
.ip-block-icon{font-size:56px;margin-bottom:12px;animation:shake .6s ease infinite alternate}
@keyframes shake{from{transform:rotate(-4deg)}to{transform:rotate(4deg)}}
.helpline-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:16px}

/* ============ v29: header polish + verify dropzone ============ */
.site-header{padding:10px 0}
.hdr-inner{gap:10px}
.brand{display:flex;align-items:center;gap:10px;min-width:0}
.brand img{height:34px;width:auto;flex-shrink:0}
.brand-name{font-weight:800;font-size:16px;letter-spacing:.2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;background:linear-gradient(90deg,var(--gib-cyan,#22d3ee),var(--gib-yellow,#facc15));-webkit-background-clip:text;background-clip:text;color:transparent}
.hdr-actions{gap:6px}
.btn-icon{width:40px;height:40px;display:grid;place-items:center;border-radius:12px;background:color-mix(in oklab,var(--c-primary,#22d3ee) 10%,transparent);border:1px solid color-mix(in oklab,var(--c-primary,#22d3ee) 25%,transparent);color:inherit;cursor:pointer;transition:all .2s}
.btn-icon:hover{transform:translateY(-1px);background:color-mix(in oklab,var(--c-primary,#22d3ee) 18%,transparent)}
#themeToggle .ico-moon{display:none}
html.dark #themeToggle .ico-sun,[data-theme="dark"] #themeToggle .ico-sun{display:none}
html.dark #themeToggle .ico-moon,[data-theme="dark"] #themeToggle .ico-moon{display:inline}
.nav-close{display:none}
@media(max-width:820px){
  .brand-name{font-size:14px;max-width:130px}
  .brand img{height:28px}
  .btn-icon{width:38px;height:38px}
  .main-nav .nav-close{display:grid;place-items:center;position:absolute;top:14px;right:14px;width:36px;height:36px;border-radius:10px;background:rgba(255,255,255,.12);border:0;color:#fff;font-size:18px;cursor:pointer}
  .main-nav{padding-top:60px}
}

/* Verify dropzone (v29) */
.verify-card-pro{display:flex;flex-direction:column;gap:12px;padding:14px;border-radius:16px;background:linear-gradient(140deg,color-mix(in oklab,var(--gib-cyan,#22d3ee) 6%,transparent),color-mix(in oklab,var(--gib-yellow,#facc15) 5%,transparent));border:1px solid color-mix(in oklab,var(--gib-cyan,#22d3ee) 25%,transparent);transition:all .25s}
.verify-card-pro:hover{transform:translateY(-2px);box-shadow:0 12px 28px -18px rgba(34,211,238,.4)}
.vc-top{display:flex;align-items:center;gap:12px}
.vc-icon{width:44px;height:44px;display:grid;place-items:center;border-radius:12px;background:rgba(255,255,255,.08);font-size:22px;flex-shrink:0}
.vc-body{flex:1;min-width:0}
.vc-title{font-weight:700;font-size:15px}
.vc-title .req{color:#f87171}
.vc-visit{font-size:12px;color:var(--gib-cyan,#22d3ee);text-decoration:none}
.vc-choice{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.vc-opt{display:flex;align-items:center;justify-content:center;gap:6px;padding:10px;border-radius:10px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);cursor:pointer;font-size:13px;font-weight:600;transition:all .2s}
.vc-opt input{accent-color:var(--gib-cyan,#22d3ee)}
.vc-opt:has(input:checked){background:color-mix(in oklab,var(--gib-cyan,#22d3ee) 20%,transparent);border-color:var(--gib-cyan,#22d3ee)}
.vc-no:has(input:checked){background:rgba(248,113,113,.18);border-color:#f87171}
.vc-drop{display:block;border:2px dashed color-mix(in oklab,var(--gib-cyan,#22d3ee) 45%,transparent);border-radius:14px;padding:12px;cursor:pointer;transition:all .2s;background:rgba(255,255,255,.03)}
.vc-drop:hover{background:color-mix(in oklab,var(--gib-cyan,#22d3ee) 8%,transparent);border-color:var(--gib-yellow,#facc15)}
.vc-drop-inner{display:flex;align-items:center;gap:12px}
.vc-drop-ico{font-size:26px}
.vc-drop-cta{margin-left:auto;padding:8px 14px;border-radius:10px;background:linear-gradient(90deg,var(--gib-cyan,#22d3ee),var(--gib-yellow,#facc15));color:#0b0d1a;font-weight:700;font-size:12px}
.vc-preview{position:relative;margin-top:8px}
.vc-preview img{max-height:120px;border-radius:10px;display:block}
.vc-rm{position:absolute;top:4px;left:4px;background:rgba(0,0,0,.7);color:#fff;border:0;width:26px;height:26px;border-radius:50%;cursor:pointer;font-size:14px}

/* ============ v30: tighter form spacing, subscribe CTA, alert, hero buttons ============ */
/* Form density */
.entry-card-pro{padding:20px 18px;border-radius:18px}
.entry-head{margin-bottom:14px}
.entry-head h3{margin:6px 0 4px;font-size:19px}
.entry-head p{margin:0;font-size:13px}
.pf-step{margin:12px 0;padding:14px 14px 12px;border-radius:14px}
.pf-step-head{margin-bottom:10px;font-size:13px;gap:10px}
.pf-num{width:24px;height:24px;font-size:12px}
.pf-grid{gap:10px}
.pf-field label{margin-bottom:4px;font-size:10.5px}
.pf-field input,.pf-field textarea{padding:10px 12px;font-size:13.5px}
.verify-list-pro{gap:10px}
.verify-card-pro{padding:12px;gap:10px;border-radius:14px}
.vc-top{gap:10px}
.vc-icon{width:40px;height:40px;font-size:20px;border-radius:10px}
.vc-title{font-size:14px}
.vc-choice{gap:8px}
.vc-opt{padding:9px 10px;font-size:12.5px;border-radius:9px}
.pf-submit{margin-top:14px;padding:14px;font-size:15px;border-radius:12px}

/* Platform-tinted icons */
.vc-icon-youtube{background:linear-gradient(135deg,#ff0000,#cc0000);color:#fff}
.vc-icon-facebook{background:linear-gradient(135deg,#1877f2,#0d5fcc);color:#fff}

/* Channel default CTA button (inside vc-top) */
.vc-cta-btn{display:inline-flex;align-items:center;gap:6px;padding:9px 14px;border-radius:10px;font-weight:700;font-size:12.5px;text-decoration:none;color:#fff;white-space:nowrap;flex-shrink:0;transition:transform .18s,box-shadow .18s;box-shadow:0 6px 18px -8px rgba(0,0,0,.35)}
.vc-cta-btn:hover{transform:translateY(-2px);box-shadow:0 10px 22px -10px rgba(0,0,0,.45)}
.vc-cta-youtube{background:linear-gradient(90deg,#ff0000,#e11d48)}
.vc-cta-facebook{background:linear-gradient(90deg,#1877f2,#3b82f6)}
.vc-cta-btn:not(.vc-cta-youtube):not(.vc-cta-facebook){background:linear-gradient(90deg,var(--gib-cyan,#22d3ee),var(--gib-yellow,#facc15));color:#0b0d1a}
@media(max-width:560px){
  .vc-top{flex-wrap:wrap}
  .vc-cta-btn{width:100%;justify-content:center;order:3;margin-top:2px}
}

/* No-subscribe alert */
.vc-alert{display:flex;gap:12px;padding:12px 14px;border-radius:12px;background:linear-gradient(135deg,rgba(248,113,113,.14),rgba(251,191,36,.10));border:1px solid rgba(248,113,113,.45);animation:slideUp .35s ease both}
.vc-alert-ico{font-size:24px;flex-shrink:0}
.vc-alert-body{flex:1;min-width:0}
.vc-alert-body b{display:block;font-size:13.5px;color:#fca5a5;margin-bottom:2px}
.vc-alert-body p{margin:0 0 8px;font-size:12.5px;line-height:1.5;opacity:.85}
.vc-alert-cta{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:9px;background:linear-gradient(90deg,#ef4444,#f59e0b);color:#fff;font-weight:700;font-size:12.5px;text-decoration:none}
.vc-warn{border-color:rgba(248,113,113,.55)!important;box-shadow:0 0 0 3px rgba(248,113,113,.08)}

/* Home hero buttons — text visibility fix */
.dc-btn{padding:12px 24px;background:#0b0d1a;color:#fff;border:1.5px solid rgba(255,255,255,.4);font-size:15px;font-weight:700;letter-spacing:.3px;text-shadow:0 1px 2px rgba(0,0,0,.5);box-shadow:0 8px 20px -6px rgba(0,0,0,.45)}
.dc-giveaway .dc-btn{background:linear-gradient(90deg,#facc15,#f59e0b);color:#0b0d1a;text-shadow:none;border-color:rgba(0,0,0,.15)}
.dc-store .dc-btn{background:linear-gradient(90deg,#22d3ee,#3b82f6);color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.4);border-color:rgba(255,255,255,.25)}
.dual-card:hover .dc-btn{transform:translateY(-2px) scale(1.04);box-shadow:0 14px 30px -8px rgba(0,0,0,.55)}


/* ============ v31 — Premium Giveaway Form ============ */
.entry-card-pro{
  position:relative;overflow:hidden;
  background:linear-gradient(160deg, rgba(255,255,255,.04), rgba(255,255,255,.01));
  border:1px solid rgba(148,163,184,.18);
  border-radius:22px;padding:22px;
  box-shadow:0 30px 80px -40px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.06);
}
.entry-card-pro .entry-glow{position:absolute;inset:-40%;background:radial-gradient(600px 260px at 20% 0%, rgba(56,189,248,.18), transparent 60%),radial-gradient(500px 240px at 100% 100%, rgba(250,204,21,.12), transparent 60%);pointer-events:none;animation:pfGlow 12s ease-in-out infinite alternate;}
@keyframes pfGlow{0%{transform:translate(0,0)}100%{transform:translate(3%,-2%)}}
.entry-head{position:relative;text-align:center;margin-bottom:18px}
.entry-badge{display:inline-block;font-size:11px;letter-spacing:.14em;font-weight:800;padding:6px 12px;border-radius:999px;background:linear-gradient(135deg,#22d3ee,#0891b2);color:#001018;margin-bottom:8px;text-transform:uppercase}
.entry-head h3{margin:.2em 0 .3em;font-size:1.35rem;font-weight:800;letter-spacing:-.01em}

.pro-form{position:relative;display:flex;flex-direction:column;gap:22px}
.pf-step{background:rgba(15,23,42,.35);border:1px solid rgba(148,163,184,.14);border-radius:18px;padding:18px}
@media (max-width:640px){.pf-step{padding:14px;border-radius:14px}}
.pf-step-head{display:flex;align-items:center;gap:10px;margin-bottom:14px;font-weight:800;font-size:1rem;letter-spacing:-.01em}
.pf-num{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:10px;background:linear-gradient(135deg,#22d3ee,#0284c7);color:#00131c;font-weight:900;box-shadow:0 6px 18px -6px rgba(34,211,238,.55)}

.pf-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:640px){.pf-grid{grid-template-columns:1fr;gap:12px}}
.pf-field{display:flex;flex-direction:column;gap:6px}
.pf-field.pf-full{grid-column:1/-1}
.pf-field label{font-size:.82rem;font-weight:700;letter-spacing:.02em;opacity:.85}
.pf-field input,.pf-field textarea{
  width:100%;padding:12px 14px;border-radius:12px;
  background:rgba(2,6,23,.55);
  border:1px solid rgba(148,163,184,.22);
  color:inherit;font:inherit;
  transition:border-color .2s ease, box-shadow .25s ease, transform .2s ease, background .2s ease;
}
.pf-field input:hover,.pf-field textarea:hover{border-color:rgba(148,163,184,.4)}
.pf-field input:focus,.pf-field textarea:focus{outline:none;border-color:#22d3ee;box-shadow:0 0 0 4px rgba(34,211,238,.18);background:rgba(2,6,23,.72)}

/* Verify cards */
.verify-list-pro{display:flex;flex-direction:column;gap:14px}
.verify-card-pro{position:relative;background:linear-gradient(160deg, rgba(255,255,255,.035), rgba(255,255,255,.01));border:1px solid rgba(148,163,184,.18);border-radius:16px;padding:16px;transition:border-color .25s ease, transform .25s ease, box-shadow .25s ease}
.verify-card-pro.vc-ok{border-color:rgba(34,197,94,.55);box-shadow:0 0 0 3px rgba(34,197,94,.12)}
.verify-card-pro.vc-warn{border-color:rgba(239,68,68,.55);box-shadow:0 0 0 3px rgba(239,68,68,.12);animation:vcShake .35s ease}
@keyframes vcShake{0%,100%{transform:translateX(0)}25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
.vc-top{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center}
@media (max-width:640px){.vc-top{grid-template-columns:auto 1fr;gap:10px}.vc-top .vc-cta-btn{grid-column:1/-1;justify-content:center}}
.vc-icon{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;font-weight:900;font-size:18px;color:#fff}
.vc-icon-youtube{background:linear-gradient(135deg,#ef4444,#b91c1c)}
.vc-icon-facebook{background:linear-gradient(135deg,#3b82f6,#1d4ed8)}
.vc-title{font-weight:800;font-size:.98rem}
.req{color:#f43f5e}
.vc-cta-btn{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:11px;color:#fff !important;font-weight:800;font-size:.85rem;text-decoration:none;transition:transform .2s ease, box-shadow .25s ease}
.vc-cta-btn:hover{transform:translateY(-1px)}
.vc-cta-youtube{background:linear-gradient(135deg,#ef4444,#991b1b);box-shadow:0 10px 24px -10px rgba(239,68,68,.7)}
.vc-cta-facebook{background:linear-gradient(135deg,#3b82f6,#1e40af);box-shadow:0 10px 24px -10px rgba(59,130,246,.7)}

.vc-choice{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
@media (max-width:480px){.vc-choice{grid-template-columns:1fr}}
.vc-opt{display:flex;align-items:center;gap:8px;padding:11px 12px;border-radius:12px;border:1px solid rgba(148,163,184,.22);background:rgba(2,6,23,.4);cursor:pointer;font-weight:700;font-size:.9rem;transition:all .2s ease}
.vc-opt input{accent-color:#22d3ee}
.vc-opt.vc-yes:hover{border-color:#22c55e;background:rgba(34,197,94,.08)}
.vc-opt.vc-no:hover{border-color:#ef4444;background:rgba(239,68,68,.08)}

/* Upload dropzone */
.vc-upload{margin-top:12px;animation:pfFade .3s ease both}
@keyframes pfFade{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
.vc-drop{display:block;border:2px dashed rgba(34,211,238,.4);border-radius:14px;padding:14px;cursor:pointer;background:rgba(2,6,23,.35);transition:border-color .25s ease, background .25s ease;position:relative}
.vc-drop:hover{border-color:#22d3ee;background:rgba(34,211,238,.06)}
.vc-drop.has-file{border-style:solid;border-color:#22c55e;background:rgba(34,197,94,.06)}
.vc-drop input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer}
.vc-drop-inner{display:flex;align-items:center;gap:12px}
.vc-drop-ico{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,#22d3ee,#0284c7);color:#001320;font-size:20px}
.vc-drop-text{display:flex;flex-direction:column;line-height:1.3}
.vc-preview{margin-top:10px}
.vc-preview img{max-width:100%;max-height:180px;border-radius:10px;display:block;object-fit:contain;background:#000}

/* Submit */
.pf-submit{width:100%;padding:15px 20px;font-size:1.02rem;font-weight:900;letter-spacing:.02em;border-radius:14px;background:linear-gradient(135deg,#22d3ee,#0891b2);color:#00131c;border:0;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:10px;box-shadow:0 20px 40px -18px rgba(34,211,238,.75);transition:transform .2s ease, box-shadow .25s ease}
.pf-submit:hover{transform:translateY(-1px);box-shadow:0 24px 46px -18px rgba(34,211,238,.9)}
.pf-arrow{transition:transform .2s ease}
.pf-submit:hover .pf-arrow{transform:translateX(4px)}

/* ============ Subscribe Modal ============ */
.sub-modal{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;padding:16px}
.sub-modal[hidden]{display:none}
.sub-modal-backdrop{position:absolute;inset:0;background:rgba(2,6,23,.72);backdrop-filter:blur(6px);opacity:0;transition:opacity .25s ease}
.sub-modal.open .sub-modal-backdrop{opacity:1}
.sub-modal-card{position:relative;width:100%;max-width:440px;background:linear-gradient(160deg,#0f172a,#0b1220);border:1px solid rgba(148,163,184,.18);border-radius:22px;padding:26px 22px 22px;box-shadow:0 40px 100px -30px rgba(0,0,0,.7);transform:translateY(14px) scale(.96);opacity:0;transition:transform .28s cubic-bezier(.2,.9,.3,1.2), opacity .22s ease;color:#f8fafc;text-align:center}
.sub-modal.open .sub-modal-card{transform:translateY(0) scale(1);opacity:1}
.sub-modal-x{position:absolute;top:10px;right:12px;background:transparent;border:0;color:#94a3b8;font-size:24px;cursor:pointer;line-height:1;padding:6px 10px;border-radius:8px}
.sub-modal-x:hover{background:rgba(148,163,184,.12);color:#fff}
.sub-modal-hero h3{font-size:1.3rem;font-weight:900;margin:.5em 0 .3em;letter-spacing:-.01em}
.sub-modal-hero p{color:#cbd5e1;font-size:.94rem;line-height:1.55;margin:0}
.sub-modal-badge{position:relative;width:76px;height:76px;margin:0 auto 6px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(135deg,#ef4444,#b91c1c);box-shadow:0 20px 40px -12px rgba(239,68,68,.6)}
.sm-ico{font-size:34px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.3))}
.sm-ring{position:absolute;inset:-8px;border-radius:50%;border:2px solid rgba(239,68,68,.5);animation:smPulse 1.6s ease-out infinite}
@keyframes smPulse{0%{transform:scale(.85);opacity:1}100%{transform:scale(1.25);opacity:0}}
.sub-modal-actions{display:flex;flex-direction:column;gap:10px;margin-top:20px}
.sub-modal-cta{width:100%;background:linear-gradient(135deg,#ef4444,#b91c1c) !important;color:#fff !important;font-weight:900;border:0;padding:14px 18px;border-radius:12px;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;box-shadow:0 16px 34px -14px rgba(239,68,68,.75);transition:transform .2s ease}
.sub-modal-cta:hover{transform:translateY(-1px)}
.btn-ghost{background:transparent;color:#94a3b8;border:1px solid rgba(148,163,184,.25);padding:11px 16px;border-radius:11px;cursor:pointer;font-weight:700}
.btn-ghost:hover{background:rgba(148,163,184,.08);color:#e2e8f0}

/* Light mode adjustments */
@media (prefers-color-scheme: light){
  body:not(.dark) .pf-step{background:rgba(248,250,252,.7);border-color:rgba(15,23,42,.08)}
  body:not(.dark) .pf-field input,body:not(.dark) .pf-field textarea{background:#fff;border-color:rgba(15,23,42,.12);color:#0f172a}
  body:not(.dark) .verify-card-pro{background:#fff;border-color:rgba(15,23,42,.08)}
  body:not(.dark) .vc-opt{background:#f8fafc;border-color:rgba(15,23,42,.1);color:#0f172a}
  body:not(.dark) .vc-drop{background:#f8fafc}
  body:not(.dark) .sub-modal-card{background:#fff;color:#0f172a}
  body:not(.dark) .sub-modal-hero p{color:#475569}
}

/* ================================================================
   v32 — Professional overhaul: verify, form contrast, store, nav
   ================================================================ */

/* --- Prevent FOUC "ghost" button on mobile refresh ---------------- */
.btn-icon, #themeToggle, .nav-toggle, .cart-pill { visibility: visible; }
html:not(.js-ready) .ico-sun, html:not(.js-ready) .ico-moon { display: none; }
/* show correct icon after theme applied */
html[data-theme="dark"] .ico-sun { display: inline; } html[data-theme="dark"] .ico-moon { display: none; }
html[data-theme="light"] .ico-moon { display: inline; } html[data-theme="light"] .ico-sun { display: none; }
#navProgress { opacity: 0; transition: opacity .2s; }
#navProgress.go { opacity: 1; }

/* --- Form input contrast (light + dark parity) ------------------- */
.pro-form input, .pro-form textarea, .pro-form select,
.card input[type=text], .card input[type=email], .card input[type=tel],
.card input[type=number], .card input[type=password], .card textarea, .card select {
  width:100%; background: var(--c-input-bg, #fff); color: var(--c-input-fg, #0f172a);
  border:1.5px solid var(--c-input-bd, #cbd5e1); border-radius: 12px; padding: 11px 14px;
  font: inherit; font-size: 14.5px; transition: border-color .2s, box-shadow .2s, background .2s;
}
.pro-form input::placeholder, .pro-form textarea::placeholder { color: #94a3b8; opacity: 1; }
.pro-form label { display:block; font-weight: 600; font-size: 13px; margin: 0 0 6px; color: var(--c-label, #334155); letter-spacing:.01em; }
.pro-form input:focus, .pro-form textarea:focus, .pro-form select:focus {
  outline: none; border-color: var(--c-primary);
  box-shadow: 0 0 0 4px color-mix(in oklab, var(--c-primary) 22%, transparent);
  background: var(--c-input-bg-focus, #fff);
}
:root { --c-input-bg:#fff; --c-input-fg:#0f172a; --c-input-bd:#cbd5e1; --c-input-bg-focus:#fff; --c-label:#334155; }
.dark { --c-input-bg:#0b1424; --c-input-fg:#e2e8f0; --c-input-bd:#334155; --c-input-bg-focus:#0f1b31; --c-label:#cbd5e1; }
.dark .pro-form input::placeholder, .dark .pro-form textarea::placeholder { color:#64748b; }
.dark .muted, .dark .muted.small { color:#94a3b8; }
[data-theme="light"] .muted, [data-theme="light"] .muted.small { color:#64748b; }

.pf-step { padding: 18px 16px; border-radius: 16px; background: var(--c-step, #f8fafc); border: 1px solid var(--c-step-bd, #e2e8f0); margin-bottom: 14px; }
.dark .pf-step { background: #0f1b31; border-color: rgba(148,163,184,.14); }
.pf-step-head { display:flex; align-items:center; gap:10px; font-weight:700; font-size:15px; color: var(--c-fg, #0f172a); margin-bottom: 12px; }
.dark .pf-step-head { color:#e2e8f0; }
.pf-num { width:26px; height:26px; border-radius:50%; background: var(--grad); color:#fff; display:inline-flex; align-items:center; justify-content:center; font-size:12px; font-weight:800; box-shadow:0 6px 14px -6px color-mix(in oklab, var(--c-primary) 60%, transparent); }
.pf-grid { display:grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.pf-field.pf-full { grid-column: 1 / -1; }
@media (max-width:520px){ .pf-grid { grid-template-columns: 1fr; } }
.pf-submit { width:100%; margin-top: 6px; display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:14px 20px; font-size:15px; font-weight:700; border-radius: 14px; background: var(--grad); color:#fff; border:0; cursor:pointer; box-shadow: 0 14px 30px -12px color-mix(in oklab, var(--c-primary) 55%, transparent); transition: transform .2s, box-shadow .2s; }
.pf-submit:hover { transform: translateY(-2px); box-shadow: 0 20px 40px -12px color-mix(in oklab, var(--c-primary) 65%, transparent); }
.pf-arrow { transition: transform .25s; } .pf-submit:hover .pf-arrow { transform: translateX(4px); }

/* --- v32 verification cards (clean, no default subscribe button) - */
.v2-list { display:grid; gap: 12px; }
.v2-card { position:relative; padding:14px; border-radius: 14px; background: var(--c-v-bg, #fff); border: 1.5px solid var(--c-v-bd, #e2e8f0); transition: border-color .25s, box-shadow .25s, transform .25s; }
.dark .v2-card { --c-v-bg:#0b1424; --c-v-bd:rgba(148,163,184,.16); }
.v2-card:hover { border-color: color-mix(in oklab, var(--c-primary) 40%, var(--c-v-bd)); transform: translateY(-1px); }
.v2-card.v2-ok { border-color: #10b981; background: color-mix(in oklab, #10b981 6%, var(--c-v-bg)); }
.v2-card.v2-warn { border-color: #ef4444; background: color-mix(in oklab, #ef4444 6%, var(--c-v-bg)); animation: v2Shake .35s; }
@keyframes v2Shake { 0%,100%{transform:translateX(0)} 25%{transform:translateX(-4px)} 75%{transform:translateX(4px)} }
.v2-head { display:flex; align-items:center; gap:12px; }
.v2-ico { width:40px; height:40px; border-radius:12px; display:inline-flex; align-items:center; justify-content:center; color:#fff; font-weight:800; font-size:16px; flex-shrink:0; box-shadow: 0 6px 14px -6px rgba(0,0,0,.35); }
.v2-ico-youtube { background: linear-gradient(135deg,#ff0033,#c00028); }
.v2-ico-facebook { background: linear-gradient(135deg,#1877f2,#0b5fd6); }
.v2-ico-instagram { background: linear-gradient(135deg,#f09433,#dc2743,#bc1888); }
.v2-meta { flex:1; min-width:0; }
.v2-title { font-weight: 700; font-size: 14.5px; color: var(--c-input-fg); }
.v2-sub { font-size: 12px; color: #94a3b8; margin-top:2px; }
.v2-req { color:#ef4444; }
.v2-status { color:#cbd5e1; font-size:18px; }
.v2-card.v2-ok .v2-status { color:#10b981; }
.v2-card.v2-ok .v2-status::before { content:"✓"; }
.v2-card.v2-warn .v2-status { color:#ef4444; }
.v2-card.v2-warn .v2-status::before { content:"⚠"; }

.v2-choice { display:grid; grid-template-columns: 1fr 1fr; gap:8px; margin-top: 12px; }
.v2-opt { display:flex; align-items:center; gap:8px; padding:10px 12px; border-radius: 10px; cursor:pointer; font-size:13px; font-weight:600; border:1.5px solid var(--c-v-bd); color: var(--c-input-fg); background: transparent; transition: all .2s; }
.v2-opt input { position:absolute; opacity:0; pointer-events:none; }
.v2-dot { width:16px; height:16px; border-radius:50%; border:2px solid #94a3b8; position:relative; flex-shrink:0; transition:.2s; }
.v2-opt:hover { background: color-mix(in oklab, var(--c-primary) 6%, transparent); }
.v2-opt-yes input:checked ~ .v2-dot { border-color:#10b981; background:#10b981; }
.v2-opt-yes input:checked ~ .v2-dot::after { content:""; position:absolute; inset:3px; border-radius:50%; background:#fff; }
.v2-opt-yes:has(input:checked) { border-color:#10b981; background: color-mix(in oklab,#10b981 10%, transparent); color:#059669; }
.v2-opt-no input:checked ~ .v2-dot { border-color:#ef4444; background:#ef4444; }
.v2-opt-no input:checked ~ .v2-dot::after { content:""; position:absolute; inset:3px; border-radius:50%; background:#fff; }
.v2-opt-no:has(input:checked) { border-color:#ef4444; background: color-mix(in oklab,#ef4444 10%, transparent); color:#dc2626; }
.dark .v2-opt-yes:has(input:checked) { color:#34d399; } .dark .v2-opt-no:has(input:checked) { color:#f87171; }

.v2-upload { margin-top: 10px; }
.v2-drop { display:block; padding: 14px; border: 2px dashed color-mix(in oklab, var(--c-primary) 40%, var(--c-v-bd)); border-radius: 12px; background: color-mix(in oklab, var(--c-primary) 4%, transparent); cursor:pointer; transition: all .2s; position:relative; }
.v2-drop:hover { border-color: var(--c-primary); background: color-mix(in oklab, var(--c-primary) 8%, transparent); }
.v2-drop input[type=file] { position:absolute; opacity:0; inset:0; width:100%; height:100%; cursor:pointer; }
.v2-drop-in { display:flex; align-items:center; gap:12px; }
.v2-drop-ico { width:38px; height:38px; border-radius:10px; background: var(--grad); color:#fff; display:inline-flex; align-items:center; justify-content:center; font-size:16px; }
.v2-drop-txt { display:flex; flex-direction:column; gap:2px; font-size:13.5px; color: var(--c-input-fg); }
.v2-drop-txt small { font-size:11.5px; color:#94a3b8; }
.v2-prev { position:relative; margin-top:10px; }
.v2-prev img { max-width:100%; max-height:180px; border-radius:10px; display:block; }
.v2-rm { position:absolute; top:6px; right:6px; width:28px; height:28px; border-radius:50%; border:0; background:#ef4444; color:#fff; font-size:16px; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; box-shadow:0 6px 14px -4px rgba(239,68,68,.5); }

/* --- Compact premium side slider (mobile) ----------------------- */
@media (max-width: 900px) {
  .main-nav {
    position: fixed; top:0; right:-100%; width: min(78vw, 320px); height:100vh;
    background: linear-gradient(180deg, #0b1424 0%, #0f1b31 100%); color:#e2e8f0;
    box-shadow: -20px 0 40px -10px rgba(0,0,0,.5);
    padding: 62px 16px 20px; flex-direction:column; align-items:stretch; gap:6px;
    transition: right .35s cubic-bezier(.2,.9,.3,1.2); z-index:99; overflow-y:auto;
  }
  [data-theme="light"] .main-nav { background: linear-gradient(180deg,#fff 0%, #f8fafc 100%); color:#0f172a; }
  .main-nav.open { right:0; }
  .main-nav a { color:inherit !important; padding:12px 14px; border-radius:10px; font-size:14.5px; display:flex; align-items:center; gap:10px; }
  .main-nav a:hover { background: color-mix(in oklab, var(--c-primary) 12%, transparent); }
  .nav-close { position:absolute; top:12px; right:12px; width:36px; height:36px; border-radius:10px; border:0; background: rgba(255,255,255,.08); color:inherit; font-size:18px; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; z-index:2; }
  [data-theme="light"] .nav-close { background: rgba(0,0,0,.06); }
  .nav-close:hover { background: #ef4444; color:#fff; }
}
@media (min-width: 901px) {
  .nav-close { display:none !important; }
}

/* --- Store: professional e-commerce polish ---------------------- */
.store-hero { padding: 56px 0 40px; background: linear-gradient(135deg, #0a1224 0%, #14204a 45%, #0b3d91 100%) !important; }
.store-hero .sh-inner { text-align:center; max-width: 720px; margin:0 auto; }
.store-hero h1 { font-size: clamp(28px, 5vw, 44px); font-weight: 800; margin: 10px 0; letter-spacing:-.02em; color:#fff; }
.store-hero p { color: rgba(255,255,255,.75); margin-bottom: 22px; }
.sh-badge { display:inline-block; padding:6px 14px; border-radius:100px; background: rgba(255,255,255,.12); backdrop-filter: blur(10px); font-size:12px; font-weight:700; letter-spacing:.15em; color:#fff; }
.store-search { border-radius: 16px !important; padding: 8px !important; box-shadow: 0 20px 50px -10px rgba(0,0,0,.35) !important; }
.store-search input { font-size: 14.5px !important; }
.store-search .btn-primary { border-radius: 12px !important; padding: 12px 22px !important; font-weight:700; background: var(--grad); border:0; color:#fff; }

/* Sticky categories bar */
.store-cats { position: sticky; top: 0; z-index: 30; padding: 12px 0; background: var(--c-bg, #fff); backdrop-filter: blur(12px); border-bottom: 1px solid var(--c-input-bd); }
.dark .store-cats { background: rgba(11,20,36,.92); border-color: rgba(148,163,184,.14); }
.cat-scroll { display:flex; gap:8px; overflow-x:auto; scrollbar-width:none; padding: 2px; }
.cat-scroll::-webkit-scrollbar { display:none; }
.cat-chip { padding: 9px 16px !important; border-radius: 10px !important; font-size: 13.5px !important; font-weight: 600 !important; background: transparent !important; border: 1.5px solid var(--c-input-bd); color: var(--c-input-fg) !important; }
.cat-chip:hover { border-color: var(--c-primary); color: var(--c-primary) !important; transform: translateY(-1px); }
.cat-chip.active { background: var(--grad) !important; color:#fff !important; border-color: transparent; box-shadow: 0 10px 22px -8px color-mix(in oklab, var(--c-primary) 55%, transparent); }

/* Product cards — cleaner premium */
.p-card, .p-card-modern { padding: 0 !important; border-radius: 16px !important; background: var(--c-v-bg, #fff) !important; border:1px solid var(--c-input-bd) !important; overflow:hidden; box-shadow: 0 4px 14px -6px rgba(0,0,0,.1) !important; }
.dark .p-card, .dark .p-card-modern { background: #0f1b31 !important; border-color: rgba(148,163,184,.14) !important; }
.p-card:hover, .p-card-modern:hover { transform: translateY(-4px) !important; box-shadow: 0 24px 45px -14px color-mix(in oklab, var(--c-primary) 40%, rgba(0,0,0,.25)) !important; }
.p-card-modern .p-thumb-wrap { border-radius: 0 !important; }
.p-card-modern .p-thumb { border-radius: 0 !important; aspect-ratio: 1/1; background: linear-gradient(135deg,#f1f5f9,#e2e8f0) !important; }
.dark .p-card-modern .p-thumb { background: linear-gradient(135deg,#1e293b,#0f172a) !important; }
.p-body { padding: 12px 14px 14px !important; display:flex; flex-direction:column; gap:6px; }
.p-body h3 { font-size: 14.5px; font-weight:700; line-height:1.35; margin:0; color: var(--c-input-fg); overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.p-desc { font-size: 12px; color:#94a3b8; margin:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.p-price-row { display:flex; align-items:baseline; gap:8px; margin-top: 2px; }
.p-price { font-size: 17px; font-weight:800; color: var(--c-primary); }
.p-old { font-size: 12.5px; color:#94a3b8; text-decoration:line-through; }
.p-cart-btn { margin-top: 8px; width:100%; padding: 10px 14px; border-radius: 10px; border:0; background: var(--grad); color:#fff; font-weight:700; font-size:13px; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; gap:6px; transition: transform .2s, box-shadow .2s; }
.p-cart-btn:hover { transform: translateY(-1px); box-shadow: 0 12px 24px -8px color-mix(in oklab, var(--c-primary) 55%, transparent); }
.p-quick-cart { position:absolute; top:10px; right:10px; width:36px; height:36px; border-radius:50%; border:0; background: rgba(255,255,255,.95); color: var(--c-primary); font-size:15px; cursor:pointer; box-shadow: 0 6px 14px -4px rgba(0,0,0,.25); display:inline-flex; align-items:center; justify-content:center; z-index:3; opacity:0; transform: translateY(-6px); transition:.25s; }
.p-card-modern:hover .p-quick-cart { opacity:1; transform: translateY(0); }
.p-badge, .p-off { position:absolute; top:10px; padding: 4px 10px; border-radius: 8px; font-size: 11px; font-weight:800; letter-spacing:.05em; color:#fff; z-index:2; }
.p-badge { left:10px; background: linear-gradient(135deg,#f59e0b,#ef4444); }
.p-off { left:10px; top:38px; background: #10b981; }

/* Product page variants */
.pd-variants { display:flex; flex-direction:column; gap:14px; margin: 14px 0; }
.pv-label { font-size:13px; font-weight:700; color: var(--c-label); margin-bottom:6px; display:block; text-transform:uppercase; letter-spacing:.05em; }
.pv-opts { display:flex; flex-wrap:wrap; gap:8px; }
.pv-opt { padding:8px 14px; border-radius: 10px; border:1.5px solid var(--c-input-bd); background: transparent; color: var(--c-input-fg); font-weight:600; font-size:13px; cursor:pointer; transition:.2s; }
.pv-opt:hover { border-color: var(--c-primary); color: var(--c-primary); }
.pv-opt.active { background: var(--grad); border-color: transparent; color:#fff; box-shadow: 0 8px 18px -6px color-mix(in oklab, var(--c-primary) 50%, transparent); }

/* Responsive product grid */
@media (max-width: 480px) {
  .p-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 10px !important; }
  .p-body h3 { font-size: 13px; }
  .p-price { font-size: 15px; }
  .p-cart-btn { padding: 8px 10px; font-size: 12px; }
}

/* --- v32 Subscribe Required modal (responsive premium) --------- */
.sub-modal { position:fixed; inset:0; z-index: 1000; display:flex; align-items:center; justify-content:center; padding: 16px; }
.sub-modal[hidden] { display:none !important; }
.sub-modal-backdrop { position:absolute; inset:0; background: rgba(3,7,18,.72); backdrop-filter: blur(8px); opacity:0; transition: opacity .25s; }
.sub-modal.open .sub-modal-backdrop { opacity:1; }
.sub-modal-card { position:relative; z-index:2; width:100%; max-width: 440px; background: var(--c-v-bg, #fff); color: var(--c-input-fg, #0f172a); border-radius: 20px; padding: 26px 22px 22px; box-shadow: 0 30px 80px -20px rgba(0,0,0,.6); border: 1px solid var(--c-input-bd); transform: translateY(20px) scale(.96); opacity:0; transition: transform .3s cubic-bezier(.2,.9,.3,1.3), opacity .25s; }
.dark .sub-modal-card { --c-v-bg:#0f1b31; }
.sub-modal.open .sub-modal-card { transform: translateY(0) scale(1); opacity:1; }
.sub-modal-x { position:absolute; top:10px; right:10px; width:34px; height:34px; border-radius:50%; border:0; background: rgba(148,163,184,.15); color: var(--c-input-fg); font-size:20px; cursor:pointer; line-height:1; display:inline-flex; align-items:center; justify-content:center; }
.sub-modal-x:hover { background:#ef4444; color:#fff; }
.sub-modal-hero { text-align:center; padding: 8px 0 16px; }
.sub-modal-badge { position:relative; width: 72px; height: 72px; margin: 0 auto 14px; border-radius:50%; background: linear-gradient(135deg, #ef4444, #f97316); display:inline-flex; align-items:center; justify-content:center; box-shadow: 0 18px 40px -12px rgba(239,68,68,.5); }
.sm-ring { position:absolute; inset:-6px; border-radius:50%; border:2px solid #ef4444; opacity:.35; animation: smPulse 1.6s ease-out infinite; }
@keyframes smPulse { 0%{transform:scale(.9);opacity:.5} 100%{transform:scale(1.3);opacity:0} }
.sm-ico { font-size: 32px; color:#fff; animation: smBell 1.2s ease-in-out infinite alternate; }
@keyframes smBell { 0%{transform:rotate(-8deg)} 100%{transform:rotate(8deg)} }
.sub-modal-hero h3 { font-size: 20px; font-weight: 800; margin: 4px 0 8px; }
.sub-modal-hero p { font-size: 14px; line-height: 1.6; color: #64748b; margin: 0; }
.dark .sub-modal-hero p { color:#94a3b8; }
.sub-modal-actions { display:flex; flex-direction:column; gap: 10px; margin-top: 6px; }
.sub-modal-cta { justify-content:center; background: var(--grad) !important; color:#fff !important; border:0 !important; padding: 13px 18px !important; font-weight:700 !important; border-radius: 12px !important; text-decoration:none; display:inline-flex; align-items:center; gap:8px; }
.sub-modal-cta:hover { transform: translateY(-2px); box-shadow: 0 18px 36px -12px color-mix(in oklab, var(--c-primary) 55%, transparent); }
.btn-ghost { background: transparent !important; color: var(--c-input-fg) !important; border:1.5px solid var(--c-input-bd) !important; padding: 11px 18px !important; border-radius: 12px !important; font-weight:600 !important; cursor:pointer; }
.btn-ghost:hover { background: color-mix(in oklab, var(--c-primary) 8%, transparent) !important; }
@media (max-width: 480px) { .sub-modal-card { padding: 22px 16px 16px; border-radius: 18px; } .sub-modal-hero h3 { font-size: 18px; } }

/* ============================================================
   v33 — Premium discount badge, clean verify choices,
         professional form-submit loading
   ============================================================ */

/* ---- Discount / featured badge: small, premium, corner tag ---- */
.p-thumb-wrap .p-badge,
.p-thumb-wrap .p-off {
  position: absolute !important;
  width: auto !important;
  max-width: 62px;
  padding: 4px 9px !important;
  border-radius: 999px !important;
  font-size: 10.5px !important;
  font-weight: 800 !important;
  letter-spacing: .02em !important;
  line-height: 1 !important;
  color: #fff !important;
  z-index: 3;
  white-space: nowrap;
  backdrop-filter: blur(6px);
  box-shadow: 0 6px 14px -4px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.25);
  border: 1px solid rgba(255,255,255,.18);
  display: inline-flex; align-items:center; gap:3px;
  animation: pBadgePop .45s cubic-bezier(.2,.9,.3,1.4) both;
}
.p-thumb-wrap .p-badge {
  top: 10px; left: 10px; right: auto; bottom: auto;
  background: linear-gradient(135deg, #f59e0b, #ef4444) !important;
}
.p-thumb-wrap .p-off {
  top: 10px; right: 10px; left: auto; bottom: auto;
  background: linear-gradient(135deg, #10b981, #059669) !important;
  padding-left: 8px !important;
}
.p-thumb-wrap .p-off::before {
  content: "%"; font-size: 9px; font-weight:900; opacity:.85;
  display:inline-block; transform: translateY(-1px);
}
.p-thumb-wrap .p-off { direction: ltr; }
@keyframes pBadgePop {
  0% { transform: translateY(-6px) scale(.7); opacity: 0; }
  100% { transform: translateY(0) scale(1); opacity: 1; }
}
@media (max-width: 480px){
  .p-thumb-wrap .p-badge, .p-thumb-wrap .p-off {
    font-size: 10px !important; padding: 3px 8px !important; top: 8px;
  }
  .p-thumb-wrap .p-badge { left: 8px; }
  .p-thumb-wrap .p-off { right: 8px; }
}

/* ---- Clean Yes/No verify choice (no leading dot) ---- */
.v2-choice-clean { display:grid; grid-template-columns: 1fr 1fr; gap:10px; margin-top: 12px; }
.v2-choice-clean .v2-opt {
  position: relative;
  display: flex; align-items: center; justify-content: center;
  gap: 8px;
  padding: 11px 12px;
  border-radius: 12px;
  border: 1.5px solid var(--c-v-bd, var(--c-input-bd));
  background: transparent;
  color: var(--c-input-fg);
  font-size: 13.5px; font-weight: 600;
  cursor: pointer;
  transition: all .2s ease;
  overflow: hidden;
}
.v2-choice-clean .v2-opt input { position:absolute; opacity:0; pointer-events:none; }
.v2-choice-clean .v2-opt-check {
  width: 20px; height: 20px; border-radius: 50%;
  display: inline-flex; align-items:center; justify-content:center;
  font-size: 11px; font-weight: 900;
  background: color-mix(in oklab, var(--c-input-bd) 40%, transparent);
  color: transparent;
  transition: all .25s cubic-bezier(.2,.9,.3,1.4);
  transform: scale(.6);
}
.v2-choice-clean .v2-opt:hover {
  border-color: color-mix(in oklab, var(--c-primary) 55%, var(--c-input-bd));
  transform: translateY(-1px);
}
.v2-choice-clean .v2-opt-yes:has(input:checked) {
  border-color: #10b981;
  background: color-mix(in oklab, #10b981 12%, transparent);
  color: #059669;
  box-shadow: 0 8px 18px -8px rgba(16,185,129,.5);
}
.v2-choice-clean .v2-opt-yes:has(input:checked) .v2-opt-check {
  background: #10b981; color: #fff; transform: scale(1);
}
.v2-choice-clean .v2-opt-no:has(input:checked) {
  border-color: #ef4444;
  background: color-mix(in oklab, #ef4444 12%, transparent);
  color: #dc2626;
  box-shadow: 0 8px 18px -8px rgba(239,68,68,.5);
}
.v2-choice-clean .v2-opt-no:has(input:checked) .v2-opt-check {
  background: #ef4444; color: #fff; transform: scale(1);
}
.dark .v2-choice-clean .v2-opt-yes:has(input:checked) { color: #34d399; }
.dark .v2-choice-clean .v2-opt-no:has(input:checked)  { color: #f87171; }

/* ---- Professional form-submit loading ---- */
.form-loading { position: relative; pointer-events: none; }
.form-loading::after {
  content: ""; position: absolute; inset: 0;
  background: color-mix(in oklab, var(--c-bg, #fff) 55%, transparent);
  backdrop-filter: blur(2px);
  border-radius: inherit;
  z-index: 5;
  animation: fadeIn .2s ease;
}
button[type=submit].is-submitting,
.btn.is-submitting {
  position: relative;
  color: transparent !important;
  pointer-events: none;
  opacity: .95;
}
button[type=submit].is-submitting::before,
.btn.is-submitting::before {
  content: ""; position: absolute;
  width: 20px; height: 20px;
  top: 50%; left: 50%;
  margin: -10px 0 0 -10px;
  border-radius: 50%;
  border: 2.5px solid rgba(255,255,255,.35);
  border-top-color: #fff;
  animation: spin .7s linear infinite;
}
button[type=submit].is-submitting::after {
  content: ""; position: absolute;
  left: 0; right: 0; bottom: 0; height: 3px;
  background: linear-gradient(90deg, transparent, #fff, transparent);
  background-size: 40% 100%; background-repeat: no-repeat;
  animation: submitProg 1.2s linear infinite;
  border-radius: 0 0 inherit inherit;
}
@keyframes submitProg {
  0%   { background-position: -40% 0; }
  100% { background-position: 140% 0; }
}
@keyframes fadeIn { from { opacity:0 } to { opacity:1 } }

/* Reusable inline spinner for AJAX buttons */
.spin-dot {
  display:inline-block; width:14px; height:14px; border-radius:50%;
  border:2px solid rgba(255,255,255,.35); border-top-color:#fff;
  animation: spin .7s linear infinite; vertical-align: -3px; margin-right:6px;
}

/* Global page-load skeleton shimmer */
.skeleton {
  background: linear-gradient(90deg,
    color-mix(in oklab, var(--c-input-bd) 30%, transparent) 0%,
    color-mix(in oklab, var(--c-input-bd) 60%, transparent) 50%,
    color-mix(in oklab, var(--c-input-bd) 30%, transparent) 100%);
  background-size: 200% 100%;
  animation: shimmer 1.4s linear infinite;
  border-radius: 8px;
}
@keyframes shimmer { to { background-position: -200% 0; } }

/* ============ v2 proof upload (any size/format) ============ */
.v2-proof { margin-top: 12px; padding-top: 12px; border-top: 1px dashed color-mix(in oklab, var(--c-v-bd, #e2e8f0) 80%, transparent); animation: v2FadeIn .28s ease; }
@keyframes v2FadeIn { from { opacity:0; transform: translateY(-4px); } to { opacity:1; transform:none; } }
.v2-proof-drop { display:block; cursor:pointer; border:2px dashed color-mix(in oklab, var(--c-primary) 45%, #cbd5e1); border-radius: 12px; padding: 14px; background: color-mix(in oklab, var(--c-primary) 4%, transparent); transition: background .2s, border-color .2s, transform .2s; }
.v2-proof-drop:hover { background: color-mix(in oklab, var(--c-primary) 9%, transparent); border-color: var(--c-primary); transform: translateY(-1px); }
.v2-proof-drop input[type=file] { display:none; }
.v2-proof-inner { display:flex; align-items:center; gap: 12px; }
.v2-proof-ico { font-size: 26px; width:44px; height:44px; display:grid; place-items:center; border-radius: 10px; background: color-mix(in oklab, var(--c-primary) 15%, transparent); }
.v2-proof-txt { display:flex; flex-direction:column; gap:2px; line-height:1.3; }
.v2-proof-txt b { color: var(--c-text, #0f172a); font-size: 14px; }
.dark .v2-proof-txt b { color:#e2e8f0; }
.v2-proof-preview { margin-top: 10px; display:flex; flex-direction:column; gap:8px; padding: 8px; border-radius:10px; background: color-mix(in oklab, var(--c-primary) 5%, #f8fafc); }
.dark .v2-proof-preview { background: rgba(148,163,184,.08); }
.v2-proof-preview img { width:100%; max-height: 180px; object-fit: contain; border-radius: 8px; background:#fff; }
.v2-proof-info { display:flex; align-items:center; justify-content:space-between; gap:8px; font-size: 12px; color: var(--c-muted,#64748b); }
.v2-proof-name { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width: 80%; }
.v2-proof-clear { border:none; background: #ef4444; color:#fff; width:26px; height:26px; border-radius: 50%; cursor:pointer; font-size:16px; line-height:1; display:grid; place-items:center; transition: transform .15s; }
.v2-proof-clear:hover { transform: scale(1.08); }

/* v43+: proof dropzone shown after "Yes" */
.v2-proof[hidden]{display:none}
.v2-drop-inner{display:flex;align-items:center;gap:12px}
.v2-drop-title{font-weight:600;color:var(--c-input-fg,#0f172a)}
.v2-drop-preview{margin-top:10px;position:relative;display:inline-block;max-width:100%}
.v2-drop-preview[hidden]{display:none}
.v2-drop-preview img{max-width:220px;max-height:160px;border-radius:10px;border:1px solid var(--c-v-bd,#e2e8f0);display:block}
.v2-drop-clear{position:absolute;top:-8px;right:-8px;width:26px;height:26px;border-radius:50%;border:0;background:#ef4444;color:#fff;font-size:16px;line-height:1;cursor:pointer;box-shadow:0 4px 10px rgba(239,68,68,.35)}

/* ============================================================
   V48 — Clean minimal brand header (no bg box, full name visible)
   ============================================================ */
.site-header .brand,
.site-header .brand:hover{
  background:transparent!important;
  -webkit-background-clip:border-box!important;
  background-clip:border-box!important;
  padding:0!important;
  border:0!important;
  box-shadow:none!important;
  text-decoration:none;
  min-width:0;
  flex:0 1 auto;
  display:inline-flex;
  align-items:center;
  gap:10px;
  max-width:100%;
}
.site-header .brand img{
  height:38px;
  width:auto;
  max-width:180px;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  padding:0!important;
  box-shadow:none!important;
  object-fit:contain;
  display:block;
}
.site-header .brand-mark{
  background:transparent!important;
  color:var(--brand,#00c8ff)!important;
  box-shadow:none!important;
  width:auto!important;height:auto!important;
  padding:0!important;font-size:22px;
}
.site-header .brand-name{
  background:linear-gradient(135deg,var(--gib-cyan,#00c8ff),var(--gib-yellow,#ffd60a))!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  color:transparent!important;
  white-space:nowrap;
  overflow:visible!important;
  text-overflow:clip!important;
  letter-spacing:-.01em;
  font-weight:800;
  font-size:clamp(15px,2.4vw,20px);
  line-height:1.15;
  padding:0!important;
  border:0!important;
}
.site-header .hdr-inner{gap:12px;flex-wrap:nowrap}
@media (max-width:520px){
  .site-header .brand-name{font-size:14.5px}
  .site-header .brand img{height:30px;max-width:120px}
}
@media (max-width:360px){
  .site-header .brand-name{font-size:13px}
}

/* ============ v49: Home mini-header — transparent brand ============ */
.home-mini-hdr{background:transparent!important;box-shadow:none!important;border:0!important}
.home-mini-hdr .brand,
.home-mini-hdr .brand:hover{
  background:transparent!important;border:0!important;box-shadow:none!important;
  padding:0!important;border-radius:0!important;text-decoration:none;
  display:inline-flex;align-items:center;gap:10px;min-width:0;max-width:100%;
}
.home-mini-hdr .brand img{
  background:transparent!important;border:0!important;box-shadow:none!important;
  padding:0!important;border-radius:0!important;object-fit:contain!important;
  width:auto!important;height:38px!important;max-width:none!important;
}
.home-mini-hdr .brand-mark{
  background:transparent!important;box-shadow:none!important;border:0!important;
  color:#fff!important;width:auto!important;height:auto!important;
}
.home-mini-hdr .brand-name{
  background:linear-gradient(90deg,var(--gib-cyan,#22d3ee),#fff 55%,var(--gib-yellow,#facc15))!important;
  -webkit-background-clip:text;background-clip:text;color:transparent!important;
  white-space:nowrap;overflow:visible;text-overflow:clip;
  font-weight:900;letter-spacing:.2px;
  font-size:clamp(15px,2.4vw,20px);
  text-shadow:none!important;
  filter:drop-shadow(0 2px 10px rgba(0,0,0,.35));
}
@media (max-width:520px){
  .home-mini-hdr{padding:14px 16px}
  .home-mini-hdr .brand img{height:32px!important}
  .home-mini-hdr .brand-name{font-size:14.5px}
}
@media (max-width:360px){
  .home-mini-hdr .brand-name{font-size:13px}
}

/* ============ v50: Home brand — FINAL FIX (no bg, full name on mobile) ============ */
body.home-page .home-mini-hdr,
.home-mini-hdr{
  background:transparent!important;box-shadow:none!important;border:0!important;
  padding:14px 16px!important;
  display:flex!important;align-items:center!important;justify-content:space-between!important;
  gap:12px!important;flex-wrap:nowrap!important;
}
.home-mini-hdr .brand,
.home-mini-hdr a.brand,
.home-mini-hdr .brand:hover{
  background:none!important;background-color:transparent!important;background-image:none!important;
  border:0!important;box-shadow:none!important;border-radius:0!important;padding:0!important;
  -webkit-background-clip:border-box!important;background-clip:border-box!important;
  display:inline-flex!important;align-items:center!important;gap:10px!important;
  min-width:0!important;max-width:100%!important;flex:1 1 auto!important;
  text-decoration:none!important;
  color:#fff!important;
}
.home-mini-hdr .brand *,
.home-mini-hdr .brand-mark{
  background:none!important;background-color:transparent!important;background-image:none!important;
  border:0!important;box-shadow:none!important;border-radius:0!important;padding:0!important;
}
.home-mini-hdr .brand img{
  height:36px!important;width:auto!important;max-width:44px!important;
  object-fit:contain!important;flex-shrink:0!important;
}
.home-mini-hdr .brand-name{
  display:inline-block!important;
  background:none!important;background-image:none!important;background-color:transparent!important;
  -webkit-background-clip:border-box!important;background-clip:border-box!important;
  -webkit-text-fill-color:#ffffff!important;color:#ffffff!important;
  font-weight:800!important;letter-spacing:.2px!important;
  white-space:nowrap!important;overflow:visible!important;text-overflow:clip!important;
  max-width:none!important;
  font-size:clamp(14px,4.2vw,20px)!important;
  text-shadow:0 2px 10px rgba(0,0,0,.45)!important;filter:none!important;
  flex:0 1 auto!important;min-width:0!important;
}
@media (max-width:520px){
  .home-mini-hdr{padding:12px 12px!important;gap:8px!important}
  .home-mini-hdr .brand img{height:30px!important;max-width:34px!important}
  .home-mini-hdr .brand-name{font-size:14px!important}
  .home-mini-hdr .btn-icon{width:38px!important;height:38px!important}
}
@media (max-width:360px){
  .home-mini-hdr .brand img{height:26px!important;max-width:30px!important}
  .home-mini-hdr .brand-name{font-size:12.5px!important;letter-spacing:.1px!important}
}

/* ============ v51: Site header brand — final cross-page fix ============
   Home already uses .home-mini-hdr; this targets Giveaway/Store/other pages.
   Goal: no colored box behind name/logo, transparent PNG untouched, full name visible. */
.site-header .hdr-inner{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  flex-wrap:nowrap!important;
  gap:10px!important;
  min-width:0!important;
}
.site-header a.brand,
.site-header .brand,
.site-header a.brand:hover,
.site-header .brand:hover{
  flex:1 1 0!important;
  min-width:0!important;
  max-width:100%!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:8px!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  background:none!important;
  background-color:transparent!important;
  background-image:none!important;
  -webkit-background-clip:border-box!important;
  background-clip:border-box!important;
  color:inherit!important;
  text-decoration:none!important;
  overflow:visible!important;
}
.site-header .brand img,
.site-header a.brand img{
  flex:0 0 auto!important;
  height:34px!important;
  width:auto!important;
  max-width:42px!important;
  object-fit:contain!important;
  background:none!important;
  background-color:transparent!important;
  background-image:none!important;
  border:0!important;
  border-radius:0!important;
  padding:0!important;
  margin:0!important;
  box-shadow:none!important;
}
.site-header .brand-mark{
  flex:0 0 auto!important;
  width:auto!important;
  height:auto!important;
  min-width:0!important;
  display:inline!important;
  background:none!important;
  background-color:transparent!important;
  background-image:none!important;
  border:0!important;
  border-radius:0!important;
  padding:0!important;
  box-shadow:none!important;
  color:#00c8ff!important;
  font-size:20px!important;
}
.site-header .brand-name{
  display:inline-block!important;
  flex:0 1 auto!important;
  min-width:0!important;
  max-width:none!important;
  width:auto!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  background:none!important;
  background-color:transparent!important;
  background-image:none!important;
  -webkit-background-clip:border-box!important;
  background-clip:border-box!important;
  -webkit-text-fill-color:#ffffff!important;
  color:#ffffff!important;
  white-space:nowrap!important;
  overflow:visible!important;
  text-overflow:clip!important;
  font-weight:850!important;
  letter-spacing:0!important;
  line-height:1.12!important;
  font-size:clamp(13px,2.1vw,20px)!important;
}
[data-theme="light"] .site-header .brand-name{
  -webkit-text-fill-color:#071225!important;
  color:#071225!important;
}
.site-header .hdr-actions{
  flex:0 0 auto!important;
  min-width:max-content!important;
}
@media (max-width:900px){
  .site-header .main-nav{flex:0 0 auto!important}
  .site-header .brand{max-width:calc(100vw - 112px)!important}
  .site-header .brand-name{font-size:clamp(12px,3.65vw,15px)!important}
  .site-header .brand img{height:30px!important;max-width:34px!important}
}
@media (max-width:360px){
  .site-header .hdr-inner{gap:7px!important}
  .site-header .brand{gap:6px!important;max-width:calc(100vw - 104px)!important}
  .site-header .brand-name{font-size:12px!important}
  .site-header .brand img{height:26px!important;max-width:30px!important}
  .site-header .btn-icon,.site-header .cart-pill{width:38px!important;height:38px!important}
}
