.whp{--whp-yellow:var(--wl-core-accent,#ffd21f);--whp-navy:#0d1735;position:relative;isolation:isolate;overflow:hidden;background:#101b39;color:white;font-family:var(--wl-core-body-font,inherit);padding:0;border:6px solid #fff;box-sizing:border-box}
.whp *{box-sizing:border-box}
.whp h2,.whp .whp-roof,.whp strong{font-family:var(--wl-core-heading-font,inherit)}
.whp-hero{display:block;width:100%;height:auto;overflow:hidden;background:transparent;line-height:0}.whp-hero-image{display:block;width:100%;max-width:100%;height:auto!important;max-height:none!important;object-fit:contain!important;object-position:center center!important;aspect-ratio:auto!important;margin:0!important;padding:0!important;border:0!important}
/* Separate the storefronts from the hero image: each section owns its background and height. */
.whp-street{display:grid;grid-template-columns:1fr 1.25fr 1fr;align-items:end;gap:clamp(8px,2vw,24px);position:relative;padding:32px clamp(14px,3vw,42px) 20px;margin-top:0;z-index:2;background:linear-gradient(180deg,#274967 0%,#172645 34%,#101b39 100%)}
.whp-place{min-width:0;background:#182541;border:4px solid #0a1429;outline:2px solid #51617d;box-shadow:8px 8px 0 #090f23;position:relative;padding:10px;text-align:center;min-height:280px}.whp-roof{margin:-22px 6px 10px;background:#f4b148;color:#11152a;padding:8px 5px;border:4px solid #10182e;font-size:clamp(10px,1.4vw,17px)}.whp-club{min-height:338px;background:#301c4f;outline-color:#ed8dce}.whp-club .whp-roof{background:#bf438c;color:white}.whp-news{background:#273d45}.whp-news .whp-roof{background:#a6bcb7}.whp-place h2{font-size:clamp(14px,1.7vw,24px);line-height:1.25;letter-spacing:1px;color:var(--whp-yellow);margin:0 0 10px}.whp-content-link{display:flex;flex-direction:column;align-items:center;gap:7px;text-decoration:none!important;color:#fff!important;padding:5px;min-height:186px;justify-content:center}.whp-content-link img{width:92px;height:92px;object-fit:cover;border:3px solid #e4ad67}.whp-release-name{font-size:clamp(12px,1.5vw,18px);line-height:1.2;font-weight:700;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.whp-content-link strong{color:var(--whp-yellow);font-size:clamp(12px,1.3vw,17px)}.whp-content-link:hover strong,.whp-content-link:focus-visible strong{text-decoration:underline}.whp-content-link:focus-visible{outline:3px dashed var(--whp-yellow);outline-offset:3px}.whp-vinyl{display:grid;place-items:center;background:#15141b;color:#f4b148;width:90px;height:90px;border-radius:50%;font-size:38px;border:9px double #4a5065}.whp-speakers{font-size:48px;color:#ed8dce}.whp-speakers span{color:#f7d078}.whp-paper{color:#14233a;background:#edf3e5;border:4px solid #d3a866;transform:rotate(-3deg);padding:12px;font-size:18px;font-weight:bold}.whp-schedule{font-size:11px;letter-spacing:1px;color:#f3d7e3}.whp-next{color:#ffe8ae;font-size:11px;margin:4px 0 0!important}.whp-sidewalk{height:25px;background:repeating-linear-gradient(90deg,#647385 0 75px,#38495d 75px 80px);margin:12px -42px 0;border-top:6px solid #8e9ca8}.whp-demo-note{margin:0 -42px!important;background:#11182b;color:#d1d8e5;text-align:center;padding:9px 12px;font:12px/1.4 Arial,sans-serif}
@media(max-width:740px){
 .whp-hero{height:auto;aspect-ratio:auto;background:none}.whp-hero-image{display:block;width:100%;height:auto!important;max-height:none!important}
 .whp-street{grid-template-columns:1fr;gap:25px;max-width:470px;margin:0 auto;padding:22px 12px 0}
 .whp-place,.whp-club{min-height:190px}
 .whp-content-link{min-height:100px}
 .whp-roof{font-size:16px}
 .whp-place h2{font-size:19px}
 .whp-release-name{font-size:16px}
 .whp-club{order:-1}
 .whp-sidewalk{margin-left:0;margin-right:0}
}
@media(prefers-reduced-motion:reduce){.whp *{scroll-behavior:auto!important;transition:none!important}}

/* v0.1.10: position the complete framed scene centrally in the available
   viewport height, while allowing natural document scrolling on short screens. */
.whp-stage{
  width:100%;
  min-height:0; /* JavaScript measures actual space above the visible footer. */
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:24px 0 32px;
  box-sizing:border-box;
}
.whp-stage>.whp{width:100%;max-width:100%;flex:none;margin:0 auto!important;}
@media(max-width:740px){.whp-stage{padding:12px 0 20px;}}

/* v0.1.11: independently configurable media-library hero and focal point. */
.whp .whp-hero.whp-hero-cover,.whp .whp-hero.whp-hero-contain{height:var(--whp-hero-dh);background:#279dea}
.whp .whp-hero.whp-hero-cover .whp-hero-image,.whp .whp-hero.whp-hero-contain .whp-hero-image{height:100%!important;max-height:none!important;object-position:var(--whp-hero-x) var(--whp-hero-y)!important}
.whp .whp-hero.whp-hero-cover .whp-hero-image{object-fit:cover!important}
.whp .whp-hero.whp-hero-contain .whp-hero-image{object-fit:contain!important}
.whp .whp-hero.whp-hero-natural .whp-hero-image{height:auto!important;object-fit:contain!important}
@media(max-width:740px){
.whp .whp-hero.whp-hero-cover,.whp .whp-hero.whp-hero-contain{height:var(--whp-hero-mh)}
.whp .whp-hero.whp-hero-cover .whp-hero-image,.whp .whp-hero.whp-hero-contain .whp-hero-image{height:100%!important}
}

/* v0.1.13: real HTML overlays inside the illustrated storefront windows. */
.whp-shop-scene{position:relative;width:100%;aspect-ratio:1672/941;overflow:hidden;background:#08132c;isolation:isolate}
.whp-shop-art{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:fill;pointer-events:none}
.whp-window{position:absolute;z-index:2;display:flex;flex-direction:column;align-items:stretch;justify-content:center;min-width:0;color:#fff;text-align:left;overflow:hidden;padding:0.2% 0.4%}
.whp-window-record{left:3.8%;top:33.6%;width:19.6%;height:18.2%}
.whp-window-club{left:36.8%;top:33.5%;width:19.4%;height:18.2%}
.whp-window-news{left:70.4%;top:36.4%;width:19.6%;height:15.8%}
.whp-window-heading{color:#ffd21f;font-size:clamp(6px,1.25vw,13px);font-weight:800;letter-spacing:.02em;line-height:1.1;text-align:center;margin-bottom:3%}
.whp-window-club .whp-window-heading{color:#dc98fc}.whp-window-news .whp-window-heading{color:#b8ede7}
.whp-window-link{display:flex;flex-direction:row;align-items:center;gap:5%;min-width:0;text-decoration:none!important;color:white!important;flex:1}
.whp-window-link .whp-square{width:37%;aspect-ratio:1/1;flex:none;height:auto;object-fit:cover;border:2px solid #dcad65;max-width:none;margin:0;display:grid;place-items:center}
.whp-window-club .whp-square{border-color:#be6de2}.whp-window-news .whp-square{border-color:#67b9ba}
.whp-square-fallback{background:#171b37;color:#ffd21f;font-size:clamp(13px,3vw,31px)}.whp-square-dj{background:radial-gradient(circle at 50% 30%,#622c8b,#171033 80%);color:#d989ff;font-size:clamp(13px,3vw,31px)}
.whp-window-detail{min-width:0;flex:1;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:clamp(3px,.8vw,9px)}
.whp-window-title{color:#fff;font-size:clamp(8px,1.4vw,15px);font-weight:800;line-height:1.2;max-width:100%;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.whp-window-action{display:inline-block;background:#ffd21f;color:#142037;padding:4px 5px;font-size:clamp(7px,1.05vw,12px);font-weight:900;line-height:1.15;white-space:nowrap}
.whp-window-club .whp-window-action{background:#ae63ee;color:#fff}.whp-window-news .whp-window-action{background:#79c7be;color:#071c26}
.whp-window-link:hover .whp-window-action,.whp-window-link:focus-visible .whp-window-action{filter:brightness(1.16)}
.whp-window-link:focus-visible{outline:2px solid #fff;outline-offset:-2px}
.whp-window-note{font-size:clamp(5px,.8vw,9px);color:#e1b3ff;line-height:1.1;text-align:center;margin-top:2%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.whp-road-promo{position:absolute;z-index:2;left:18%;top:76.3%;width:70%;height:12%;display:flex;align-items:center;justify-content:center;color:#fff;overflow:hidden;text-align:center;padding:0 2%}
.whp-promo-placeholder{font-size:clamp(10px,1.7vw,21px);font-weight:900;color:#ffd21f;letter-spacing:.03em;text-shadow:2px 2px #081329}
.whp-road-promo img{display:block;width:100%;max-height:100%;object-fit:contain}
/* Narrow screens: preserve artwork proportions and all window landmarks; for legibility, stack live listings below the art. */
@media(max-width:740px){
 .whp-shop-scene{aspect-ratio:auto;overflow:visible;background:#0a1531;padding-bottom:12px}
 .whp-shop-art{position:relative;inset:auto;width:100%;height:auto;object-fit:contain}
 .whp-window{position:relative;left:auto;top:auto;width:auto;height:auto;min-height:90px;margin:9px 12px;padding:10px;border:2px solid #78698f;background:#14233f;overflow:visible}
 .whp-window-heading{font-size:13px;margin-bottom:8px}
 .whp-window-link{gap:12px}.whp-window-link .whp-square{width:76px;height:76px;max-width:30%}
 .whp-window-title{font-size:15px}.whp-window-action{font-size:12px}.whp-window-note{font-size:10px;margin-top:8px}
 .whp-road-promo{position:relative;left:auto;top:auto;width:auto;height:auto;min-height:65px;margin:10px 12px 0;padding:12px 8px;border:2px solid #ffd21f;background:#101c38}
 .whp-promo-placeholder{font-size:13px}
}

/* v0.1.14: adjustable Site Style-linked typography and storefront overlap. */
.whp-shop-scene{margin-top:calc(-1 * var(--whp-roof-overlap,55px));z-index:3;position:relative}
.whp-shop-scene .whp-window,.whp-shop-scene .whp-window *{font-family:var(--whp-window-font,var(--wl-core-body-font,inherit))!important}
.whp-shop-scene .whp-window-heading{font-size:var(--whp-heading-size,11px)!important}
.whp-shop-scene .whp-window-title{font-size:var(--whp-title-size,12px)!important}
.whp-shop-scene .whp-window-action{font-size:var(--whp-button-size,10px)!important;padding:var(--whp-button-pad-y,3px) var(--whp-button-pad-x,4px)!important}
@media(max-width:740px){.whp-shop-scene{margin-top:0}}

/* v0.1.15: transparent sky above the storefront roofline allows the hero to show through. */
.whp-shop-scene{background:transparent!important}
.whp-shop-scene .whp-window-heading{line-height:1.05}
.whp-shop-scene .whp-window-title{line-height:1.12}
.whp-shop-scene .whp-window-action{line-height:1.05;letter-spacing:0;max-width:100%;box-sizing:border-box}
.whp-shop-scene .whp-window-detail{gap:clamp(2px,.5vw,6px)}

/* v0.1.16: preserve edited alpha roofline and let the hero show through above storefronts. */
.whp .whp-shop-scene{background:transparent!important}
.whp .whp-shop-art{background:transparent!important}

/* v0.1.17: improve alignment and legibility at actual storefront width. */
@media (min-width:741px){
 .whp-shop-scene .whp-window{justify-content:center;gap:2px;}
 .whp-shop-scene .whp-window-heading{flex:none;margin:0 0 3px;}
 .whp-shop-scene .whp-window-link{flex:0 1 auto;align-items:center;justify-content:center;gap:5%;min-height:0;}
 .whp-shop-scene .whp-window-record .whp-square,
 .whp-shop-scene .whp-window-news .whp-square{width:27%;max-width:27%;flex:0 0 27%;border-width:1px;}
 .whp-shop-scene .whp-window-detail{flex:1 1 0;min-width:0;gap:3px;justify-content:center;}
 .whp-shop-scene .whp-window-club .whp-window-link{width:100%;flex:0 1 auto;}
 .whp-shop-scene .whp-window-club .whp-window-detail{align-items:center;text-align:center;flex:1 1 auto;}
 .whp-shop-scene .whp-window-club .whp-window-title{display:block;max-height:none;overflow:visible;text-align:center;line-height:1.2;}
 .whp-shop-scene .whp-window-club .whp-window-note{flex:none;width:100%;min-width:0;margin:2px 0 0;padding:0 2px;white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:normal;font-size:clamp(7px,.78vw,10px);line-height:1.3;}
 .whp-shop-scene .whp-window-action{white-space:nowrap;max-width:100%;}
}
@media (max-width:740px){
 .whp-shop-scene .whp-window-record .whp-square,
 .whp-shop-scene .whp-window-news .whp-square{width:60px;height:60px;max-width:25%;border-width:1px;}
 .whp-shop-scene .whp-window-club .whp-window-link{justify-content:center;text-align:center;}
 .whp-shop-scene .whp-window-club .whp-window-detail{align-items:center;}
 .whp-shop-scene .whp-window-club .whp-window-note{white-space:normal;overflow:visible;text-overflow:clip;line-height:1.35;}
}

/* v0.1.18: line up headings with titles (same text column) and space actions clearly. */
.whp-shop-scene .whp-window-record .whp-window-detail,
.whp-shop-scene .whp-window-news .whp-window-detail{align-items:flex-start;text-align:left;gap:0!important;}
.whp-shop-scene .whp-window-record .whp-window-heading,
.whp-shop-scene .whp-window-news .whp-window-heading{align-self:flex-start;text-align:left;margin:0 0 5px!important;width:100%;}
.whp-shop-scene .whp-window-record .whp-window-title,
.whp-shop-scene .whp-window-news .whp-window-title{text-align:left;margin:0!important;}
.whp-shop-scene .whp-window-record .whp-window-action,
.whp-shop-scene .whp-window-news .whp-window-action{align-self:flex-start;margin-top:8px!important;}
@media(max-width:740px){
 .whp-shop-scene .whp-window-record .whp-window-action,
 .whp-shop-scene .whp-window-news .whp-window-action{margin-top:10px!important;}
}

/* v0.1.19: center each image + text group as a single unit in its shop window.
   Keep the text within the group left-aligned, and leave the Club unchanged. */
@media (min-width:741px){
  .whp-shop-scene .whp-window-record .whp-window-link,
  .whp-shop-scene .whp-window-news .whp-window-link{
    width:max-content;max-width:100%;margin-inline:auto;
    flex:0 1 auto;justify-content:center;gap:8px;
  }
  .whp-shop-scene .whp-window-record .whp-window-detail,
  .whp-shop-scene .whp-window-news .whp-window-detail{
    flex:0 1 auto;width:auto;min-width:0;
  }
  .whp-shop-scene .whp-window-record .whp-square,
  .whp-shop-scene .whp-window-news .whp-square{
    flex:0 0 auto;width:60px;max-width:30%;
  }
}

/* v0.1.20: compact Club schedule tagline; no long dates to wrap. */
.whp-shop-scene .whp-window-club .whp-window-note{
  font-size:clamp(7px,.75vw,10px);font-weight:700;letter-spacing:.01em;
  white-space:normal;text-align:center;line-height:1.15;margin-top:5px;
  color:#e1b3ff;
}

/* v0.1.21: distribute Club content vertically inside the existing display window.
   Apply only on desktop, where the overlay sits inside the illustrated window. */
@media (min-width:741px){
  .whp-shop-scene .whp-window-club{gap:8px;justify-content:center;}
  .whp-shop-scene .whp-window-club .whp-window-heading{margin:0 0 5px!important;}
  .whp-shop-scene .whp-window-club .whp-window-link{margin:3px 0;}
  .whp-shop-scene .whp-window-club .whp-window-detail{gap:9px;}
  .whp-shop-scene .whp-window-club .whp-window-note{margin:6px 0 0!important;}
}


/* v0.1.22: center promo content cleanly inside the road slot. */
.whp-road-promo{padding:0 1.1%!important;box-sizing:border-box;line-height:0;display:flex!important;align-items:center!important;justify-content:center!important;overflow:hidden}
.whp-road-promo > *{width:100%;height:100%;min-width:0;min-height:0;display:flex;align-items:center;justify-content:center}
.whp-road-promo .wpm-rotator,
.whp-road-promo .wpm-slide,
.whp-road-promo .wpm-link{width:100%!important;height:100%!important;min-width:0;min-height:0;display:flex!important;align-items:center!important;justify-content:center!important;margin:0 auto!important}
.whp-road-promo .wpm-ad-image{display:block!important;width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;object-fit:contain!important;object-position:center center!important;margin:auto!important}

/* v0.1.24: 3px inset shadow, 40% opacity, blur at 30% of width (0.9px).
   Updated from v0.1.23 shadow.
   Previously: soft shadow cast inward from the white homepage frame.
   Pseudo-element preserves Site Style's existing exterior box-shadow. */
.whp::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:20;
  pointer-events:none;
  box-shadow:inset 0 0 0.9px 3px rgba(0,0,0,.40);
}

/* v0.1.25: optical centering of image promos within the road sign.
   The transparent artwork's visible pixels sit slightly above geometric center.
   Shift only the image (not the ad link, rotation container or road art). */
@media (min-width:741px){
  .whp .whp-road-promo .wpm-ad-image{transform:translateY(clamp(3px,.5vw,8px))!important;}
}


/* v0.1.26 – dedicated mobile composition. Desktop rules above are unchanged.
   Each shop facade is a crop of the identical desktop pixel-art source.
   The live overlay is positioned INSIDE the facade display window. */
.whp-mobile-facade{display:none!important}
@media (max-width:740px){
 .whp .whp-shop-scene{
   display:flex!important;flex-direction:column!important;
   width:100%!important;height:auto!important;aspect-ratio:auto!important;
   margin-top:-18px!important;overflow:visible!important;
   padding:0!important;background:transparent!important;
 }
 .whp .whp-shop-art{display:none!important}
 .whp .whp-shop-scene .whp-window{
   display:flex!important;position:relative!important;inset:auto!important;
   width:100%!important;height:auto!important;aspect-ratio:557 / 563;
   flex:0 0 auto!important;min-height:0!important;
   box-sizing:border-box!important;margin:0!important;padding:0!important;
   border:0!important;border-radius:0!important;
   background:transparent!important;overflow:visible!important;
   align-items:stretch!important;justify-content:normal!important;
 }
 .whp .whp-shop-scene .whp-mobile-facade{
   display:block!important;position:absolute!important;inset:0!important;
   width:100%!important;height:100%!important;object-fit:fill!important;
   margin:0!important;pointer-events:none!important;
 }
 .whp .whp-shop-scene .whp-window-link{
   position:absolute!important;display:flex!important;flex-direction:row!important;
   align-items:center!important;justify-content:center!important;
   width:58.5%!important;height:30.5%!important;
   top:50.4%!important;left:11.3%!important;
   padding:2px!important;margin:0!important;box-sizing:border-box!important;
   gap:7px!important;min-height:0!important;min-width:0!important;
   flex:0 0 auto!important;text-align:left!important;
 }
 .whp .whp-shop-scene .whp-window-club .whp-window-link{top:51.2%!important;left:11.1%!important;width:59%!important;height:29%!important}
 .whp .whp-shop-scene .whp-window-news .whp-window-link{top:55.1%!important;left:10.8%!important;width:59.8%!important;height:30%!important}
 .whp .whp-shop-scene .whp-window-record .whp-square,
 .whp .whp-shop-scene .whp-window-news .whp-square{
   width:clamp(32px,13vw,75px)!important;height:clamp(32px,13vw,75px)!important;
   max-width:32%!important;flex:0 0 auto!important;object-fit:cover!important;
   border-width:1px!important;
 }
 .whp .whp-shop-scene .whp-window-detail{
   display:flex!important;flex:0 1 auto!important;flex-direction:column!important;
   align-items:flex-start!important;justify-content:center!important;
   min-width:0!important;width:auto!important;gap:2px!important;
   text-align:left!important;
 }
 .whp .whp-shop-scene .whp-window-heading{
   font-size:clamp(8px,2.6vw,12px)!important;line-height:1.15!important;
   text-align:left!important;margin:0 0 4px!important;
 }
 .whp .whp-shop-scene .whp-window-title{
   font-size:clamp(9px,3vw,14px)!important;line-height:1.22!important;
   -webkit-line-clamp:3!important;overflow:hidden!important;display:-webkit-box!important;
   -webkit-box-orient:vertical!important;max-height:3.7em!important;
 }
 .whp .whp-shop-scene .whp-window-action{
   font-size:clamp(8px,2.45vw,12px)!important;padding:3px 4px!important;
   white-space:nowrap!important;margin:5px 0 0!important;line-height:1.1!important;
 }
 .whp .whp-shop-scene .whp-window-club .whp-window-heading{
   position:absolute!important;top:53%!important;left:11.3%!important;
   width:58.5%!important;text-align:center!important;z-index:3;
 }
 .whp .whp-shop-scene .whp-window-club .whp-window-link{
   top:57%!important;height:18%!important;align-items:center!important;
 }
 .whp .whp-shop-scene .whp-window-club .whp-window-detail{
   align-items:center!important;text-align:center!important;width:100%!important;
 }
 .whp .whp-shop-scene .whp-window-club .whp-window-title{
   text-align:center!important;max-height:3.7em!important;
 }
 .whp .whp-shop-scene .whp-window-club .whp-window-note{
   position:absolute!important;top:76%!important;left:11.3%!important;
   width:58.5%!important;margin:0!important;font-size:clamp(8px,2.45vw,12px)!important;
   text-align:center!important;line-height:1.15!important;
 }
 .whp .whp-shop-scene .whp-road-promo{
   position:relative!important;inset:auto!important;display:flex!important;
   flex:0 0 auto!important;width:100%!important;height:auto!important;
   aspect-ratio:1672 / 319!important;margin:0!important;padding:4% 16%!important;
   border:0!important;border-radius:0!important;
   box-sizing:border-box!important;
   background:#0a132a url('mobile-road.png?v=0.1.33') center center / 100% 100% no-repeat!important;
   align-items:center!important;justify-content:center!important;
   overflow:hidden!important;
 }
 .whp .whp-shop-scene .whp-road-promo .wpm-ad-image{
   object-fit:contain!important;object-position:center center!important;
   transform:none!important;max-height:100%!important;
 }
}


/* v0.1.28: one mobile source of truth for the hero / roof and road ad.
   v0.1.27 added top padding to the hero and put the rotator in a small
   artificial region, so the visual image was not actually aligned. */
@media (max-width:740px){
  /* Preserve the full natural hero height, with no padding that shifts or clips
     the image. A small overlap brings the facade over the bottom of the hero. */
  .whp .whp-hero, .whp .whp-hero.whp-hero-natural{
    padding:0!important;margin:0!important;height:auto!important;
    min-height:0!important;aspect-ratio:auto!important;overflow:visible!important;
    background:transparent!important;line-height:0!important;
  }
  .whp .whp-hero .whp-hero-image{
    display:block!important;width:100%!important;height:auto!important;
    max-height:none!important;max-width:100%!important;
    object-fit:contain!important;object-position:center!important;
    margin:0!important;padding:0!important;transform:none!important;
  }
  /* Other crop modes remain available in the dashboard, but mobile keeps the
     entire hero visible to avoid image cut-off at narrow widths. */
  .whp .whp-hero.whp-hero-cover,.whp .whp-hero.whp-hero-contain{height:auto!important;}
  .whp .whp-shop-scene{margin-top:-16px!important;}
  /* The yellow road markings and megaphone belong to the background crop.
     The live image should fill the open painted rectangle to their right. */
  .whp .whp-shop-scene .whp-road-promo{
    padding:0!important;margin:0!important;overflow:hidden!important;
    position:relative!important;
  }
  .whp .whp-shop-scene .whp-road-promo > .wpm-rotator{
    position:absolute!important;
    left:23%!important;top:18%!important;width:69%!important;height:64%!important;
    min-width:0!important;min-height:0!important;margin:0!important;
    display:flex!important;align-items:center!important;justify-content:center!important;
  }
  .whp .whp-shop-scene .whp-road-promo .wpm-slide,
  .whp .whp-shop-scene .whp-road-promo .wpm-link{
    display:flex!important;width:100%!important;height:100%!important;
    align-items:center!important;justify-content:center!important;
  }
  .whp .whp-shop-scene .whp-road-promo .wpm-ad-image{
    display:block!important;width:100%!important;height:100%!important;
    object-fit:contain!important;object-position:center center!important;
    max-width:100%!important;max-height:100%!important;
    transform:none!important;margin:auto!important;
  }
}


/* v0.1.29: mobile frame starts immediately at its stage boundary; no
   additional blue Site Style background band above the white border.
   Keep the hero entirely within the frame and retain the separate
   roofline-to-hero overlap below. */
@media (max-width:740px){
  .whp-stage{padding-top:0!important;margin-top:0!important;}
  .whp-stage > .whp{margin-top:0!important;position:relative!important;overflow:hidden!important;}
  .whp-stage > .whp > .whp-hero{margin-top:0!important;position:relative!important;}
  .whp-stage > .whp > .whp-hero > .whp-hero-image{vertical-align:top!important;}
}


/* v0.1.30: mobile road promo fits by WIDTH, not by the tall transparent
   source canvas. Center-crop excess transparent top/bottom within the live
   advertisement opening; desktop and the rest of mobile remain untouched. */
@media (max-width:740px){
  .whp .whp-shop-scene .whp-road-promo .wpm-ad-image{
    display:block!important;
    width:100%!important;height:100%!important;
    max-width:none!important;max-height:none!important;
    object-fit:cover!important;
    object-position:50% 50%!important;
    transform:none!important;margin:0!important;
  }
}

/* v0.1.31: undo image cropping introduced in 0.1.30. The whole
   linked promo must remain visible inside the mobile road opening. */
@media (max-width:740px){
 .whp .whp-shop-scene .whp-road-promo .wpm-ad-image{
  width:100%!important;height:100%!important;
  max-width:100%!important;max-height:100%!important;
  object-fit:contain!important;object-position:center center!important;
  transform:none!important;margin:auto!important;
 }
}


/* v0.1.32: clean asphalt without yellow street border. Promo occupies the
   available street area; the storefront/windows and hero remain unchanged. */
@media (min-width:741px){
 .whp .whp-shop-scene .whp-road-promo{left:8%!important;top:76.4%!important;width:84%!important;height:16%!important;padding:0!important;}
 .whp .whp-shop-scene .whp-road-promo .wpm-ad-image{transform:none!important;object-fit:contain!important;object-position:center center!important;}
}
@media (max-width:740px){
 .whp .whp-shop-scene .whp-road-promo{padding:0!important;border:0!important;background-image:url('mobile-road.png?v=0.1.33')!important;}
 .whp .whp-shop-scene .whp-road-promo > .wpm-rotator{left:5%!important;top:32%!important;width:90%!important;height:56%!important;}
 .whp .whp-shop-scene .whp-road-promo .wpm-ad-image{object-fit:contain!important;object-position:center center!important;transform:none!important;}
}

/* v0.1.33: bust stale mobile-road image cache after clean street replacement. */