:root{--image-error-opacity: .5;--image-error-filter: grayscale(100%);--nav-arrow-bg: color-mix(in srgb, var(--bg-app) 72%, transparent);--nav-arrow-border: 1px solid rgba(255, 255, 255, .3);--nav-arrow-color: #ffffff;--nav-arrow-size: 40px;--nav-arrow-border-radius: 50%;--nav-arrow-transition: transform .3s ease, background-color .3s ease, border-color .3s ease, color .3s ease;--thumbnail-border: 2px solid transparent;--thumbnail-border-radius: 8px;--thumbnail-transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease;--thumbnail-active-border: var(--accent);--thumbnail-active-shadow: 0 0 15px color-mix(in srgb, var(--accent) 45%, transparent);--counter-bg: color-mix(in srgb, var(--bg-app) 70%, transparent);--counter-color: #ffffff;--counter-border: 1px solid rgba(255, 255, 255, .1)}.base-image-shell{position:relative;width:100%;height:100%;display:block;overflow:hidden;background-color:color-mix(in srgb,var(--bg-surface) 82%,#000 18%);isolation:isolate;transition:box-shadow .32s ease,background-color .22s ease}.base-image-shell.contain,.base-image.contain,.base-image-placeholder.contain{--object-fit: contain;--placeholder-background-size: contain}.base-image-shell.cover,.base-image.cover,.base-image-placeholder.cover{--object-fit: cover;--placeholder-background-size: cover}.base-image-placeholder{position:absolute;inset:0;z-index:0;pointer-events:none;background-position:center;background-repeat:no-repeat;background-size:var(--placeholder-background-size, cover);filter:blur(14px) saturate(.9);transform:scale(1.04);opacity:1;transition:opacity .48s ease-out}.base-image-shell.has-placeholder:not(.loaded):not(.error){box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 14%,transparent);animation:image-placeholder-edge 2.4s ease-in-out infinite}.base-image-shell.has-placeholder:not(.loaded):not(.error) .base-image-placeholder{animation:image-placeholder-breathe 2.4s ease-in-out infinite}.base-image-shell.has-placeholder:not(.loaded):not(.error) .base-image{opacity:0}.base-image-shell.has-placeholder.loaded .base-image-placeholder{opacity:0}.base-image-shell.has-placeholder.loaded{box-shadow:none;animation:none}.base-image-shell.has-placeholder.loaded .base-image-placeholder,.base-image-shell.has-placeholder.error .base-image-placeholder{animation:none}@keyframes image-placeholder-breathe{0%,to{filter:blur(16px) saturate(.85);transform:scale(1.045)}50%{filter:blur(10px) saturate(1);transform:scale(1.025)}}@keyframes image-placeholder-edge{0%,to{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 10%,transparent)}50%{box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--accent) 24%,transparent),inset 0 0 22px color-mix(in srgb,var(--accent) 10%,transparent)}}.base-image{position:relative;z-index:1;width:100%;height:100%;display:block;object-fit:var(--object-fit, cover);object-position:center;opacity:1;transition:opacity .42s ease-out,filter .26s ease-out}.base-image.loaded,.base-image-shell:not(.has-placeholder) .base-image{opacity:1;filter:none}.base-image.error{opacity:var(--image-error-opacity);filter:var(--image-error-filter)}.base-image-shell.stage-image{border-radius:var(--radius-2)}.base-image-shell.thumbnail-image,.base-image-shell.thumbnail-image .base-image{width:100%;height:100%}.base-image-shell.thumbnail-image .base-image{object-fit:cover}@media(prefers-reduced-motion:reduce){.base-image,.base-image-shell,.base-image-placeholder{transition:none;animation:none}}.product-image-viewer .nav-arrow{position:absolute;top:50%;transform:translateY(-50%);background:var(--nav-arrow-bg);border:var(--nav-arrow-border);border-radius:var(--nav-arrow-border-radius);width:var(--nav-arrow-size);height:var(--nav-arrow-size);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:var(--nav-arrow-transition);color:var(--nav-arrow-color);z-index:10}.product-image-viewer .nav-arrow:hover{background:#000c;border-color:#fff9;transform:translateY(-50%) scale(1.1)}.product-image-viewer .nav-arrow-left{left:1rem}.product-image-viewer .nav-arrow-right{right:1rem}.product-image-viewer .image-counter{position:absolute;top:1rem;right:1rem;background:var(--counter-bg);color:var(--counter-color);padding:.5rem 1rem;border-radius:20px;font-size:.9rem;font-weight:500;border:var(--counter-border)}.product-image-viewer .thumbnail-strip{display:flex;flex-direction:row;align-items:center;gap:.75rem;justify-content:flex-start;padding:.5rem;overflow-x:auto;overflow-y:hidden}.thumbnail{position:relative;overflow:hidden;border:var(--thumbnail-border);border-radius:var(--thumbnail-border-radius);padding:0;background:transparent;appearance:none;cursor:pointer;transition:var(--thumbnail-transition);flex-shrink:0}.product-image-viewer .thumbnail{width:60px;height:60px}.thumbnail:hover{border-color:#ffffff80;transform:scale(1.05)}.thumbnail.active{border-color:var(--thumbnail-active-border);box-shadow:var(--thumbnail-active-shadow)}@media(max-width:768px){.product-image-viewer .nav-arrow{width:36px;height:36px}.product-image-viewer .nav-arrow-left{left:.5rem}.product-image-viewer .nav-arrow-right{right:.5rem}.product-image-viewer .image-counter{top:.5rem;right:.5rem;padding:.4rem .8rem;font-size:.8rem}.product-image-viewer .thumbnail{width:50px;height:50px}}@media(min-width:768px){.product-image-viewer .thumbnail-strip{flex-direction:column;overflow-x:hidden;overflow-y:auto}}@media(hover:none)and (pointer:coarse){.product-image-viewer .nav-arrow{width:72px;height:72px}.product-image-viewer .thumbnail{width:90px;height:90px}}.thumbnail:focus-visible,.product-image-viewer .nav-arrow:focus-visible{outline:none;box-shadow:var(--focus-ring)}