/* Doors and drawers occupy one piece of furniture throughout the reveal. */
.workshop .cabinet-shell{position:relative;width:min(1120px,calc(100% - 28px),calc((100svh - 242px)*1.5));aspect-ratio:3/2;margin:0 auto;isolation:isolate;perspective:1800px}
.cabinet-shell>.compact-cabinet{width:100%;margin:0;transition:filter 1.3s ease}
.cabinet-shell:not(.cabinet-open)>.compact-cabinet{filter:brightness(.48)}
.workshop .cabinet-shell>.cabinet-doors{position:absolute;inset:0;width:100%;height:100%;min-width:0;min-height:0;max-width:none;max-height:none;aspect-ratio:auto;margin:0;perspective:1500px;z-index:3;border-radius:12px;outline:none;cursor:pointer}
.workshop .cabinet-doors[hidden]{display:none}
.workshop .cabinet-doors:before{inset:0;border:3px solid #57432c;border-radius:12px;box-shadow:inset 0 0 0 1px #b9986355,0 15px 35px #0007;z-index:4;opacity:1;transition:opacity .7s;pointer-events:none}
.workshop .cabinet-doors:after{display:none}
.workshop .cabinet-doors .door{height:100%;width:50%;border:0;background:#2d1a0f;background-image:none;overflow:hidden;backface-visibility:hidden;transition:transform 1.35s cubic-bezier(.4,0,.45,1),box-shadow 1.35s}
.workshop .cabinet-doors .door-left{border-radius:12px 0 0 12px;transform-origin:left center}
.workshop .cabinet-doors .door-right{border-radius:0 12px 12px 0;transform-origin:right center}
.workshop .cabinet-doors .door-art{position:absolute;top:0;left:0;width:200%;max-width:none;height:100%;object-fit:cover;object-position:center;pointer-events:none;user-select:none}
.workshop .cabinet-doors .door-right .door-art{left:-100%}
.workshop .cabinet-doors.is-opening .door-left{transform:rotateY(-103deg);box-shadow:inset -8px 0 15px #0006}
.workshop .cabinet-doors.is-opening .door-right{transform:rotateY(103deg);box-shadow:inset 8px 0 15px #0006}
.workshop .cabinet-doors.is-opening:before{opacity:0}
.workshop .cabinet-doors:focus-visible{outline:2px solid #e4c590;outline-offset:6px}
.cabinet-skip{display:inline-block;margin-left:15px;text-decoration:underline;text-underline-offset:4px;font-size:11px}
.workshop .cabinet-hint{min-height:25px}
@media(max-width:720px){.cabinet-shell{perspective:1000px}.workshop .cabinet-shell>.cabinet-doors{perspective:1000px}.cabinet-skip{display:block;margin:7px 0 0}.workshop .cabinet-hint{min-height:45px}}
.motion-off .cabinet-doors *,.motion-off .cabinet-doors:before,.motion-off .cabinet-shell>.compact-cabinet{transition:none!important}
@media(prefers-reduced-motion:reduce){.cabinet-doors *,.cabinet-doors:before,.cabinet-shell>.compact-cabinet{transition:none!important}}

/* The frame stays with the furniture when its two leaves swing open. */
.workshop .cabinet-shell:before{content:'';position:absolute;inset:-13px;border:15px solid #68522e;border-image:url('cabinet-door-wide.webp') 27 stretch;box-shadow:0 16px 38px #0008,inset 0 0 12px #040509;pointer-events:none;z-index:5}
.workshop .cabinet-shell>.compact-cabinet{height:100%;padding:16px;gap:14px;grid-template-rows:repeat(3,minmax(0,1fr));grid-template-columns:repeat(2,minmax(0,1fr));border-radius:0;background:linear-gradient(90deg,#20160f,#2d1a0f 50%,#20160f);box-shadow:inset 0 0 16px #000b}
.workshop .cabinet-shell .cabinet-drawer{aspect-ratio:auto;height:100%;min-height:0;border-radius:8px;background-size:100% 100%}
.workshop .cabinet-shell .cabinet-drawer>summary{padding:clamp(12px,1.5vw,20px) 12px 48px}
.workshop .cabinet-shell .drawer-label{width:76%;max-width:360px;min-height:54px;padding:7px 10px 9px}
.workshop .cabinet-shell .drawer-label .drawer-title{font-size:clamp(30px,2.7vw,40px)}
.workshop .cabinet-shell .drawer-label .drawer-category{font-size:8px}
.workshop .cabinet-shell .drawer-index{font-size:15px;bottom:13px;left:18px}
.workshop .cabinet-shell>.cabinet-doors{border-radius:0}
.workshop .cabinet-doors:before{display:none}
.workshop .cabinet-doors .door-left,.workshop .cabinet-doors .door-right{border-radius:0}
.workshop .cabinet-doors .door-art{object-fit:cover}
.workshop .workbench{width:min(1240px,94%);padding-top:14px}
.workshop .cabinet-heading{margin-bottom:22px}
.workshop .cabinet-hint{margin-top:23px}
@media(min-width:721px) and (max-width:1120px){.workshop .cabinet-shell{width:min(940px,calc(100% - 28px),calc((100svh - 275px)*1.5))}}
@media(max-width:720px){
 .workshop .cabinet-shell{width:calc(100% - 28px);aspect-ratio:4/5}
 .workshop .cabinet-shell>.compact-cabinet{padding:10px;gap:9px}
 .workshop .cabinet-shell .cabinet-drawer{border-radius:7px;background-size:auto 100%}
 .workshop .cabinet-shell .cabinet-drawer>summary{padding:13px 6px 43px}
 .workshop .cabinet-shell .drawer-label{width:96%;padding:6px 3px;min-height:46px}
 .workshop .cabinet-shell .drawer-label .drawer-title{font-size:24px}
 .workshop .cabinet-shell .drawer-label .drawer-category{font-size:6.5px}
 .workshop .cabinet-shell .drawer-index{font-size:12px;left:10px;bottom:10px}
 .workshop .workbench{width:94%;padding-top:10px}
}
@media(min-width:721px) and (max-height:650px){.workshop .cabinet-shell{width:min(820px,calc(100% - 28px));min-height:390px}}
