body{margin:0;background:#0A0B10}
a{color:#7D95FF}a:hover{color:#FFFFFF}
input:focus-visible,a:focus-visible,button:focus-visible{outline:3px solid #7D95FF;outline-offset:3px}
@keyframes spk-twinkle{0%,100%{opacity:.12;transform:scale(.5) rotate(0deg)}50%{opacity:1;transform:scale(1) rotate(25deg)}}
.spk{position:absolute;pointer-events:none;animation:spk-twinkle 2.8s ease-in-out infinite;z-index:0}
@media (prefers-reduced-motion:reduce){.spk{animation:none;opacity:.55}}
.glitch{position:relative;animation:gl-skew 5s steps(1) infinite}
.glitch::before,.glitch::after{content:attr(data-text);position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;clip-path:inset(0 0 100% 0)}
.glitch::before{color:#2F5BFF;animation:gl-a 5s steps(1) infinite}
.glitch::after{color:#FF3DA8;animation:gl-b 5s steps(1) infinite}
@keyframes gl-skew{0%,100%{transform:none}86%{transform:skewX(-5deg)}88%{transform:skewX(4deg)}90%{transform:none}}
@keyframes gl-a{0%,100%{transform:none;clip-path:inset(0 0 100% 0)}85%{transform:translate(-5px,2px);clip-path:inset(8% 0 62% 0)}87%{transform:translate(5px,-2px);clip-path:inset(52% 0 22% 0)}89%{transform:translate(-3px,0);clip-path:inset(30% 0 48% 0)}91%{transform:none;clip-path:inset(0 0 100% 0)}}
@keyframes gl-b{0%,100%{transform:none;clip-path:inset(0 0 100% 0)}86%{transform:translate(5px,-1px);clip-path:inset(64% 0 10% 0)}88%{transform:translate(-4px,2px);clip-path:inset(18% 0 58% 0)}90%{transform:translate(3px,0);clip-path:inset(40% 0 36% 0)}92%{transform:none;clip-path:inset(0 0 100% 0)}}
.neon{animation:neon 6s infinite}
@keyframes neon{0%,18%,22%,52%,58%,100%{opacity:1;text-shadow:0 0 6px rgba(47,91,255,.9),0 0 18px rgba(47,91,255,.6)}20%,55%{opacity:.35;text-shadow:none}}
.scan{position:absolute;inset:0;pointer-events:none;z-index:1;background:repeating-linear-gradient(0deg,rgba(255,255,255,.035) 0 1px,transparent 1px 4px)}
.shimmer{position:absolute;left:0;right:0;top:-160px;height:160px;pointer-events:none;z-index:1;background:linear-gradient(180deg,rgba(47,91,255,0) 0%,rgba(47,91,255,.12) 50%,rgba(47,91,255,0) 100%);animation:shimmer 7s linear infinite}
@keyframes shimmer{0%{transform:translateY(0)}100%{transform:translateY(1200px)}}
@media (prefers-reduced-motion:reduce){.glitch,.glitch::before,.glitch::after,.neon,.shimmer{animation:none}}
.neon-plug{filter:drop-shadow(0 0 3px #4F74FF) drop-shadow(0 0 8px #2F5BFF);animation:np-flick 3.4s infinite}
@keyframes np-flick{0%,44%,50%,100%{opacity:1}46%{opacity:.35}48%{opacity:.9}49%{opacity:.4}}
@media (prefers-reduced-motion:reduce){.neon-plug{animation:none}}
.cord-drips{filter:drop-shadow(0 0 4px rgba(47,91,255,.7))}
.cdrip{transform-box:fill-box;transform-origin:top;animation:cdrip 3s ease-in infinite}
.cdrip-1{animation-delay:-1s}.cdrip-2{animation-delay:-2s}
@keyframes cdrip{0%{transform:scaleY(.35);opacity:1}75%{transform:scaleY(1.25);opacity:1}100%{transform:translateY(10px) scaleY(1.25);opacity:0}}
.hero-tag{font-family:'Sedgwick Ave Display',cursive;position:absolute;pointer-events:none;line-height:1}
@media (prefers-reduced-motion:reduce){.cdrip{animation:none}}
.ldrip{transform-box:fill-box;transform-origin:top;animation:ldrip 3.2s ease-in infinite}
.ldrip-2{animation-delay:-1.1s}.ldrip-3{animation-delay:-2.1s}
@keyframes ldrip{0%,100%{transform:scaleY(.92)}50%{transform:scaleY(1.08)}}
@media (prefers-reduced-motion:reduce){.ldrip{animation:none}}
.dfall{opacity:0;animation:dfall 3.6s ease-in infinite}
.dfall-1{animation-delay:-1.2s}.dfall-2{animation-delay:-2.4s}
@keyframes dfall{0%,55%{opacity:0;transform:translateY(-6px)}60%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(26px)}}
@media (prefers-reduced-motion:reduce){.dfall{animation:none;opacity:0}}
.crown-neon{animation:crown-flick 4s infinite}.crown-neon-2{animation-delay:-1.7s}
@keyframes crown-flick{0%,40%,46%,100%{opacity:1}42%{opacity:.45}44%{opacity:.95}45%{opacity:.5}}
@media (prefers-reduced-motion:reduce){.crown-neon{animation:none}}
@media (max-width:900px){.crown-neon-2{display:none}}
.melt-glow{animation:melt-pulse 2.4s ease-in-out infinite}
@keyframes melt-pulse{0%,100%{opacity:.55}50%{opacity:1}}
@media (prefers-reduced-motion:reduce){.melt-glow{animation:none}}
@media (max-width:900px){.hero-tag{display:none}}
@media (max-width:900px){.tag-hero{display:none}}
.cord-svg{animation:cord-flash 4.2s steps(1) infinite}
@keyframes cord-flash{0%,100%{filter:drop-shadow(0 0 4px rgba(47,91,255,.55))}88%{filter:drop-shadow(0 0 16px #7D95FF) brightness(1.7)}89%{filter:drop-shadow(0 0 4px rgba(47,91,255,.55))}91%{filter:drop-shadow(0 0 20px #FFFFFF) brightness(1.9)}93%{filter:drop-shadow(0 0 4px rgba(47,91,255,.55))}}
.cord-glow{opacity:.3;animation:cord-pulse 2.2s ease-in-out infinite}
@keyframes cord-pulse{0%,100%{opacity:.18}50%{opacity:.6}}
.cord-surge{stroke-dasharray:7 93;stroke-dashoffset:100;animation:cord-surge 2.4s linear infinite}
.cord-surge-2{stroke-dasharray:4 96;animation-duration:3.4s;animation-delay:-1.2s}
@keyframes cord-surge{from{stroke-dashoffset:100}to{stroke-dashoffset:0}}
.zap{opacity:0;animation:zap 2.4s steps(1) infinite}
.zap-2{animation-delay:-.8s}.zap-3{animation-delay:-1.6s}
@keyframes zap{0%,100%{opacity:0}10%{opacity:1}14%{opacity:0}18%{opacity:1}24%{opacity:0}}
@media (prefers-reduced-motion:reduce){.cord-svg,.cord-glow,.cord-surge,.zap{animation:none}.zap{opacity:.8}.cord-surge{opacity:0}}


.byo-pop{animation:byoPop .55s cubic-bezier(.2,1.6,.4,1) both}
@keyframes byoPop{0%{transform:scale(.2) rotate(-25deg);opacity:0}100%{transform:scale(1) rotate(var(--rot,0deg));opacity:1}}
.byo-fall{position:absolute;box-shadow:0 2px 3px rgba(0,0,0,.4);transform:rotate(var(--r,0deg));animation:byoFall .75s cubic-bezier(.3,.9,.4,1.2) both}
@keyframes byoFall{0%{transform:translateY(-220px) rotate(0deg);opacity:0}20%{opacity:1}100%{transform:translateY(0) rotate(var(--r,0deg));opacity:1}}
.byo-drizpath{stroke-dasharray:440;stroke-dashoffset:440;animation:byoDraw 1.1s ease-out .05s forwards}
@keyframes byoDraw{to{stroke-dashoffset:0}}
.byo-flapL{animation:byoFlapL .4s cubic-bezier(.3,1.3,.5,1) both}
@keyframes byoFlapL{from{transform:translateX(-130%) rotate(-14deg)}to{transform:none}}
.byo-flapR{animation:byoFlapR .4s cubic-bezier(.3,1.3,.5,1) .1s both}
@keyframes byoFlapR{from{transform:translateX(130%) rotate(14deg)}to{transform:none}}
.byo-ribV{animation:byoRibV .25s ease-out .45s both}
@keyframes byoRibV{from{transform:scaleY(0)}to{transform:none}}
.byo-ribH{animation:byoRibH .25s ease-out .52s both}
@keyframes byoRibH{from{transform:scaleX(0)}to{transform:none}}
.byo-bow{animation:byoPop .45s cubic-bezier(.2,1.6,.4,1) .62s both}
.byo-flyx{position:fixed;z-index:9999;pointer-events:none;width:72px;height:72px;animation:byoFlyX .85s linear forwards}
@keyframes byoFlyX{to{transform:translateX(var(--dx))}}
.byo-flyy{animation:byoFlyY .85s cubic-bezier(.35,-0.7,.75,1) forwards}
@keyframes byoFlyY{to{transform:translateY(var(--dy))}}
.byo-spin{animation:byoSpin .85s ease-in forwards;filter:drop-shadow(0 0 10px #2F5BFF)}
@keyframes byoSpin{to{transform:rotate(620deg) scale(.35)}}
.cart-bump{animation:cartBump .55s cubic-bezier(.2,1.8,.4,1)}
.cart-bump2{animation:cartBump2 .55s cubic-bezier(.2,1.8,.4,1)}
@keyframes cartBump{40%{transform:scale(1.25) rotate(-5deg);box-shadow:0 0 36px rgba(47,91,255,1)}}
@keyframes cartBump2{40%{transform:scale(1.25) rotate(5deg);box-shadow:0 0 36px rgba(47,91,255,1)}}
.byo-cord{position:relative}
.byo-cord::before{content:"";position:absolute;left:21px;top:24px;bottom:24px;width:3px;border-radius:3px;background:linear-gradient(180deg,#2F5BFF,#9FB3FF 50%,#2F5BFF);background-size:100% 200%;box-shadow:0 0 10px #2F5BFF;animation:byoCord 2.4s linear infinite}
@keyframes byoCord{to{background-position:0 200%}}
.byo-plate{animation:byoGlow 2.8s ease-in-out infinite}
@keyframes byoGlow{50%{opacity:.55;transform:scaleX(.9)}}
.byo-whoosh{animation:byoWhoosh .8s ease-out both}
@keyframes byoWhoosh{0%{transform:scale(.4) rotate(-12deg);opacity:0}30%{opacity:1}100%{transform:scale(1.1) rotate(-8deg);opacity:0}}
@media (max-width:860px){.byo-grid{grid-template-columns:1fr!important}.byo-stagecol{position:sticky!important;top:8px!important;z-index:20;width:min(200px,48vw);justify-self:end}.byo-cap{display:none!important}}
@media (prefers-reduced-motion:reduce){.byo-pop,.byo-fall,.byo-flapL,.byo-flapR,.byo-ribV,.byo-ribH,.byo-bow,.byo-plate,.byo-cord::before,.cart-bump,.cart-bump2,.byo-whoosh{animation:none}.byo-drizpath{animation:none;stroke-dashoffset:0}}

.nav-toggle{display:none}
@media (max-width:760px){.nav-toggle{display:inline-flex}.site-nav{display:none!important;flex-basis:100%;order:3}.site-nav[data-open="true"]{display:flex!important;flex-direction:column;align-items:stretch}.site-nav[data-open="true"] button{text-align:left}}
@media (max-width:860px){.byo-lbl{display:none}}

@media (max-width:860px){
.byo-grid{gap:20px!important}
.byo-stagecol{position:sticky!important;top:0!important;z-index:20;width:auto!important;justify-self:stretch!important;flex-direction:row!important;align-items:center;gap:14px!important;background:rgba(10,11,16,.94);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);margin:0 -20px;padding:10px 20px;border-bottom:1px solid #262A38}
.byo-stagecol [data-byo-stage]{flex:0 0 118px;width:118px}
.byo-cap{display:flex!important;gap:4px!important;min-width:0}
.byo-cap > div > span:first-child{font-size:20px!important}
.byo-cap p{font-size:13px!important;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.byo-done-btns,.byo-done-sub{display:none!important}
.byo-done-t{font-size:20px!important}
.byo-pk{font-size:24px!important;right:6px!important;bottom:4px!important}
.byo-whoosh{font-size:24px!important}
}
@media (max-width:760px){.hdr{column-gap:10px!important}.hdr > button:first-child{zoom:.8}.hdr [data-cart-btn]{padding:10px 12px!important}}
