:root{--iv-overlay-bg:#fff;--iv-toolbar-bg:#fff;--iv-toolbar-color:#333;--iv-toolbar-shadow:none;--iv-thumbnails-wrapper-bg:transparent;--iv-thumbnail-bg:transparent;--iv-thumbnail-border:transparent;--iv-thumbnail-error-bg:#ececee;--iv-button-hover-bg:rgba(0,0,0,.06);--iv-button-radius:8px;--iv-nav-bg:#fff;--iv-nav-shadow:0 2px 8px rgba(0,0,0,.1);--iv-z-index:9999;--iv-transition:.2s ease}.image-viewer-overlay{background:var(--iv-overlay-bg);width:100%;height:100%;z-index:var(--iv-z-index);-webkit-user-select:none;user-select:none;flex-direction:column;display:flex;position:fixed;top:0;left:0}.image-viewer-toolbar{background:var(--iv-toolbar-bg);color:var(--iv-toolbar-color);box-shadow:var(--iv-toolbar-shadow);z-index:10;border-radius:12px;align-items:center;gap:8px;padding:2px 12px;display:flex;position:absolute;top:16px;left:50%;transform:translate(-50%)}.image-viewer-toolbar-left,.image-viewer-toolbar-right{background:var(--iv-toolbar-bg);border-radius:12px;align-items:center;gap:8px;display:flex}.image-viewer-separator{color:#ddd;margin:0 4px;font-size:14px}.image-viewer-close-btn svg{width:20px!important;height:20px!important}.image-viewer-close-pc-btn{z-index:10;position:absolute;top:18px;right:24px}.image-viewer-btn{background:var(--iv-toolbar-bg);width:36px;height:36px;color:var(--iv-toolbar-color);cursor:pointer;border-radius:var(--iv-button-radius);transition:background var(--iv-transition);border:none;justify-content:center;align-items:center;padding:0;display:flex}.image-viewer-btn:hover{background:var(--iv-button-hover-bg)}.image-viewer-btn:disabled{opacity:.4;cursor:not-allowed}.image-viewer-btn:disabled:hover{background:0 0}.image-viewer-btn svg{width:24px;height:24px}.image-viewer-toolbar--mobile{box-shadow:none;background:0 0;border-radius:0;justify-content:space-between;padding:8px 16px;top:0;left:0;right:0;transform:none}.image-viewer-toolbar--mobile .image-viewer-btn{color:#333}.image-viewer-toolbar--mobile .image-viewer-btn:hover{background:rgba(0,0,0,.06)}.image-viewer-main{flex:1;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.image-viewer-image{object-fit:contain;max-width:calc(100% - 80px);max-height:calc(100% - 80px);transition:transform var(--iv-transition),opacity var(--iv-transition);cursor:default}.image-viewer-image.dragging,.image-viewer-image.zooming{cursor:-webkit-grabbing;cursor:-moz-grabbing;cursor:grabbing;transition:none}.image-viewer-slider{width:100%;height:100%;position:absolute;top:0;left:0;overflow:hidden}.image-viewer-slide{will-change:transform;backface-visibility:hidden;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:absolute;top:0;left:0}.image-viewer-slide-image{object-fit:contain;pointer-events:none;max-width:calc(100% - 80px);max-height:calc(100% - 80px)}.image-viewer-nav{background:var(--iv-nav-bg);width:30px;height:30px;color:var(--iv-toolbar-color);cursor:pointer;box-shadow:var(--iv-nav-shadow);transition:opacity var(--iv-transition),transform var(--iv-transition);z-index:10;border:none;border-radius:50%;justify-content:center;align-items:center;padding:0;display:flex;position:absolute;top:50%;transform:translateY(-50%)}.image-viewer-nav:hover{transform:translateY(-50%)scale(1.05)}.image-viewer-nav:disabled{opacity:.3;cursor:not-allowed}.image-viewer-nav:disabled:hover{transform:translateY(-50%)}.image-viewer-nav svg{width:16px;height:16px}.image-viewer-nav--prev{left:24px}.image-viewer-nav--next{right:24px}.image-viewer-thumbnails-wrapper{background:var(--iv-thumbnails-wrapper-bg);padding:12px 0;position:absolute;bottom:0;left:0;right:0;overflow:hidden}.image-viewer-thumbnails{scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none;touch-action:pan-x;align-items:center;gap:8px;display:flex;overflow-x:auto;overflow-y:hidden}.image-viewer-thumbnails::-webkit-scrollbar{display:none}.image-viewer-thumbnail{border:2px solid var(--iv-thumbnail-border);cursor:pointer;width:60px;height:60px;transition:border-color var(--iv-transition),opacity var(--iv-transition),transform var(--iv-transition);opacity:.3;background-color:var(--iv-thumbnail-bg);border-radius:6px;flex-shrink:0;overflow:hidden}@media (hover:hover){.image-viewer-thumbnail:hover{opacity:.85;transform:scale(1.05)}}.image-viewer-thumbnail.active{opacity:1}.image-viewer-thumbnail-error{background:var(--iv-thumbnail-error-bg);justify-content:center;align-items:center;width:100%;height:100%;display:flex}.image-viewer-thumbnail-error svg{width:24px;height:24px}.image-viewer-thumbnails-arrow{background:var(--iv-nav-bg);width:22px;height:22px;box-shadow:var(--iv-nav-shadow);cursor:pointer;z-index:5;transition:opacity var(--iv-transition),background var(--iv-transition);border:none;border-radius:50%;justify-content:center;align-items:center;display:flex;position:absolute;top:50%;transform:translateY(-50%)}.image-viewer-thumbnails-arrow:hover{background:#fff}.image-viewer-thumbnails-arrow svg{width:14px;height:14px}.image-viewer-thumbnails-arrow--prev{left:16px}.image-viewer-thumbnails-arrow--next{right:16px}.image-viewer-thumbnail img{object-fit:cover;width:100%;height:100%}.image-viewer-thumbnails-spacer{flex-shrink:0;width:calc(50% - 30px);height:1px}@media (max-width:768px){.image-viewer-thumbnails-spacer{width:calc(50% - 24px)}}.image-viewer-loading{pointer-events:none;justify-content:center;align-items:center;display:none;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.image-viewer-loading.visible{display:flex}.image-viewer-loading svg{width:20px;height:20px;animation:1s linear infinite iv-spin}@keyframes iv-spin{to{transform:rotate(360deg)}}.image-viewer-error{pointer-events:none;flex-direction:column;justify-content:center;align-items:center;gap:12px;display:none;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.image-viewer-error.visible{display:flex}.image-viewer-error svg{width:60px;height:60px}.image-viewer-error span{color:#9095a0;font-size:14px}.image-viewer-overlay.image-viewer-entering{animation:.4s forwards iv-fade-in}.image-viewer-overlay.image-viewer-leaving{animation:.4s forwards iv-fade-out}@keyframes iv-fade-in{0%{opacity:0}to{opacity:1}}@keyframes iv-fade-out{0%{opacity:1}to{opacity:0}}@media (max-width:1024px){.image-viewer-nav--prev{left:16px}.image-viewer-nav--next{right:16px}}@media (max-width:768px){.image-viewer-image,.image-viewer-slide-image{max-width:100%;max-height:calc(100% - 120px)}.image-viewer-thumbnails-wrapper{padding:8px 0}.image-viewer-thumbnails{gap:6px}.image-viewer-thumbnail{width:48px;height:48px}.image-viewer-nav{width:28px;height:28px}.image-viewer-nav svg{width:14px;height:14px}}@media (hover:none){.image-viewer-btn:active{background:rgba(0,0,0,.1)}.image-viewer-thumbnail:active{transform:scale(.95)}}
