/* Quiet controls sit outside photographs, with separate keyboard targets. */
.image-social{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;color:var(--ink-soft);font:500 12px/1.3 var(--sans);padding:8px 0 12px;position:relative;min-width:0}
.social-control,.social-views{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;min-width:44px;max-width:100%;font:inherit;white-space:nowrap}
.social-control{appearance:none;border:0;background:transparent;color:inherit;cursor:pointer;padding:6px 8px;border-radius:3px}
.social-control svg,.social-views svg,.site-share svg{width:20px;height:20px;flex:none}
.social-control:hover,.social-control[aria-pressed=true]{color:var(--gold-bright)}
.social-control[aria-pressed=true] svg{fill:color-mix(in srgb,var(--gold) 20%,transparent)}
.social-control:focus-visible,.site-share:focus-visible,[role=button]:focus-visible{outline:2px solid var(--gold-bright);outline-offset:3px}
.social-control:disabled{opacity:.6;cursor:wait}.social-views{font-size:11px;color:var(--ink-dim)}
.social-message{flex-basis:100%;font-size:11px;line-height:1.5;overflow-wrap:anywhere}.social-message:empty{display:none}
.social-copy-link{width:100%;min-height:44px;font:13px var(--sans);color:var(--ink);background:var(--bg);border:1px solid var(--gold);padding:8px}
.gallery-item{min-width:0;align-self:start}.gallery-item.wide{grid-column:span 2}.gallery-item .cell{width:100%}.gallery-item .image-social{justify-content:space-between;gap:2px;padding:4px 2px 12px}.gallery-item .social-word{display:none}.gallery-item .social-control{padding:5px 4px}
.anthro-card .ph[role=button]{cursor:zoom-in}.anthro-card .image-social{padding-bottom:0}
.ir-art>.image-social{padding-top:16px}.hero-art>.image-social{position:absolute;z-index:4;right:22px;bottom:72px;background:var(--bg);padding:3px 10px;box-shadow:0 4px 20px #0002;max-width:calc(100% - 44px)}
#lb-social .image-social{margin:10px 0 18px;color:var(--ink)}
.site-share{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-width:44px;min-height:44px;border:0;background:none;color:var(--ink);padding:7px;cursor:pointer;flex:none;font:600 11px var(--sans)}
#site-share-status{position:fixed;z-index:205;top:78px;right:20px;max-width:calc(100vw - 40px);font:13px/1.5 var(--sans);color:var(--ink);background:var(--bg);padding:10px 14px;box-shadow:var(--shadow-soft)}
#site-share-status:empty{display:none}
.portrait-viewer{width:min(920px,calc(100vw - 24px));max-height:calc(100dvh - 24px);border:0;padding:20px;background:var(--bg);color:var(--ink);overflow:auto}.portrait-viewer::backdrop{background:#000b}.portrait-viewer>img{display:block;margin:14px auto;width:100%;max-height:70dvh;object-fit:contain}.portrait-close{min-height:44px;padding:8px 20px;font:600 13px var(--sans);background:var(--bg);color:var(--ink);border:1px solid var(--line-strong);cursor:pointer}
@media(min-width:1201px){.nav-inner{gap:12px}.nav-links{gap:clamp(10px,1.5vw,22px)}.site-share-label{display:none}}
@media(max-width:1200px){.site-share{position:absolute;right:70px;top:14px}.site-share-label{display:none}.nav .wordmark{padding-right:88px}.nav .wordmark .fa{display:none}}
@media(max-width:520px){.image-social{gap:3px}.social-word{display:none}.gallery-item .social-control,.gallery-item .social-views{min-width:40px;gap:3px}.gallery-item .social-control svg,.gallery-item .social-views svg{width:17px;height:17px}.nav .wordmark{font-size:17px;gap:8px}.nav .brand-mark{width:30px;height:30px}.hero-art>.image-social{right:16px;bottom:60px}.gallery-item .image-social{font-size:11px}.social-message{font-size:11px}}

/* Reserve a caption/control strip so the hero controls do not cover the painting. */
.hero-art img{height:calc(100% - 64px)}
.hero-art::before,.hero-art::after{bottom:64px;pointer-events:none}
.hero-art .caption{bottom:80px}
.hero-art>.image-social{bottom:0;left:0;right:0;min-height:64px;max-width:none;width:100%;padding:4px 22px;justify-content:flex-end;background:var(--bg);box-shadow:none}
@media(max-width:520px){
 .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 .gallery-item .image-social{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0}
 .gallery-item .social-control,.gallery-item .social-views{min-width:0;min-height:48px;flex-direction:column;gap:0;padding:3px 0}
 .gallery-item .social-message{grid-column:1/-1}
}
