@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation-duration:.22s;animation-timing-function:cubic-bezier(.2,.7,.2,1)}
@media (prefers-reduced-motion:reduce){::view-transition-old(root),::view-transition-new(root){animation:none}}

/* ---------------- deep field ---------------- */
.sbc-sky{position:fixed;inset:0;z-index:-2;pointer-events:none;overflow:hidden;contain:strict;
  background:
    radial-gradient(120% 70% at 50% -10%,rgba(40,70,120,.34),transparent 60%),
    radial-gradient(90% 60% at 50% 115%,rgba(30,22,70,.45),transparent 65%),
    linear-gradient(180deg,#060913 0%,#05070d 45%,#070812 100%)}
.sbc-sky i{position:absolute;display:block;will-change:transform}
.sbc-neb{border-radius:50%;opacity:.9;mix-blend-mode:screen}
.sbc-neb--a{width:78vmax;height:62vmax;left:-24vmax;top:-26vmax;
  background:radial-gradient(closest-side,rgba(92,192,255,.20),rgba(92,192,255,.07) 45%,transparent 72%);
  animation:sbcDriftA 70s ease-in-out infinite alternate}
.sbc-neb--b{width:70vmax;height:70vmax;right:-28vmax;top:8vh;
  background:radial-gradient(closest-side,rgba(139,123,255,.19),rgba(139,123,255,.06) 48%,transparent 72%);
  animation:sbcDriftB 86s ease-in-out infinite alternate}
.sbc-neb--c{width:64vmax;height:48vmax;left:12vw;bottom:-30vmax;
  background:radial-gradient(closest-side,rgba(54,214,195,.12),rgba(54,214,195,.04) 50%,transparent 74%);
  animation:sbcDriftC 94s ease-in-out infinite alternate}
.sbc-aurora{left:-10%;right:-10%;top:-38vh;height:70vh;border-radius:50%;opacity:.55;
  background:conic-gradient(from 200deg at 50% 100%,transparent 0deg,rgba(92,192,255,.16) 40deg,rgba(139,123,255,.14) 80deg,rgba(54,214,195,.10) 120deg,transparent 160deg);
  -webkit-mask-image:radial-gradient(60% 55% at 50% 100%,#000 30%,transparent 72%);mask-image:radial-gradient(60% 55% at 50% 100%,#000 30%,transparent 72%);
  animation:sbcAurora 40s ease-in-out infinite alternate}
.sbc-grid{inset:0;will-change:auto!important;opacity:.5;
  background-image:radial-gradient(rgba(160,200,255,.13) 1px,transparent 1.2px);background-size:34px 34px;
  -webkit-mask-image:radial-gradient(70% 60% at 50% 20%,#000 0%,transparent 70%);mask-image:radial-gradient(70% 60% at 50% 20%,#000 0%,transparent 70%)}
.sbc-dust{inset:0;will-change:auto!important;opacity:.05;background-image:url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22220%22%20height%3D%22220%22%3E%3Cfilter%20id%3D%22n%22%3E%3CfeTurbulence%20type%3D%22fractalNoise%22%20baseFrequency%3D%22.85%22%20numOctaves%3D%222%22%20stitchTiles%3D%22stitch%22%2F%3E%3CfeColorMatrix%20values%3D%220%200%200%200%201%20%200%200%200%200%201%20%200%200%200%200%201%20%200%200%200%20.55%200%22%2F%3E%3C%2Ffilter%3E%3Crect%20width%3D%22100%25%22%20height%3D%22100%25%22%20filter%3D%22url%28%23n%29%22%2F%3E%3C%2Fsvg%3E");background-size:220px 220px}
.sbc-sky::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 90% at 50% 40%,transparent 55%,rgba(0,0,0,.55) 100%)}
@keyframes sbcDriftA{0%{transform:translate3d(0,0,0) scale(1)}100%{transform:translate3d(10vw,8vh,0) scale(1.12)}}
@keyframes sbcDriftB{0%{transform:translate3d(0,0,0) scale(1.05)}100%{transform:translate3d(-12vw,14vh,0) scale(.94)}}
@keyframes sbcDriftC{0%{transform:translate3d(0,0,0) scale(1)}100%{transform:translate3d(14vw,-10vh,0) scale(1.15)}}
@keyframes sbcAurora{0%{transform:translate3d(-4%,0,0) rotate(-3deg);opacity:.4}100%{transform:translate3d(4%,2vh,0) rotate(3deg);opacity:.62}}

/* light: morning sky */
html.sb-light .sbc-sky{background:
    radial-gradient(120% 70% at 50% -10%,rgba(147,197,253,.45),transparent 60%),
    radial-gradient(90% 60% at 50% 115%,rgba(196,181,253,.35),transparent 65%),
    linear-gradient(180deg,#eef4ff 0%,#f5f7fc 50%,#f1f0fb 100%)}
html.sb-light .sbc-neb{mix-blend-mode:normal;opacity:.75}
html.sb-light .sbc-neb--a{background:radial-gradient(closest-side,rgba(96,165,250,.22),transparent 72%)}
html.sb-light .sbc-neb--b{background:radial-gradient(closest-side,rgba(167,139,250,.2),transparent 72%)}
html.sb-light .sbc-neb--c{background:radial-gradient(closest-side,rgba(45,212,191,.14),transparent 74%)}
html.sb-light .sbc-aurora{opacity:.35;background:conic-gradient(from 200deg at 50% 100%,transparent 0deg,rgba(96,165,250,.25) 50deg,rgba(167,139,250,.2) 100deg,transparent 160deg)}
html.sb-light .sbc-grid{background-image:radial-gradient(rgba(30,64,175,.12) 1px,transparent 1.2px);opacity:.45}
html.sb-light .sbc-dust{opacity:.035;filter:invert(1)}
html.sb-light .sbc-sky::after{background:radial-gradient(120% 90% at 50% 40%,transparent 60%,rgba(148,163,184,.18) 100%)}

/* v2: photographic plates */
.sbc-v2{background:linear-gradient(180deg,#010206 0%,#000 55%,#010105 100%)}
html:not(.sb-light) .sbc-v2 .sbc-plate,html:not(.sb-light) .sbc-v2 .sbc-near,html:not(.sb-light) .sbc-v2 .sbc-dust{display:none}
html:not(.sb-light) .sbc-v2::after{background:none}
.sbc-plate{position:absolute;inset:-40px -28px -48px;will-change:transform}
.sbc-pic{position:absolute;inset:0;opacity:0;transition:opacity .6s ease}
.sbc-pic.is-in{opacity:.9}
.sbc-near{position:absolute;inset:-90px -64px -150px;will-change:transform;z-index:1}
.sbc-near .sbc-pic img{animation:sbcNear 70s ease-in-out infinite alternate;transform-origin:50% 50%}
@keyframes sbcNear{0%{transform:scale(1.04) translate3d(0,0,0)}100%{transform:scale(1.1) translate3d(1.6%,-1.2%,0)}}
.sbc-v2 .sbc-dust{z-index:2}
html.sb-light .sbc-pic.is-in{opacity:1}
.sbc-pic img{display:block;width:100%;height:100%;object-fit:cover;transform-origin:62% 38%;animation:sbcCam 120s ease-in-out infinite alternate;will-change:transform}
html.sb-light .sbc-pic--dark,html:not(.sb-light) .sbc-pic--light{display:none}
@keyframes sbcCam{0%{transform:scale(1.02)}100%{transform:scale(1.075) translate3d(-.8%,.6%,0)}}
#sb-stars{opacity:0;transition:opacity 1s ease;will-change:transform}
#sb-stars.is-in{opacity:1}
html.sb-light #sb-stars{display:none}
.sbc-v2 .sbc-dust{opacity:.035}
.sbc-v2::after{background:radial-gradient(60% 50% at 40% 46%,rgba(5,7,16,.36),transparent 78%),radial-gradient(34% 30% at 22% 64%,rgba(5,7,16,.30),transparent 80%),radial-gradient(130% 100% at 50% 42%,transparent 58%,rgba(0,0,0,.42) 100%)}
html.sb-light .sbc-v2{background:linear-gradient(180deg,#90b5f1 0%,#c9daf8 45%,#e6edfb 78%,#edf1fc 100%)}
html.sb-light .sbc-v2 .sbc-dust{opacity:.02}
html.sb-light .sbc-v2::after{background:radial-gradient(130% 100% at 50% 40%,transparent 62%,rgba(120,140,180,.10) 100%)}
@media (max-width:700px){
  .sbc-neb--c,.sbc-grid{display:none}
  .sbc-neb--a{width:120vmax;height:90vmax;left:-50vmax;top:-40vmax}
  .sbc-neb--b{width:110vmax;height:110vmax;right:-60vmax}
}
@media (prefers-reduced-motion:reduce){.sbc-sky i,.sbc-pic img{animation:none!important}.sbc-near{transform:none!important}}

/* ---------------- reveals ---------------- */
.sbx-pend{opacity:0;transform:translate3d(0,26px,0) scale(.985);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1);transition-delay:var(--sbx-d,0s)}
.sbx-pend.sbx-in{opacity:1;transform:none}
.sbx-pend.sbx-l{transform:translate3d(-26px,0,0)}
.sbx-pend.sbx-l.sbx-in{transform:none}

/* ---------------- tilt + glare ---------------- */
html .sbx-tilt{transition:transform .45s cubic-bezier(.2,.8,.2,1)}
html .sbx-tilt.sbx-live{transform:perspective(900px) translate3d(0,-4px,0) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg))!important;transition:transform .12s linear!important}
.sbx-glare{position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .3s ease;z-index:3;
  background:radial-gradient(420px circle at var(--gx,50%) var(--gy,50%),rgba(255,255,255,.10),transparent 45%)}
.sbx-tilt.sbx-live .sbx-glare{opacity:1}
html.sb-light .sbx-glare{background:radial-gradient(420px circle at var(--gx,50%) var(--gy,50%),rgba(29,78,216,.07),transparent 45%)}
.card .thumb img,.sb-frt-img img,.sb-pop-thumb img{transition:transform .7s cubic-bezier(.16,1,.3,1)}
.card:hover .thumb img,.sb-frt-card:hover .sb-frt-img img,.sb-pop-card:hover .sb-pop-thumb img{transform:scale(1.06)}

/* ---------------- button sheen ---------------- */
.btn:not(.btn-ghost),.pk-btn--primary,.single_add_to_cart_button,.sb-checkout-btn,.sb-support-btn,.sb-tr-btn{position:relative;overflow:hidden;isolation:isolate}
.btn:not(.btn-ghost)::after,.pk-btn--primary::after,.single_add_to_cart_button::after,.sb-checkout-btn::after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:45%;z-index:1;pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-18deg) translateX(0);opacity:0}
.btn:not(.btn-ghost):hover::after,.pk-btn--primary:hover::after,.single_add_to_cart_button:hover::after,.sb-checkout-btn:hover::after{animation:sbxSheen .8s cubic-bezier(.2,.7,.2,1)}
@keyframes sbxSheen{0%{opacity:0;transform:skewX(-18deg) translateX(0)}20%{opacity:1}100%{opacity:0;transform:skewX(-18deg) translateX(420%)}}

/* ---------------- hero spotlight ---------------- */
.pk-hero,.hero,.sb-ci-sheet,.pk-band{--sx:50%;--sy:30%}
.sbx-spot{position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:0;opacity:0;transition:opacity .4s ease;
  background:radial-gradient(520px circle at var(--sx) var(--sy),rgba(92,192,255,.10),transparent 60%)}
.sbx-spot-on .sbx-spot{opacity:1}
html.sb-light .sbx-spot{background:radial-gradient(520px circle at var(--sx) var(--sy),rgba(29,78,216,.06),transparent 60%)}

/* ---------------- small touches ---------------- */
.pk-ic,.sb-ci-pane-ic{transition:transform .35s cubic-bezier(.2,1.4,.3,1),box-shadow .35s ease}
.pk-card:hover .pk-ic,.pk-tile:hover .pk-ic{transform:translateY(-2px) rotate(-6deg);box-shadow:0 10px 24px -10px rgba(92,192,255,.6)}
.pd-source-card{transition:transform .3s cubic-bezier(.2,.8,.2,1),border-color .3s ease,box-shadow .3s ease}
.pd-source-card:hover{transform:translateY(-3px);box-shadow:0 20px 40px -26px rgba(0,0,0,.9)}
.foot-col a{background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .3s ease,color .2s ease}
.foot-col a:hover{background-size:100% 1px}
@media (prefers-reduced-motion:reduce){
  .sbx-pend{opacity:1!important;transform:none!important;transition:none!important}
  .sbx-tilt{transform:none!important}
  .btn::after,.pk-btn--primary::after,.single_add_to_cart_button::after,.sb-checkout-btn::after{display:none}
}