/* True Heritage v2 design system: extracted verbatim from designs/website/interactive/ShopV2.dc.html (Home v2, approved).
   Do not edit here without updating Home v2; new components live in th-pages.css. */
@property --a{syntax:'<angle>';inherits:false;initial-value:0deg}
.lg{overflow:visible;flex:none;animation:lgGlow 6.5s ease-in-out infinite}
@keyframes lgGlow{0%,100%{filter:drop-shadow(0 0 8px rgba(255,150,70,.6)) drop-shadow(0 0 22px rgba(70,140,255,.3))}50%{filter:drop-shadow(0 0 8px rgba(70,140,255,.7)) drop-shadow(0 0 22px rgba(255,150,70,.35))}}
.lg path{transform-box:fill-box;transform-origin:center}
.lg.solid{animation:none;filter:none}
@keyframes lgIn{from{opacity:0;transform:var(--f)}}
@keyframes lgT{from{opacity:0;transform:translateY(-24px);filter:blur(8px)}}
.lg-rt{--f:translateY(-90px);animation:lgIn .9s cubic-bezier(.2,.8,.2,1) .15s both}
.lg-rl{--f:translateX(-100px) rotate(-30deg);animation:lgIn 1s cubic-bezier(.2,.8,.2,1) .35s both}
.lg-mo{--f:translateY(-170px) scale(.7);animation:lgIn 1.1s cubic-bezier(.2,1.25,.4,1) .6s both}
.lg-tt{animation:lgT 1.2s ease 1.4s both}
.lg-tb{animation:lgT 1.2s ease 1.6s both}
.lg-yl{--f:translateX(-70px);animation:lgIn .9s cubic-bezier(.2,.8,.2,1) 1.9s both}
.lg-yr{--f:translateX(70px);animation:lgIn .9s cubic-bezier(.2,.8,.2,1) 1.9s both}
.lg-sw{animation:lgSw 6.5s ease-in-out 2.4s infinite;transform:skewX(-18deg)}
@keyframes lgSw{0%{transform:skewX(-18deg) translateX(0)}35%,100%{transform:skewX(-18deg) translateX(1400px)}}
.lg-fl{transform-box:fill-box;transform-origin:center;opacity:0;mix-blend-mode:screen;animation:lgFl 1.8s ease 1.1s both,lgFl2 6.5s ease 4s infinite}
.lg-fl2{animation-delay:1.25s,7.25s}
@keyframes lgFl{0%{opacity:0;transform:scale(.3)}25%{opacity:1;transform:scale(1.3)}100%{opacity:.35;transform:scale(1)}}
@keyframes lgFl2{0%,100%{opacity:.35}10%{opacity:1}30%{opacity:.35}}
.intro{animation:introOut .8s ease 4.4s forwards}
@keyframes introOut{to{opacity:0;visibility:hidden}}
.ibeam{position:absolute;left:50%;top:-6%;width:46%;height:70%;transform:translateX(-50%);background:linear-gradient(180deg,rgba(150,190,255,.38),rgba(150,190,255,0));clip-path:polygon(40% 0,60% 0,100% 100%,0 100%);filter:blur(12px);pointer-events:none}
@media (prefers-reduced-motion: reduce){.lg,.lg *{animation:none!important}.lg-sw{display:none}.lg-fl{opacity:.35}.intro{animation:none!important}}

