@import url('https://fonts.googleapis.com/css2?family=Anton&family=Inter:wght@400;500;600;700;800;900&display=swap');
/* STYLE A: DARK RECORD STORE. Near-black with film grain, huge condensed type, covers as the hero, red only as an accent. */
body.store{background:#0a0a0b;color:#e9e9e9}
body.store:before{content:'';position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.07;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence baseFrequency='.9' numOctaves='3'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}
body.store>#stTop,body.store>.case,body.store>section,body.store>form,body.store>footer{position:relative;z-index:1}
body.store #bar{position:fixed}

/* top */
.st-bar{background:#e0242f;color:#fff;font:700 11px Inter,sans-serif;letter-spacing:.18em;text-transform:uppercase}
.st-head,.st-nav,.st-tick{background:#0a0a0b}
.st-logo{font:400 clamp(30px,3.6vw,42px)/1 Anton,sans-serif;letter-spacing:.02em;color:#fff}
.st-tools svg{stroke:#fff}.st-tools .badge{background:#e0242f}.st-abadge{box-shadow:0 0 0 2px #0a0a0b}
.st-nav a{color:#8d8d92;font:600 12px Inter,sans-serif;letter-spacing:.2em;text-transform:uppercase}
.st-nav a.on,.st-nav a:hover{color:#fff;border-color:#e0242f}
.st-tick{border-color:#1d1d20}.st-tick div{font:400 15px Anton,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#6d6d72}
.st-drop{background:#141416}

/* home: the featured pack is the hero at the top */
#v-home.on{display:flex;flex-direction:column}#v-home>.st-feat{order:-1;margin-top:0}
.st-feat2{background:#0a0a0b;padding-top:60px;padding-bottom:70px;border-bottom:1px solid #1d1d20}
.st-feat2:before{opacity:.22}
.st-feat2:after{background:linear-gradient(90deg,rgba(10,10,11,.95) 0%,rgba(10,10,11,.55) 60%,rgba(10,10,11,.9))}
.st-feat2 .in{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.st-feat2 .st-ftx{order:-1}
.st-feye{border:0;padding:0;color:#e0242f;font:800 12px Inter,sans-serif;letter-spacing:.3em}
.st-feat2 h3{font:400 clamp(56px,7.5vw,118px)/.9 Anton,sans-serif;text-transform:uppercase;letter-spacing:0;margin:16px 0 18px}
.st-feat2 .d{color:#9a9a9a}
.st-feat2 .p{font:400 40px Anton,sans-serif;letter-spacing:.02em}
.st-feat2 .st-fbtns button{border-radius:0;font:800 13px Inter,sans-serif;letter-spacing:.14em;text-transform:uppercase;padding:19px 30px}
.st-feat2 .a{background:#fff;color:#000;box-shadow:none}.st-feat2 .a:hover{background:#e0242f;color:#fff;transform:none}
.st-feat2 .b{background:none;border:1px solid #444!important;backdrop-filter:none}.st-feat2 .b:hover{border-color:#fff!important;background:none}
.st-fcov{border-radius:0;box-shadow:0 50px 90px rgba(0,0,0,.85)}
.st-fart:after{content:'NEW';position:absolute;z-index:3;top:-14px;left:-14px;background:#e0242f;color:#fff;font:800 12px Inter,sans-serif;letter-spacing:.2em;padding:10px 14px}

/* section titles */
.st-sec{text-align:left}
.st-sec h2,.st-rel h2{font:400 clamp(34px,3.6vw,48px)/1 Anton,sans-serif;text-transform:uppercase;letter-spacing:.01em;color:#fff;text-align:left;margin-bottom:26px}
.st-all{background:none;border:1px solid #444;border-radius:0;color:#fff;font:800 12px Inter,sans-serif;letter-spacing:.2em;text-transform:uppercase;padding:15px 26px}
.st-all:hover{border-color:#fff}

/* product cards: the art is the card; hover shows play + add to cart */
.st-card,.st-card[data-k="p"],body.store #packs .card{background:none!important;box-shadow:none!important;padding:0!important;border-radius:0!important}
.st-card:hover{transform:none!important;box-shadow:none!important}
.st-cv,.st-vw>.cv,.st-vw>.st-cv,body.store .card .cv{border-radius:0!important;overflow:hidden;box-shadow:0 20px 40px rgba(0,0,0,.6)}
.st-cv img,.st-cv canvas,body.store .card .cv img{transition:transform .6s}
.st-card:hover .st-cv img,body.store #packs .card:hover .cv img{transform:scale(1.07)}
.st-vrec,.st-vw .st-vrec{display:none}.st-vw{padding-right:0!important}
.st-cv:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(0,0,0,.9));opacity:0;transition:.35s;pointer-events:none}
.st-card:hover .st-cv:after{opacity:1}
.st-play{background:#fff;opacity:0}.st-card:hover .st-play,.st-play.on{opacity:1}
.st-tag{border-radius:0;font:800 10px Inter,sans-serif;letter-spacing:.18em;padding:7px 10px;background:#e0242f}.st-tag.st-new{background:#e0242f}
.st-nm,.st-card[data-k="p"] .st-nm{text-align:left;color:#fff;font:700 15px Inter,sans-serif;margin:14px 0 4px}
.st-pr,.st-card[data-k="p"] .st-pr{background:none!important;color:#fff!important;text-align:left;padding:0!important;font:400 24px Anton,sans-serif!important;letter-spacing:.02em;width:auto;border-radius:0}
.st-pr s{color:#666!important;font:500 14px Inter,sans-serif}
.st-pr.in{color:#e0242f!important}
.st-row,.st-grid{gap:22px}
.st-row>.st-card{flex:0 1 calc((100% - 44px)/3)}

/* Sample Packs page grid */
body.store #packs .grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;max-width:1180px}
body.store #packs .card .ti .tl{color:#fff;font:700 15px Inter,sans-serif}
body.store #packs .card .pr{color:#fff!important;font:400 26px Anton,sans-serif!important;letter-spacing:.02em}
body.store #packs .card .cart{border-radius:0!important;background:#e0242f!important;color:#fff!important;font:800 11px Inter,sans-serif!important;letter-spacing:.16em!important;padding:14px!important}
body.store #packs .card .cart:hover{background:#fff!important;color:#000!important;transform:none}
body.store #packs .card .cart.in{background:#fff!important;color:#000!important}
body.store .cvlk{background:rgba(0,0,0,.6);color:#fff}
body.store .cv .pl{background:#fff!important}

/* beats teaser, FAQ */
.st-bteaser{background:#121214;border:1px solid #232327;border-radius:0;box-shadow:none}.st-bteaser b{color:#fff;font:400 22px Anton,sans-serif;letter-spacing:.03em;text-transform:uppercase}.st-bteaser em{color:#888}
.st-bteaser:hover{border-color:#e0242f}
.st-faq details{border-color:#232327}.st-faq summary{color:#fff;font:600 16px Inter,sans-serif}.st-faq p{color:#9a9a9a}
.st-bund{border-radius:0;background:#121214;border:1px solid #2a2a2e}

/* beats page */
body.store .row{border-color:#1d1d20}
body.store .row .tl,body.store .row .ti,body.store .row .st,body.store .row .no{color:#fff}
body.store .row .tg,body.store .row small{color:#777}
body.store .row .cart{background:#fff;color:#000;border-color:#fff;border-radius:0}
.st-crate .st-card{background:#141416!important;padding:12px!important}
.st-hot .st-pr{color:#fff!important}

/* beat / pack page */
body.store .bp h1{font:400 clamp(44px,5.5vw,84px)/.92 Anton,sans-serif;text-transform:uppercase;letter-spacing:.01em;color:#fff}
body.store .bp .d{color:#9a9a9a}
body.store .bp .prc,body.store .bp .price{color:#fff!important;font:400 40px Anton,sans-serif!important;letter-spacing:.02em}
body.store .bp,body.store .bp a,body.store .bp button{color:#fff}
body.store .bp .tgs span{background:#e0242f;color:#fff;border-radius:0}
body.store #bwv{background:#121214;border-radius:0;box-shadow:none;border:1px solid #232327}
body.store .acts2 .pl{background:#fff;border-radius:50%}body.store .acts2 .pl i{border-left-color:#000!important}
body.store .acts2 .cart{border-radius:0!important;background:none!important;color:#fff!important;border:1px solid #3a3a3e!important;box-shadow:none}
body.store .acts2 .cart:hover{border-color:#fff!important}
body.store .acts2 #bCart{background:#fff!important;color:#000!important;border-color:#fff!important}
body.store .acts2 #bCart:hover{background:#e0242f!important;color:#fff!important;border-color:#e0242f!important}
.st-trust{color:#777}.st-trust b{background:#141416;border-color:#2a2a2e;color:#ddd;border-radius:0}
.st-sinfo b{color:#fff;font:400 clamp(34px,4vw,56px)/.95 Anton,sans-serif;text-transform:uppercase;letter-spacing:.01em}
.st-sp{border-radius:0;background:#fff;color:#000;font:400 26px Anton,sans-serif}
.st-sbtn{color:#fff}.st-dots i{background:#333}.st-dots i.on{background:#e0242f}
.st-scv{border-radius:0}

/* misc pages, sign up, footer */
body.store .about,body.store .about h2,body.store .about p,body.store .plc,body.store .plc h3,body.store .plc b,body.store .empty{color:#ddd}
body.store .fsub{background:#121214;border:1px solid #232327;border-radius:0;box-shadow:none}
body.store .fsub label{color:#fff}
body.store .fsub input[type=email]{background:#0a0a0b!important;color:#fff!important;border-color:#2a2a2e!important;border-radius:0}
body.store .fsub button{background:#e0242f!important;border-radius:0}
body.store footer.f{background:#050506;color:#666}
body.store .st-remind{border-radius:0}
@media(max-width:820px){.st-feat2 .st-ftx{order:0}body.store #packs .grid{grid-template-columns:repeat(2,minmax(0,1fr))}.st-row>.st-card{flex-basis:calc((100% - 22px)/2)}}
.st-row{justify-content:flex-start}
.st-packrow{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}.st-packrow>.st-card{flex:none}@media(max-width:820px){.st-packrow{grid-template-columns:repeat(2,minmax(0,1fr))}}
#v-home>.st-sec:last-child,#v-home>*:last-child{margin-bottom:0;padding-bottom:20px}body.store .case{padding-bottom:10px}body.store .plc{padding-top:30px;padding-bottom:20px}body.store .fsub{margin-top:24px}body.store footer.f{margin-top:24px}
/* customer account: dark record store */
#acct.st-dash .box{background:#0d0d0f;color:#e9e9e9;border:1px solid #232327;border-radius:0}
.sd-head{background:#0a0a0b;border-bottom:1px solid #1d1d20;border-radius:0}
.sd-head b{font:400 30px Anton,sans-serif;letter-spacing:.02em;text-transform:uppercase}
.sd-av{border-radius:0;background:#e0242f;font:400 24px Anton,sans-serif}
.sd-tabs{background:#0a0a0b;border-bottom:1px solid #1d1d20}
.sd-tabs button{font:700 11px Inter,sans-serif;letter-spacing:.18em;text-transform:uppercase;color:#777}
.sd-tabs button.on{color:#fff;border-color:#e0242f}
.sd-tabs i{border-radius:0}
.sd-body h4{color:#e0242f;letter-spacing:.24em}
.sd-stats div{background:#141416;border:1px solid #232327;border-radius:0;box-shadow:none}
.sd-stats b{color:#fff;font:400 40px Anton,sans-serif}.sd-stats span{color:#777;text-transform:uppercase;letter-spacing:.14em;font-size:10px}
.sd-alert{background:#e0242f;border-radius:0;font:800 12px Inter,sans-serif;letter-spacing:.12em;text-transform:uppercase}
.sd-ic{border-radius:0;box-shadow:0 16px 30px rgba(0,0,0,.6)}
.sd-it b{color:#fff}
.sd-order,.sd-msg{background:#141416;border:1px solid #232327;border-radius:0;box-shadow:none}
.sd-buy{border-color:#232327}.sd-bc{border-radius:0}
.sd-bt b,.sd-msg summary b{color:#fff}.sd-msg p{color:#9a9a9a}
.sd-dl{background:#fff;color:#000;border-radius:0;font:800 11px Inter,sans-serif;letter-spacing:.14em;text-transform:uppercase}
.sd-dl:hover{background:#e0242f;color:#fff}
.sd-empty{color:#777}
.sd-foot button{border-color:#333;color:#aaa;border-radius:0;text-transform:uppercase;letter-spacing:.14em;font-size:11px}
/* sign in / create account, cart, saved: same dark look */
body.store #acct .box,body.store #modal .box,body.store #fav .box{background:#0d0d0f;border:1px solid #232327;border-radius:0}
body.store #acct h3,body.store #modal h3,body.store #fav h3{font:400 32px Anton,sans-serif;letter-spacing:.02em;color:#fff}
body.store #acct input,body.store #modal input{background:#0a0a0b;border:1px solid #2a2a2e;color:#fff;border-radius:0}
body.store #acct .go,body.store #modal .go{background:#e0242f;color:#fff;border:0;border-radius:0;font:800 12px Inter,sans-serif;letter-spacing:.16em}
body.store #acct .acl{color:#aaa;border-color:#333;border-radius:0}
.sd-rel{display:flex;flex-direction:column;gap:8px}
.sd-rr{display:grid;grid-template-columns:52px 40px 1fr auto auto;gap:14px;align-items:center;background:#141416;border:1px solid #232327;padding:10px 12px}
.sd-rr .sd-bc{width:52px;height:52px}
.sd-rp{width:38px;height:38px;border-radius:50%;border:0;background:#fff;display:grid;place-items:center;cursor:pointer}
.sd-rp i{border-left:11px solid #000;border-top:7px solid transparent;border-bottom:7px solid transparent;margin-left:3px}
.sd-rp.on i{border:0;width:10px;height:12px;margin:0;border-left:3px solid #000;border-right:3px solid #000}
.sd-rr .sd-bt b{cursor:pointer}.sd-nw{font:800 9px Inter,sans-serif;letter-spacing:.16em;background:#e0242f;color:#fff;padding:3px 6px;margin-left:6px;font-style:normal;vertical-align:middle}
.sd-rpr{font:400 22px Anton,sans-serif;color:#fff}.sd-rpr s{font:500 12px Inter,sans-serif;color:#666;margin-right:6px}
.sd-add{background:#e0242f!important;color:#fff!important}
.sd-relb{display:flex;gap:10px;margin-top:18px}
.sd-beats{background:none;border:1px solid #444;color:#fff;font:400 20px Anton,sans-serif;letter-spacing:.08em;padding:9px 22px;cursor:pointer}
.sd-beats:hover{border-color:#fff}
@media(max-width:600px){.sd-rr{grid-template-columns:44px 36px 1fr;}.sd-rpr,.sd-add{grid-column:span 1}}
/* BACK OFFICE in the record store theme */
#bo{background:#0a0a0b;font-family:Inter,sans-serif;padding-top:0}
#bo .bh{position:sticky;top:0;z-index:5;background:rgba(10,10,11,.96);backdrop-filter:blur(8px);margin:0 calc(-1*clamp(14px,4vw,60px)) 26px;padding:18px clamp(14px,4vw,60px);border-bottom:1px solid #1d1d20;gap:4px}
#bo .bh h2{font:400 34px/1 Anton,sans-serif;letter-spacing:.02em;color:#fff;margin-right:auto}
#bo .bh button{background:none;border:0;border-bottom:2px solid transparent;color:#7c7c82;font:700 11px Inter,sans-serif;letter-spacing:.16em;padding:10px 11px}
#bo .bh button:hover{color:#fff;border-color:#3a3a3e}
#bo .bh button.on{background:none;color:#fff;border-color:#e0242f}
#bo .bh button[data-t=out],#bo #boOut{border:1px solid #333;margin-left:8px}
#bo .bo2{gap:22px}
#bo .bo2>form,#bo .bo2>div>form,#bo #bf,#bo #bf2,#bo #bf3{background:#111113;border:1px solid #1f1f23;padding:22px}
#bo h3{font:400 30px/1 Anton,sans-serif;letter-spacing:.02em;color:#fff;margin-bottom:16px}
#bo label{font:700 10px Inter,sans-serif;letter-spacing:.18em;color:#86868c;text-transform:uppercase}
#bo input[type=text],#bo input[type=number],#bo input[type=email],#bo textarea,#bo select{background:#0a0a0b;border:1px solid #26262a;color:#fff;border-radius:0;font:500 14px Inter,sans-serif;padding:12px}
#bo input:focus,#bo textarea:focus,#bo select:focus{border-color:#e0242f;outline:0}
#bo input[type=file]{color:#888;font:500 12px Inter,sans-serif}
#bo input[type=file]::file-selector-button{background:#1a1a1d;color:#fff;border:1px solid #333;padding:8px 12px;font:700 11px Inter,sans-serif;letter-spacing:.1em;margin-right:10px;cursor:pointer}
#bo .chk{font:600 12px Inter,sans-serif;color:#cfcfd3;letter-spacing:.06em}
#bo input[type=checkbox]{accent-color:#e0242f}
#bo .go{background:#e0242f;color:#fff;border:0;border-radius:0;font:800 12px Inter,sans-serif;letter-spacing:.16em;padding:16px}
#bo .go:hover{background:#fff;color:#000}
#bo .bi{background:#111113;border:1px solid #1f1f23;padding:12px 14px;transition:border-color .2s}
#bo .bi:hover{border-color:#34343a}
#bo .bi img,#bo .bi .nc{box-shadow:0 8px 18px rgba(0,0,0,.6)}
#bo .bi b{font:400 21px/1.05 Anton,sans-serif;letter-spacing:.03em;color:#fff}
#bo .bi span{font:600 13px Inter,sans-serif;color:#9a9aa0;letter-spacing:.02em}
#bo .bi .acts button{background:none;border:1px solid #2e2e33;color:#ddd;font:700 10px Inter,sans-serif;letter-spacing:.14em;padding:10px 13px;border-radius:0}
#bo .bi .acts button:hover{border-color:#fff;color:#fff}
#bo .bi .acts button:first-child{color:#fff;border-color:#4a4a50}
#bo .bi .acts .del{border-color:#4a1a1d;color:#ff6b6b}
#bo .bi .acts .del:hover{background:#e0242f;border-color:#e0242f;color:#fff}
#bo .bi.gp{background:linear-gradient(90deg,#1a0a0d,#111113);border:1px solid #3a1418}
#bo .bi.gp b{font:400 24px Anton,sans-serif}
#bo .bi.gp input{background:#0a0a0b;border:1px solid #333;border-radius:0;font:700 15px Inter,sans-serif}
#bo .cur,#bo #bmsg,#bo .nt{color:#9a9a9a;font-family:Inter,sans-serif}
#bo .bi:has(>span:only-child){grid-template-columns:1fr!important}