/* A photographed room is the fixed coordinate plane for the product choreography. */
.composition{height:390svh;background:#f5f4f1}.composition-sticky{height:100svh;min-height:780px;background:#f5f4f1;overflow:hidden}
.composition-heading{top:4.5%;left:6%;right:6%;text-align:center}.composition-heading h2{font-size:clamp(38px,4.15vw,66px);margin:13px 0 9px;line-height:1.05}.composition-heading>p:last-child{font-size:16px}.composition-heading>.eyebrow{font-size:12px}
.story-picker{top:22%;left:5%;right:5%;gap:10px}.story-picker button{font-size:14px;border-color:#85817b;color:#282725;padding:10px 19px}.story-picker button[aria-pressed=true]{background:#282725;border-color:#282725;color:#f5f4f1}
#shelf-stories.room-story{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:0;position:absolute;inset:29% 4% 11%;max-width:none;margin:0;isolation:isolate}
.room-viewport{position:relative;flex:1;width:100%;min-height:0;display:grid;place-items:center;overflow:hidden;container-type:size}
.room-scene{position:relative;width:min(100%,calc(100cqh * 1.5));aspect-ratio:3/2;transform-origin:50% 66%;isolation:isolate;box-shadow:0 12px 36px #26252320}
.room-backdrop{display:block;width:100%;height:100%;object-fit:contain}.room-objects{position:absolute;inset:0;pointer-events:none}.room-box{position:absolute;display:block;min-width:0;border:0;border-radius:0;padding:0;margin:0;background:none;transform-origin:center bottom;pointer-events:auto;cursor:pointer;filter:drop-shadow(0 3px 2px #26252355)}
.room-box-front{display:block;position:absolute;inset:0;overflow:hidden}.room-box-front>img{position:absolute;display:block;max-width:none;object-fit:fill;pointer-events:none;user-select:none;mix-blend-mode:normal}
.room-box:focus-visible{outline:2px solid #f5f4f1;outline-offset:4px}.room-box.is-placed:hover{filter:drop-shadow(0 3px 2px #26252355) brightness(1.07)}
.room-box::after{content:attr(data-sku);position:absolute;bottom:calc(100% + 5px);left:50%;transform:translateX(-50%) translateY(4px);padding:4px 7px;background:#282725;color:#f5f4f1;font:12px/1.2 var(--sans);white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}.room-box.is-placed:hover::after,.room-box:focus-visible::after{opacity:1;transform:translateX(-50%) translateY(0)}
.room-linen{position:absolute;z-index:25;pointer-events:none;transform-origin:center bottom}.room-linen>img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.linen-folded{opacity:0}
.room-story-info{display:flex;justify-content:space-between;align-items:center;gap:25px;width:min(100%,1000px);padding-top:14px;min-height:42px}.room-story-caption{font-size:14px;line-height:1.5;color:#57544f}.room-build{font-size:14px;gap:25px;white-space:nowrap;padding-bottom:7px;background:transparent;border:0;border-bottom:1px solid #85817b;color:#282725}.room-build>span{font-size:20px}
.composition-bottom{bottom:3%;left:6%;right:6%;color:#282725}.composition-bottom .composition-phase{font-size:14px}.story-replay{font-size:14px}.box-counter{font-size:36px}.box-counter small{font-size:13px}
@media(min-width:761px) and (max-height:800px){.composition-sticky{min-height:690px}.composition-heading{top:3%}.composition-heading h2{font-size:42px}.story-picker{top:22%}#shelf-stories.room-story{inset:30% 5% 12%}}
@media(max-width:760px){.composition{height:340svh}.composition-sticky{min-height:690px}.composition-heading{top:5%;left:6%;right:6%}.composition-heading h2{font-size:clamp(35px,9vw,48px);line-height:1.02;margin:13px 0}.composition-heading h2 em{display:inline}.composition-heading>.eyebrow{font-size:12px;line-height:1.5}.composition-heading>p:last-child{font-size:14px;max-width:310px}.story-picker{top:24%;left:4%;right:4%;gap:6px;flex-wrap:wrap}.story-picker button{font-size:12px;padding:10px 12px;line-height:1.2;white-space:nowrap}.story-picker button:last-child{font-size:12px}#shelf-stories.room-story{inset:32% 0 13%;max-width:none}.room-viewport{width:100%;overflow:hidden}.room-scene{width:100%;box-shadow:none}.room-story-info{padding:12px 6% 0;gap:12px;flex-wrap:wrap;justify-content:center;text-align:center}.room-story-caption{font-size:13px;width:100%;line-height:1.4}.room-build{font-size:14px}.composition-bottom{bottom:3.5%;gap:15px;align-items:center}.composition-bottom .composition-phase{font-size:12px!important;max-width:115px}.story-replay{font-size:12px;max-width:120px;gap:8px}.box-counter{font-size:29px}.box-counter small{font-size:12px}.room-box::after{font-size:14px}}
@media(max-width:370px){.story-picker{gap:5px;left:2%;right:2%}.story-picker button{font-size:12px;padding:9px 8px}.composition-heading h2{font-size:34px}.composition-bottom{left:4%;right:4%;gap:8px}}
@media(prefers-reduced-motion:reduce){.composition,.composition-sticky{height:900px;min-height:0}.room-scene,.room-box,.room-linen{transform:none!important}.room-box{opacity:1!important}.linen-loose{opacity:0!important}.linen-folded{opacity:1!important}}
body.motion-off .composition,body.motion-off .composition-sticky{height:900px;min-height:0}body.motion-off .room-scene,body.motion-off .room-box,body.motion-off .room-linen{transform:none!important}body.motion-off .room-box{opacity:1!important}body.motion-off .linen-loose{opacity:0!important}body.motion-off .linen-folded{opacity:1!important}
/* Keep the fixed navigation clear, with the scene larger than the editorial sidebar. */
.composition-sticky{display:grid;grid-template-columns:minmax(220px,25%) minmax(0,1fr);grid-template-rows:1fr 1fr auto;gap:22px 5%;padding:106px 5% 28px}
.composition-heading{position:relative;grid-column:1;grid-row:1;top:auto;left:auto;right:auto;align-self:end;width:100%;text-align:left;z-index:3}
.composition-heading h2{font-size:clamp(38px,4.4vw,66px);line-height:1.04;margin:15px 0}.composition-heading h2 em{display:block}.composition-heading>p:last-child{max-width:250px;font-size:15px}
.story-picker{position:relative;grid-column:1;grid-row:2;top:auto;left:auto;right:auto;align-self:start;align-items:flex-start;justify-content:flex-start;flex-direction:column;gap:9px;padding-top:8px}.story-picker button{text-align:left;min-height:42px}
#shelf-stories.room-story{position:relative;grid-column:2;grid-row:1/3;inset:auto;min-height:0;height:100%;width:100%;margin:0;max-width:none}
.room-story-info{gap:15px;flex-wrap:wrap;justify-content:space-between}.room-story-caption{font-size:13px}.room-build{font-size:14px}
.composition-bottom{position:relative;grid-column:1/-1;grid-row:3;inset:auto;min-height:42px;align-self:end}
@media(max-width:960px){.composition-sticky{grid-template-columns:1fr;grid-template-rows:auto auto minmax(0,1fr) auto;gap:15px;padding:95px 4% 25px;min-height:740px}.composition-heading{grid-column:1;grid-row:1;text-align:center;align-self:auto;inset:auto}.composition-heading h2{font-size:clamp(34px,6vw,48px);line-height:1.04;margin:10px 0}.composition-heading h2 em{display:inline}.composition-heading>p:last-child{font-size:14px;max-width:none}.composition-heading>.eyebrow{font-size:11px}.story-picker{grid-column:1;grid-row:2;flex-direction:row;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px;padding:0;inset:auto}.story-picker button{font-size:12px;padding:10px 12px;min-height:40px}#shelf-stories.room-story{grid-column:1;grid-row:3;inset:auto;min-height:0}.room-story-info{justify-content:center;text-align:center;padding:12px 3% 0;gap:8px}.room-story-caption{width:100%;font-size:13px}.room-viewport{overflow:hidden}.room-scene{width:min(100%,calc(100cqh * 1.5));max-width:none}.composition-bottom{grid-column:1;grid-row:4;inset:auto}.composition-bottom .composition-phase{font-size:12px!important}.story-replay{font-size:12px}.box-counter{font-size:30px}}
@media(max-width:370px){.composition-sticky{padding-inline:3%;gap:12px}.story-picker button{font-size:12px;padding:9px}.composition-heading h2{font-size:33px}.composition-heading>.eyebrow{font-size:10px}}