.emb{flex:none;animation:emGlow 6.5s ease-in-out infinite}
@keyframes emGlow{0%,100%{filter:drop-shadow(0 0 6px rgba(255,150,70,.6)) drop-shadow(0 0 16px rgba(70,140,255,.3))}50%{filter:drop-shadow(0 0 6px rgba(70,140,255,.65)) drop-shadow(0 0 16px rgba(255,150,70,.35))}}
@media (prefers-reduced-motion: reduce){.emb{animation:none;filter:drop-shadow(0 0 6px rgba(255,150,70,.5))}}
body{margin:0;font-family:'Space Grotesk',sans-serif;background:#08090D;color:#FAFBFF}
a{color:inherit;text-decoration:none}
a:hover{color:#FFFFFF}
:focus-visible{outline:3px solid #00E4CD;outline-offset:3px}
.smoke{position:absolute;border-radius:50%;filter:blur(76px);pointer-events:none}
.s1{animation:d1 18s ease-in-out infinite}.s2{animation:d2 24s ease-in-out infinite}.s3{animation:d3 21s ease-in-out infinite}
@keyframes d1{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(80px,-56px) scale(1.2)}}
@keyframes d2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-100px,46px) scale(1.14)}}
@keyframes d3{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(56px,70px) scale(1.22)}}
.in{opacity:0;transform:translateY(34px);filter:blur(12px);animation:inr 1.1s cubic-bezier(.2,.8,.2,1) forwards}
.d1{animation-delay:.1s}.d2{animation-delay:.28s}.d3{animation-delay:.46s}.d4{animation-delay:.7s}.d5{animation-delay:.9s}
@keyframes inr{to{opacity:1;transform:none;filter:none}}
.edge{position:relative;padding:1px;background:conic-gradient(from var(--a),rgba(250,251,255,0.1) 0deg,#00E4CD 38deg,rgba(250,251,255,0.1) 95deg,rgba(250,251,255,0.1) 185deg,#BA79FF 232deg,rgba(250,251,255,0.1) 292deg,rgba(250,251,255,0.1) 360deg);animation:spin 8s linear infinite}
@keyframes spin{to{--a:360deg}}
.pulse{animation:pl 1.8s ease-in-out infinite}
@keyframes pl{0%,100%{opacity:1}50%{opacity:0.25}}
.marq{display:flex;width:max-content;animation:mq 40s linear infinite}
@keyframes mq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.caret{animation:cr 1s steps(1) infinite}
@keyframes cr{50%{opacity:0}}
.card{position:relative;box-shadow:0 0 54px -18px var(--g);transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s}
@media (hover:hover){.card:hover{transform:translateY(-8px);box-shadow:0 30px 70px -22px var(--g)}}
/* slanted bands */
.band{position:absolute;border-radius:100px;background:linear-gradient(180deg,rgba(28,30,43,.9),rgba(12,13,19,.9));border:1px solid rgba(250,251,255,.06);transform:rotate(-38deg)}
.streak{position:absolute;height:2px;width:340px;background:linear-gradient(90deg,transparent,var(--c),transparent);box-shadow:0 0 16px var(--c);opacity:0;animation:sweep 7.5s ease-in-out infinite}
@keyframes sweep{0%{opacity:0;transform:translate(-180px,140px) rotate(-38deg)}15%{opacity:1}60%{opacity:1}100%{opacity:0;transform:translate(380px,-300px) rotate(-38deg)}}
/* lamp category bar */
.lamp{display:flex;overflow-x:auto;background:rgba(16,18,27,.82);backdrop-filter:blur(12px);border:1px solid rgba(250,251,255,.12);border-radius:22px;padding:0 6px;box-shadow:0 24px 50px -24px rgba(0,0,0,.9)}
.lt{position:relative;flex:1;min-width:76px;min-height:88px;border:0;background:transparent;color:rgba(250,251,255,.45);cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.08em;text-transform:uppercase;transition:color .45s}
.lt:hover{color:rgba(250,251,255,.85)}
.lt::before{content:'';position:absolute;top:0;left:50%;width:46px;height:4px;border-radius:0 0 4px 4px;background:var(--c);box-shadow:0 0 14px var(--c);transform:translateX(-50%) scaleX(0);transition:transform .45s cubic-bezier(.3,1.3,.5,1)}
.lt::after{content:'';position:absolute;top:4px;left:50%;width:96px;height:72px;transform:translateX(-50%);background:linear-gradient(180deg,var(--c),transparent);clip-path:polygon(30% 0,70% 0,100% 100%,0 100%);opacity:0;transition:opacity .45s;pointer-events:none}
.lt svg{transition:filter .45s}
.lt[aria-pressed="true"]{color:var(--c)}
.lt[aria-pressed="true"]::before{transform:translateX(-50%) scaleX(1)}
.lt[aria-pressed="true"]::after{opacity:.26}
.lt[aria-pressed="true"] svg{filter:drop-shadow(0 0 6px var(--c)) drop-shadow(0 0 16px var(--c))}
/* slide-up glow category boxes */
.sc{position:relative;height:330px}
.sc-top{position:absolute;left:0;right:0;top:40px;height:180px;border:0;border-radius:22px;background:#15171F;color:#FAFBFF;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;z-index:2;font-family:'Space Grotesk',sans-serif;box-shadow:0 22px 40px -18px rgba(0,0,0,.95),inset 0 1px 0 rgba(255,255,255,.07);transition:transform .6s cubic-bezier(.3,1.2,.5,1),background .6s,box-shadow .6s}
.sc-bot{position:absolute;left:12px;right:12px;top:52px;height:170px;border-radius:0 0 20px 20px;background:#F3F4FA;color:#08090D;padding:0 22px 18px;box-sizing:border-box;display:flex;flex-direction:column;justify-content:flex-end;gap:10px;transition:transform .6s cubic-bezier(.3,1.2,.5,1);box-shadow:0 20px 40px -20px rgba(0,0,0,.9)}
.sc[data-open="true"] .sc-top{transform:translateY(-36px);background:linear-gradient(135deg,var(--c1),var(--c2));box-shadow:0 0 50px -6px var(--c1),0 0 90px -10px var(--c2),inset 0 1px 0 rgba(255,255,255,.3)}
.sc[data-open="true"] .sc-bot{transform:translateY(104px)}
@media (hover:hover){.sc:hover .sc-top{transform:translateY(-36px);background:linear-gradient(135deg,var(--c1),var(--c2));box-shadow:0 0 50px -6px var(--c1),0 0 90px -10px var(--c2),inset 0 1px 0 rgba(255,255,255,.3)}.sc:hover .sc-bot{transform:translateY(104px)}}
/* neon chasing corners */
.chase{position:relative;border-radius:28px;background:#0C0E18}
.chase::before{content:'';position:absolute;top:-2px;left:-2px;right:-2px;bottom:-2px;border-radius:30px;padding:2px;background:conic-gradient(from var(--a),#00E4CD 0deg,rgba(0,228,205,0) 80deg,transparent 180deg,#F171DA 180deg,rgba(241,113,218,0) 260deg,transparent 360deg);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;animation:spin 5s linear infinite;pointer-events:none}
/* glow pill button */
.gbtn{position:relative;display:inline-flex;align-items:center;justify-content:center;min-height:56px;padding:0 32px;border-radius:999px;background:#0A0B10;color:#FAFBFF;font-weight:500;font-size:17px;box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 14px 30px -12px #000;transition:transform .25s}
.gbtn:hover{transform:translateY(-3px)}
.gbtn::after{content:'';position:absolute;left:22%;right:8%;bottom:-1px;height:2px;border-radius:2px;background:linear-gradient(90deg,transparent,#3978FF,#A855F7,#FAFBFF);box-shadow:0 0 12px #A855F7,0 0 24px #3978FF;transition:left .5s cubic-bezier(.3,1.2,.5,1),right .5s cubic-bezier(.3,1.2,.5,1),box-shadow .5s}
.gbtn:hover::after{left:6%;right:6%;box-shadow:0 0 16px #A855F7,0 0 34px #3978FF}
.vsoc{display:none}
@media (min-width:1100px){.vsoc{display:flex}}
.glass{background:rgba(16,18,27,0.66);backdrop-filter:blur(16px);border:1px solid rgba(250,251,255,0.16)}
.btn{transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s,background .25s}
.btn:hover{transform:translateY(-3px)}
.btn-w:hover{box-shadow:0 0 50px rgba(250,251,255,0.5)}
.btn-o:hover{background:rgba(250,251,255,0.12)}
.btn .ar{display:inline-block;margin-left:10px;transition:transform .25s}
.btn:hover .ar{transform:translateX(6px)}
.nl{position:relative;display:inline-block}
.nl:after{content:'';position:absolute;left:16px;right:16px;bottom:7px;height:1px;background:#FAFBFF;transform:scaleX(0);transform-origin:left;transition:transform .3s}
.nl:hover:after{transform:scaleX(1)}
.chip{transition:background .2s,color .2s,transform .2s}
.chip:hover{transform:translateY(-2px)}
.sw{position:relative;flex:none;width:92px;height:44px;padding:0;border:0;border-radius:22px;cursor:pointer;overflow:hidden;background:linear-gradient(180deg,#06070B,#151722);font-family:'IBM Plex Mono',monospace;font-size:12px;font-weight:700;transition:box-shadow .5s,transform .2s}
.sw:active{transform:scale(.97)}
.sw::before{content:'';position:absolute;top:0;bottom:0;right:0;width:58%;background:radial-gradient(circle at 70% 50%,var(--lit),transparent 85%);opacity:0;transition:opacity .45s}
.sw[aria-checked="true"]{box-shadow:inset 0 3px 8px rgba(0,0,0,.6),0 0 0 2px #1d1f2a,0 0 26px -2px var(--lit)}
.sw[aria-checked="true"]::before{opacity:1}
.swo,.swn{position:absolute;top:0;bottom:0;display:flex;align-items:center;letter-spacing:.06em;pointer-events:none}
.swo{left:12px;color:#FF5A5A;text-shadow:0 0 10px rgba(255,64,64,.85);transition:opacity .35s}
.swn{right:13px;color:#FFFFFF;opacity:0;text-shadow:0 0 10px var(--lit);transition:opacity .4s}
.sw[aria-checked="true"] .swn{opacity:1}
.sw[aria-checked="true"] .swo{opacity:0}
.swk{position:absolute;top:4px;left:4px;width:54px;height:36px;border-radius:18px;background:linear-gradient(180deg,#5C6070 0%,#383B48 55%,#2B2E39 100%);box-shadow:0 3px 7px rgba(0,0,0,.65),inset 0 1px 0 rgba(255,255,255,.28);transform:translateX(30px);transition:transform .5s cubic-bezier(.3,1.3,.5,1)}
.swk::after{content:'';position:absolute;left:50%;top:50%;width:30px;height:18px;transform:translate(-50%,-50%);background-image:radial-gradient(circle,rgba(250,251,255,.38) 1.3px,transparent 1.7px);background-size:6px 6px}
.sw[aria-checked="true"] .swk{transform:none}
.sw.sm{width:70px;height:34px;border-radius:17px;font-size:10px}
.sw.sm .swo{left:9px}.sw.sm .swn{right:10px}
.sw.sm .swk{top:3px;left:3px;width:40px;height:28px;border-radius:14px;transform:translateX(24px)}
.sw.sm .swk::after{width:22px;height:14px;background-size:5px 5px}
.sw.sm[aria-checked="true"] .swk{transform:none}
.sw::after{content:'';position:absolute;top:0;bottom:0;left:0;width:60%;background:radial-gradient(circle at 30% 50%,rgba(255,64,64,.55),transparent 80%);opacity:1;transition:opacity .45s;pointer-events:none}
.sw[aria-checked="true"]::after{opacity:0}
.sw:not([aria-checked="true"]){box-shadow:inset 0 3px 8px rgba(0,0,0,.85),0 0 0 2px #1d1f2a,0 0 22px -4px rgba(255,64,64,.55)}
.cx *{transition:color .55s ease,background-color .55s ease,border-color .55s ease,box-shadow .55s ease}
.trace{position:relative}
.trace::before{content:'';position:absolute;top:-1px;left:-1px;right:-1px;bottom:-1px;border-radius:inherit;padding:2px;background:conic-gradient(from var(--a),transparent 0deg,transparent 245deg,var(--lit) 305deg,#FAFBFF 346deg,transparent 360deg);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;animation:spin 6s linear infinite;opacity:.6;transition:opacity .4s;pointer-events:none;z-index:2}
.trace:hover::before{opacity:1;animation-duration:2.6s}
.rm{position:relative;display:inline-flex;align-items:center;min-height:44px;padding:0 18px 0 54px;border:1px solid var(--line);border-radius:22px;font-weight:700;font-size:15px;color:var(--fg);background:transparent;cursor:pointer;font-family:'Space Grotesk',sans-serif;transition:padding .5s cubic-bezier(.3,1.2,.5,1),border-color .3s}
.rmc{position:absolute;top:3px;left:3px;width:36px;height:36px;border-radius:50%;background:var(--btnbg);color:var(--btnfg);display:flex;align-items:center;justify-content:center;box-shadow:var(--btnsh);transition:left .5s cubic-bezier(.3,1.2,.5,1)}
.rm:hover{padding:0 54px 0 18px;border-color:var(--fg)}
.rm:hover .rmc{left:calc(100% - 39px)}
.ringbtn{position:relative;flex:none;width:64px;height:64px;border-radius:50%;border:0;padding:0;cursor:pointer;background:#0B0C12;color:#FAFBFF;display:inline-flex;align-items:center;justify-content:center;box-shadow:inset 0 2px 8px rgba(0,0,0,.85),0 0 30px -6px rgba(250,251,255,.35);transition:transform .25s}
.ringbtn:hover{transform:scale(1.07)}
.ringbtn::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;border-radius:50%;padding:2px;background:conic-gradient(from var(--a),rgba(250,251,255,.12),#FAFBFF 18%,#00E4CD 38%,#F171DA 56%,rgba(250,251,255,.12) 76%,#FAFBFF);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;animation:spin 3.2s linear infinite}
.ringbtn.sm{width:46px;height:46px}
.pbar{display:flex;align-items:center;gap:10px;padding:5px 5px 5px 18px;border-radius:40px;background:rgba(16,18,27,.72);backdrop-filter:blur(12px);border:1px solid rgba(250,251,255,.28);box-shadow:0 0 50px -20px rgba(168,85,247,.9);transition:border-color .3s,box-shadow .3s}
.pbar:focus-within{border-color:#00E4CD;box-shadow:0 0 0 3px rgba(0,228,205,.35),0 0 50px -20px rgba(168,85,247,.9)}
.pbar input{flex:1;min-width:0;height:44px;border:0;outline:none;background:transparent;color:#FAFBFF;font-family:'Space Grotesk',sans-serif;font-size:17px}
.pbar input::placeholder{color:#A3A8BD}
.gl{position:relative;display:block}
.gl::before,.gl::after{content:attr(data-t);position:absolute;left:0;top:0;width:100%;pointer-events:none;opacity:0}
.gl::before{color:var(--c1);animation:glA 6.5s steps(1) infinite;animation-delay:var(--gd,0s)}
.gl::after{color:var(--c2);animation:glB 6.5s steps(1) infinite;animation-delay:var(--gd,0s)}
@keyframes glA{0%,91%,100%{opacity:0}91.5%{opacity:1;clip-path:inset(8% 0 64% 0);transform:translateX(-12px)}93.5%{opacity:1;clip-path:inset(52% 0 20% 0);transform:translateX(14px)}95.5%{opacity:1;clip-path:inset(28% 0 42% 0);transform:translateX(-7px)}97.5%{opacity:1;clip-path:inset(74% 0 4% 0);transform:translateX(9px)}99%{opacity:0}}
@keyframes glB{0%,92%,100%{opacity:0}92.5%{opacity:1;clip-path:inset(60% 0 12% 0);transform:translateX(12px)}94.5%{opacity:1;clip-path:inset(14% 0 58% 0);transform:translateX(-14px)}96.5%{opacity:1;clip-path:inset(40% 0 30% 0);transform:translateX(8px)}98.5%{opacity:0}}
.sl{opacity:0;animation:slin 1.25s cubic-bezier(.2,.7,.2,1) both}
.sl.d2{animation-delay:.15s}.sl.d3{animation-delay:.55s}.sl.d4{animation-delay:.95s}
@keyframes slin{0%{opacity:1;clip-path:inset(46% 0 46% 0);transform:translateX(-44px)}22%{clip-path:inset(18% 0 62% 0);transform:translateX(34px)}42%{clip-path:inset(62% 0 8% 0);transform:translateX(-20px)}62%{clip-path:inset(4% 0 34% 0);transform:translateX(12px)}82%{clip-path:inset(0 0 0 0);transform:translateX(-4px)}100%{opacity:1;clip-path:inset(0 0 0 0);transform:none}}
.fade{animation:fd .6s ease both}
@keyframes fd{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@supports (animation-timeline: view()){
.rv{opacity:0;transform:translateY(56px);animation:rvk linear both;animation-timeline:view();animation-range:entry 4% entry 42%}
@keyframes rvk{to{opacity:1;transform:none}}
}
.gl::before,.gl::after{animation:none!important;opacity:0!important}
.chase::before{animation:none!important;opacity:0!important}
.chase{border:1px solid rgba(250,251,255,0.16)}
@media (prefers-reduced-motion: reduce){
.smoke,.pulse,.marq,.edge,.caret,.trace::before,.ringbtn::before,.gl::before,.gl::after,.chase::before{animation:none!important}
.streak{animation:none!important;opacity:0}
.sc-top,.sc-bot,.lt::before,.lt::after,.gbtn::after{transition:none!important}
.gl::before,.gl::after{opacity:0}
.in,.rv,.sl,.fade{opacity:1!important;transform:none!important;filter:none!important;animation:none!important;clip-path:none!important}
.card,.btn,.chip,.rm,.rmc{transition:none!important}
}
