.project-showcase-wall{background:linear-gradient(180deg,color-mix(in oklch,var(--muted)50%,transparent),transparent 42%),var(--card)}.project-screenshot-rail{scrollbar-color:color-mix(in oklch,var(--muted-foreground)42%,transparent)transparent;scrollbar-width:thin;scroll-snap-type:x proximity;scroll-padding-inline:1rem}.project-screenshot-rail::-webkit-scrollbar{height:10px}.project-screenshot-rail::-webkit-scrollbar-track{background:0 0}.project-screenshot-rail::-webkit-scrollbar-thumb{background:color-mix(in oklch,var(--muted-foreground)32%,transparent);background-clip:content-box;border:3px solid #0000;border-radius:999px}.project-screenshot-rail::-webkit-scrollbar-thumb:hover{background:color-mix(in oklch,var(--muted-foreground)50%,transparent);background-clip:content-box}.project-screenshot-card{scroll-snap-align:start}.project-showcase-canvas{background-color:var(--background);background-image:linear-gradient(135deg,color-mix(in oklch,var(--muted)32%,transparent)25%,transparent 25%),linear-gradient(225deg,color-mix(in oklch,var(--muted)32%,transparent)25%,transparent 25%),linear-gradient(45deg,color-mix(in oklch,var(--muted)32%,transparent)25%,transparent 25%),linear-gradient(315deg,color-mix(in oklch,var(--muted)32%,transparent)25%,var(--background)25%);background-position:14px 0,14px 0,0 0,0 0;background-size:28px 28px}.project-screenshot-image{width:auto;max-width:min(760px,82vw);height:min(520px,62vh)}@media (max-width:640px){.project-screenshot-image{max-width:78vw;height:min(390px,58vh)}}
