/* Screenshot gallery for the reader landings. Source: landing-shared/shots/shots.css (copy with copy.sh, do not edit the copies).
   Uses the landing's own variables: --acc, --card, --stroke, --muted, --shadow. */
.shots-wrap{position:relative}
.shots-track{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 20px;padding:6px 20px 22px;margin:0 -20px;scrollbar-width:thin;scrollbar-color:var(--stroke) transparent;-webkit-overflow-scrolling:touch}
.shots-track:focus-visible{outline:2px solid var(--acc);outline-offset:2px;border-radius:12px}
.shots-track figure{flex:0 0 auto;width:min(62vw,250px);margin:0;scroll-snap-align:start}
.shots-track img{display:block;width:100%;height:auto;aspect-ratio:9/16;border-radius:18px;background:var(--card);border:1px solid var(--stroke);box-shadow:var(--shadow)}
.shots-nav{display:flex;justify-content:center;gap:10px;margin-top:6px}
.shots-nav button{width:42px;height:42px;border-radius:50%;border:1px solid var(--stroke);background:var(--card);color:var(--acc);font-size:22px;line-height:1;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.shots-nav button:hover{border-color:var(--acc)}
.shots-nav button:disabled{opacity:.4;cursor:default;border-color:var(--stroke)}
@media(prefers-reduced-motion:reduce){.shots-track{scroll-behavior:auto}}