@import "parallax.css";
/* ═════════ THE DIGITAL VAULT — ULTRA THEME (public pages) ═════════ */
body.ultra:not(.white){background:#050406;background-image:radial-gradient(1100px 600px at 80% -10%,rgba(232,185,35,.16),transparent 60%),radial-gradient(900px 500px at 0% 20%,rgba(184,134,11,.12),transparent 60%);
  font-family:Inter,system-ui,sans-serif;animation:pagein .6s ease both}
@keyframes pagein{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
h1,h2,h3,.brand-t{font-family:"Space Grotesk",Inter,system-ui,sans-serif}
#dust{position:fixed;inset:0;z-index:-1;pointer-events:none;width:100%;height:100%}
.shimmer{background:linear-gradient(100deg,#b8860b 0%,#ffe27a 25%,#fff7d1 40%,#e8b923 55%,#b8860b 75%,#ffe27a 100%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shim 6s linear infinite}
@keyframes shim{to{background-position:-250% 0}}
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
.reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}

/* header */
.uh{position:sticky;top:0;z-index:60;backdrop-filter:blur(18px) saturate(140%);background:rgba(5,4,6,.72);border-bottom:1px solid rgba(232,185,35,.14)}
.uh .wrap{display:flex;align-items:center;gap:20px;height:74px}
.uh .brand{display:inline-flex;align-items:center;gap:12px;text-decoration:none;flex-shrink:0}
.uh .brand img{width:46px;height:46px;min-width:46px;min-height:46px;flex-shrink:0;border-radius:50%;box-shadow:0 0 0 1px rgba(232,185,35,.5),0 0 28px rgba(232,185,35,.45);object-fit:contain}
.brand-t{font-weight:900;letter-spacing:.08em;font-size:15px;line-height:1.15;white-space:nowrap;display:flex;flex-direction:column;justify-content:center;flex-shrink:0}
.brand-t small{display:block;font-size:9.5px;letter-spacing:.22em;color:var(--primary);font-weight:700;white-space:nowrap;margin-top:2px}
.uh nav{margin-left:auto;display:flex;align-items:center;gap:2px}
.uh nav a.l{padding:10px 15px;border-radius:10px;font-size:14px;font-weight:700;color:#bdb4a0;position:relative;transition:.2s;white-space:nowrap;display:inline-flex;align-items:center;justify-content:center}
.uh nav a.l:hover{color:#fff}
.uh nav a.l.on{color:var(--primary2)}
.uh nav a.l.on::after{content:"";position:absolute;left:15px;right:15px;bottom:3px;height:2px;border-radius:2px;background:linear-gradient(90deg,transparent,var(--primary),transparent)}
.burger{display:none;margin-left:auto;background:var(--surface);border:1px solid var(--line);color:#fff;width:44px;height:44px;border-radius:12px;font-size:20px;cursor:pointer}
@media(max-width:860px){.burger{display:block}.uh nav{position:absolute;top:74px;left:0;right:0;flex-direction:column;align-items:stretch;background:rgba(5,4,6,.97);border-bottom:1px solid var(--line);padding:12px 22px 20px;display:none;margin:0}
/* Burger menu toggle state */
.uh nav.show {
  display: flex !important;
}

  .uh.open nav{display:flex}.uh nav a.l{padding:14px}}

/* hero */
.hero-u{position:relative;min-height:80vh;display:flex;align-items:center;overflow:hidden;border-bottom:1px solid rgba(232,185,35,.12);
  background:radial-gradient(700px 500px at 78% 45%,rgba(232,185,35,.22),transparent 65%),radial-gradient(900px 600px at 0% 0%,rgba(184,134,11,.18),transparent 60%),linear-gradient(180deg,#0a0805,#050406)}
.hero-u .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;padding-top:50px;padding-bottom:50px}
.hero-u h1{font-size:clamp(42px,6.4vw,84px);line-height:1;font-weight:900;letter-spacing:-2px;margin:20px 0 20px}
.hero-u .lead{font-size:18px;color:#cfc6b2;max-width:560px}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.tchip{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:800;letter-spacing:.8px;color:var(--primary2);padding:9px 15px;border-radius:99px;border:1px solid rgba(232,185,35,.3);background:rgba(232,185,35,.07)}
.emblem{position:relative;display:grid;place-items:center}
.emblem img{width:min(430px,86%);border-radius:50%;position:relative;z-index:2;animation:float 6s ease-in-out infinite;box-shadow:0 0 90px rgba(232,185,35,.35)}
.emblem::before,.emblem::after{content:"";position:absolute;border-radius:50%;border:1px solid rgba(232,185,35,.35);animation:ring 5s linear infinite}
.emblem::before{width:min(500px,98%);aspect-ratio:1}
.emblem::after{width:min(560px,112%);aspect-ratio:1;animation-delay:-2.5s;border-style:dashed;opacity:.5}
@keyframes ring{to{transform:rotate(360deg)}}
@keyframes float{50%{transform:translateY(-14px)}}
@media(max-width:900px){.hero-u .wrap{grid-template-columns:1fr}.emblem{order:-1;margin-bottom:-10px}.emblem img{width:min(250px,60%)}.hero-u{min-height:auto}}
.btn.gold{background:linear-gradient(135deg,#f7d560,#e8b923 45%,#b8860b);color:#1a1200;border-color:transparent;box-shadow:0 14px 40px -12px rgba(232,185,35,.7);font-weight:800}
.btn.gold:hover{filter:brightness(1.1);transform:translateY(-2px)}
.btn.ghost{background:rgba(255,255,255,.04);border-color:rgba(232,185,35,.35);color:var(--primary2)}
.btn.lg{padding:15px 28px;font-size:15px;border-radius:14px}

.statbar{position:relative;margin-top:-54px;z-index:5}
.statbar .in{display:grid;grid-template-columns:repeat(4,1fr);border-radius:22px;background:rgba(14,12,8,.86);backdrop-filter:blur(14px);border:1px solid rgba(232,185,35,.22);box-shadow:0 30px 80px -30px #000}
.statbar .s{padding:26px 22px;text-align:center;border-right:1px solid var(--line)}
.statbar .s:last-child{border:0}
.statbar b{display:block;font-family:'Space Grotesk';font-size:38px;font-weight:900}
.statbar span{font-size:12.5px;color:var(--muted);font-weight:700;letter-spacing:.8px;text-transform:uppercase}
@media(max-width:760px){.statbar .in{grid-template-columns:repeat(2,1fr)}.statbar .s:nth-child(2){border-right:0}.statbar .s:nth-child(-n+2){border-bottom:1px solid var(--line)}}

/* ticker */
.ticker{overflow:hidden;border-block:1px solid rgba(244,217,160,.16);background:rgba(18,14,12,.85);margin-top:44px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);contain:paint}
.ticker .t{display:inline-flex;align-items:center;gap:28px;width:max-content;padding:14px 0;animation:royalMarqueeMove 30s linear infinite;will-change:transform;font-size:13.5px;font-weight:600;color:#ded6c5}
.ticker:hover .t{animation-play-state:paused}
@keyframes tick{0%{transform:translate3d(0,0,0)}100%{transform:translate3d(-50%,0,0)}}
@keyframes royalMarqueeMove{0%{transform:translate3d(0,0,0)}100%{transform:translate3d(-50%,0,0)}}
.ticker b{color:#f4d9a0}

/* section heads */
.kick{font-size:12px;font-weight:800;letter-spacing:.3em;text-transform:uppercase;color:var(--primary)}
.sh{display:flex;flex-wrap:wrap;gap:14px;align-items:flex-end;justify-content:space-between;margin-bottom:30px}
.sh h2{font-size:clamp(30px,4vw,46px);font-weight:900;letter-spacing:-1px;line-height:1.05;margin-top:8px}
.sh p{color:var(--muted);max-width:560px;margin-top:8px}
.more{font-weight:800;color:var(--primary2);font-size:14px}.more:hover{text-decoration:underline}

/* category cards */
.cats{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:18px}
.cc{position:relative;display:block;padding:28px;border-radius:22px;background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.015));border:1px solid var(--line);overflow:hidden;transition:.35s;transform-style:preserve-3d}
.cc::before{content:"";position:absolute;inset:0;background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),rgba(232,185,35,.22),transparent 45%);opacity:0;transition:.3s}
.cc:hover{border-color:rgba(232,185,35,.55);transform:perspective(900px) rotateX(var(--rx,0)) rotateY(var(--ry,0)) translateY(-6px);box-shadow:0 30px 70px -30px rgba(232,185,35,.5)}
.cc:hover::before{opacity:1}
.cc .ic{font-size:36px;width:70px;height:70px;border-radius:20px;display:grid;place-items:center;background:rgba(232,185,35,.1);border:1px solid rgba(232,185,35,.3);margin-bottom:22px;position:relative}
.cc h3{font-size:21px;font-weight:800;position:relative}
.cc p{color:var(--muted);font-size:13.5px;margin:6px 0 20px;min-height:40px;position:relative}
.cc .meta{display:flex;justify-content:space-between;align-items:center;font-size:13px;font-weight:700;position:relative}
.cc .meta em{font-style:normal;color:var(--primary2)}
.cc .arrow{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#f7d560,#b8860b);color:#1a1200;font-weight:900;transition:.3s}
.cc:hover .arrow{transform:translateX(5px)}

/* product cards */
a.pc{display:block;padding:22px;border-radius:20px;transform-style:preserve-3d}
a.pc:hover{transform:perspective(900px) rotateX(var(--rx,0)) rotateY(var(--ry,0)) translateY(-5px)}
.pc-top{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}
.pc-top .badge{margin:0}
a.pc h3{font-size:18px;margin:16px 0 4px;min-height:46px}
.pc-bot{display:flex;justify-content:space-between;align-items:flex-end;margin-top:14px}
.go{font-size:13px;font-weight:800;color:var(--primary2)}
a.pc:hover .go{text-decoration:underline}

/* toolbar */
.bar2{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:22px}
.bar2 .input,.bar2 .select{min-width:0}.bar2 .grow{flex:1;min-width:200px}

/* breadcrumbs / page head */
.crumbs{font-size:13px;color:var(--muted);font-weight:600;margin-bottom:18px}
.crumbs a:hover{color:var(--primary2)}.crumbs i{margin:0 8px;opacity:.5;font-style:normal}
.phead{padding:54px 0 10px;position:relative}
.phead h1{font-size:clamp(34px,5vw,60px);font-weight:900;letter-spacing:-1.5px;line-height:1.05}
.phead p{color:var(--muted);margin-top:10px;max-width:640px}
.banner-strip{width:100%!important;max-width:100%!important;display:block!important;box-sizing:border-box!important;margin-top:26px;height:160px;border-radius:22px;background:linear-gradient(90deg,rgba(5,4,6,.9),rgba(5,4,6,.2)),url(../assets/banner.gif) center/cover;border:1px solid rgba(232,185,35,.35);box-shadow:0 15px 40px rgba(0,0,0,.7)}

/* product detail */
.pd{display:grid;grid-template-columns:.95fr 1.05fr;gap:34px;align-items:start}
@media(max-width:860px){.pd{grid-template-columns:1fr}}
.pv{position:relative;aspect-ratio:1/.9;border-radius:26px;overflow:hidden;display:grid;place-items:center;background:radial-gradient(circle at 50% 35%,rgba(232,185,35,.35),transparent 60%),linear-gradient(160deg,#17130a,#070605);border:1px solid rgba(232,185,35,.3)}
.pv .big{font-size:110px;filter:drop-shadow(0 10px 40px rgba(232,185,35,.5));animation:float 6s ease-in-out infinite}
.pv img.wm{position:absolute;right:-30px;bottom:-30px;width:46%;opacity:.14;border-radius:50%}
.pv .tag{position:absolute;left:18px;top:18px}
.pi h1{font-size:clamp(28px,4vw,44px);font-weight:900;letter-spacing:-1px;line-height:1.1;margin:14px 0 10px}
.pi .price{font-size:46px;font-family:'Space Grotesk'}
.meter{margin:22px 0;padding:18px;border-radius:16px;background:var(--surface);border:1px solid var(--line)}
.meter .row2{display:flex;justify-content:space-between;font-size:13px;font-weight:800;margin-bottom:10px}
.meter .bar{height:9px;margin:0}
.ctas{display:flex;flex-wrap:wrap;gap:12px;margin:22px 0}
.perks{display:grid;gap:10px;margin-top:8px}
.perk{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:14px;background:var(--surface);border:1px solid var(--line);font-size:14px;color:#d6cdb8}
.perk b{color:#fff}.perk span.i{font-size:20px}

/* feature cards */
.feat{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.ft{padding:26px;border-radius:20px;background:var(--surface);border:1px solid var(--line);transition:.3s}
.ft:hover{border-color:rgba(232,185,35,.45);transform:translateY(-4px)}
.ft .i{font-size:28px;margin-bottom:14px}.ft h4{font-size:17px;margin-bottom:6px}.ft p{color:var(--muted);font-size:14px}

/* reviews page */
.rsum{display:grid;grid-template-columns:auto 1fr;gap:34px;align-items:center;padding:28px;border-radius:22px;background:var(--surface);border:1px solid var(--line);margin-bottom:22px}
@media(max-width:700px){.rsum{grid-template-columns:1fr}}
.rsum .big{font-family:'Space Grotesk';font-size:72px;font-weight:900;line-height:1}
.dist .d{display:flex;align-items:center;gap:12px;font-size:13px;font-weight:700;margin:6px 0;color:var(--muted)}
.dist .d .bar{flex:1;margin:0}
.dist .d .bar span{background:linear-gradient(90deg,#b8860b,#f7d560)}

/* CTA band */
.cta-band{position:relative;overflow:hidden;border-radius:28px;padding:64px 40px;text-align:center;border:1px solid rgba(232,185,35,.3);
  background:linear-gradient(0deg,rgba(5,4,6,.82),rgba(5,4,6,.82)),url(../assets/banner.jpg) center/cover}
.cta-band h2{font-size:clamp(30px,4.4vw,54px);font-weight:900;letter-spacing:-1px}
.cta-band p{color:#cfc6b2;margin:12px auto 28px;max-width:560px}

/* footer */
.uf{margin-top:70px;border-top:1px solid rgba(232,185,35,.14);background:linear-gradient(180deg,transparent,rgba(232,185,35,.04));padding:50px 0 30px}
.uf .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:30px}
@media(max-width:800px){.uf .cols{grid-template-columns:1fr 1fr}}
.uf h5{font-size:12px;letter-spacing:.25em;text-transform:uppercase;color:var(--primary);margin-bottom:14px}
.uf a{display:block;color:#a9a08b;font-size:14px;padding:4px 0}.uf a:hover{color:#fff}
.uf .fine{margin-top:34px;padding-top:20px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;color:#80786a;font-size:13px}
.uf p.about{color:#a9a08b;font-size:14px;margin-top:14px;max-width:320px}
.small-live{margin-left:auto}

.showcase{margin-top:46px}
.showcase img{width:100%;border-radius:26px;border:1px solid rgba(232,185,35,.3);box-shadow:0 40px 100px -40px rgba(232,185,35,.45);transition:.5s}
.showcase img:hover{transform:scale(1.012);box-shadow:0 50px 120px -40px rgba(232,185,35,.65)}
.uf .wrap{display:block}
.hero-u .wrap{padding-bottom:96px}
@media(max-width:900px){.hero-u .wrap{padding-bottom:70px}}

/* ═════════ v2: cart, quantity, sales ═════════ */
.cartbtn{position:relative;width:44px;height:44px;min-width:44px;min-height:44px;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;border-radius:12px;border:1px solid rgba(232,185,35,.3);background:rgba(232,185,35,.07);font-size:18px;cursor:pointer;color:#fff;transition:.2s}
.cartbtn:hover{transform:translateY(-1px);border-color:rgba(232,185,35,.6)}
.cbadge{position:absolute;top:-6px;right:-6px;min-width:20px;height:20px;padding:0 6px;border-radius:99px;display:grid;place-items:center;font-size:11px;font-weight:900;color:#1a1200;background:linear-gradient(135deg,#f7d560,#b8860b)}
.cdrawer{position:fixed;top:0;left:0;width:100vw;height:100vh;height:100dvh;z-index:200;pointer-events:none}
.cdrawer.open{pointer-events:auto}
.cscrim{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.6);opacity:0;transition:.3s;backdrop-filter:blur(3px)}
.cdrawer.open .cscrim{opacity:1}
.csheet{position:absolute;top:0;right:0;height:100%;width:min(420px,100%);background:#0c0a06;border-left:1px solid rgba(232,185,35,.25);padding:22px;display:flex;flex-direction:column;gap:14px;transform:translateX(100%);transition:transform .4s cubic-bezier(.2,.8,.2,1);overflow:auto}
.cdrawer.open .csheet{transform:none}
.chead{display:flex;justify-content:space-between;align-items:center;font-size:20px;font-family:'Space Grotesk'}
.cline{display:flex;align-items:center;gap:10px;padding:12px;border-radius:14px;background:var(--surface);border:1px solid var(--line)}
.cl-name{flex:1;min-width:0}.cl-name b{display:block;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cl-name small{color:var(--muted);font-size:12px}
.cline .stk button{width:30px;height:30px}
.cq{min-width:24px;text-align:center;font-weight:900}
.cfoot{margin-top:auto;padding-top:16px;border-top:1px solid var(--line)}
.ctot{display:flex;justify-content:space-between;align-items:center;font-size:14px;color:var(--muted);margin-bottom:12px}
.ctot b{font-family:'Space Grotesk';font-size:28px;color:#fff}
.cbtns{display:grid;grid-template-columns:1fr auto;gap:10px}
.cfoot .note{margin-bottom:12px;font-size:12.5px}
.qty{display:flex;align-items:center;gap:12px;margin:18px 0 4px;font-weight:800;font-size:14px;color:var(--muted)}
.qty button{width:40px;height:40px;border-radius:12px;border:1px solid rgba(232,185,35,.35);background:var(--surface);color:var(--primary2);font-size:18px;font-weight:900;cursor:pointer}
.qty button:hover{background:rgba(232,185,35,.12)}
.qty b{min-width:32px;text-align:center;font-size:18px;color:#fff}
[hidden]{display:none!important}

/* admin sales */
.sales-kpi{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:0 0 18px}
@media(max-width:800px){.sales-kpi{grid-template-columns:repeat(2,1fr)}}
.bars{display:flex;align-items:flex-end;gap:8px;height:150px;margin-top:10px}
.bars div{flex:1;border-radius:8px 8px 3px 3px;background:linear-gradient(180deg,#f7d560,#b8860b);min-height:3px;position:relative;transition:height .6s}
.bars div span{position:absolute;bottom:-22px;left:0;right:0;text-align:center;font-size:10px;color:var(--muted);font-weight:700}
.bars div em{position:absolute;top:-20px;left:0;right:0;text-align:center;font-size:11px;font-style:normal;font-weight:800;color:var(--primary2)}

/* v3: refunded / cancelled order states + install support */
.st.refunded{color:#f2a1a1;background:rgba(248,113,113,.12)}
.st.cancelled{color:var(--muted);background:rgba(255,255,255,.05);text-decoration:line-through}

/* ═════════ THEME: GOLD + RED (enabled with THEME_VARIANT = "redgold" in js/config.js) ═════════ */
body.redgold{--primary:#e53935;--primary2:#ff8a80;--accent:#ffb74d;--shadow:0 20px 60px -20px rgba(229,57,53,.5);
  background:#060405;background-image:radial-gradient(1100px 600px at 80% -10%,rgba(229,57,53,.2),transparent 60%),radial-gradient(900px 500px at 0% 20%,rgba(255,183,77,.1),transparent 60%)}
body.redgold .uh{border-bottom-color:rgba(229,57,53,.22)}
body.redgold .uh nav a.l.on{color:#ff8a80}
body.redgold .uh nav a.l.on::after{background:linear-gradient(90deg,transparent,#e53935,transparent)}
body.redgold .btn.gold,body.redgold .btn.primary{background:linear-gradient(135deg,#ff8a80,#e53935 45%,#8e0000);color:#fff;box-shadow:0 14px 40px -12px rgba(229,57,53,.75)}
body.redgold .btn.ghost{border-color:rgba(229,57,53,.45);color:#ff8a80}
body.redgold .shimmer{background:linear-gradient(100deg,#8e0000 0%,#ff5252 25%,#ffd7d0 40%,#e53935 55%,#8e0000 75%,#ff8a80 100%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent}
body.redgold .kick,body.redgold .tchip,body.redgold .eyebrow{color:#ff8a80;border-color:rgba(229,57,53,.35);background:rgba(229,57,53,.09)}
body.redgold .cc:hover{border-color:rgba(229,57,53,.6);box-shadow:0 30px 70px -30px rgba(229,57,53,.55)}
body.redgold .cc::before{background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),rgba(229,57,53,.24),transparent 45%)}
body.redgold .cc .arrow{background:linear-gradient(135deg,#ff8a80,#8e0000);color:#fff}
body.redgold .cc .ic{background:rgba(229,57,53,.1);border-color:rgba(229,57,53,.35)}
body.redgold .cbadge{background:linear-gradient(135deg,#ff8a80,#8e0000);color:#fff}
body.redgold .tab.on{background:linear-gradient(135deg,#ff8a80,#e53935 45%,#8e0000);color:#fff}
body.redgold .statbar .in{border-color:rgba(229,57,53,.3)}
body.redgold .emblem img{box-shadow:0 0 90px rgba(229,57,53,.45)}
body.redgold .emblem::before,body.redgold .emblem::after{border-color:rgba(229,57,53,.4)}
body.redgold .step.done .dot{background:linear-gradient(135deg,#ff8a80,#8e0000)}
body.redgold .step.done::before,body.redgold .bar span{background:linear-gradient(90deg,#e53935,#ffb74d)}
body.redgold .toast .ok{border-color:#e53935}

/* ═════════ THEME: EMERALD VAULT (THEME_VARIANT = "emerald") ═════════ */
body.emerald{--primary:#10b981;--primary2:#6ee7b7;--accent:#fde68a;--muted:#9fb8ac;--shadow:0 20px 60px -20px rgba(16,185,129,.5);
  background:#030806;background-image:radial-gradient(1100px 600px at 80% -10%,rgba(16,185,129,.2),transparent 60%),radial-gradient(900px 500px at 0% 20%,rgba(253,230,138,.08),transparent 60%)}
body.emerald .uh{border-bottom-color:rgba(16,185,129,.22);background:rgba(3,8,6,.74)}
body.emerald .uh nav a.l.on{color:#6ee7b7}
body.emerald .uh nav a.l.on::after{background:linear-gradient(90deg,transparent,#10b981,transparent)}
body.emerald .btn.gold,body.emerald .btn.primary{background:linear-gradient(135deg,#6ee7b7,#10b981 45%,#047857);color:#03140d;box-shadow:0 14px 40px -12px rgba(16,185,129,.7)}
body.emerald .btn.ghost{border-color:rgba(16,185,129,.45);color:#6ee7b7}
body.emerald .shimmer{background:linear-gradient(100deg,#047857 0%,#34d399 25%,#d1fae5 40%,#10b981 55%,#047857 75%,#6ee7b7 100%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent}
body.emerald .kick,body.emerald .tchip,body.emerald .eyebrow{color:#6ee7b7;border-color:rgba(16,185,129,.35);background:rgba(16,185,129,.09)}
body.emerald .cc:hover{border-color:rgba(16,185,129,.6);box-shadow:0 30px 70px -30px rgba(16,185,129,.55)}
body.emerald .cc::before{background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),rgba(16,185,129,.24),transparent 45%)}
body.emerald .cc .arrow{background:linear-gradient(135deg,#6ee7b7,#047857);color:#03140d}
body.emerald .cc .ic{background:rgba(16,185,129,.1);border-color:rgba(16,185,129,.35)}
body.emerald .cbadge{background:linear-gradient(135deg,#6ee7b7,#047857);color:#03140d}
body.emerald .tab.on{background:linear-gradient(135deg,#6ee7b7,#10b981 45%,#047857);color:#03140d}
body.emerald .statbar .in{border-color:rgba(16,185,129,.3)}
body.emerald .emblem img{box-shadow:0 0 90px rgba(16,185,129,.45)}
body.emerald .emblem::before,body.emerald .emblem::after{border-color:rgba(16,185,129,.4)}
body.emerald .step.done .dot{background:linear-gradient(135deg,#6ee7b7,#047857)}
body.emerald .step.done::before,body.emerald .bar span{background:linear-gradient(90deg,#10b981,#fde68a)}
body.emerald .toast .ok{border-color:#10b981}
body.emerald .stat b,body.emerald .statbar b{color:#ecfdf5}

/* ═════════ v9 UI refresh: editorial gold ═════════ */
body.ultra{letter-spacing:-.005em;background:#060504;
  background-image:radial-gradient(1000px 520px at 85% -8%,rgba(232,185,35,.14),transparent 62%),radial-gradient(760px 460px at -5% 30%,rgba(232,185,35,.07),transparent 60%)}
h1,h2,h3,.brand-t{letter-spacing:-.02em}
.uh{background:rgba(6,5,4,.66);border-bottom:none;backdrop-filter:blur(20px) saturate(150%)}
.uh .wrap{height:76px}
.uh nav{background:rgba(255,255,255,.035);border:1px solid rgba(232,185,35,.18);border-radius:999px;padding:5px 6px;box-shadow:0 10px 40px -18px rgba(0,0,0,.8)}
.uh nav a.l{padding:9px 16px;border-radius:999px;white-space:nowrap;display:inline-flex;align-items:center;justify-content:center}
.uh nav a.l.on{background:rgba(232,185,35,.12);color:#ffe27a}
.uh nav a.l.on::after{display:none}
.uh nav a.l:hover{background:rgba(255,255,255,.05)}
.hero-u h1{font-size:clamp(44px,6.8vw,92px);line-height:.98;letter-spacing:-.035em}
.hero-u .lead{font-size:17px;color:#bfb6a0}
.eyebrow,.tchip,.kick{border-radius:999px}
.kick{letter-spacing:.22em}
.btn.gold{border-radius:999px;padding:14px 26px}
.btn.ghost{border-radius:999px}
.statbar .in{border-radius:26px;background:rgba(12,10,6,.8)}
.statbar b{font-size:44px;letter-spacing:-.03em}
.cc,.card,.panel,.ft,.how,.rev,.glass{border-radius:20px}
.cc{border-color:rgba(232,185,35,.12)}
.cc:hover,.card:hover,a.pc:hover{box-shadow:0 0 0 1px rgba(232,185,35,.45),0 30px 70px -36px rgba(232,185,35,.5)}
.card .btn,a.pc .go{letter-spacing:.01em}
.sh h2{letter-spacing:-.035em}
.bento>*{border-radius:20px}
.marquee span{font-family:'Space Grotesk';letter-spacing:.02em}
.live{border-radius:999px}
footer,.uf{background:#060504}
.uf .fine{letter-spacing:.04em}
html,body.ultra{overflow-x:clip}
.ticker,.marquee{max-width:100%;contain:paint}

/* ═════════ v10: midnight-gold theme, flowing motion, page transitions ═════════ */
@property --ang{syntax:'<angle>';inherits:false;initial-value:0deg}
body.ultra{background:#05060a;
  background-image:radial-gradient(1200px 620px at 15% -10%,rgba(232,185,35,.16),transparent 60%),radial-gradient(900px 560px at 95% 10%,rgba(90,110,255,.10),transparent 62%),radial-gradient(800px 500px at 50% 110%,rgba(232,185,35,.10),transparent 60%);
  background-size:140% 140%,130% 130%,120% 120%;animation:flowbg 26s ease-in-out infinite alternate}
@keyframes flowbg{0%{background-position:0% 0%,100% 0%,50% 100%}100%{background-position:30% 20%,70% 30%,40% 80%}}

/* flowing gold border on cards */
.cc,.glass,.ft,.how,.rev,.panel{position:relative;isolation:isolate}
.cc::before,.glass::before,.ft::before,.how::before,.rev::before,.panel::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;
  background:conic-gradient(from var(--ang),transparent 0 70%,rgba(255,226,140,.9) 80%,transparent 90%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
  opacity:0;transition:opacity .4s;animation:spin 6s linear infinite;pointer-events:none;z-index:-1}
.cc:hover::before,.glass:hover::before,.ft:hover::before,.how:hover::before,.rev:hover::before,.panel:hover::before{opacity:1}
@keyframes spin{to{--ang:360deg}}

/* full-bleed animated banner hero */
.hero-u{background:linear-gradient(90deg,rgba(5,6,10,.97) 0%,rgba(5,6,10,.78) 42%,rgba(5,6,10,.25) 100%),url(../assets/banner.gif) center/cover no-repeat!important;min-height:86vh}
.hero-u h1 .shimmer{background-size:300% 100%}

/* page transitions */
#veil{position:fixed;inset:0;z-index:300;pointer-events:none;background:#05060a;opacity:0;transform:translateY(12px);transition:opacity .42s ease,transform .42s cubic-bezier(.2,.8,.2,1)}
#veil::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 35%,rgba(255,226,140,.35) 50%,transparent 65%);transform:translateX(-100%)}
body.leaving #veil{opacity:1;transform:none;pointer-events:all}
body.leaving #veil::after{animation:sweep .5s ease forwards}
@keyframes sweep{to{transform:translateX(100%)}}
body.ultra main{animation:enter .7s cubic-bezier(.2,.8,.2,1) both}
@media(prefers-reduced-motion:reduce){body.ultra,body.ultra main,.cc::before,#veil::after{animation:none!important}#veil{transition:none}}

/* Animated Custom Golden Emojis */
.gold-emoji {
  width: 24px;
  height: 24px;
  vertical-align: middle;
  object-fit: contain;
  display: inline-block;
  filter: drop-shadow(0 2px 6px rgba(212, 175, 55, 0.4));
  pointer-events: none;
}
.gold-emoji-cat {
  width: 44px;
  height: 44px;
  object-fit: contain;
  filter: drop-shadow(0 4px 12px rgba(212, 175, 55, 0.45));
  pointer-events: none;
  transition: transform 0.3s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.cc:hover .gold-emoji-cat {
  transform: scale(1.12) rotate(4deg);
}
.gold-emoji-title {
  width: 32px;
  height: 32px;
  vertical-align: middle;
  object-fit: contain;
  margin-right: 8px;
  filter: drop-shadow(0 2px 8px rgba(212, 175, 55, 0.5));
  pointer-events: none;
}
.gold-emoji-lg {
  width: 86px;
  height: 86px;
  object-fit: contain;
  filter: drop-shadow(0 6px 20px rgba(212, 175, 55, 0.55));
  pointer-events: none;
  animation: float 4s ease-in-out infinite;
}
@keyframes float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}