.spi-owner-media,
.spi-owner-gallery-page { --media-ink: var(--text, #073b4c); --media-muted: var(--muted, #526f76); --media-line: color-mix(in srgb, var(--primary, #0f766e) 22%, transparent); color: var(--media-ink); }
.spi-owner-media { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr)); gap:clamp(.75rem,2vw,1.25rem); margin:clamp(1.5rem,4vw,3rem) 0; }
.spi-owner-photo,.spi-owner-video { margin:0; overflow:hidden; border:1px solid var(--media-line); border-radius:1rem; background:var(--surface,#fff); box-shadow:0 .6rem 1.8rem rgba(7,59,76,.09); }
.spi-owner-photo picture,.spi-owner-photo img,.spi-owner-video video { display:block; width:100%; }
.spi-owner-photo img,.spi-owner-video video { height:auto; aspect-ratio:16/9; object-fit:cover; background:#dcebee; }
.spi-owner-photo figcaption,.spi-owner-video figcaption { display:grid; gap:.2rem; padding:.8rem 1rem; color:var(--media-muted); font-size:.92rem; line-height:1.45; }
.spi-owner-map { justify-self:start; margin-top:.15rem; padding:.35rem .7rem .35rem .55rem; border:1px solid var(--media-line); border-radius:999px; background:color-mix(in srgb,var(--primary,#0f766e) 6%,var(--surface,#fff)); color:var(--primary,#0f766e); font-size:.85rem; font-weight:700; text-decoration:none; }
.spi-owner-map::before { content:"\1F4CD"; margin-right:.35rem; }
.spi-owner-map:hover,.spi-owner-map:focus-visible { border-color:var(--primary,#0f766e); text-decoration:underline; }
.spi-owner-map-hint { font-weight:400; }
@media (max-width:30rem) { .spi-owner-map-hint { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; } }
.spi-owner-video figcaption strong { color:var(--media-ink); }
.spi-owner-gallery-page { width:min(74rem,calc(100% - 2rem)); margin:0 auto; padding:clamp(2rem,6vw,5rem) 0; }
.spi-owner-gallery-intro { max-width:48rem; }
.spi-owner-gallery-intro h1 { margin:.2rem 0 .8rem; font-size:clamp(2.2rem,7vw,4.8rem); line-height:.96; letter-spacing:-.035em; }
.spi-owner-gallery-intro p { font-size:clamp(1rem,2vw,1.18rem); line-height:1.7; color:var(--media-muted); }
.spi-owner-eyebrow { margin:0; color:var(--primary,#0f766e)!important; font-size:.78rem!important; font-weight:850; letter-spacing:.12em; text-transform:uppercase; }
.spi-owner-albums { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr)); gap:1rem; margin:2rem 0 0; padding:0; list-style:none; }
.spi-owner-albums a { display:grid; grid-template-rows:auto 1fr; height:100%; overflow:hidden; border:1px solid var(--media-line); border-radius:1rem; background:var(--surface,#fff); color:var(--media-ink); text-decoration:none; }
.spi-owner-albums a:hover,.spi-owner-albums a:focus-visible { border-color:var(--primary,#0f766e); transform:translateY(-2px); }
.spi-owner-album-cover { display:block; overflow:hidden; aspect-ratio:16/9; background:#dcebee; }
.spi-owner-album-cover picture,.spi-owner-album-cover img { display:block; width:100%; height:100%; }
.spi-owner-album-cover img { object-fit:cover; transition:transform .3s ease; }
.spi-owner-albums a:hover .spi-owner-album-cover img,.spi-owner-albums a:focus-visible .spi-owner-album-cover img { transform:scale(1.025); }
.spi-owner-album-copy { display:grid; align-content:center; gap:.35rem; min-height:6rem; padding:1rem 1.15rem; }
.spi-owner-albums strong { font-size:1.25rem; }
.spi-owner-albums span { color:var(--media-muted); }
.spi-owner-guide-links { margin-top:clamp(2rem,5vw,4rem); padding:1.25rem; border-left:.25rem solid var(--primary,#0f766e); background:color-mix(in srgb,var(--primary,#0f766e) 7%,var(--surface,#fff)); }
.spi-owner-guide-links h2 { margin:0 0 .35rem; }
.spi-owner-guide-links p { margin:0; line-height:1.65; }
.spi-owner-breadcrumb { display:flex; flex-wrap:wrap; gap:.45rem; margin-bottom:1.5rem; color:var(--media-muted); font-size:.9rem; }
.spi-owner-gallery-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,20rem),1fr)); gap:1rem; margin-top:2rem; }
.spi-owner-pagination { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-top:2rem; padding-top:1.25rem; border-top:1px solid var(--media-line); }
.spi-owner-pagination span { color:var(--media-muted); }
.spi-owner-empty { margin-top:2rem; padding:1rem; border:1px dashed var(--media-line); border-radius:1rem; }
@media (max-width:36rem) { .spi-owner-pagination { align-items:stretch; flex-direction:column; } .spi-owner-pagination a { padding:.7rem 0; } }
@media (prefers-reduced-motion:no-preference) { .spi-owner-albums a { transition:border-color .18s ease,transform .18s ease; } }
/* click to enlarge */
.spi-owner-open { display:block; cursor:zoom-in; }
.spi-owner-open:focus-visible { outline:3px solid var(--primary,#0f766e); outline-offset:3px; }
.spi-owner-caption { display:block; }
/* a photo's own page */
.spi-owner-photo-page { width:min(78rem,calc(100% - 2rem)); margin:0 auto; padding:clamp(1.5rem,4vw,3rem) 0 clamp(2rem,6vw,4rem); }
.spi-owner-full { margin:0; overflow:hidden; border:1px solid var(--media-line); border-radius:1rem; background:var(--surface,#fff); }
.spi-owner-full picture,.spi-owner-full img { display:block; width:100%; height:auto; }
.spi-owner-full figcaption { padding:.9rem 1.1rem; color:var(--media-ink); font-size:1.05rem; }
.spi-owner-taken { margin:.5rem 0 0; color:var(--media-muted); font-size:.9rem; }
.spi-owner-share { margin-top:clamp(1.25rem,3vw,2rem); }
.spi-owner-share-title { margin:0 0 .6rem; font-size:1rem; letter-spacing:.02em; }
.spi-owner-share-row { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; }
.spi-owner-share-link { padding:.45rem .85rem; border:1px solid var(--media-line); border-radius:999px; background:var(--surface,#fff); color:var(--media-ink); font:inherit; font-size:.9rem; font-weight:600; text-decoration:none; cursor:pointer; }
.spi-owner-share-link:hover,.spi-owner-share-link:focus-visible { border-color:var(--primary,#0f766e); color:var(--primary,#0f766e); }
.spi-owner-share-copy.is-done { border-color:var(--primary,#0f766e); color:var(--primary,#0f766e); }
.spi-owner-share-map::before { content:"\1F4CD"; margin-right:.35rem; }
.spi-owner-share-plain { overflow-wrap:anywhere; font-weight:400; font-size:.8rem; color:var(--media-muted); }
.spi-owner-stepper { display:flex; flex-wrap:wrap; gap:.75rem; justify-content:space-between; align-items:center; margin-top:clamp(1.5rem,4vw,2.5rem); padding-top:1.25rem; border-top:1px solid var(--media-line); }
.spi-owner-step,.spi-owner-step-all { color:var(--primary,#0f766e); font-weight:600; text-decoration:none; }
.spi-owner-step:hover,.spi-owner-step-all:hover { text-decoration:underline; }
/* larger view overlay */
html.spi-owner-lb-open { overflow:hidden; }
.spi-owner-lightbox { position:fixed; z-index:9999; inset:0; display:grid; grid-template-rows:1fr auto; place-items:center; padding:clamp(.75rem,3vw,2.5rem); background:rgba(3,25,33,.94); }
.spi-owner-lightbox[hidden] { display:none; }
.spi-owner-lb-figure { display:grid; gap:.6rem; place-items:center; max-width:100%; max-height:100%; margin:0; }
.spi-owner-lb-figure img { max-width:100%; max-height:78vh; width:auto; height:auto; border-radius:.5rem; background:#0b2b34; object-fit:contain; }
.spi-owner-lb-figure figcaption { max-width:52rem; color:#e8f3f5; font-size:.98rem; line-height:1.5; text-align:center; }
.spi-owner-lb-actions { display:flex; flex-wrap:wrap; gap:.6rem; justify-content:center; padding-top:.9rem; }
.spi-owner-lb-actions a { padding:.5rem .9rem; border:1px solid rgba(232,243,245,.45); border-radius:999px; color:#e8f3f5; font-size:.9rem; font-weight:600; text-decoration:none; }
.spi-owner-lb-actions a:hover,.spi-owner-lb-actions a:focus-visible { border-color:#fff; background:rgba(232,243,245,.12); }
.spi-owner-lightbox button { position:absolute; display:grid; place-items:center; width:2.9rem; height:2.9rem; border:1px solid rgba(232,243,245,.45); border-radius:999px; background:rgba(3,25,33,.65); color:#e8f3f5; font-size:1.2rem; cursor:pointer; }
.spi-owner-lightbox button[hidden] { display:none; }
.spi-owner-lightbox button:hover,.spi-owner-lightbox button:focus-visible { border-color:#fff; background:rgba(232,243,245,.18); }
.spi-owner-lb-close { top:clamp(.6rem,2vw,1.5rem); right:clamp(.6rem,2vw,1.5rem); }
.spi-owner-lb-prev { top:50%; left:clamp(.4rem,2vw,1.5rem); transform:translateY(-50%); }
.spi-owner-lb-next { top:50%; right:clamp(.4rem,2vw,1.5rem); transform:translateY(-50%); }
@media (max-width:36rem) { .spi-owner-lb-prev,.spi-owner-lb-next { top:auto; bottom:.5rem; transform:none; } .spi-owner-lb-figure img { max-height:62vh; } }

/* R92 — an approved share can carry many photographs, so a gallery card holds
   a row of them. ONE `<figure>` and one anchor id per POST, because that is
   what one moderation decision covers and what the contributor's own
   `/community/photos/#photo-<id>` link points at. */
.spi-photo-card-images { display: flex; flex-wrap: wrap; gap: .3rem; }
.spi-photo-card-images > a { flex: 1 1 8rem; min-width: 0; }
.spi-photo-card[data-photo-count="1"] .spi-photo-card-images > a { flex: 1 1 100%; }
.spi-photo-card-images img { width: 100%; height: 100%; object-fit: cover; border-radius: .5rem; }
.spi-photo-count { display: inline-block; margin-left: .4rem; color: #5a7f88; font-size: .74rem; font-weight: 800; }