/* A square catalog detail, opened only on request. */
#heroImages .material-toggle{
 position:absolute;z-index:9;right:clamp(28px,4.15vw,80px);bottom:108px;
 display:inline-flex;align-items:center;gap:16px;min-height:44px;padding:0 4px;
 border:0;background:transparent;color:#fff;cursor:pointer;
 font:400 11px/1.4 Inter,sans-serif;letter-spacing:.045em;
 text-shadow:0 1px 8px rgba(0,0,0,.5);transition:opacity 220ms ease;
}
#heroImages .material-toggle[hidden]{display:none;}
#heroImages .material-toggle>span:first-child{border-bottom:1px solid rgba(255,255,255,.65);padding-bottom:5px;}
#heroImages .material-toggle-mark{font:300 22px/1 Inter,sans-serif;transition:transform 220ms ease;}
#heroImages.is-material-open .material-toggle-mark{transform:rotate(45deg);}
#heroImages .material-toggle:hover{opacity:.75;}
#heroImages .material-toggle:focus-visible,
#heroImages .material-panel-close:focus-visible,
#heroImages .material-product-link:focus-visible{outline:1px solid currentColor;outline-offset:4px;}
#heroImages .material-panel{
 position:absolute;z-index:8;left:clamp(28px,4.15vw,80px);top:136px;
 width:clamp(192px,16vw,240px);margin:0;background:#f3eee6;color:#2a211a;
 box-shadow:0 10px 36px rgba(0,0,0,.14);opacity:0;visibility:hidden;
 transform:translateY(6px);pointer-events:none;
 transition:opacity 280ms ease,transform 380ms cubic-bezier(.22,1,.36,1),visibility 0s 280ms;
}
#heroImages.is-material-open .material-panel{
 opacity:1;visibility:visible;transform:none;pointer-events:auto;transition-delay:0s;
}
#heroImages .material-panel-image{
 display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;
}
#heroImages .material-panel-close{
 position:absolute;right:4px;top:4px;z-index:1;width:40px;height:40px;
 display:grid;place-items:center;border:0;background:rgba(243,238,230,.88);color:#2a211a;cursor:pointer;
}
#heroImages .material-product-link{
 display:flex;align-items:center;justify-content:space-between;gap:16px;
 min-height:44px;padding:10px 13px;color:inherit;text-decoration:none;
 font:400 10px/1.4 Inter,sans-serif;letter-spacing:.1em;
}
#heroImages .material-product-id{border-bottom:1px solid rgba(42,33,26,.45);padding-bottom:2px;}
#heroImages .material-product-link:hover .material-product-id{border-color:currentColor;}
@media(max-width:767px){
 #heroImages .material-toggle{top:104px;right:24px;bottom:auto;font-size:10px;gap:12px;}
 #heroImages .material-panel{left:24px;top:108px;width:clamp(116px,calc(100svh - 452px),176px);}
 #heroImages.is-material-open .material-toggle{opacity:0;visibility:hidden;pointer-events:none;}
}
@media(max-height:540px) and (orientation:landscape){
 #heroImages .material-toggle{top:96px;right:24px;bottom:auto;}
 #heroImages .material-panel{top:96px;left:24px;width:132px;}
 #heroImages.is-material-open .hero-image-caption{opacity:0;}
}

/* Hover previews the change; applying it remains an explicit, persistent action. */
html body #compare .tm-room .tm-room-paper{
 opacity:0;transition:opacity 600ms cubic-bezier(.22,1,.36,1)!important;
}
html body #compare .tm-room.is-installed .tm-room-paper{opacity:1;}
html body #compare .tm-room.has-keyboard-preview:not(.is-installed) .tm-room-paper{opacity:.34;}
html body #compare .tm-room-btn{min-width:44px!important;min-height:44px!important;}
html body #compare .tm-room-btn::after{
 content:'Apply wallpaper';position:absolute;left:calc(100% + 12px);top:50%;
 transform:translateY(-50%);padding:7px 9px;white-space:nowrap;pointer-events:none;
 color:#3d2f22;background:rgba(243,238,230,.9);border-radius:2px;
 font:400 10px/1.3 Inter,sans-serif;letter-spacing:.05em;
 opacity:0;transition:opacity 240ms ease;
}
html body #compare .tm-room.has-keyboard-preview:not(.is-installed) .tm-room-btn::after{opacity:1;}
@media(min-width:768px){
 html body #compare .tm-set .tm-room:last-child .tm-room-btn::after{left:auto;right:calc(100% + 12px);}
}
@media(hover:hover) and (pointer:fine){
 html body #compare .tm-room:not(.is-installed):hover .tm-room-paper{opacity:.34;}
 html body #compare .tm-room:not(.is-installed):hover .tm-room-btn::after{opacity:1;}
}
@media(hover:none){
 html body #compare .tm-room:not(.is-installed) .tm-room-btn::after{content:'Tap to apply';opacity:1;}
}
@media(prefers-reduced-motion:reduce){
 #heroImages .material-panel,#heroImages .material-toggle,
 html body #compare .tm-room .tm-room-paper,
 html body #compare .tm-room-btn::after{transition:none!important;}
}