/* XENIX gallery: scoped to the storefront; BONUS and account components retain their layout. */
#skin-gallery{position:relative;height:1000px;overflow:hidden;isolation:isolate;margin:0 calc(50% - 50vw);background:#101210}
.gallery-wall{position:absolute;left:50%;top:-115px;width:1700px;transform:translateX(-50%) rotate(-7deg);display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:16px;align-items:start}
.gallery-column{display:flex;flex-direction:column;gap:16px;will-change:transform}
.gallery-tile{display:block;position:relative;width:100%;padding:0;border:1px solid #ffffff20;border-radius:5px;background:#24262b;overflow:hidden;aspect-ratio:var(--gallery-ratio,1);box-shadow:0 12px 30px #0005;transition:transform .4s,box-shadow .4s;color:white;text-align:left;cursor:pointer}
.gallery-tile>img{display:block;width:100%;height:100%;object-fit:contain;object-position:center}
.gallery-tile.gallery-featured{transform:scale(1.12);z-index:2;border-color:#c0a97766;box-shadow:0 25px 60px #0009}
.gallery-tile:hover,.gallery-tile:focus-visible{transform:scale(1.2) rotate(7deg);z-index:4;box-shadow:0 25px 65px #000c}
.gallery-caption{position:absolute;inset:auto 0 0;padding:35px 12px 12px;background:linear-gradient(transparent,#000e);opacity:0;transition:opacity .25s;pointer-events:none}
.gallery-featured .gallery-caption,.gallery-tile:hover .gallery-caption,.gallery-tile:focus-visible .gallery-caption{opacity:1}
.gallery-caption small{display:block;font-size:7px;letter-spacing:1.6px;color:#d4cdbf}.gallery-caption strong{display:block;font-family:Georgia,'Noto Sans Thai',serif;font-size:17px;font-weight:400;line-height:1.15;margin:5px 0;overflow-wrap:anywhere}.gallery-price{font-size:10px;color:#efd3a0}.gallery-image-fallback{display:grid;place-items:center;height:100%;padding:15px;font-size:11px;color:#b8b5ac}
.gallery-veil{position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,#101210 0%,#101210e6 17%,transparent 70%),linear-gradient(90deg,#0003,transparent 60%)}
.gallery-copy{position:absolute;bottom:90px;left:max(7%,calc((100vw - 1230px)/2));right:max(7%,calc((100vw - 1230px)/2));pointer-events:none;text-shadow:0 4px 20px #0005}.gallery-copy .eyebrow{font-size:10px;letter-spacing:4px;color:#d7c18c}.gallery-copy h1{font-family:Georgia,'Noto Sans Thai',serif;font-weight:400;font-size:clamp(46px,7vw,100px);line-height:1.2;letter-spacing:-2px;color:#f1f0e8;margin:20px 0 28px}.gallery-copy h1>span:last-child{color:#d7c18c;font-style:italic}.gallery-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;color:#c3c5ba;font-size:12px}.gallery-bottom .button{pointer-events:auto;border-radius:30px;background:#161914d9;border-color:#a69a6e66;color:#e8dbc1;white-space:nowrap}
.gallery-motion{position:absolute;top:20px;right:24px;z-index:5;border:1px solid #e1d1a577;border-radius:50%;width:40px;height:40px;background:#161914db;color:#eddcba;cursor:pointer}.gallery-status{position:absolute;top:35%;left:0;right:0;text-align:center;font-size:12px;color:#c5c2b8;pointer-events:none}.gallery-mark{position:absolute;bottom:27px;right:7%;font-size:8px;letter-spacing:3px;color:#a5a593;pointer-events:none}
body:has(#cdk.is-active){background:#101210}body:has(#cdk.is-active)>header{background:#151811ed;border-bottom-color:#d4c69933}#cdk>.section-title{margin-top:45px}.cdk-card{transition:box-shadow .25s}.cdk-card:hover{box-shadow:0 12px 35px #0004}
@media(min-width:1700px){.gallery-wall{width:2100px}}
@media(max-width:760px){#skin-gallery{height:760px}.gallery-wall{width:930px;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;top:-75px}.gallery-column{gap:10px}.gallery-copy{left:6%;right:6%;bottom:70px}.gallery-copy h1{font-size:clamp(39px,9vw,64px);letter-spacing:-1px}.gallery-copy .eyebrow{font-size:8px;letter-spacing:2.5px}.gallery-bottom{font-size:10px;gap:12px}.gallery-bottom .button{font-size:10px;min-height:40px;padding:10px 14px}.gallery-caption{padding:25px 7px 8px}.gallery-caption strong{font-size:12px}.gallery-caption small{font-size:6px;letter-spacing:1px}.gallery-price{font-size:8px}.gallery-motion{right:14px;top:14px;width:34px;height:34px}.gallery-mark{font-size:6px;letter-spacing:1.8px}.gallery-tile:hover{transform:scale(1.08)}#cdk>.section-title{margin-top:28px}}
@media(prefers-reduced-motion:reduce){.gallery-column{will-change:auto}.gallery-tile,.gallery-caption{transition:none}.gallery-tile:hover,.gallery-tile:focus-visible{transform:none}}

/* Keep the full-bleed wall inside the viewport scrollbar boundary. */
body{overflow-x:clip}
.gallery-copy h1>span:first-child{color:#f1f0e8}

/* Slow horizontal drift, separate from the wall's rotation and scroll depth. */
.gallery-wall{animation:gallery-drift 24s ease-in-out infinite alternate;animation-play-state:paused;will-change:translate}
.gallery-wall.gallery-drifting{animation-play-state:running}
@keyframes gallery-drift{from{translate:-130px 0}to{translate:130px 0}}
@media(max-width:760px){@keyframes gallery-drift{from{translate:-90px 0}to{translate:90px 0}}}
@media(prefers-reduced-motion:reduce){.gallery-wall{animation:none;translate:none;will-change:auto}}

.gallery-wall{min-width:calc(100vw + 440px)}
