:root{--paper:#f6f5f1;--ink:#1a2218;--acid:#c0fa45}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:var(--paper);font:12px Arial,"Hiragino Kaku Gothic ProN",sans-serif;overflow-x:hidden}button,a{-webkit-tap-highlight-color:transparent;color:inherit}button{font:inherit;cursor:pointer}a{text-decoration:none}button{border:0;background:none}button:focus-visible,a:focus-visible{outline:2px solid #497833;outline-offset:6px}header{height:100px;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;position:relative;z-index:100;font-weight:600;font-size:11px;letter-spacing:.06em}.brand{position:absolute;left:50%;transform:translateX(-50%);width:160px}.brand img{width:100%;display:block;mix-blend-mode:multiply}header button{padding:12px 0}#closeFocus{margin-left:auto}main{width:100%;overflow:clip;min-height:calc(100svh - 140px);display:flex;flex-direction:column;align-items:center}.rack-scene{width:min(1050px,100%);height:clamp(375px,44vh,405px);position:relative;perspective:1600px;perspective-origin:50% 20px;margin-top:5vh;touch-action:pan-y;user-select:none}.rail{position:absolute;top:17px;left:9%;width:82%;height:11px;border-radius:7px;background:linear-gradient(#fdfdfc 0%,#818680 26%,#d0d2ca 42%,#f7f6ed 55%,#777c75 78%,#b4b8b1);box-shadow:0 7px 8px #292d2422,0 0 1px #444;transition:opacity .4s}.rail i{position:absolute;width:9px;height:36px;top:-16px;left:4%;background:linear-gradient(90deg,#777,#eee,#999);border-radius:8px;transform:skewY(-25deg);z-index:-1;box-shadow:4px 6px 8px #0002}.rail i+ i{left:auto;right:4%}#rack{position:absolute;inset:0;transform-style:preserve-3d}.item{position:absolute;left:50%;top:0;width:340px;height:340px;margin-left:-170px;padding:0;transform-origin:50% 17px;transform-style:preserve-3d;transition:transform 1s cubic-bezier(.18,.75,.2,1),filter 1s,opacity .6s;will-change:transform;outline-offset:0}.item img{width:100%;height:100%;object-fit:contain;object-position:50% 0%;pointer-events:none;filter:drop-shadow(9px 12px 7px #24251d23)}.item.is-active img{filter:drop-shadow(13px 17px 10px #24251d26)}.arrow{position:absolute;top:46%;border:1px solid #73796c;border-radius:50%;font:28px Georgia;width:36px;height:36px;line-height:25px;z-index:50;transition:background .2s}.arrow:hover{background:#e4e6dc}.prev{left:3%}.next{right:3%}.selection{text-align:center;position:relative;z-index:60;min-height:205px;padding:4px 20px 60px}.eyebrow{font-size:9px;letter-spacing:.18em;opacity:.5;margin:0 0 11px}h1{font-size:15px;margin:0;font-weight:600;line-height:1.5}#colorName{font-size:10px;letter-spacing:.1em;margin:7px 0 10px}#colors{display:flex;justify-content:center;gap:10px;min-height:26px;margin-bottom:9px}.swatch{width:16px;height:16px;border-radius:50%;border:2px solid var(--paper);outline:1px solid #b5b6ac;padding:0;background:var(--swatch)}.swatch[aria-pressed=true]{outline:1.5px solid #1d2519;outline-offset:2px}#discover,#availability{display:inline-flex;border:1px solid #535d4b;border-radius:30px;padding:10px 22px;font-size:9px;letter-spacing:.08em;gap:22px;align-items:center}#availability{display:none}.gesture{font-size:8px;letter-spacing:.14em;opacity:.45;margin-top:22px}.views{display:none;justify-content:center;margin:0 auto 18px;border:1px solid #7d8475;border-radius:25px;width:max-content;padding:3px;gap:3px}.views button{font-size:9px;letter-spacing:.07em;padding:7px 19px;border-radius:20px}.views button[aria-pressed=true]{background:#283521;color:white}.views button:disabled{opacity:.3;cursor:default}footer{position:fixed;bottom:0;width:100%;height:34px;display:flex;align-items:center;overflow:hidden;background:var(--acid);z-index:120;border-top:1px solid #0001}footer div{white-space:nowrap;font-size:15px;font-weight:800;letter-spacing:.045em;animation:ticker 34s linear infinite}@keyframes ticker{to{transform:translateX(-50%)}}body.focus .rail{opacity:0}body.focus .rack-scene{margin-top:0;height:clamp(390px,55vh,480px)}body.focus .item{width:420px;height:420px;margin-left:-210px}body.focus .selection{padding-top:0}body.focus .views{display:flex}body.focus #discover,body.focus .gesture,body.focus .eyebrow{display:none}body.focus #availability{display:inline-flex}body.focus h1{font-size:17px}dialog{border:0;background:var(--paper);max-width:460px;padding:65px 45px;line-height:2}dialog::backdrop{background:#20271e77;backdrop-filter:blur(6px)}dialog img{width:190px;mix-blend-mode:multiply}dialog h2{font-size:22px}.close{position:absolute;right:20px;top:15px;font-size:27px}dialog a{display:inline-block;border-bottom:1px solid;margin-top:20px} [hidden]{display:none!important}@media(max-width:650px){header{height:88px;padding:0 23px;font-size:9px}.brand{width:125px}.rack-scene{margin-top:6vh;height:335px;perspective:1000px}.rail{left:-18%;width:136%;top:15px;height:8px}.rail i{display:none}.item{width:290px;height:290px;margin-left:-145px;transform-origin:50% 15px}.arrow{width:29px;height:29px;font-size:23px;top:45%;background:#f6f5f188}.prev{left:16px}.next{right:16px}.selection{padding-bottom:60px}h1{font-size:13px}body.focus .rack-scene{height:365px;margin-top:2vh}body.focus .item{height:330px;width:330px;margin-left:-165px}body.focus h1{font-size:14px}footer{height:30px}footer div{font-size:13px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* Dedicated photographed side profiles: no horizontal squeezing or perspective flattening. */
.item img{position:absolute;inset:0;transition:opacity .32s ease;backface-visibility:visible}.item .front-image{opacity:0}.item .side-image{opacity:1}.item.is-active .front-image{opacity:1}.item.is-active .side-image{opacity:0}
:root{--sprite-size:340px}.focus{--sprite-size:420px}.item,.focus .item{width:60px;height:var(--sprite-size);margin-left:-30px}.item.is-active,.focus .item.is-active{width:calc(var(--sprite-size) * .82);margin-left:calc(var(--sprite-size) * -.41)}.item img{inset:auto;top:0;left:50%;width:var(--sprite-size);height:var(--sprite-size);margin-left:calc(var(--sprite-size) / -2)}@media(max-width:650px){:root{--sprite-size:290px}.focus{--sprite-size:330px}}

body.focus{background:#fff}.focus .item img{filter:none}.focus .rack-scene{margin-top:0}.focus #photoCaption{font-size:10px;color:#687060;margin:9px 0 14px}.focus .selection{padding-bottom:70px}.focus .views{margin-bottom:10px}#galleryThumbs{display:none}.focus #galleryThumbs{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin:0 auto 20px}.gallery-thumb{width:68px;padding:4px;border:1px solid #d7d9d1;border-radius:5px;background:white}.gallery-thumb[aria-pressed=true]{border-color:#263421}.gallery-thumb img{width:58px;height:58px;object-fit:contain}.gallery-thumb span{display:block;font-size:9px;margin:3px 0}#photoZoom{position:fixed;inset:0;width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;padding:50px 15px 20px;background:white}#photoZoom img{width:100%;height:100%;object-fit:contain;mix-blend-mode:normal}#closeZoom{position:absolute;right:25px;top:18px;font-size:12px;letter-spacing:.08em;padding:10px}.focus .item.is-active{cursor:zoom-in}@media(max-width:650px){.focus .rack-scene{height:340px}.gallery-thumb{width:57px}.gallery-thumb img{width:47px;height:47px}.focus .selection{padding-top:0}.focus #galleryThumbs{gap:7px}.focus h1{max-width:320px}}
/* Keep the product gallery controls visible on ordinary laptop screens. */
.focus{--sprite-size:min(420px,42vh)}.focus header{height:80px}.focus .rack-scene{height:calc(var(--sprite-size) + 12px);margin-top:0}.focus .selection{padding:0 20px 55px;min-height:0}.focus #colorName{margin:5px 0 8px}.focus #colors{min-height:22px;margin-bottom:7px}.focus .views{margin:0 auto 8px;padding:2px}.focus .views button{padding:5px 16px}.focus #photoCaption{margin:6px 0 9px;font-size:9px}.focus #galleryThumbs{margin:0 auto 12px}.gallery-thumb{width:56px;padding:3px}.gallery-thumb img{width:48px;height:48px}.gallery-thumb span{font-size:8px;margin:2px 0}.focus #availability{padding:8px 18px}@media(max-width:650px){.focus{--sprite-size:min(330px,38vh)}.gallery-thumb{width:56px}.gallery-thumb img{width:48px;height:48px}.focus .rack-scene{height:calc(var(--sprite-size) + 12px)}}
body.focus .rack-scene{height:calc(var(--sprite-size) + 12px);margin-top:0}

/* Flat hit targets stay above the rail; the artwork alone turns in three dimensions. */
.rack-scene{perspective:none}#rack,.item{transform-style:flat}.item{touch-action:pan-y;isolation:isolate}.rail{pointer-events:none}.item .back-image{opacity:0}.item.is-active.is-back .front-image{opacity:0}.item.is-active.is-back .back-image{opacity:1}.item.is-active.is-back .side-image{opacity:0}.item.turning img{transition:none}.views{display:flex}.item .back-image{backface-visibility:hidden}.focus .back-image{display:none}.gesture{max-width:400px;line-height:1.8}.swatch{min-width:22px;min-height:22px}.item:not(.is-active){cursor:pointer}
/* The rail and tap surface span every visible hanger, including a 16-item collection. */
.rack-scene{width:100%;max-width:none}.rail{left:2%;width:96%}

/* Never crossfade two garment silhouettes, including during color changes. */
.item img{transition:none}

/* Horizontal rack navigation, with a visible position handle for mouse and keyboard. */
.rack-scene{cursor:grab}.rack-scene.is-dragging,.rack-scene.is-dragging .item{cursor:grabbing}.rack-scroll{width:min(240px,60vw);margin:-22px auto 22px;position:relative;z-index:65}.rack-scroll input{display:block;width:100%;height:24px;margin:0;accent-color:#394431;cursor:ew-resize;touch-action:pan-y}.focus .rack-scroll{display:none}.rack-scroll input:focus-visible{outline:2px solid #497833;outline-offset:4px}@media(max-width:650px){.rack-scroll{margin:-20px auto 18px;width:180px}}

/* Trousers keep their full vertical drape on clip hangers; shorts remain shorter. */
.item.is-pants{--sprite-size:430px}.item.is-pants.is-shorts{--sprite-size:300px}body.has-pants:not(.has-shorts):not(.focus) .rack-scene{height:460px}body.no-styling:not(.focus) #availability{display:inline-flex}.focus .item.is-pants{--sprite-size:min(420px,42vh)}@media(max-width:650px){.item.is-pants{--sprite-size:360px}.item.is-pants.is-shorts{--sprite-size:270px}body.has-pants:not(.has-shorts):not(.focus) .rack-scene{height:390px}.focus .item.is-pants{--sprite-size:min(330px,38vh)}}

.rack-scene.is-dragging .item{transition:none}
