.scene-canvas{position:fixed;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}.roster-site #collection{z-index:2}.roster-site .background-video{z-index:-3}.roster-site .roster-backdrop,.roster-site .logo-spotlight{z-index:-2}.roster-site .scene-canvas{z-index:0}.scene-dark-ink,.scene-dark-ink :is(span,i){color:#111!important}.scene-white-ink,.scene-white-ink :is(span,i){color:#fff!important}.scene-dark-ink img.brand-logo{filter:none!important}.scene-white-ink img.brand-logo{filter:invert(1)!important}
.store-light{background:#fff!important;color:#111!important;--white:#111;--muted:#666;--gold:#444;--line:#1113}.store-light .roster-backdrop{background:#fff!important}.store-light .roster-backdrop::after{display:none}.store-light .logo-spotlight{opacity:0!important}.store-light .brand-logo{filter:none!important}.store-light :is(h1,h2,h3,p,a,button,small,span,label,.eyebrow){color:#111}.store-light .menu-toggle{color:#111}.store-light :is(.breadcrumb,.roster-footer){color:#555}.store-light .section-detail{border-color:#1113}.store-light .section-detail p,.store-light #section-copy{color:#555}.store-light .sequencer-handle{color:#111;background:#fff;border-color:#1113}.store-light .drum-machine{color:#111;background:#fff}.store-light .drum-machine :is(button,input){color:#111}.store-light .drum-step{background:#ddd!important;border-color:#aaa!important}.store-light .drum-step.is-active{background:#444!important}
.main-menu nav a{transition:transform 850ms cubic-bezier(.4,0,.2,1),opacity 450ms ease,filter 450ms ease}.store-mode #main-menu nav a:not([href="#store"]){opacity:0;filter:blur(3px);pointer-events:none}.store-mode #main-menu nav a[href="#store"]{transform:translateY(var(--store-lift,0px));color:#111}.store-mode #main-menu nav a[href="#store"] span{color:inherit}.store-mode .menu-bottom{opacity:0;pointer-events:none}
.scene-decode{font:inherit;letter-spacing:inherit;white-space:inherit}.scene-glyph{position:relative;display:inline;white-space:pre-wrap}.scene-glyph>span{font:inherit}.scene-glyph>i{position:absolute;inset:0;display:block;text-align:center;font:inherit;font-style:normal;color:inherit;pointer-events:none}.scene-decode{animation:scene-text-arrive 700ms cubic-bezier(.4,0,.2,1) both}@keyframes scene-text-arrive{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.main-menu nav a{transition:none}.scene-decode{animation:none}}
html.store-boot,html.store-boot .roster-site,html.store-boot .roster-backdrop{background:#fff!important}html.store-boot .roster-site{color:#111;--white:#111;--muted:#666}html.store-boot .brand-logo{filter:none!important}
/* The homepage scrim must not tint the white handoff before deferred JS starts.
   Once the inverse wave starts, the normal video scrim is revealed with pixels. */
html.store-boot .roster-backdrop::after{display:none}
html.store-boot .logo-spotlight{opacity:0!important}
.store-mode #collection,.store-mode .breadcrumb,.store-mode .roster-footer{opacity:0!important;pointer-events:none}
.roster-site{isolation:isolate}
.roster-site::before{content:'';position:fixed;inset:0;z-index:-4;pointer-events:none;background:#080d14 url('media/background-poster.jpg') center 55%/cover no-repeat}
.roster-site .background-video{opacity:0;transition:opacity 450ms cubic-bezier(.42,0,.58,1)}
.roster-site .background-video[data-scene-ready="true"]{opacity:1}
.roster-site .background-video[data-scene-covered="true"]{transition:none}
@media(prefers-reduced-motion:reduce){.roster-site .background-video{transition:none}}
/* A white handoff between documents; no separately appearing header or menu. */
.commerce-scene main{opacity:1;animation:none!important;transition:none}
.commerce-scene :is(.own-store-heading,.portal-wrap,.admin-shell){position:relative}
.commerce-scene main>:not(.store-header,.commerce-navigation,.data-wave){transition:opacity 650ms cubic-bezier(.42,0,.58,1)}
html.commerce-boot .commerce-scene main>:not(.store-header,.commerce-navigation,.data-wave),.commerce-scene.commerce-leaving main>:not(.store-header,.commerce-navigation,.data-wave){opacity:0;pointer-events:none}
html.store-returning :is(#collection,.roster-footer,.sequencer-handle){opacity:0!important;pointer-events:none}
.commerce-scene :is(.own-store-empty,.shop-product,.store-alert,.portal-panel,.commerce-admin-link,.store-admin-slot>a){animation:commerce-soft-arrive 650ms cubic-bezier(.42,0,.58,1) backwards}
.commerce-scene .shop-product:nth-child(3n+2){animation-delay:65ms}
.commerce-scene .shop-product:nth-child(3n){animation-delay:130ms}
.commerce-scene .shop-catalog{min-height:240px}
.commerce-scene .store-admin-slot{display:inline-flex;min-width:60px}
.commerce-scene .store-admin-slot>a{font:400 11px var(--sans);letter-spacing:.15em;text-transform:uppercase}
@keyframes commerce-soft-arrive{from{opacity:0}to{opacity:1}}
@media(max-width:600px){.commerce-scene .store-admin-slot{min-width:40px}.commerce-scene .store-admin-slot>a{font-size:9px;letter-spacing:.07em}}
@media(max-width:600px){
 .commerce-scene .store-header{height:104px;gap:12px;align-items:center}
 .commerce-scene .store-nav{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 44px;grid-template-rows:44px 30px;gap:0 8px;flex:1;min-width:0;margin-left:0;align-items:center}
 .commerce-scene .store-nav .cart-link{grid-area:1/1;justify-self:start}
 .commerce-scene .store-admin-slot{grid-area:1/2;min-width:0}
 .commerce-scene .store-nav>a.commerce-close{grid-area:1/3;font-size:30px;min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center;padding:0}
 .commerce-scene .store-nav>a[href="/account"]{grid-area:2/1;white-space:nowrap}
 .commerce-scene .store-nav>a[href="/promoters"]{grid-area:2/2/3/4;white-space:nowrap}
 .commerce-scene .store-nav>a:not(.commerce-close){min-height:30px;display:flex;align-items:center}
 .scene-running :is(.roster-header,#main-menu,.sequencer-handle),.commerce-scene main{will-change:opacity;backface-visibility:hidden}
}
@media(prefers-reduced-motion:reduce){.commerce-scene main{transition:none}.commerce-scene :is(.own-store-empty,.shop-product,.store-alert,.portal-panel,.commerce-admin-link,.store-admin-slot>a){animation:none}}
/* Preserve shared navigation across the actual document change. Unsupported
   browsers still render both headers at full opacity, never an empty shell. */
@view-transition{navigation:auto}
.roster-site:not(.intro-mode) .brand-logo,.commerce-scene .store-header .brand img{view-transition-name:hir-brand}
.landing-account,.store-header .store-account-actions>a[href="/account"]{view-transition-name:hir-account}
.landing-account,.commerce-scene .store-header .store-account-actions>a[href="/account"]{width:98px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.landing-admin[hidden]{display:none!important}
.landing-promotion[hidden]{display:none!important}
@media(max-width:680px){.landing-account,.commerce-scene .store-header .store-account-actions>a[href="/account"]{width:71px}}
.store-mode #main-menu nav a[href="#store"] .nav-label,.commerce-navigation>a[aria-current="page"] .nav-label{view-transition-name:hir-store}
::view-transition-group(hir-brand),::view-transition-group(hir-account),::view-transition-group(hir-store){animation-duration:650ms;animation-timing-function:cubic-bezier(.42,0,.58,1)}
::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal}
::view-transition-old(hir-brand),::view-transition-new(hir-brand),::view-transition-old(hir-account),::view-transition-new(hir-account),::view-transition-old(hir-store),::view-transition-new(hir-store){animation:none;mix-blend-mode:normal}
/* The logo has one identical viewport box in both documents. Only the new
   snapshot is painted: no crossfade, stretching or two superimposed logos. */
.commerce-scene .store-header{padding-left:calc(3.1vw + 168px)}
.commerce-scene .store-header .brand{position:fixed;left:3.1vw;top:20px;width:130px;height:74px;transform:none}
.commerce-scene .store-header .brand img{display:block;width:100%;height:100%;object-fit:contain}
::view-transition-group(hir-brand){animation:none!important}
::view-transition-old(hir-brand){display:none!important}
::view-transition-new(hir-brand){animation:none!important;opacity:1}
/* Capture only the lettering, not two differently sized navigation rows. */
#main-menu nav a .nav-label,.commerce-navigation>a .nav-label{display:inline!important;width:auto;font:inherit;letter-spacing:inherit;color:inherit;text-shadow:none}
.commerce-navigation>a[aria-current="page"]{font:400 13px/1.2 var(--sans);letter-spacing:.19em;min-height:15.6px;gap:16px;text-shadow:none}
.commerce-navigation>a[aria-current="page"] .nav-index{width:auto;font:400 9px/1 var(--sans);letter-spacing:.15em}
.store-mode #main-menu nav a[href="#store"]{animation:none!important;filter:none;text-shadow:none}
::view-transition-group(hir-store){animation:none!important}
::view-transition-old(hir-store){display:none!important}
::view-transition-new(hir-store){animation:none!important;opacity:1}
@media(max-width:900px) and (min-width:681px){.commerce-scene .commerce-navigation{left:25px}.commerce-navigation>a[aria-current="page"]{font-size:11px;min-height:13.2px;gap:10px}}
@media(max-width:680px){.commerce-scene .commerce-navigation{left:20px;top:145px}.commerce-navigation>a[aria-current="page"]{font-size:10px;letter-spacing:.15em;min-height:12px;gap:12px}.commerce-navigation>a[aria-current="page"] .nav-index{display:none}}
@media(max-width:360px){.commerce-navigation>a[aria-current="page"]{font-size:9px;min-height:10.8px}}
@media(max-width:900px) and (min-width:681px){.commerce-scene .store-header .brand{left:25px}}
@media(max-width:680px){.commerce-scene .store-header .brand{left:20px;top:13px;width:105px;height:68px}.commerce-scene .store-header{padding-left:137px;padding-right:20px}}
@media(max-width:360px){.commerce-scene .store-nav>a:not(.commerce-close),.commerce-scene .store-admin-slot>a{font-size:8px;letter-spacing:.04em}}
/* The returning document starts with the corner logo BEFORE deferred JS runs,
   rather than painting its initial centred/oversized intro for a frame. */
html:is(.store-boot,.store-returning) .roster-site.intro-mode .brand-mark{left:3.1vw;top:20px;width:130px;height:74px;transform:none!important}
@media(max-width:900px) and (min-width:681px){html:is(.store-boot,.store-returning) .roster-site.intro-mode .brand-mark{left:25px}}
@media(max-width:680px){html:is(.store-boot,.store-returning) .roster-site.intro-mode .brand-mark{left:20px;top:13px;width:105px;height:68px;transform:none!important}}
@media(prefers-reduced-motion:reduce){@view-transition{navigation:none}.commerce-scene main>:not(.store-header,.commerce-navigation,.data-wave){transition:none}}
/* Account has one viewport anchor in both shells, independent of role/tabs. */
.landing-account,.commerce-scene .store-header .store-nav>a[href="/account"]{position:fixed;top:37px;right:104px;font:400 11px/1.4 var(--sans);letter-spacing:.15em;white-space:nowrap;z-index:12;min-height:30px;display:flex;align-items:center}
.commerce-scene :is(.portal-panel,.own-store-empty,.shop-product,.store-alert,.commerce-admin-link,.store-admin-slot>a,.store-promoter-slot>a,.account-promoter-content,.admin-stats,.portal-tabs,.promoter-membership,.promoter-milestones){animation:none!important}
.commerce-scene [data-motion-block]{position:relative}
.motion-switch{position:relative;min-height:280px;overflow:clip;transition:height 650ms cubic-bezier(.42,0,.58,1)}
.motion-switch-inner{position:relative;display:flow-root}
.commerce-scene main,.motion-switch,.data-wave{overflow-anchor:none}
.promoter-membership-slot{min-height:36px;display:flow-root}.promoter-status-slot{min-height:24px;display:flow-root}
.promoter-load-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(prefers-reduced-motion:reduce){.motion-switch{transition:none}}
@media(max-width:680px){.landing-account,.commerce-scene .store-header .store-nav>a[href="/account"]{top:27px;right:72px;font-size:9px;letter-spacing:.07em;min-height:30px}}
/* One responsive corner-logo box in BOTH documents, including the pre-paint
   return state. Reserve a separate right-hand lane for cart/account/close. */
.commerce-scene .store-header .store-account-actions>a[href="/account"],.landing-account{max-width:160px;overflow:hidden;text-overflow:ellipsis}
@media(max-width:680px){
 .roster-site:not(.intro-mode) .brand-mark,
 html:is(.store-boot,.store-returning) .roster-site.intro-mode .brand-mark,
 .commerce-scene .site-header.store-header .brand{width:clamp(64px,22vw,105px);height:68px}
 .commerce-scene .site-header.store-header .brand img{width:100%;height:100%}
 .commerce-scene .store-header .store-account-actions>a[href="/account"],.landing-account{max-width:min(26vw,110px);display:block;line-height:30px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}