/* The same 2⅓-card filmstrip proportions as the homepage, scoped to this page. */
.website-selected{--website-work-gutter:clamp(24px,5vw,100px);overflow:hidden}
.website-work-track{--website-work-gap:26px;--website-work-card-width:calc((100% + var(--website-work-gutter) - var(--website-work-gap)*2)*3/7);display:flex;align-items:flex-start;gap:var(--website-work-gap);overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-left:var(--website-work-gutter);padding:0 var(--website-work-gutter) 8px;scrollbar-width:none;cursor:grab;touch-action:pan-x pan-y}
.website-work-track::-webkit-scrollbar{display:none}
.website-work-track:focus-visible{outline:1px solid #78a4ff;outline-offset:-1px}
.website-work-track.is-dragging{cursor:grabbing;scroll-snap-type:none;user-select:none;scroll-behavior:auto}
.website-work-track>.website-project{flex:0 0 var(--website-work-card-width);min-width:0;scroll-snap-align:start}
.website-work-track .website-project>div{aspect-ratio:1.85;padding:clamp(16px,1.6vw,28px)}
.website-work-track .website-project img{user-select:none;pointer-events:none}
.website-work-track.is-dragging img{transform:none}
.website-work-track .website-project figcaption{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin:0;padding:22px 0 12px}
.website-work-track .website-project h3{font-size:23px;line-height:1.25}
.website-work-track .website-project figcaption p{font-size:11px;text-align:right;margin:0;max-width:none}
.website-work-controls{display:flex;align-items:center;gap:32px;padding-top:30px}
.website-work-controls[hidden]{display:none}
.website-work-count{font-size:12px;font-variant-numeric:tabular-nums;display:flex;align-items:center;gap:15px;white-space:nowrap}
.website-work-count>span:last-child{color:#999}
.website-work-progress{height:1px;background:#414141;flex:1;overflow:hidden}
.website-work-progress>span{height:100%;width:100%;display:block;background:#fff;transform:scaleX(.25);transform-origin:left;transition:transform .4s ease}
.website-work-hint{font-size:10px;color:#999;white-space:nowrap}
.website-work-arrows{display:flex;gap:8px}
.website-work-arrows button{display:grid;place-items:center;width:44px;height:44px;border:1px solid #505050;color:#fff;transition:background .2s,color .2s}
.website-work-arrows button:hover:not(:disabled){background:#fff;color:#171717}
.website-work-arrows button:focus-visible{outline-color:#8ab1ff}
.website-work-arrows .ui-arrow{width:18px;height:18px}
.website-work-status{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
@media(max-width:850px){.website-work-track{--website-work-card-width:60vw}.website-work-controls{gap:22px}.website-work-track .website-project h3{font-size:20px}.website-work-track .website-project figcaption p{font-size:10px}}
@media(max-width:650px){.website-selected{--website-work-gutter:24px}.website-work-track{--website-work-gap:14px;--website-work-card-width:84vw}.website-work-track .website-project>div{aspect-ratio:1.18;padding:17px}.website-work-track .website-project figcaption{display:block;padding-top:18px}.website-work-track .website-project figcaption p{text-align:left;margin-top:7px}.website-work-controls{gap:18px;padding-top:22px}.website-work-hint{display:none}.website-work-count{font-size:10px;gap:10px}.website-work-arrows button{width:36px;height:36px}}
@media(prefers-reduced-motion:reduce){.website-work-progress>span,.website-work-arrows button{transition:none}}
