#village-interior.is-shop-counter{--counter-width:min(100%,1020px,calc((100svh - 170px)*1.7768));padding-block:18px;scroll-margin:0;min-height:100svh;display:flex;flex-direction:column;justify-content:center}
#village-interior.is-shop-counter>header{width:var(--counter-width);max-width:none}
#village-interior.is-shop-counter>.interior-slot{width:100%}
.shop-counter{width:var(--counter-width);margin:0 auto;color:#e9e4d1}
.shop-counter-pan{position:relative;overflow:hidden;aspect-ratio:1672/941;border:1px solid #8e794a70;border-radius:9px;box-shadow:0 12px 40px #0005}
.shop-counter-scene{position:absolute;top:0;left:50%;height:100%;min-width:100%;aspect-ratio:1672/941;transform:translateX(-50%);isolation:isolate}
.shop-counter-art{display:block;width:100%;height:100%;object-fit:contain}
.shop-counter-shelf{position:absolute;background:none;border:1px solid transparent;border-radius:5px;cursor:pointer;color:#eee0bb;padding:0;min-height:44px;min-width:44px}
.shop-counter-shelf[data-shop-display=coloring]{left:32%;top:36%;width:28%;height:16%}
.shop-counter-shelf[data-shop-display=paintings]{left:32%;top:52%;width:28%;height:13%}
.shop-counter-shelf[data-shop-display=counter]{left:60%;top:42%;width:16%;height:24%}
.shop-counter-shelf span{position:absolute;bottom:100%;left:50%;transform:translateX(-50%);white-space:nowrap;padding:5px 10px;background:#17251fed;border:1px solid #b6a06e;border-radius:4px;font:14px/1.4 var(--sans);opacity:0;pointer-events:none}
.shop-counter-shelf:hover,.shop-counter-shelf:focus-visible{background:#ffe4a41a;border-color:#ecd39c;box-shadow:0 0 24px #d5bd6333}
.shop-counter-shelf:hover span,.shop-counter-shelf:focus-visible span{opacity:1}
.shop-counter-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;padding:12px 0 0}
.shop-counter-actions button{font:15px/1.4 var(--sans);min-height:44px;padding:8px 16px;border:1px solid #a28e5e55;background:#29382c;color:#e9e4d1;border-radius:5px;cursor:pointer}
.shop-counter button:focus-visible{outline:2px solid #f3dfaa;outline-offset:3px}
.shop-counter:not(.calm) .shop-counter-pan{animation:shop-counter-arrival .65s cubic-bezier(.2,.65,.25,1) both}
@keyframes shop-counter-arrival{from{opacity:.4;transform:scale(.97)}to{opacity:1;transform:scale(1)}}
#rotwood-shell .approaching-shop .viewport{overflow:hidden;pointer-events:none}
#rotwood-shell .approaching-shop #rotwood-canvas{transform-origin:25% 60%;transform:scale(1.45);opacity:.15;transition:transform .55s ease-in,opacity .55s ease-in}
@media(max-width:760px){
  #village-interior.is-shop-counter{--counter-width:min(100%,calc((100svh - 180px)*1.08))}
  .shop-counter-pan{aspect-ratio:1.08}
  .shop-counter-actions{gap:7px;padding-top:10px}
  .shop-counter-actions button{font-size:13px;padding:8px 11px}
}
@media(prefers-reduced-motion:reduce){.shop-counter .shop-counter-pan{animation:none!important}#rotwood-shell .approaching-shop #rotwood-canvas{transition:none}}
