/* Closet layout: the pole and hangers share the same scrolling coordinate space. */
.rail-window{--garment-width:clamp(220px,21vw,300px);--garment-height:calc(var(--garment-width)*1.5);--rail-pitch:clamp(108px,11vw,155px);--rail-y:48px;display:flex;align-items:center;min-height:calc(var(--garment-height) + 90px);padding:0;isolation:isolate}
.rail-track{position:relative;display:flex;align-items:flex-start;justify-content:center;gap:0;width:max-content;min-width:100%;height:auto;flex-shrink:0;padding:var(--rail-y) calc((var(--garment-width) - var(--rail-pitch))/2 + 36px) 30px;perspective:none;transform-style:flat}
.rail-track>.clothes-rail{position:absolute;top:var(--rail-y);left:25px;right:25px;width:auto;height:5px;background:linear-gradient(180deg,#b3b0a5 0%,#f4f2e9 30%,#b5b1a4 55%,#77766d 100%);border:1px solid #99978a;border-radius:3px;z-index:0;box-shadow:0 7px 7px #29261614}
.rail-track>.clothes-rail:before,.rail-track>.clothes-rail:after{width:7px;height:18px;top:-8px;border:1px solid #aaa79c;border-radius:2px;background:linear-gradient(90deg,#d0ccbd,#f5f2e7 45%,#a5a195);box-shadow:1px 1px 2px #0002}
.rail-track>.clothes-rail:before{left:-2px}.rail-track>.clothes-rail:after{right:-2px}
.rail-track>.rail-piece,.rail-track>.rail-piece:nth-child(n){display:block;position:relative;width:var(--rail-pitch);min-width:var(--rail-pitch);height:var(--garment-height);margin:0;flex:0 0 var(--rail-pitch);transform:none;perspective:none;will-change:auto;transition:none;transform-origin:50% 0;z-index:1;color:var(--ink);-webkit-user-drag:none}
.rail-track>.rail-piece:hover,.rail-track>.rail-piece:focus-visible{transform:none;z-index:4}
.rail-piece .rail-face{position:absolute;left:50%;width:var(--garment-width);max-width:none;height:var(--garment-height);object-fit:contain;transform:translateX(-50%);filter:drop-shadow(12px 15px 6px #29261620);pointer-events:none;display:block;transition:opacity .38s ease;animation:none}
.rail-piece .rail-front{top:calc(-1 * var(--front-hook-y,.045) * var(--garment-height));opacity:1}
.rail-piece .rail-back{top:calc(-1 * var(--back-hook-y,.045) * var(--garment-height));opacity:0}
.rail-track>.rail-piece:hover img,.rail-track>.rail-piece:focus-visible img{filter:drop-shadow(12px 15px 6px #29261620)}
@media(hover:hover){.rail-piece.has-back:hover .rail-front{opacity:0}.rail-piece.has-back:hover .rail-back{opacity:1}}
.rail-piece.has-back:focus-visible .rail-front{opacity:0}.rail-piece.has-back:focus-visible .rail-back{opacity:1}
.rail-piece .piece-tag{bottom:-5px;left:50%;font-size:8px;min-width:160px;justify-content:center;white-space:nowrap;transform:translate(-50%,5px);opacity:0;z-index:8}
.rail-piece:hover .piece-tag,.rail-piece:focus-visible .piece-tag{opacity:1;transform:translate(-50%,0)}
.nino-colour-options{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 8px}
.nino-colour-options button{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);padding:9px 12px;min-height:38px;font-size:10px;transition:border-color .2s,background .2s}
.nino-colour-options button:before{content:"";width:13px;height:13px;flex-shrink:0;border-radius:50%;background:var(--swatch,#999);border:1px solid #0002;box-shadow:inset 0 0 0 1px #fff2}
.nino-colour-options button.is-active{border-color:var(--ink);background:color-mix(in srgb,var(--ink) 5%,transparent)}
.nino-colour-options button:disabled{opacity:.3;text-decoration:line-through}
.woocommerce-product-gallery{position:relative}.nino-gallery-transition{position:absolute;inset:0;z-index:7;pointer-events:none;overflow:hidden;background:transparent;opacity:1}
.nino-gallery-transition img{width:100%;height:100%;object-fit:contain;display:block}
.nino-gallery-transition.is-fading{opacity:0;transition:opacity .44s cubic-bezier(.2,.65,.2,1)}
.woocommerce-product-gallery__image img{transition:opacity .3s ease}
@media(max-width:760px){.rail-window{--garment-width:228px;--rail-pitch:112px;--rail-y:38px;min-height:425px}.rail-track{padding-left:78px;padding-right:78px;justify-content:flex-start}.rail-track>.clothes-rail{left:24px;right:24px}.rail-piece .piece-tag{font-size:7px;min-width:125px;bottom:0}.browse-hint{max-width:170px;text-align:center}.rail-bottom{padding-top:10px}}
@media(max-width:370px){.rail-window{--garment-width:216px;--rail-pitch:104px}.rail-track{padding-left:72px;padding-right:72px}}
@media(prefers-reduced-motion:reduce){.rail-piece .rail-face,.nino-gallery-transition.is-fading{transition:none}}