/* The hardware uses metallic shading; the garments are the approved RGBA cutouts. */
.rail-page #collection{padding:0;overflow:hidden}
.rail-stage{height:clamp(430px,49vh,550px);margin:8px auto 0;width:min(1360px,100%);isolation:isolate}
.rack-hardware{position:absolute;inset:0 7%;pointer-events:none}
.rack-topbar{position:absolute;left:0;right:0;top:35px;height:13px;border-radius:8px;background:linear-gradient(#59615c 0%,#f6f7f3 22%,#e2e6df 40%,#8b938b 53%,#bfc7be 70%,#5c655d 100%);box-shadow:0 2px 2px #23332633,inset 0 1px 1px #fff} /* taste-skill-ignore: metallic rack highlights and garment contact shadows are part of the requested physical scene. */
.rack-upright{position:absolute;top:41px;bottom:30px;width:12px;background:linear-gradient(90deg,#5d675e,#f2f4ed 30%,#cad1c6 49%,#778173 76%,#454f44);border-radius:3px;box-shadow:4px 3px 5px #2d3b2720} /* taste-skill-ignore: metallic rack highlights and garment contact shadows are part of the requested physical scene. */
.rack-upright.left{left:1px}.rack-upright.right{right:1px}
.rack-foot{position:absolute;bottom:20px;width:104px;height:11px;border-radius:5px;background:linear-gradient(#d8ded2,#fafcf6 25%,#7e8978 60%,#4c5747);transform:rotate(-17deg);box-shadow:2px 9px 8px #1c2e2527} /* taste-skill-ignore: metallic rack highlights and garment contact shadows are part of the requested physical scene. */
.rack-foot.left{left:-37px}.rack-foot.right{right:-38px}
.rack-foot:before,.rack-foot:after{content:'';position:absolute;width:11px;height:13px;background:#454b43;border-radius:3px;top:-1px}.rack-foot:before{left:0}.rack-foot:after{right:0}
.rack-collar{position:absolute;bottom:130px;width:17px;height:22px;border-radius:3px;background:linear-gradient(90deg,#464c41,#929c88 45%,#353e31);box-shadow:0 1px 2px #0003} /* taste-skill-ignore: metallic rack highlights and garment contact shadows are part of the requested physical scene. */
.rack-collar.left{left:-1px}.rack-collar.right{right:-1px}
.rack-floor-shadow{position:absolute;bottom:0;left:-3%;right:-3%;height:34px;border-radius:50%;background:#34402b14;filter:blur(10px)}
.clothing-rail{width:84%;height:calc(100% - 70px);top:18px;perspective:1400px;perspective-origin:50% 35%;touch-action:pan-y;cursor:grab;user-select:none;-webkit-user-select:none;overflow:visible}
.clothing-rail.is-dragging,.clothing-rail.is-dragging *{cursor:grabbing!important}
.rack-item{position:absolute;top:0;left:50%;width:290px;height:100%;padding:0;border:0;background:transparent;transform-origin:50% 22px;will-change:transform;touch-action:pan-y;cursor:grab;outline-offset:6px}
.rack-item:focus-visible{outline:2px solid var(--accent);border-radius:10px}
.hanger-assembly{position:absolute;inset:0;transform-origin:50% 22px;will-change:transform;pointer-events:none;filter:drop-shadow(5px 8px 5px #18281c22);transform:translateY(0) rotateY(0);transition:transform 320ms cubic-bezier(.22,.68,.3,1)} /* taste-skill-ignore: metallic rack highlights and garment contact shadows are part of the requested physical scene. */
.rack-item.is-hovered .hanger-assembly{transform:translateY(-6px) rotateY(var(--peek-turn,0deg))}
@media(prefers-reduced-motion:reduce){.hanger-assembly{transition:none}.rack-item.is-hovered .hanger-assembly{transform:none}}
.hanger-art{position:absolute;top:0;width:74%;height:125px;left:13%;overflow:visible}
.rack-item:not(.is-bottom) .hanger-art{width:var(--hoodie-hanger-width,52%);left:50%;transform:translateX(-50%)}
.hanger-hook{fill:none;stroke:#747e71;stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round}
.hanger-highlight{fill:none;stroke:#fafbf4;stroke-width:.9;stroke-linecap:round;opacity:.9}
.hanger-wood{fill:#ae7950;stroke:#785335;stroke-width:1.1}
.hanger-grain{fill:none;stroke:#deb88b;stroke-width:1;opacity:.6}
.hanger-clip{fill:#7d8778;stroke:#444d40;stroke-width:1}
.garment-cutout{position:absolute;left:50%;top:44px;transform:translateX(-50%);overflow:hidden;pointer-events:none}
.garment-cutout img{position:absolute;max-width:none;object-fit:fill;user-select:none;-webkit-user-drag:none;pointer-events:none}
.rack-item.is-bottom .hanger-art{height:90px;top:0}
.rack-item.is-bottom .garment-cutout{top:69px}
.rack-item.is-active .hanger-assembly{filter:drop-shadow(8px 14px 8px #18281c2b)} /* taste-skill-ignore: metallic rack highlights and garment contact shadows are part of the requested physical scene. */
.rail-arrow{background:#eaece5c9;top:44%;border-color:#7b87755c}
.rail-arrow.prev{left:1.5%}.rail-arrow.next{right:1.5%}
.rack-hint{text-align:center;font-size:12px;color:var(--muted);margin:2px 0 0;letter-spacing:.01em}
.rail-caption{margin-top:13px}.rail-caption h2{font-size:24px}.rail-caption>button{margin-top:5px}
.rail-bottom{padding-top:12px;padding-bottom:14px}
.rail-page .rail-room{min-height:calc(100svh - 160px)}
.rail-page .rack-motion-toggle{border:0;background:transparent;text-decoration:underline;text-underline-offset:4px;font-size:12px;padding:7px}
@media(min-width:1600px){.rail-stage{height:530px}}
@media(max-width:900px){.rail-stage{height:440px}.rack-hardware{left:8%;right:8%}.rack-item{width:260px}.clothing-rail{width:83%}}
@media(max-width:600px){
 .rail-stage{height:365px;margin-top:4px;width:100%}.rack-hardware{inset:0 8%}.rack-topbar{height:10px;top:34px}.rack-upright{width:9px;bottom:27px}.rack-upright.right{right:0}.rack-foot{width:60px;height:9px;bottom:20px}.rack-foot.left{left:-20px}.rack-foot.right{right:-21px}.rack-collar{width:12px;height:17px;bottom:100px}.rack-collar.right{right:-1px}.clothing-rail{width:80%;top:18px;height:calc(100% - 60px)}.rack-item{width:230px}.rack-hint{font-size:11px;margin-top:0}.rail-caption{margin-top:9px}.rail-caption h2{font-size:21px}.rail-caption>span{font-size:11px}.rail-caption>button{padding:5px 0}.rail-bottom{padding:10px 12px}.rail-page .rail-room{min-height:0}.rail-arrow{width:34px;height:34px;top:42%}.rail-arrow.prev{left:7px}.rail-arrow.next{right:7px}
}
@media(prefers-reduced-motion:reduce){.rack-item,.hanger-assembly{will-change:auto}.clothing-rail{scroll-behavior:auto}}

.touch-hint{display:none}
.rail-page .swipe-hint{text-align:center;font-size:12px;color:var(--muted);margin-top:8px}
.rail-page #detail-image{touch-action:pan-y;cursor:grab;user-select:none;transform-origin:center}
.rail-page #detail-image img{-webkit-user-drag:none;pointer-events:none}
@media(hover:none),(pointer:coarse){.pointer-hint{display:none}.touch-hint{display:inline}}
