/* Mira Denim (store 7) — «Примерьте образ». Only transform/opacity animate. */
.look-stage{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 330px;grid-template-rows:auto 1fr auto;gap:0 28px;
 height:760px;padding:84px 32px 22px;background:linear-gradient(180deg,#f4f2ee 0%,#efece7 70%,#e9e5de 100%);color:#231f1a;overflow:hidden;isolation:isolate;contain:layout paint;user-select:none;-webkit-user-select:none}
.look-head{grid-column:1;grid-row:1}
.look-head h3{margin:0;font:400 clamp(28px,2.6vw,38px)/1.1 Georgia,serif;letter-spacing:-.02em}
.look-head p{margin:8px 0 0;font-size:12px;color:#857b6f}
.look-scene{position:relative;grid-column:1;grid-row:2;min-height:0;touch-action:pan-y;outline-offset:-4px;cursor:grab}
.is-dragging .look-scene{cursor:grabbing}
.look-scene:focus-visible{outline:2px solid #b08a52}
.look-floor{position:absolute;left:-10%;right:-10%;bottom:0;height:16%;background:radial-gradient(60% 100% at 50% 100%,#e1dcd3,transparent 70%);pointer-events:none}
#shopView .look-fig{position:absolute;display:block;padding:0;border:0;background:none;cursor:inherit;will-change:transform,opacity;-webkit-tap-highlight-color:transparent;transition:none}
.look-fig:active:not(:disabled){transform:none}
.look-img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:bottom;pointer-events:none;-webkit-user-drag:none}
.look-shadow{position:absolute;left:var(--cx,50%);bottom:-7px;width:62%;height:22px;margin-left:-31%;border-radius:50%;background:radial-gradient(closest-side,#2b241a3d,transparent);pointer-events:none}
.look-cursor{position:absolute;z-index:200;left:0;top:0;width:78px;height:78px;margin:-39px 0 0 -39px;border-radius:50%;display:grid;place-items:center;
 border:1px solid #231f1a33;background:#fbfaf7cc;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:#231f1a;font-size:10px;letter-spacing:.14em;text-transform:uppercase;
 pointer-events:none;opacity:0;scale:.6;transition:opacity 180ms ease,scale 220ms cubic-bezier(.22,1,.36,1)}
.look-cursor[data-mode=prev] span,.look-cursor[data-mode=next] span{font-size:18px;letter-spacing:0}
.has-cursor .look-cursor[data-mode=view],.has-cursor .look-cursor[data-mode=prev],.has-cursor .look-cursor[data-mode=next]{opacity:1;scale:1}
.has-cursor .look-cursor[data-mode=idle]{opacity:.9;scale:.16}
@media (hover:hover) and (pointer:fine){.has-cursor .look-scene{cursor:none}}
.look-foot{grid-column:1;grid-row:3;display:grid;grid-template-columns:minmax(0,260px) 1fr auto;align-items:center;gap:18px;padding-top:14px}
.look-progress{display:flex;gap:6px}
.look-progress span{position:relative;flex:1;height:2px;background:#231f1a1f;overflow:hidden}
.look-progress span::after{content:"";position:absolute;inset:0;background:#231f1a;transform-origin:0 50%;transform:scaleX(var(--fill,0))}
.look-counter{margin:0;font-size:12px;color:#6f665a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.look-counter b{color:#231f1a;font-weight:400}
.look-navs{display:flex;gap:8px}
#shopView .look-nav{width:44px;height:44px;border-radius:50%;border:1px solid #231f1a2e;background:transparent;color:#231f1a;display:grid;place-items:center;padding:0}
.look-nav svg{width:20px;height:20px}
.look-panel{grid-column:2;grid-row:1/4;display:flex;flex-direction:column;min-height:0;padding:6px 0 0 26px;border-left:1px solid #231f1a1a}
.look-panel-head{display:flex;align-items:baseline;justify-content:space-between;padding-bottom:12px;border-bottom:1px solid #231f1a1a}
.look-panel-head h4{margin:0;font:400 20px/1.2 Georgia,serif}
.look-count{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#857b6f}
.look-list{list-style:none;margin:0;padding:0;flex:1;min-height:0;overflow:auto;scrollbar-width:none}
.look-list::-webkit-scrollbar{display:none}
.look-item{display:grid;grid-template-columns:84px 16px minmax(0,1fr) 34px;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid #231f1a14;border-radius:4px}
.look-thumb{display:block;width:84px;height:84px;background:#e8e4dd;border-radius:3px;overflow:hidden}
.look-thumb img{display:block;width:100%;height:100%;object-fit:contain;padding:7px;box-sizing:border-box}
.look-no{align-self:start;padding-top:6px;font-size:10px;color:#9a9083}
.look-text{display:grid;gap:3px;min-width:0}
.look-cat{font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:#9a9083}
.look-name{font-size:14px;line-height:1.3}
.look-price{font-size:13px;color:#4e463c}
#shopView .look-add{width:34px;height:34px;border-radius:50%;border:1px solid #231f1a2e;background:transparent;color:#231f1a;font-size:18px;line-height:1;padding:0}
.look-total{display:flex;justify-content:space-between;align-items:end;gap:12px;padding:14px 0 12px}
.look-total>div:first-child{display:grid;gap:2px}.look-total strong{font-weight:400;font-size:14px}
.look-total>div:first-child span{font-size:11px;color:#857b6f}
.look-total-price{display:grid;justify-items:end;gap:2px}.look-total-price s{font-size:12px;color:#9a9083}.look-total-price strong{font-size:18px}
#shopView .look-add-all{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:50px;padding:0 18px;border:0;border-radius:2px;background:#231f1a;color:#f6f1e9;font-size:13px}
.look-add-all svg{width:20px;height:20px}
.look-note{margin:10px 0 0;font-size:11px;line-height:1.5;color:#857b6f}
@media (hover:hover) and (pointer:fine){#shopView .look-nav:hover,#shopView .look-add:hover{background:#231f1a;color:#f6f1e9}#shopView .look-add-all:hover{background:#3a332b}}
@media(max-width:900px){
 .look-stage{grid-template-columns:1fr;grid-template-rows:auto 470px auto auto;height:auto;padding:84px 0 26px}
 .look-head,.look-foot{padding-left:20px;padding-right:20px}
 .look-foot{grid-template-columns:1fr auto;grid-template-rows:auto auto;gap:10px 14px}
 .look-progress{grid-column:1/-1}
 .look-panel{grid-column:1;grid-row:4;border-left:0;border-top:1px solid #231f1a1a;margin:18px 20px 0;padding:18px 0 0}
 .look-list{overflow:visible}
}
@media(max-height:560px) and (min-width:701px){.look-stage{height:520px;grid-template-columns:minmax(0,1fr) 290px}.look-item{grid-template-columns:60px 14px minmax(0,1fr) 32px;padding:8px 0}.look-thumb{width:60px;height:60px}}
@media(prefers-reduced-motion:reduce){.look-cursor{transition:none}}
/* rows open the piece; the + button stays on top */
.look-item{position:relative}
#shopView .look-open{position:absolute;inset:0;z-index:0;width:100%;border:0;background:transparent;padding:0;border-radius:4px;cursor:pointer}
.look-item>:not(.look-open){position:relative;z-index:1;pointer-events:none}
#shopView .look-item>.look-add{pointer-events:auto}
@media (hover:hover) and (pointer:fine){#shopView .look-open:hover{background:#231f1a08}}
