body .tk-image-viewer__wrapper{position:fixed;inset:0;background:rgba(0,0,0,.65);display:none;align-items:center;justify-content:center;z-index:9999;opacity:0;transition:opacity .2s ease}
body .tk-image-viewer__wrapper--visible{display:flex;opacity:1}
body .tk-image-viewer__wrapper--fade-out{opacity:0}
.tk-image-viewer__canvas{position:relative;display:flex;align-items:center;justify-content:center;cursor:grab;overflow:visible;background:transparent}
.tk-image-viewer__canvas.grabbing{cursor:grabbing}
.tk-image-viewer__canvas img{max-width:none;max-height:none;object-fit:contain;transition:transform .2s ease;border-radius:16px;user-select:none;pointer-events:none}
.tk-image-viewer__wrapper--fullscreen .tk-image-viewer__canvas img{max-width:100vw;max-height:100vh}
.tk-image-viewer__close{position:fixed;top:24px;right:24px;width:40px;height:40px;border-radius:999px;background:#fff;color:#111;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(0,0,0,.3);cursor:pointer;transform:scale(1);transition:transform .15s ease}
.tk-image-viewer__close:focus{outline:2px solid #3b82f6}
.tk-image-viewer__close:hover{transform:scale(1.08)}
.tk-image-viewer__actions{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:rgba(255,255,255,.9);backdrop-filter:saturate(180%) blur(6px);border-radius:16px;display:flex;gap:12px;padding:8px 12px;box-shadow:0 4px 16px rgba(0,0,0,.2)}
.tk-image-viewer__actions button{border:none;background:#fff;color:#111;border-radius:12px;padding:8px 12px;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.15);transition:transform .12s ease}
.tk-image-viewer__actions button:hover{transform:translateY(-1px)}
.tk-image-viewer__info{position:fixed;bottom:68px;left:50%;transform:translateX(-50%);color:#fff;font-size:14px;background:rgba(0,0,0,.35);padding:6px 10px;border-radius:12px}
/* 📱 移动端适配样式 */
@media (max-width:985px){
  .tk-image-viewer__actions{gap:8px;padding:6px 10px}
  .tk-image-viewer__info{bottom:80px}
}

@media (max-width:768px){
  /* 🥳 关闭按钮移动端适配 */
  .tk-image-viewer__close{
    top:12px;
    right:12px;
    width:36px;
    height:36px;
    font-size:18px
  }
  
  /* 💕 图片圆角调整 & 移动端尺寸限制 */
  .tk-image-viewer__canvas img{
    border-radius:8px;
    max-width:90vw;
    max-height:70vh
  }
  
  /* 🔗 操作按钮栏移动端适配 */
  .tk-image-viewer__actions{
    bottom:16px;
    gap:6px;
    padding:6px 8px;
    border-radius:12px;
    max-width:calc(100vw - 32px);
    flex-wrap:wrap;
    justify-content:center
  }
  
  .tk-image-viewer__actions button{
    padding:6px 10px;
    font-size:12px;
    border-radius:8px
  }
  
  /* 🌆 图片计数信息位置调整 */
  .tk-image-viewer__info{
    bottom:72px;
    font-size:12px;
    padding:4px 8px
  }
}

@media (max-width:480px){
  /* ☀️ 小屏幕手机适配 */
  .tk-image-viewer__close{
    top:8px;
    right:8px;
    width:32px;
    height:32px;
    font-size:16px
  }
  
  .tk-image-viewer__actions{
    bottom:12px;
    gap:4px;
    padding:4px 6px
  }
  
  .tk-image-viewer__actions button{
    padding:5px 8px;
    font-size:11px
  }
  
  .tk-image-viewer__info{
    bottom:64px;
    font-size:11px
  }
}