:root{--lime:#7546FF;--accent:#7546FF;--bg:#FFFFFF;--ink:#15191D;color-scheme:light}
html,body,main.shell{background:#FFFFFF!important;color:#15191D!important}
header,nav,header .apex-announcement{background:#15191D!important;color:#fff!important}
.brand-logo{width:240px!important;height:78px!important;max-width:44vw!important;object-fit:cover!important;object-position:center!important}
header .apex-ship-message{color:#fff!important}.nav-availability i,.eyebrow-dot{background:#7546FF!important}
.hero,.hero-copy{background:#FFFFFF!important;color:#15191D!important}.hero h1{color:#15191D!important}.hero h1 em{color:#7546FF!important}.hero p,.hero-note,.hero-metrics span{color:#465467!important}.hero-metrics strong{color:#15191D!important}
.hero-art,.hero-art.apex-vial-hero{background-image:none!important;background-size:cover!important;background-position:center!important;filter:none!important}.hero-art:before,.hero-art:after,.hero:before,.hero:after{display:none!important}
.nav-browse,.hero-cta,.add,.action,.btn:not(.secondary),.apex-floating,.apex-promo-controls button,.apex-variant-option.active,.category-button.active{background:#7546FF!important;color:#fff!important;border-color:#7546FF!important}
.panel,.apex-cart-drawer,.apex-dialog{background:#15191D!important;color:#fff!important;border-color:#343b40!important}.panel h2,.panel .price,.panel .total,.panel .line,.panel strong,.apex-dialog h2{color:#fff!important}
.product,.apex-v52-card,.apex-v52-quote{background:#fff!important;color:#15191D!important;border-color:#dce4e8!important}.details h3,.details h3 button,.product .price,.apex-v52-card h3,.apex-v52-trust h2{color:#15191D!important}
.apex-v52-trust,.apex-v52-trust p,.apex-v52-quote,.product .meta{color:#465467!important}.apex-v52-kicker,.section-kicker,.lime-period,.hero-eyebrow{color:#7546FF!important}.apex-v52-quote{border-left-color:#7546FF!important}
.search,input,select,textarea{background:#fff!important;color:#15191D!important;border-color:#ccd8df!important}.category-button{background:#fff!important;color:#15191D!important;border-color:#dce4e8!important}.apex-mobile-menu{background:#15191D!important}.apex-mobile-menu a{color:#fff!important}
footer,.footer-brand{color:#15191D!important}.footer-brand span{color:#7546FF!important}.apex-promo-cart{background:#252a30!important;border-color:#465467!important}
@media(max-width:600px){.brand-logo{width:175px!important;height:64px!important}.hero-art{min-height:270px!important}.hero-metrics{flex-wrap:wrap}}
html body main.shell > section.hero .hero-copy p{color:#465467!important}
html body main.shell > section.hero div.hero-art.apex-vial-hero{background-image:none!important;background-size:cover!important;background-position:center!important}
html body main.shell > section.hero{background:#FFFFFF!important}
html body .category-bar .category-button.active{background:#7546FF!important;color:white!important}
html body .portal-label{color:#CABCFF!important}
html body main.shell > section.hero{display:grid!important;grid-template-columns:1.02fr .98fr!important}
html body main.shell > section.hero .hero-copy{width:auto!important;max-width:none!important;height:auto!important}
html body main.shell > section.hero div.hero-art.apex-vial-hero{position:relative!important;inset:auto!important;width:100%!important;height:100%!important;opacity:1!important;z-index:0!important}
@media(max-width:700px){html body main.shell > section.hero{display:flex!important;flex-direction:column!important;height:auto!important}html body main.shell > section.hero div.hero-art.apex-vial-hero{height:280px!important;min-height:280px!important}}

/* Header and side-by-side hero, approved correction */
html body .apex-free-shipping-banner{display:none!important}
html body header nav{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;position:relative!important}
html body header nav .brand{flex:0 1 auto!important;min-width:0!important}
html body header nav .apex-mobile-nav{display:flex!important;position:static!important;inset:auto!important;transform:none!important;order:10!important;flex:0 0 auto!important;gap:6px!important;margin:0 0 0 auto!important;z-index:auto!important}
html body header nav .apex-mobile-nav a,html body header nav .apex-mobile-nav button{display:flex!important;align-items:center!important;justify-content:center!important;width:40px!important;height:44px!important;color:white!important;background:transparent!important;border:0!important;text-decoration:none!important;font-size:25px!important}
html body header nav .nav-right{margin-left:auto!important}
html body main.shell > section.hero{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;align-items:center!important;height:auto!important;min-height:350px!important;overflow:hidden!important}
html body main.shell > section.hero .hero-copy{grid-column:1!important;grid-row:1!important;order:0!important;padding:28px 24px!important;min-width:0!important}
html body main.shell > section.hero div.hero-art.apex-vial-hero{grid-column:2!important;grid-row:1!important;order:0!important;position:relative!important;width:100%!important;height:100%!important;min-height:350px!important;margin:0!important;aspect-ratio:auto!important;background-size:cover!important}
html body main.shell > section.hero>.apex-mobile-trust{grid-column:1/-1!important;grid-row:2!important}
@media(max-width:850px){
 html body header nav .nav-right,html body header nav .portal-label{display:none!important}
 html body header nav .brand-logo{width:175px!important;max-width:44vw!important;height:62px!important}
 html body header nav{padding:6px 12px!important;min-height:74px!important}
 html body main.shell > section.hero{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)!important;min-height:260px!important;margin:10px 0 18px!important;padding:0!important}
 html body main.shell > section.hero .hero-copy{padding:18px 10px!important}
 html body main.shell > section.hero h1{font-size:clamp(21px,4.7vw,37px)!important;line-height:1.12!important;letter-spacing:-.6px!important;margin:0 0 12px!important}
 html body main.shell > section.hero .hero-copy p{font-size:12px!important;line-height:1.5!important;margin:0!important}
 html body main.shell > section.hero div.hero-art.apex-vial-hero{min-height:260px!important;background-size:auto 100%!important;background-color:#FFFFFF!important}
 html body .hero-actions,html body .hero-metrics{display:none!important}
 html body main.shell > section.hero>.apex-mobile-trust{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;margin:0!important;padding:12px!important;border:0!important}
 html body .apex-mobile-trust span{background:#fff!important;color:#7546FF!important;border:1px solid #dce4e8!important;border-radius:10px!important;padding:12px 8px!important}
 html body .apex-mobile-trust b{color:#15191D!important}
}

/* Mobile reset: remove inherited overlay widths and vertical offsets. */
html body main.shell > section.hero .hero-description-mobile{display:none!important}
@media(max-width:850px){
 html body main.shell > section.hero{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)!important;align-items:center!important;min-height:0!important;height:auto!important;gap:0!important;border:0!important;border-radius:0!important;isolation:auto!important;overflow:visible!important;margin:0 0 16px!important;padding:0!important}
 html body main.shell > section.hero .hero-copy{position:relative!important;inset:auto!important;transform:none!important;align-self:center!important;width:100%!important;max-width:100%!important;min-width:0!important;padding:24px 10px 24px 0!important;z-index:1!important;font-size:initial!important}
 html body main.shell > section.hero h1#hero-title{width:100%!important;max-width:100%!important;font-size:clamp(20px,5.2vw,34px)!important;line-height:1.13!important;letter-spacing:-.65px!important;margin:0 0 12px!important;overflow-wrap:normal!important}
 html body main.shell > section.hero .hero-copy p{width:100%!important;max-width:100%!important;min-width:0!important;font-size:12px!important;line-height:1.55!important;margin:0!important;transform:none!important;color:#465467!important}
 html body main.shell > section.hero .hero-copy .hero-description-full{display:none!important}
 html body main.shell > section.hero .hero-copy .hero-description-mobile{display:block!important}
 html body main.shell > section.hero .hero-copy .hero-actions,html body main.shell > section.hero .hero-copy .hero-metrics{display:none!important}
 html body main.shell > section.hero div.hero-art.apex-vial-hero{position:relative!important;inset:auto!important;align-self:stretch!important;width:100%!important;max-width:100%!important;height:auto!important;min-height:0!important;aspect-ratio:auto!important;transform:none!important;border:0!important;border-radius:0!important;background-size:contain!important;background-position:center!important;background-repeat:no-repeat!important;background-color:#FFFFFF!important;overflow:hidden!important;z-index:0!important}
 html body main.shell > section.hero > .apex-mobile-trust{position:static!important;inset:auto!important;transform:none!important;display:grid!important;width:100%!important;grid-column:1/-1!important;grid-row:2!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;margin:0!important;padding:0!important;z-index:auto!important}
 html body main.shell > section.hero > .apex-mobile-trust > span{position:relative!important;transform:none!important;min-width:0!important;min-height:100px!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:flex-start!important;gap:6px!important;padding:12px!important;background:#fff!important;border:1px solid #dce4e8!important;box-shadow:none!important;border-radius:10px!important;color:transparent!important;font-size:0!important}
 html body main.shell > section.hero > .apex-mobile-trust > span b{color:#15191D!important;font-size:11px!important;line-height:1.3!important;font-weight:750!important}
 html body main.shell > section.hero > .apex-mobile-trust > span:before{background:#f3eeff!important;border:1px solid #d9ccff!important;color:#7546FF!important;box-shadow:none!important;width:25px!important;height:25px!important}
 html body main.shell > section.hero > .apex-mobile-trust > span:after{color:#596675!important;font-size:10px!important;line-height:1.35!important}
 html body header nav{min-height:70px!important;padding:4px 12px!important}
 html body header nav .brand-logo{height:60px!important;width:170px!important;max-width:45vw!important;object-fit:contain!important}
 html body header nav .apex-mobile-nav{gap:3px!important}
 html body header nav .apex-mobile-nav a,html body header nav .apex-mobile-nav button{width:40px!important;min-width:40px!important;height:44px!important;padding:0!important}
 html body .apex-floating{min-height:48px!important;padding:12px 16px!important;bottom:calc(10px + env(safe-area-inset-bottom))!important;border:0!important;border-radius:10px!important;font-size:14px!important;color:#fff!important;box-shadow:0 3px 12px #15191d26!important}
}

/* NYTE brand and responsive catalog artwork. */
:root{--nyte-violet:#7546ff;--nyte-ink:#11121a}
html body header,html body header nav{background:#08090f!important}
html body .brand-logo{object-fit:contain!important;max-width:40vw!important;width:220px!important;height:68px!important}
html body .hero-art.apex-vial-hero{display:flex!important;align-items:flex-end!important;justify-content:center!important;gap:0!important;background:none!important;padding:12px!important;min-width:0!important}
html body .hero-art.apex-vial-hero img{display:block!important;object-fit:contain!important;max-width:55%!important;width:55%!important;mix-blend-mode:multiply;position:relative!important}
html body .hero-art .nyte-hero-reta{height:290px!important;z-index:2!important;margin-right:-40px!important}
html body .hero-art .nyte-hero-mots{height:350px!important;z-index:1!important}
html body .apex-variant-option.selected{background:#7546ff!important;color:#fff!important;border-color:#7546ff!important}
html body .product-image-top{color:#716b83!important}
html body .pic{background:white!important}
html body .pic img{width:100%!important;height:100%!important;object-fit:contain!important}
html body .product:focus-within{outline:2px solid #7546ff;outline-offset:3px}
@media(max-width:850px){
html body .brand-logo,html body header nav .brand-logo{width:165px!important;height:58px!important;max-width:43vw!important}
html body main.shell>section.hero div.hero-art.apex-vial-hero{padding:0!important;align-items:center!important;overflow:visible!important}
html body .hero-art.apex-vial-hero img{width:62%!important;max-width:62%!important}
html body .hero-art .nyte-hero-reta{height:165px!important;margin-right:-24px!important}
html body .hero-art .nyte-hero-mots{height:205px!important}
html body .apex-mobile-nav{flex-shrink:0!important}
html body .apex-mobile-trust span:before{color:#7546ff!important}
html body .grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
html body .details{min-width:0!important;padding:12px!important}
html body .details h3{overflow-wrap:anywhere!important}
html body .apex-cart-drawer{max-width:100vw!important;width:min(420px,100vw)!important}
}
@media(max-width:360px){html body .hero-art .nyte-hero-reta{height:135px!important}html body .hero-art .nyte-hero-mots{height:170px!important}html body header nav .apex-mobile-nav a,html body header nav .apex-mobile-nav button{width:34px!important;min-width:34px!important}}

html body .pic img[data-vial-ml="3"]{width:86%!important;height:86%!important}
html body main.shell>section.hero div.hero-art.apex-vial-hero{background:#fff!important}
html body main.shell>section.hero div.hero-art.apex-vial-hero img{mix-blend-mode:normal!important}
html body main.shell #products article.product .pic,html body main.shell #products article.product .product-image-frame{background:#fff!important}
html body main.shell #products article.product .pic img{mix-blend-mode:normal!important}

html body main.shell>section.hero div.hero-art.apex-vial-hero{padding:0!important;align-items:center!important;overflow:hidden!important}
html body main.shell>section.hero div.hero-art.apex-vial-hero img.nyte-floating-hero{width:100%!important;max-width:none!important;height:100%!important;max-height:380px!important;object-fit:cover!important;object-position:right center!important;margin:0!important;mix-blend-mode:normal!important}
@media(max-width:850px){html body main.shell>section.hero div.hero-art.apex-vial-hero img.nyte-floating-hero{width:165%!important;min-width:165%!important;max-width:none!important;height:240px!important;object-fit:contain!important;object-position:right center!important;transform:translateX(-18%)!important}}

/* Approved Option 3: Dark Fade. The mobile image and layout remain the existing version. */
.nyte-hero-picture{display:contents}
@media(min-width:851px){
 html body main.shell>section.hero{display:block!important;position:relative!important;isolation:isolate!important;min-height:390px!important;height:auto!important;padding:0!important;border:1px solid #e2d9f8!important;border-radius:16px!important;overflow:hidden!important;background:#fff!important}
 html body main.shell>section.hero .hero-copy{position:relative!important;z-index:1!important;display:block!important;width:49%!important;max-width:49%!important;padding:34px 30px!important;background:transparent!important;grid-area:auto!important}
 html body main.shell>section.hero div.hero-art.apex-vial-hero{position:absolute!important;inset:0!important;display:block!important;width:100%!important;height:100%!important;min-height:0!important;z-index:0!important;grid-area:auto!important;padding:0!important;background:transparent!important}
 html body main.shell>section.hero div.hero-art.apex-vial-hero img.nyte-floating-hero{display:block!important;width:100%!important;min-width:0!important;max-width:none!important;height:100%!important;min-height:0!important;max-height:none!important;object-fit:cover!important;object-position:center center!important;transform:none!important;margin:0!important}
 html body main.shell>section.hero h1#hero-title{font-size:clamp(40px,4.15vw,64px)!important;line-height:1.04!important;letter-spacing:-2px!important;margin:0 0 18px!important}
 html body main.shell>section.hero .hero-copy p{max-width:460px!important;font-size:13px!important;line-height:1.65!important;margin:0!important}
}