.puppy-gallery{min-width:0}
.puppy-stage{position:relative;overflow:hidden;border-radius:20px;background:#f5f4f1}
.puppy-main{display:block;touch-action:pan-y}
.puppy-main .puppy-main-image{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;cursor:zoom-in}
.puppy-arrow{position:absolute;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:46px;height:46px;border:0;border-radius:50%;background:#fff;color:var(--ink,#303334);box-shadow:0 3px 16px #0002;cursor:pointer;padding:12px;z-index:2}
.puppy-arrow[hidden]{display:none}
.puppy-arrow:hover{background:var(--yellow,#f8b500)}
.puppy-arrow svg{width:100%;height:100%;pointer-events:none}
.puppy-prev{left:16px}.puppy-next{right:16px}.puppy-next svg{transform:rotate(180deg)}
.puppy-thumbs{display:flex;gap:10px;overflow-x:auto;padding:12px 2px 6px;scrollbar-width:thin;scrollbar-color:#d6d2c9 transparent}
.puppy-thumb{flex:0 0 76px;height:76px;border:2px solid transparent;border-radius:9px;padding:3px;overflow:hidden}
.puppy-thumb img{display:block;width:100%;height:100%;object-fit:cover;border-radius:5px}
.puppy-thumb[aria-current=true]{border-color:var(--accent,#ff5356)}
.puppy-gallery a:focus-visible,.puppy-gallery button:focus-visible,.puppy-viewer button:focus-visible{outline:3px solid #f8b500;outline-offset:3px}
.puppy-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.puppy-viewer{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;border:0;padding:60px 72px;background:transparent;color:white;overflow:hidden}
.puppy-viewer::backdrop{background:rgba(16,19,21,.92)}
.puppy-viewer[open]{display:flex;align-items:center;justify-content:center}
.puppy-viewer-image{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;touch-action:pan-y;user-select:none}
.puppy-viewer-close{position:absolute;right:20px;top:14px;width:44px;height:44px;padding:0;border:0;border-radius:50%;font:32px/1 sans-serif;color:#303334;background:white;cursor:pointer}
.puppy-viewer-count{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);font-size:14px}
@media(max-width:700px){.puppy-arrow{width:40px;height:40px;padding:10px}.puppy-prev{left:10px}.puppy-next{right:10px}.puppy-thumb{flex-basis:64px;height:64px}.puppy-thumbs{gap:7px}.puppy-viewer{padding:65px 10px}.puppy-viewer .puppy-arrow{background:#fffE}}

.puppy-loader{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;z-index:1;background:#ffffff24}
.puppy-loader[hidden],.puppy-load-error[hidden]{display:none}
.puppy-loader-ring{width:48px;height:48px;border:4px solid #ffffffbd;border-top-color:var(--accent,#ff5356);border-radius:50%;box-shadow:0 0 0 8px #ffffffb3,0 3px 22px #0002;animation:puppy-loading .8s linear infinite}
.is-loading .puppy-main-image,.puppy-viewer.is-loading .puppy-viewer-image{opacity:.5}
.puppy-viewer .puppy-loader{background:transparent}
.puppy-viewer-close{z-index:3}
.puppy-load-error{position:absolute;bottom:15px;left:12px;right:12px;z-index:2;padding:10px 14px;border-radius:8px;background:#fff;color:#303334;font-size:13px;text-align:center;pointer-events:none}
@keyframes puppy-loading{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.puppy-loader-ring{animation-duration:2s}}