.room-extension{position:absolute;inset:0;pointer-events:none}
.extended-room{display:none}
[data-room-framing=extended] #wares .room-extension{inset:auto;left:50%;top:50%;width:max(100vw,177.6833vh);height:max(56.2799vw,100vh);transform:translate(-50%,-50%)}
[data-room-framing=extended] #wares .extended-room{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:fill}
[data-room-framing=extended] #wares #stage{width:72.3445%;height:72.306%;left:14.5335%;top:11.1583%;transform:none;mask:none;overflow:visible}
.framing-compare{position:absolute;left:42px;top:31px;z-index:15;padding:9px 13px;background:#fffffff2;border:1px solid #555;color:#222;box-shadow:2px 2px 0 #fff}
.framing-compare>span{font:8px/1.3 monospace;letter-spacing:.16em;display:block;margin-bottom:5px}
.framing-compare>div{display:flex;gap:15px}.framing-compare button{font:16px/1.3 IMFellEnglish,Georgia,serif;padding:1px 0;border-bottom:1px solid transparent}.framing-compare button[aria-pressed=true]{border-bottom-color:#222}
@media(max-width:700px){.framing-compare{left:25px;top:28px;padding:6px 8px}.framing-compare>span{font-size:7px}.framing-compare button{font-size:12px}.framing-compare>div{gap:9px}[data-room-framing=extended] #wares .room-extension{width:170vw;height:95.676vw;left:50%;top:25%;transform:translate(-50%,-50%)}}
/* Keep the whole character performance at one scale, anchored to the resting palm.
   The counter and background stay registered to the generated environment. */
[data-room-framing=extended] #wares :is(#foreground,#foreground-still,#jump-character,#jump-hand,#counter-contacts,#arrival-lines){
 scale:.76;
 transform-origin:28.11% 82.36%;
}

/* Feather the background joins, not the character's travel area. */
[data-room-framing=extended] #wares :is(#poster,#backgrounds,#shared-counter){mask-image:linear-gradient(to right,transparent,black 3%,black 97%,transparent),linear-gradient(to bottom,transparent,black 4%,black 94%,transparent);mask-composite:intersect}
.framing-compare .jump-review{margin-top:7px;display:block;font:12px/1.4 Georgia,serif}.jump-review summary{cursor:pointer}.jump-review .pose-buttons{display:flex;gap:8px;flex-wrap:wrap;max-width:210px;margin-top:6px}.framing-compare .pose-buttons button{font-size:12px}
.framing-compare .replay-jump{display:block;font-size:13px;margin-top:8px}
/* One counter surface: moving footage is restricted to the wall above it. */
[data-room-framing=extended] #wares :is(#poster,#backgrounds){mask-image:linear-gradient(to right,transparent,black 3%,black 97%,transparent),linear-gradient(to bottom,transparent,black 4%,black 69%,transparent 79%);mask-composite:intersect}
[data-room-framing=extended] #wares #shared-counter{mask:none}
/* Full-frame cat footage and its matching empty room. */
#wares .wide-cat-video{display:none;position:absolute;inset:0;width:100%;height:100%;object-fit:fill;filter:grayscale(1);pointer-events:none;opacity:0;transition:opacity .18s linear}
[data-room-framing=extended] #wares .wide-cat-video{display:block}
[data-room-framing=extended] #wares .wide-cat-video.active{opacity:1}
[data-room-framing=extended] #wares .wide-cat-ready :is(#poster,#backgrounds){visibility:hidden}
[data-room-framing=extended] #wares .extended-room{filter:grayscale(1)}
.reduced-motion #wares .wide-cat-video{transition:none}
#wares .small-cat-video{transition:opacity .4s ease}
#wares .small-cat-video.cat-incoming{z-index:1}
[data-room-framing=extended] #wares #stage{z-index:3}
#wares .cat-crest-lettering{display:none;position:absolute;inset:0;width:100%;height:100%;object-fit:fill;z-index:2;pointer-events:none;clip-path:inset(46.2% 43% 50.2% 47.5%);filter:grayscale(1)}
[data-room-framing=extended] #wares .cat-crest-lettering{display:block}
.reduced-motion #wares .small-cat-video{transition:none}

/* Continue only the front panels past the bottom edge. The tabletop and performance stay live. */
#wares .counter-extension{display:none;position:absolute;left:0;top:76.5%;width:100%;height:23.5%;z-index:6;overflow:hidden;pointer-events:none;mask-image:linear-gradient(to bottom,transparent,black 5%)}
[data-room-framing=extended] #wares .counter-extension{display:block}
#wares .counter-extension img{position:absolute;left:0;top:-325.532%;width:100%;height:425.532%;object-fit:fill;filter:grayscale(1)}
@media(max-width:700px){#wares .counter-extension{height:max(23.5%,calc(75vh - 25.354vw + 2px))}}

/* Keep review tools accessible without occupying the shop dialogue. */
#wares .framing-compare{top:auto;bottom:120px;left:30px;padding:7px 10px;max-width:235px}
#wares .framing-compare>summary{font:12px/1.4 IMFellEnglish,Georgia,serif;cursor:pointer}
#wares .framing-compare[open]>summary{margin-bottom:9px}
@media(max-width:700px){#wares .framing-compare{left:21px;bottom:112px;padding:5px 8px}}

/* Retire the outgoing frame immediately after the incoming fade. Otherwise its
   fade-out can rise above the new take when cat-incoming loses its z-index. */
#wares .small-cat-video:not(.active){transition:none}
