/* Card controls: keep icon geometry independent of font metrics. */
.project-card .project-open{display:flex;align-items:center;justify-content:center;line-height:1;flex-shrink:0;padding:0}
.project-card .project-open .play-icon{display:block;width:12px;height:15px;margin:0 0 0 3px;font-size:0;line-height:0;background:currentColor;clip-path:polygon(0 0,100% 50%,0 100%)}
.project-card .project-open>svg{display:block;width:20px;height:20px}
.project-meta>div{min-width:0}.project-meta h3{overflow-wrap:anywhere}.project-id{flex-shrink:0;margin-left:10px}
.project-dialog{max-height:calc(100dvh - 24px)}
.project-player{max-height:60dvh}.project-player.portrait-player{height:65dvh}
@media(min-width:681px) and (max-width:1024px){.nav{gap:12px}.header-identity,.nav-contact{font-size:clamp(14px,1.75vw,18px);white-space:nowrap}.nav-contact{gap:8px}.project-grid{gap:28px 18px}.project-glow .project-card{padding:9px}.project-meta h3{font-size:15px}.about-grid{gap:28px}}
@media(max-width:680px){.project-card .project-open{width:42px;height:42px;right:14px;bottom:14px}.project-card:has(.play-icon) .sample-label{left:12px;bottom:14px;font-size:9px;padding:7px 9px}.project-meta h3 span{display:block;margin:6px 0 0;font-size:9px}.dialog-body{padding:20px}.dialog-body h2{font-size:clamp(22px,6vw,30px);letter-spacing:-.5px;overflow-wrap:anywhere}.project-player.portrait-player{height:62dvh}.contact-options a{overflow-wrap:anywhere;min-width:0}.hero-footer{flex-wrap:wrap;justify-content:space-between;row-gap:10px}.work-end{gap:12px;flex-wrap:wrap}}
@media(max-width:380px){.nav .header-identity{font-size:15px}.nav{gap:8px}.hero-bottom .hero-welcome{font-size:20px}.section-heading{gap:15px;flex-wrap:wrap}.project-meta h3{font-size:15px}}
@media(max-height:600px) and (orientation:landscape){.project-dialog{max-height:calc(100dvh - 16px)}.project-player{max-height:65dvh}.project-player.portrait-player{height:70dvh}}

/* Keep card control icons fixed in every interaction state. */
.project-card .project-open,.project-card .project-open>span,.project-card:hover .project-open,.project-card:hover .project-open>span,.project-card:active .project-open,.project-card:active .project-open>span{transform:none!important;transition:none!important;animation:none!important}
