.project-carousel{min-width:0}
.project-carousel .carousel-hint{font-size:13px;margin:0 0 22px;max-width:36ch}
.project-carousel-stage{position:relative;min-width:0}
.project-carousel-viewport{overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;touch-action:manipulation}
.carousel-ready .project-carousel-viewport{overflow:hidden;scroll-snap-type:none;touch-action:pan-y pinch-zoom}
.project-carousel .project-list{position:relative;display:flex;gap:0;align-items:stretch;margin:0;padding:10px 0 14px;width:100%;overflow:visible;row-gap:0;touch-action:manipulation}
.carousel-ready .project-list{touch-action:pan-y pinch-zoom}
.project-carousel .project{flex:0 0 33.333333%;padding:0 12px;min-width:0;margin:0;scroll-snap-align:center}
.project-carousel .project button{height:100%}
.project-carousel .project-image{aspect-ratio:1;transform:scale(var(--project-scale,1));transform-origin:50% 100%;will-change:transform}
.project-carousel .project-image img{user-select:none;-webkit-user-drag:none}
.project-carousel .project-meta{min-height:136px}
.project-carousel .project-meta>div{min-width:0}
.project-carousel .project-meta h3{font-size:clamp(20px,2.1vw,28px)}
.project.is-selected .project-open{background:var(--green);color:var(--paper)}
.project-carousel-controls{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:18px 0 0}
.project-carousel-controls[hidden],.carousel-arrow[hidden]{display:none}
.project-carousel-controls p{font-size:13px;margin:0}
.carousel-arrow{position:absolute;z-index:4;top:var(--project-arrow-y,40%);transform:translateY(-50%);width:48px;height:48px;border-radius:0;border:0;background:transparent;color:var(--green);display:grid;place-items:center;font-size:24px;line-height:1;box-shadow:none}
.carousel-previous{left:0}.carousel-next{right:0}
.carousel-play{font:inherit;font-size:12px;min-height:44px;padding:9px 14px;border:1px solid var(--line);border-radius:100px;background:var(--paper);color:var(--ink)}
.carousel-arrow:active,.carousel-play:active{filter:brightness(.94)}
@media(hover:hover){.carousel-arrow:hover{color:#24634d}.carousel-play:hover{border-color:var(--green)}}
@media(max-width:760px){.project-carousel .project{flex-basis:84%;padding-inline:8px}.project-carousel .project-meta{min-height:112px}.carousel-arrow{width:44px;height:44px}}
@media(prefers-reduced-motion:no-preference){.carousel-arrow:active{transform:translateY(-50%) scale(.985)}.carousel-play:active{transform:scale(.985)}}
@media(prefers-reduced-motion:reduce){.project-carousel-viewport{scroll-behavior:auto}.project-carousel .project-image{will-change:auto}}