@font-face{font-family:Lora;src:url('assets/lora-regular.ttf') format('truetype');font-style:normal;font-weight:400 700;font-display:swap}
@font-face{font-family:Lora;src:url('assets/lora-italic.ttf') format('truetype');font-style:italic;font-weight:400 700;font-display:swap}
/* V2 pairs Lora's true regular and italic with the existing functional sans. */
.opening h1,.palette-heading,.statement-header h2,.room-editorial-heading h2,.discovery-header h2,.collection-title h2,.album-invitation,.album-description h2,.dialog-copy h2,.v2-tool-dialog h2{font-family:Lora,Georgia,serif;font-style:normal;font-weight:400;font-synthesis:none;letter-spacing:-.045em;line-height:1.08}
.opening h1 em,.palette-heading em,.statement-header h2 em,.room-editorial-heading h2 em,.discovery-header h2 em,.collection-title h2 em{font-style:italic;font-weight:400;letter-spacing:-.035em}
.masthead{display:flex;align-items:center;justify-content:initial;gap:8px;height:64px;padding:8px 12px;background:#fff;border-top:4px solid #ffc845;border-bottom:1px solid #e5e1da}
.v2-nav-icon{display:flex;align-items:center;justify-content:center;background:none;width:40px;height:44px;flex:none;padding:8px;color:#211913}
.v2-brand{display:block;margin-right:auto;flex:none}.v2-brand img{width:108px;height:auto;max-width:none}
.v2-nav-actions{display:flex;align-items:center;gap:2px}
.opening-type{padding:22px var(--page-gutter) 0}
.opening h1{font-size:clamp(52px,15.2vw,66px);line-height:.98;letter-spacing:-.055em;margin:0}
.hero-scene,.hero-opening-slot{margin-top:-10px}
.hero-caption{padding-top:13px;padding-bottom:19px;font-size:clamp(10px,2.85vw,12px);letter-spacing:.01em}
.palette-section{padding-top:24px}
.palette-heading{font-size:clamp(38px,10.5vw,47px);line-height:1.02}
.statement-header h2{font-size:clamp(41px,11.2vw,50px);line-height:1.02}
.room-editorial-heading h2,.discovery-header h2,.collection-title h2{font-size:clamp(32px,8.7vw,39px);line-height:1.08}
.room-editorial-heading .eyebrow{font-size:9px;letter-spacing:1.6px}
.room-editorial-caption strong{font-family:Lora,Georgia,serif;font-size:25px;font-weight:400;line-height:1.13;letter-spacing:-.025em;font-synthesis:none}
.room-editorial-caption strong em{font-style:italic}
.room-editorial-caption small{font-size:9px;letter-spacing:1.1px}
.room-editorial-notes{font-size:11px;line-height:1.6}
.album-invitation{font-size:25px;letter-spacing:-.035em}.album-description h2{font-size:36px}
.preview-bag-button{top:73px}
.environment-hint{position:absolute;right:0;bottom:calc(100% + 12px);width:228px;padding:13px 27px 13px 14px;border:1px solid #fff9;background:#faf7f0f5;color:#34261d;box-shadow:0 5px 25px #2d1b1224;border-radius:13px;pointer-events:auto;animation:hint-arrive .35s ease-in-out}
.environment-hint:after{content:'';position:absolute;bottom:-5px;right:65px;width:10px;height:10px;background:#faf7f0;transform:rotate(45deg)}
.environment-hint[hidden]{display:none}.environment-hint-open{display:flex;flex-direction:column;align-items:flex-start;gap:4px;text-align:left;background:none;padding:0;position:relative;z-index:1}
.environment-hint-open strong{font-family:Lora,Georgia,serif;font-size:17px;line-height:1.2;font-weight:400;letter-spacing:-.4px}
.environment-hint-open span{font-size:10px;line-height:1.6;color:#806c5c}
.environment-hint-close{position:absolute;right:4px;top:4px;background:none;width:28px;height:28px;font-size:20px;color:#806c5c}
.v2-tool-dialog{width:calc(100% - 32px);max-width:420px;max-height:82dvh;overflow:auto;border:0;border-radius:20px;padding:28px 24px;background:#fffbf4;color:#302018;font-family:Lexend,Arial,sans-serif}
.v2-tool-dialog::backdrop{background:#21191380;backdrop-filter:blur(5px)}
.v2-tool-close{position:absolute;right:10px;top:8px;width:40px;height:40px;background:none;font-size:26px}
.v2-tool-dialog h2{font-size:29px;line-height:1.2;margin:8px 0 24px;max-width:280px}.v2-tool-dialog p{font-size:13px;line-height:1.7;color:#806c5c}
.v2-tool-dialog label{display:block;font-size:12px;margin-bottom:9px}.v2-tool-dialog form>div{display:flex;gap:8px}
.v2-tool-dialog input{min-width:0;flex:1;border:1px solid #dacabb;border-radius:8px;background:#fff;padding:12px;font:inherit;font-size:12px}
.v2-tool-dialog button[type=submit]{background:#302018;color:#fff;padding:12px;border-radius:8px;font-size:12px}
.v2-saved-piece{display:flex;align-items:center;gap:14px;padding:14px 0;border-top:1px solid #e5d8c8;font-size:12px;line-height:1.6}.v2-saved-piece img{width:70px;border-radius:8px}.v2-saved-piece small{display:block;margin-top:4px}
@keyframes hint-arrive{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:350px){.masthead{gap:4px;padding-inline:7px}.v2-brand img{width:90px}.v2-nav-icon{width:36px}.v2-nav-actions{gap:0}.opening h1{font-size:50px}.room-editorial-caption strong{font-size:23px}}
@media(prefers-reduced-motion:reduce){.environment-hint{animation:none}}
/* Mobile PDP header dimensions, without the app banner or a separate surface. */
.masthead{height:52px;min-height:52px;padding:6px 16px;gap:12px;background:transparent;border:0;box-shadow:none}
.v2-brand{display:inline-flex;align-items:center;margin-right:0}
.v2-brand img{width:71.642px;height:16px}
.v2-nav-actions{gap:16px;margin-left:auto}
.v2-nav-icon{position:relative;display:inline-flex;flex:0 0 20px;width:20px;height:20px;min-width:20px;padding:0;line-height:0;overflow:visible}
.v2-nav-icon:before{content:'';position:absolute;inset:-12px}
.v2-nav-icon svg{display:block;flex:none;width:20px;height:20px}
#v2-cart svg{transform:scale(1.08);transform-origin:center}
/* Compact pocket navigation with the record player seated beside it. */
.bottom-dock{height:128px}
.bottom-dock .bottom-palette,.bottom-dock.tabs-visible .bottom-palette{left:14px;right:96px;bottom:max(14px,env(safe-area-inset-bottom));padding-top:25px;gap:8px;height:69px;align-items:end}
.bottom-palette .palette-button{padding:0;min-width:0;filter:drop-shadow(0 3px 3px #36221618)}
.bottom-palette .colour-label{position:relative;height:43px;font-size:12px;font-weight:400;border-radius:0;background:none;isolation:isolate;z-index:2;gap:0}
.bottom-palette .colour-label:before{content:'';position:absolute;inset:0;z-index:-1;border-radius:6px 6px 9px 9px;background-color:var(--pocket-colour);background-image:url('assets/wall-plaster.png');background-size:120px;background-blend-mode:multiply;border:1px solid #ffffff26;box-shadow:inset 0 1px 1px #fff3,inset 0 -2px 3px #0002;mask-image:radial-gradient(ellipse 30% 6px at 50% 0,transparent 97%,#000 100%);-webkit-mask-image:radial-gradient(ellipse 30% 6px at 50% 0,transparent 97%,#000 100%)}
.bottom-palette .active .colour-label:after{width:13px;height:13px;margin-left:5px;background-color:#fff4e6;border-radius:50%;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233c281e' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 4 4 10-10'/%3E%3C/svg%3E");background-size:9px;background-repeat:no-repeat;background-position:center}
.bottom-palette .selected-line{display:none}
.bottom-palette .palette-button .tiny-photos,.bottom-palette .palette-button.active .tiny-photos{width:43px;height:38px;left:calc(50% - 22px);bottom:29px;z-index:1}
.bottom-palette .palette-button .tiny-photos img,.bottom-palette .palette-button.active .tiny-photos img{width:30px;height:36px;border:2px solid #fff6e9}
.bottom-palette .palette-button .tiny-photos img:first-child{transform:translate(7px,8px) rotate(-4deg) scale(.88)}
.bottom-palette .palette-button.active .tiny-photos img:first-child{transform:translate(-1px,-1px) rotate(-10deg)}
.bottom-palette .palette-button .tiny-photos img:nth-child(2),.bottom-palette .palette-button.active .tiny-photos img:nth-child(2){left:17px;top:5px}
.bottom-palette .palette-button.active .tiny-photos img:nth-child(2){transform:translate(0,0) rotate(9deg)}
.bottom-dock .mini-player,.bottom-dock.tabs-visible .mini-player{right:13px;bottom:max(14px,env(safe-area-inset-bottom));width:70px;height:110px;padding:6px;gap:6px;display:flex;flex-direction:column;align-items:center;justify-content:space-between;border-radius:38px;transform:translateX(92px);opacity:0;transition:transform .5s ease-in-out,opacity .3s ease-in-out;overflow:visible}
.bottom-dock.visible .mini-player,.bottom-dock.visible.tabs-visible .mini-player{transform:translateX(0);opacity:1}
.bottom-dock .mini-player:before{content:'';position:absolute;bottom:5px;left:6px;width:56px;height:56px;border-radius:50%;background:#4f2b1a12;box-shadow:inset 0 1px 5px #30201825}
.bottom-dock .record-control{position:relative;order:2;display:flex;align-items:center;justify-content:center;width:56px;height:56px;min-width:56px;min-height:56px;z-index:2}
.bottom-dock .record{width:56px;height:56px;flex:none;animation:record-spin 16s linear infinite;animation-timing-function:linear!important;animation-play-state:running}
.bottom-dock .record-label{width:41px;height:41px}
.mini-player .sound-toggle{order:1;width:34px;height:34px;min-width:34px;min-height:34px;flex:none;background:#ffffff52;padding:8px;position:relative;z-index:2}
.bottom-dock.visible #record-control{animation:disc-seat .85s both;animation-timing-function:cubic-bezier(.22,1,.36,1)!important}
.bottom-dock:before,.bottom-dock.tabs-visible:before{height:128px}
.environment-hint:after{right:28px}
@keyframes disc-seat{0%{opacity:0;transform:translate(108px,-24px) rotate(22deg) scale(1.08)}55%{opacity:1;transform:translate(8px,-7px) rotate(5deg) scale(1.025)}76%{opacity:1;transform:translate(-4px,3px) rotate(-3deg) scale(.975)}90%{transform:translate(1px,-1px) rotate(.6deg) scale(1.005)}100%{opacity:1;transform:translate(0,0) rotate(0) scale(1)}}
@media(max-width:350px){.bottom-dock .bottom-palette,.bottom-dock.tabs-visible .bottom-palette{left:12px;right:90px;gap:6px}.bottom-dock .mini-player,.bottom-dock.tabs-visible .mini-player{right:11px;width:66px}.bottom-palette .colour-label{font-size:11px}.bottom-palette .active .colour-label:after{width:11px;height:11px;margin-left:3px}}
@media(prefers-reduced-motion:reduce){.bottom-dock.visible #record-control{animation:none!important}.bottom-dock .mini-player,.bottom-dock .bottom-palette{transition:none!important}.bottom-dock .record{animation:none!important}}
/* Lora uses the requested medium weight, in both true regular and italic styles. */
.opening h1,.palette-heading,.statement-header h2,.room-editorial-heading h2,.discovery-header h2,.collection-title h2,.album-invitation,.album-description h2,.dialog-copy h2,.v2-tool-dialog h2,.room-editorial-caption strong,.environment-hint-open strong{font-weight:500}
.opening h1 em,.palette-heading em,.statement-header h2 em,.room-editorial-heading h2 em,.discovery-header h2 em,.collection-title h2 em,.room-editorial-caption strong em{font-weight:500}
/* The room selector's vertical track ends with the photograph. */
.room-editorial-notes{display:none}
.room-editorial-layout{align-items:stretch}
.room-editorial-main{min-height:0}
.room-editorial-tabs{align-self:stretch;min-height:0;padding:14px 0;display:grid;grid-template-rows:repeat(3,minmax(0,1fr));align-items:center;justify-items:center}
.room-editorial-tabs button{min-height:0;max-height:100%;height:auto;padding:12px 10px;margin:0}

/* Colour controls respond quickly and decelerate into the selected state. */
.palette-button,.palette-button *,.palette-button:before,.palette-button:after,.palette-button *:before,.palette-button *:after{transition-timing-function:ease-out!important}

/* V3 opening: a small seasonal eyebrow and the two-line editorial headline. */
[data-version="v3"] .opening-type>.eyebrow{display:block;font-family:Lexend,sans-serif;font-size:11px;font-weight:400;line-height:1.4;letter-spacing:.12em;text-transform:none;margin:0 0 12px}
[data-version="v3"] .opening h1{font-size:clamp(48px,15.2vw,66px);line-height:1.02;letter-spacing:-.045em}
[data-version="v3"] .hero-scene:not(.fullscreen-opening),[data-version="v3"] .hero-opening-slot{margin-top:-18px}
[data-version="v3"] .opening h1{position:relative;z-index:2}
[data-version="v3"] .hero-scene.fullscreen-opening{margin:0;top:0}

/* V3: explicit shopping actions, with a high-contrast ivory button on every shelf. */
[data-version="v3"] .wardrobe-category-map .continuous-link{padding:0 3px;align-items:flex-end}
[data-version="v3"] .wardrobe-category-map .continuous-link>span{background:#fff9ef;color:#402318;border:1px solid #e7cfb6;border-radius:24px;min-height:34px;padding:5px 7px;font-size:clamp(8px,2.45vw,11px);font-weight:500;white-space:nowrap;gap:4px;box-shadow:0 2px 4px #301b1833;backdrop-filter:none;-webkit-backdrop-filter:none}
[data-version="v3"] .shop-category-arrow{display:flex;align-items:center;justify-content:center;border:1px solid #875339;border-radius:50%;width:18px;height:18px;flex:0 0 18px;font-weight:400}
[data-version="v3"] .wardrobe-category-map .continuous-link:hover>span{background:#fff;color:#402318;transform:translateY(-2px)}
[data-version="v3"] .wardrobe-category-map .continuous-link:active>span{transform:translateY(1px)}
[data-version="v3"] .wardrobe-category-map .continuous-link:focus-visible>span{outline:2px solid #fff;outline-offset:3px}

/* Pairing media is a clean film slot; finishing touches scroll to the page edge. */
[data-version="v3"] .detail-scene>span{display:none}
[data-version="v3"] .detail-scene{cursor:default}
[data-version="v3"] .detail-scene:hover>img{transform:none}
[data-version="v3"] .finds-track{width:calc(100% + var(--page-gutter));max-width:none;margin-right:calc(-1 * var(--page-gutter));padding-right:var(--page-gutter)}

/* Dark frosted player, preserving its blur, placement and record motion. */
.bottom-dock .mini-player,.bottom-dock.tabs-visible .mini-player{background:rgba(22,19,18,.74);color:#fff8ef;border-color:#ffffff2e;box-shadow:0 5px 20px #0003;backdrop-filter:blur(18px) saturate(1.2);-webkit-backdrop-filter:blur(18px) saturate(1.2)}
.bottom-dock .mini-player .sound-toggle{background:#ffffff12;color:#fff8ef;border:1px solid #ffffff16}
.bottom-dock .mini-player:before{background:#0003;box-shadow:inset 0 1px 5px #0005}
/* Only inactive photo previews shrink; selected pairs retain their full size. */
#main-palette .palette-button:not(.active) .tiny-photos img:first-child{transform-origin:50% 100%;transform:translate(9px,8px) rotate(-4deg) scale(.65)}
.bottom-palette .palette-button:not(.active) .tiny-photos img:first-child{transform-origin:50% 100%;transform:translate(7px,8px) rotate(-4deg) scale(.65)}

/* Category buttons: subtle top corners, rounded lower corners. */
[data-version="v3"] .wardrobe-category-map .continuous-link>span{border-radius:6px 6px 12px 12px}

/* Rust's supplied wardrobe has taller upper shelves. */
:root[data-theme=rust] .wardrobe-category-map{inset:0 3% 1.5%;grid-template-rows:41% 29% 30%}
