/* Quiet project navigation, anchored close to the image's lower-right edge. */
.hero-showcase{width:min(290px,100%);max-width:290px;justify-self:end;margin:0 calc(28px - var(--hero-inset)) 18px;padding:7px 12px 4px;border-radius:10px;background:linear-gradient(120deg,#ffffffa6,#eaf2f578);box-shadow:0 5px 24px #1b334014,inset 0 1px 0 #ffffff91}
.hero-project{min-height:32px;gap:9px}
.project-info strong{font-size:12px;line-height:1.5}
.project-open{width:22px;height:22px;background:transparent;border-color:#536d7d40}
.showcase-bottom{gap:8px;margin-top:0}
.showcase-controls button{width:28px;height:28px}
.hero-dots{gap:2px}
.hero-dot{width:18px;min-height:28px}
.hero-dot span{width:4px;height:4px}
.hero-dot[aria-pressed="true"] span{width:14px}
.showcase-controls button > .hd-icon{width:14px;height:14px}
.project-open .hd-icon{width:13px;height:13px}
@media(max-width:960px){.hero-showcase{width:min(290px,100%);max-width:290px;margin-right:calc(20px - var(--hero-inset));margin-bottom:16px}}
@media(max-width:640px){.hero-showcase{width:min(280px,100%);max-width:280px;justify-self:end;margin-right:calc(16px - var(--hero-inset));margin-bottom:14px;padding:5px 11px 2px;border-radius:9px}.hero-project{min-height:34px}.project-info strong{font-size:11px;line-height:1.5}.project-open{width:22px;height:22px}.hero-dot{width:18px;min-height:34px}.showcase-controls button{width:34px;height:34px}.showcase-controls .hd-icon{width:14px;height:14px}}