/* Material samples connect the protection motif to the real packing sequence. */
.work-experience .work-object {background:radial-gradient(ellipse at 40% 22%,#fafaf6,#eceee9 85%)}
.work-object .object-label {color:#615e50;letter-spacing:.065em}
.work-object .scene-caption {color:#676356}
.work-object .assembly-sequence {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:22px 5% 0;padding:0;list-style:none}
.work-object .assembly-sequence li {min-width:0;border:0;border-top:1px solid #c8c2b3;padding:0;position:relative}
.work-object .assembly-sequence li::before {content:"";position:absolute;top:-1px;left:0;right:0;height:1px;background:#975a3a;transform:scaleX(0);transform-origin:left;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.work-object .assembly-sequence li[data-state=current]::before,.work-object .assembly-sequence li[data-state=complete]::before {transform:scaleX(1)}
.work-object .assembly-sequence button {display:grid;grid-template-columns:24px minmax(0,1fr);grid-template-rows:auto auto;column-gap:10px;row-gap:2px;align-content:center;width:100%;min-height:74px;padding:12px 0;border:0;white-space:normal;line-height:1.35;transition:color .2s}
.work-object .assembly-sequence button:is(:hover,[aria-pressed=true]) {color:#975a3a;border:0}
.work-object .assembly-sequence .layer-number {grid-column:2;grid-row:1;font-size:11px;line-height:1.3;letter-spacing:.035em;font-variant-numeric:tabular-nums;color:#787465}
.work-object .assembly-sequence .layer-name {grid-column:2;grid-row:2;font-size:14px;line-height:1.3;letter-spacing:-.018em;color:inherit}
.layer-swatch {grid-column:1;grid-row:1/3;align-self:center;display:block;width:22px;height:28px;position:relative;transform:skewY(-5deg);border:1px solid #a88c66;background:#c9b08a;transition:transform .3s}
[data-inspect-layer="0"] .layer-swatch {background:linear-gradient(90deg,#c4a77a 0 46%,#dbc5a1 46% 55%,#ccb38e 55%)}
[data-inspect-layer="0"] .layer-swatch::after {content:"";position:absolute;bottom:-3px;left:-1px;right:-1px;height:3px;background:repeating-linear-gradient(90deg,#8f7553 0 1px,#e3d0ad 1px 3px);border:1px solid #ac936c}
[data-inspect-layer="1"] .layer-swatch {background:radial-gradient(#aba99b 0 .5px,transparent .6px) 0 0 / 3px 3px,#e7e6da;border-color:#c5c4b4;border-right:3px solid #cfcebd;border-bottom:3px solid #d8d7c7}
[data-inspect-layer="2"] .layer-swatch {background:repeating-linear-gradient(90deg,transparent 0 5px,#a4885433 5px 6px),linear-gradient(100deg,#d5bd8d,#c9ac77);border-color:#b79c6a;border-right:3px solid #ac8e57;border-bottom:3px solid #bf9e62}
.assembly-sequence button:is(:hover,[aria-pressed=true]) .layer-swatch {transform:skewY(-5deg) translateY(-2px)}
.work-object .object-end {border-top:1px solid #c8c2b366;margin:0 5%;padding:14px 0 20px;align-items:center;gap:16px}
.work-object .object-end .object-disclosure {padding:0;margin:0;font-size:12px;line-height:1.6}
.work-object .object-end .assembly-replay {margin:0;font-size:12px;min-height:44px;flex:none}
.work-object .assembly-note {margin:0 5% 20px;min-height:3.3em;font-size:14px;line-height:1.6;color:#676356}
@media(max-width:700px){
 .work-object .assembly-sequence {display:flex;flex-wrap:wrap;gap:12px;margin-top:18px}
 .work-object .assembly-sequence li {flex:1 1 0;min-width:max-content}
 .work-object .assembly-sequence button {grid-template-columns:1fr;grid-template-rows:28px auto auto;row-gap:5px;min-height:104px;align-content:start;padding:12px 0}
 .work-object .assembly-sequence .layer-swatch {grid-column:1;grid-row:1;width:19px;height:24px}
 .work-object .assembly-sequence .layer-number {grid-column:1;grid-row:2;font-size:11px}
 .work-object .assembly-sequence .layer-name {grid-column:1;grid-row:3;font-size:14px;white-space:nowrap}
 .work-object .object-end {flex-wrap:wrap;padding-bottom:16px;gap:0 14px}
 .work-object .object-end .object-disclosure {font-size:12px}
 .work-object .assembly-note {font-size:14px}
}
@media(prefers-reduced-motion:reduce){.work-object .assembly-sequence li::before,.layer-swatch{transition:none}.assembly-sequence button:is(:hover,[aria-pressed=true]) .layer-swatch{transform:skewY(-5deg)}}

/* A close-up is intentional and reversible; the whole canvas remains tappable. */
.work-object[data-detail=true] .scene-trigger>span{background:#f7f8f3;padding:10px 14px;border:1px solid #b8bdb2;gap:18px;min-height:44px}
.work-object .scene-trigger>span{background:#f2f4eeeb;min-height:44px;padding:10px 0}
.work-object .scene-caption{font-size:13px;line-height:1.5}
.work-object .assembly-note{font-size:15px;line-height:1.6;max-width:48ch;color:#4e534a}
.work-object .assembly-sequence button[aria-pressed=true]{color:#8e452f}
.work-object .assembly-sequence button:focus-visible{outline:2px solid #a34d33;outline-offset:4px}
[data-inspect-layer="2"] .layer-swatch{background:repeating-linear-gradient(90deg,transparent 0 7px,#a488541f 7px 8px),linear-gradient(100deg,#e8ddc8,#d8c7a9);border-color:#bfae8f;border-right-color:#bfae8f;border-bottom-color:#cfbe9f}
@media(max-width:700px){.work-object .assembly-note{font-size:14px;min-height:4.8em}.work-object .scene-caption{font-size:12px}.work-object[data-detail=true] .object-label{font-size:10px;letter-spacing:.025em;gap:10px}}

/* A neutral studio field lets the real material edges carry the detail. */
.work-object .work-visual{background:radial-gradient(ellipse at 35% 20%,#f9f8f3 0%,#e7e5dc 100%)}
