/* =========================================================
   Rev272J — visual refinement only
   - Cart environment feather/richness
   - BITS text-card cleanup
   - Homepage figure montage beside the pulp poster
   - Smaller/quieter Arcade circuitry
   - Utility/account/footer-page title + glass continuity
   - About memory-photo rebalance
   - Mobile-only category background visibility lift
   - Contained product-photo popup
   NO cart / checkout transport / account / Store API JS changes.
   ========================================================= */

:root{
  --bb-j-red:#e33c35;
  --bb-j-cream:#f3efe7;
  --bb-j-muted:#9298a1;
  --bb-j-glass:linear-gradient(145deg,rgba(15,18,22,.91),rgba(5,7,9,.94));
  --bb-j-line:rgba(255,255,255,.09);
  --bb-j-radius:16px;
}

/* ---------------------------------------------------------
   1) CART ENVIRONMENT — richer, softer, longer bottom melt.
   Presentation only. Cart logic remains untouched.
   --------------------------------------------------------- */
body.cart-page::before{
  height:min(68vw,790px)!important;
  opacity:.68!important;
  filter:brightness(.89) saturate(1.16) contrast(1.08)!important;
  -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 48%,rgba(0,0,0,.92) 59%,rgba(0,0,0,.66) 72%,rgba(0,0,0,.28) 86%,transparent 100%)!important;
  mask-image:linear-gradient(to bottom,#000 0%,#000 48%,rgba(0,0,0,.92) 59%,rgba(0,0,0,.66) 72%,rgba(0,0,0,.28) 86%,transparent 100%)!important;
}
body.cart-page::after{
  height:min(68vw,790px)!important;
  background:
    radial-gradient(ellipse 72% 58% at 50% 31%,transparent 0 42%,rgba(4,4,5,.10) 59%,rgba(4,4,5,.50) 79%,#050505 100%),
    linear-gradient(180deg,transparent 0 56%,rgba(5,5,5,.12) 68%,rgba(5,5,5,.72) 91%,#050505 100%)!important;
}
@media(max-width:680px){
  body.cart-page::before,body.cart-page::after{height:470px!important}
  body.cart-page::before{opacity:.50!important;filter:brightness(.91) saturate(1.10) contrast(1.05)!important}
}

/* ---------------------------------------------------------
   2) BITS — remove the fake/blank art wells and turn the section
   into useful compact editorial glass cards.
   --------------------------------------------------------- */
body.bits-page .bits-news-grid{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:14px!important;
}
body.bits-page .bits-story-card,
body.bits-page .bits-story-card.wide{
  grid-column:auto!important;
  min-height:190px!important;
  display:flex!important;
  align-items:stretch!important;
  border:1px solid rgba(255,255,255,.075)!important;
  border-radius:14px!important;
  background:linear-gradient(145deg,rgba(12,14,17,.84),rgba(4,5,7,.90))!important;
  box-shadow:0 20px 52px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.025)!important;
  overflow:hidden!important;
}
body.bits-page .bits-story-card::before{
  content:"";
  width:2px;
  flex:0 0 2px;
  background:linear-gradient(180deg,transparent 4%,rgba(227,60,53,.85) 28%,rgba(227,60,53,.28) 76%,transparent 96%);
}
body.bits-page .bits-story-art{display:none!important}
body.bits-page .bits-story-card>div:last-child{
  width:100%!important;
  padding:25px 26px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
}
body.bits-page .bits-story-card h2{font-size:clamp(22px,2vw,29px)!important;margin:7px 0 10px!important}
body.bits-page .bits-story-card p{font-size:12px!important;line-height:1.65!important;margin:0 0 16px!important}
@media(max-width:900px){body.bits-page .bits-news-grid{grid-template-columns:1fr 1fr!important}}
@media(max-width:600px){body.bits-page .bits-news-grid{grid-template-columns:1fr!important}.bits-story-card{min-height:160px!important}}

/* ---------------------------------------------------------
   3) HOME — supplied figure cutouts become a quiet montage beside
   the pulp poster. Desktop only to protect phone performance.
   --------------------------------------------------------- */
.home-pulp-top-v259{position:relative!important;overflow:hidden!important;isolation:isolate!important}
.home-pulp-top-v259 .home-pulp-copy,
.home-pulp-top-v259 .home-pulp-poster{position:relative!important;z-index:4!important}
.home-character-montage-v272j{
  position:absolute;
  z-index:2;
  right:clamp(-64px,-2vw,-18px);
  top:18px;
  width:clamp(500px,42vw,760px);
  height:610px;
  pointer-events:none;
  opacity:.56;
  filter:saturate(.78) brightness(.72) contrast(1.05);
  -webkit-mask-image:radial-gradient(ellipse 78% 78% at 58% 47%,#000 0 52%,rgba(0,0,0,.78) 66%,rgba(0,0,0,.30) 83%,transparent 100%);
  mask-image:radial-gradient(ellipse 78% 78% at 58% 47%,#000 0 52%,rgba(0,0,0,.78) 66%,rgba(0,0,0,.30) 83%,transparent 100%);
}
.home-character-montage-v272j::after{
  content:"";position:absolute;inset:0;z-index:8;pointer-events:none;
  background:linear-gradient(90deg,rgba(0,0,0,.72) 0%,rgba(0,0,0,.18) 28%,transparent 55%,rgba(0,0,0,.14) 82%,rgba(0,0,0,.58) 100%),linear-gradient(180deg,rgba(0,0,0,.42),transparent 22%,transparent 72%,rgba(0,0,0,.64));
}
.home-character-montage-v272j img{position:absolute;height:auto;object-fit:contain;filter:drop-shadow(0 18px 20px rgba(0,0,0,.72))}
.home-character-montage-v272j .f1{width:31%;left:2%;top:9%;opacity:.72;transform:rotate(-2deg)}
.home-character-montage-v272j .f2{width:29%;left:24%;top:2%;opacity:.78;transform:rotate(1deg)}
.home-character-montage-v272j .f3{width:31%;right:18%;top:9%;opacity:.80;transform:rotate(-1deg)}
.home-character-montage-v272j .f4{width:27%;right:-1%;top:1%;opacity:.68;transform:rotate(2deg)}
.home-character-montage-v272j .f5{width:26%;left:15%;bottom:-4%;opacity:.65;transform:rotate(2deg)}
.home-character-montage-v272j .f6{width:27%;right:6%;bottom:-6%;opacity:.66;transform:rotate(-1deg)}
@media(max-width:1180px){.home-character-montage-v272j{right:-120px;opacity:.44}}
@media(max-width:900px){.home-character-montage-v272j{display:none!important}}

/* ---------------------------------------------------------
   4) ARCADE CIRCUITRY — smaller, calmer, desaturated and fully
   vignetted into the black ceiling behind the existing logo.
   --------------------------------------------------------- */
body.arcade-hub-page .bb-arcade-poster-main::after{
  top:8px!important;
  height:540px!important;
  background-size:1500px auto!important;
  background-position:center 2px!important;
  opacity:.40!important;
  filter:brightness(1.04) saturate(.54) contrast(.98)!important;
  mix-blend-mode:screen!important;
  -webkit-mask-image:radial-gradient(ellipse 61% 57% at 50% 29%,#000 0 39%,rgba(0,0,0,.78) 58%,rgba(0,0,0,.30) 77%,transparent 100%)!important;
  mask-image:radial-gradient(ellipse 61% 57% at 50% 29%,#000 0 39%,rgba(0,0,0,.78) 58%,rgba(0,0,0,.30) 77%,transparent 100%)!important;
}
@media(max-width:1100px){body.arcade-hub-page .bb-arcade-poster-main::after{height:470px!important;background-size:1280px auto!important;opacity:.34!important}}
@media(max-width:680px){body.arcade-hub-page .bb-arcade-poster-main::after{height:385px!important;background-size:1020px auto!important;opacity:.26!important;filter:brightness(1.02) saturate(.48) contrast(.98)!important}}

/* ---------------------------------------------------------
   5) UTILITY / POLICY / ACCOUNT CONTINUITY — shorter titles,
   glass title ledge, rounded panels and deliberate spacing.
   --------------------------------------------------------- */
body.info-page .bb-info-shell,
body.account-page .bb-info-shell,
body.newsletter-page .bb-info-shell{
  position:relative!important;
  isolation:isolate!important;
}
body.info-page .bb-info-shell::before,
body.account-page .bb-info-shell::before,
body.newsletter-page .bb-info-shell::before{
  content:""!important;display:block!important;position:absolute!important;z-index:-1!important;
  left:50%!important;top:18px!important;width:min(1320px,100vw)!important;height:300px!important;transform:translateX(-50%)!important;
  background:radial-gradient(ellipse 70% 76% at 50% 10%,rgba(149,18,23,.12),rgba(8,10,13,.16) 43%,transparent 76%)!important;
  pointer-events:none!important;
}
body.info-page .bb-info-shell>.catalog-kicker,
body.account-page .bb-info-shell>.catalog-kicker,
body.newsletter-page .bb-info-shell>.catalog-kicker{
  color:#e24740!important;font-size:10px!important;letter-spacing:.20em!important;margin-bottom:9px!important;
}
body.info-page .bb-info-shell>h1,
body.account-page .bb-info-shell>h1,
body.newsletter-page .bb-info-shell>h1{
  width:max-content!important;max-width:100%!important;
  margin:0 0 32px!important;
  padding:0 0 16px!important;
  font-family:"Bahnschrift SemiCondensed",Bahnschrift,"Arial Narrow","Segoe UI",Arial,sans-serif!important;
  font-size:clamp(38px,4.9vw,68px)!important;
  font-weight:760!important;
  line-height:.92!important;
  letter-spacing:-.032em!important;
  text-transform:uppercase!important;
  color:var(--bb-j-cream)!important;
  position:relative!important;
}
body.info-page .bb-info-shell>h1::after,
body.account-page .bb-info-shell>h1::after,
body.newsletter-page .bb-info-shell>h1::after{
  content:""!important;display:block!important;position:absolute!important;left:0!important;bottom:0!important;
  width:clamp(48px,7vw,92px)!important;height:2px!important;margin:0!important;
  background:linear-gradient(90deg,var(--bb-j-red),rgba(227,60,53,0))!important;
  box-shadow:0 0 16px rgba(227,60,53,.16)!important;
}
body.info-page .bb-legal-nav{
  border:1px solid rgba(255,255,255,.07)!important;border-radius:12px!important;padding:10px 12px!important;
  background:rgba(6,8,10,.58)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.02)!important;
}
body.info-page .bb-legal-copy,
body.info-page .bb-faq details,
body.account-page :is(.bb-account-card,.bb-profile-command,.bb-profile-editor,.bb-account-orders,.bb-account-links>a,.bb-account-summary-card),
body.newsletter-page :is(.bb-preference-card,.bb-info-grid article){
  border-radius:var(--bb-j-radius)!important;
  border-color:var(--bb-j-line)!important;
  background:var(--bb-j-glass)!important;
  box-shadow:0 24px 62px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.026)!important;
}
body.info-page .bb-legal-copy{padding:clamp(30px,3.8vw,50px)!important}
body.info-page .bb-legal-copy h2,
body.info-page .bb-faq summary,
body.account-page :is(.bb-account-card h2,.bb-profile-command h2,.bb-profile-editor h2,.bb-account-orders h2),
body.newsletter-page :is(h2,h3){
  font-family:"Bahnschrift SemiCondensed",Bahnschrift,"Arial Narrow","Segoe UI",Arial,sans-serif!important;
  letter-spacing:-.015em!important;
}
body.info-page .bb-legal-copy h2{font-size:clamp(21px,2vw,29px)!important;color:#f3efe8!important}
body.info-page .bb-faq details{padding:24px 26px!important}
body.info-page .bb-faq summary{font-size:clamp(16px,1.6vw,20px)!important;color:#f3efe8!important}

/* Wishlist uses a catalog shell, so give its opening block the same language. */
body.wishlist-page .wishlist-section{padding-top:clamp(54px,6vw,78px)!important}
body.wishlist-page .catalog-heading{
  padding:clamp(24px,3vw,38px)!important;border:1px solid var(--bb-j-line)!important;border-radius:16px!important;
  background:var(--bb-j-glass)!important;box-shadow:0 24px 62px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.026)!important;
}
body.wishlist-page .catalog-heading h2{
  font-family:"Bahnschrift SemiCondensed",Bahnschrift,"Arial Narrow","Segoe UI",Arial,sans-serif!important;
  font-size:clamp(38px,4.5vw,62px)!important;font-weight:760!important;letter-spacing:-.03em!important;text-transform:uppercase!important;
}
body.wishlist-page .wishlist-empty{border-radius:16px!important;border-color:var(--bb-j-line)!important;background:var(--bb-j-glass)!important}

@media(max-width:700px){
  body.info-page .bb-info-shell>h1,body.account-page .bb-info-shell>h1,body.newsletter-page .bb-info-shell>h1{font-size:clamp(34px,10vw,46px)!important;margin-bottom:25px!important}
  body.info-page .bb-legal-copy{padding:24px 20px!important}
  body.info-page .bb-faq details{padding:20px 18px!important}
  body.wishlist-page .catalog-heading{padding:22px 18px!important}
  body.wishlist-page .catalog-heading h2{font-size:clamp(34px,10vw,46px)!important}
}

/* ---------------------------------------------------------
   6) ABOUT — make the two archival memories actually readable while
   preserving the collage/text hierarchy and smooth edge dissolves.
   --------------------------------------------------------- */
body.about-page .about-memory-toy-aisle{
  left:-2vw!important;bottom:-2%!important;width:min(57vw,940px)!important;height:72%!important;opacity:.235!important;
  filter:contrast(1.04) brightness(.74) saturate(.76)!important;
  -webkit-mask-image:radial-gradient(ellipse 78% 76% at 42% 52%,#000 0 48%,rgba(0,0,0,.84) 63%,rgba(0,0,0,.36) 81%,transparent 100%)!important;
  mask-image:radial-gradient(ellipse 78% 76% at 42% 52%,#000 0 48%,rgba(0,0,0,.84) 63%,rgba(0,0,0,.36) 81%,transparent 100%)!important;
}
body.about-page .about-memory-computer{
  right:-1vw!important;top:1%!important;width:min(48vw,800px)!important;height:58%!important;opacity:.19!important;
  filter:contrast(1.02) brightness(.66) saturate(.72)!important;
  -webkit-mask-image:radial-gradient(ellipse 78% 74% at 55% 48%,#000 0 48%,rgba(0,0,0,.82) 63%,rgba(0,0,0,.34) 82%,transparent 100%)!important;
  mask-image:radial-gradient(ellipse 78% 74% at 55% 48%,#000 0 48%,rgba(0,0,0,.82) 63%,rgba(0,0,0,.34) 82%,transparent 100%)!important;
}
body.about-page .origin-collage{filter:drop-shadow(0 28px 44px rgba(0,0,0,.20))}
@media(max-width:1180px){
  body.about-page .about-memory-toy-aisle{width:82vw!important;height:54%!important;left:-21vw!important;bottom:0!important;opacity:.17!important}
  body.about-page .about-memory-computer{width:70vw!important;height:44%!important;right:-21vw!important;top:4%!important;opacity:.14!important}
}
@media(max-width:680px){
  body.about-page .about-memory-toy-aisle{width:128vw!important;height:40%!important;left:-46vw!important;bottom:1%!important;opacity:.125!important}
  body.about-page .about-memory-computer{display:block!important;background-image:url("images/about/about-bg-computer-memory-v272.webp")!important;width:116vw!important;height:32%!important;right:-56vw!important;top:10%!important;opacity:.085!important}
}

/* ---------------------------------------------------------
   7) CATEGORY BACKGROUNDS — MOBILE ONLY. Desktop is untouched.
   Raise selected low-opacity art just enough to remain visible on phones.
   --------------------------------------------------------- */
@media(max-width:700px){
  body.category-page.category-tmnt::before{opacity:.34!important;filter:brightness(.66) saturate(1.10) contrast(1.12)!important}
  body.category-page.category-gi-joe::before{opacity:.26!important;filter:brightness(.58) saturate(.98) contrast(1.10)!important}
  body.category-page.category-transformers::before{opacity:.34!important;filter:brightness(.61) saturate(1.08) contrast(1.14)!important}
  body.category-page.category-star-wars::before{opacity:.33!important;filter:brightness(.70) saturate(.92) contrast(1.13)!important}
  body.category-page.category-anime::before{opacity:.31!important;filter:brightness(.54) saturate(.78) contrast(1.17)!important}
  body.category-page.category-marvel::before{opacity:.38!important;filter:brightness(.61) saturate(1.04) contrast(1.13)!important}
  body.category-page.category-dc::before{opacity:.40!important;filter:brightness(.74) saturate(1.10) contrast(1.13)!important}
  body.category-page.category-video-games::before{opacity:.62!important;filter:brightness(.88) saturate(1.10) contrast(1.10)!important}
  body.category-page.category-vintage-toys::before{opacity:.25!important;filter:brightness(.72) saturate(.88) contrast(1.08)!important}
  body.category-page.category-skateboarding::before{opacity:.30!important;filter:saturate(1.08) contrast(1.05) brightness(.98)!important}
  /* Already-rich pages stay essentially as designed. */
  body.category-page.category-motu::before,body.category-page.category-aliens::before,body.category-page.category-hot-wheels::before{filter:brightness(1.04) saturate(1.12) contrast(1.08)!important}
}

/* ---------------------------------------------------------
   8) PRODUCT PHOTO VIEWER — make it unmistakably a popup, not a
   giant takeover. No gallery JavaScript changes required.
   --------------------------------------------------------- */
body.product-page .bb-photo-zoom{
  padding:clamp(24px,7vh,72px) clamp(22px,7vw,110px)!important;
  background:rgba(0,0,0,.72)!important;
  -webkit-backdrop-filter:blur(7px)!important;backdrop-filter:blur(7px)!important;
}
body.product-page .bb-photo-zoom__panel{
  width:min(720px,calc(100vw - 110px))!important;
  height:min(640px,calc(100dvh - 130px))!important;
  max-width:720px!important;max-height:640px!important;
  border:0!important;border-radius:18px!important;
  background:#060709!important;
  box-shadow:0 36px 120px rgba(0,0,0,.80),0 0 0 1px rgba(255,255,255,.06)!important;
}
body.product-page .bb-photo-zoom__viewport{padding:18px!important;background:radial-gradient(circle at 50% 42%,#11151a,#040506 72%)!important}
body.product-page .bb-photo-zoom__viewport img{max-width:100%!important;max-height:100%!important;object-fit:contain!important;object-position:center!important}
@media(max-width:700px){
  body.product-page .bb-photo-zoom{padding:22px 14px!important}
  body.product-page .bb-photo-zoom__panel{width:calc(100vw - 28px)!important;height:min(68dvh,560px)!important;max-height:68dvh!important;border-radius:15px!important}
}