.product-gallery { display: grid; gap: 12px; }
.product-gallery__modes { display: inline-flex; gap: 8px; flex-wrap: wrap; }
.product-gallery__mode {
  border: 1px solid #d7e3f2; background: #f7fbff; color: #173a63;
  border-radius: 999px; padding: 8px 14px; font-weight: 800; font-size: 13px; cursor: pointer;
}
.product-gallery__mode.is-active { border-color: #1f6cff; background: #eaf3ff; color: #0b4fbf; }
.product-gallery__stage, .product-gallery__360 {
  position: relative; border: 1px solid #d9e6f5; border-radius: 18px;
  background: linear-gradient(135deg, #f5fdff, #ffffff);
  min-height: 320px; overflow: hidden; display: grid; place-items: center;
}
.product-gallery__stage img, .product-gallery__360 img {
  width: 100%; height: 100%; max-height: 520px; object-fit: contain; display: block;
}
.product-gallery__zoom-hint, .product-gallery__360-meta span {
  position: absolute; right: 12px; bottom: 12px;
  background: rgba(15, 36, 68, 0.78); color: #fff; border-radius: 999px;
  padding: 6px 10px; font-size: 12px; font-weight: 700; pointer-events: none;
}
.product-gallery__360-meta {
  position: absolute; left: 12px; bottom: 12px; display: flex; gap: 8px; flex-wrap: wrap;
}
.product-gallery__360-meta span { position: static; pointer-events: none; }
.product-gallery__360 { touch-action: pan-y; cursor: ew-resize; background: #f7fbff; }
.product-gallery__thumbs {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(72px, 1fr)); gap: 10px;
}
.product-gallery__thumb, .product-gallery__thumbs .thumb {
  border: 2px solid #d9e6f5; border-radius: 12px; overflow: hidden; background: #fff;
  padding: 0; height: 78px; cursor: pointer;
}
.product-gallery__thumb.is-active, .product-gallery__thumb.active,
.product-gallery__thumbs .thumb.is-active, .product-gallery__thumbs .thumb.active {
  border-color: #1f6cff; box-shadow: 0 0 0 2px rgba(31,108,255,.18);
}
.product-gallery__thumb img, .product-gallery__thumbs .thumb img {
  width: 100%; height: 100%; object-fit: cover; display: block;
}
.product-gallery__note { margin: 0; color: #63758f; font-size: 13px; font-weight: 600; line-height: 1.4; }

body.has-product-lightbox { overflow: hidden; }
.product-lightbox[hidden] { display: none !important; }
.product-lightbox { position: fixed; inset: 0; z-index: 9999; }
.product-lightbox__backdrop { position: absolute; inset: 0; background: rgba(8,18,34,.72); }
.product-lightbox__panel {
  position: relative; z-index: 1; width: min(960px, calc(100vw - 24px));
  height: min(90vh, 820px); margin: 5vh auto 0; background: #fff; border-radius: 18px;
  box-shadow: 0 24px 64px rgba(0,0,0,.28); display: grid; grid-template-rows: 1fr auto; overflow: hidden;
}
.product-lightbox__stage {
  position: relative; overflow: hidden; background: #0f243f; display: grid; place-items: center; cursor: zoom-in;
}
.product-lightbox__stage.is-zoomed { cursor: zoom-out; }
.product-lightbox__stage img {
  width: 100%; height: 100%; object-fit: contain; transition: transform .12s ease-out; transform: scale(1);
}
.product-lightbox__stage img.is-zoomed { transform: scale(2.2); }
.product-lightbox__close, .product-lightbox__nav {
  position: absolute; z-index: 2; border: 0; background: rgba(255,255,255,.92); color: #14325a;
  border-radius: 999px; width: 42px; height: 42px; font-size: 28px; line-height: 1; cursor: pointer; font-weight: 700;
}
.product-lightbox__close { top: 12px; right: 12px; }
.product-lightbox__nav--prev { left: 12px; top: 50%; transform: translateY(-50%); }
.product-lightbox__nav--next { right: 12px; top: 50%; transform: translateY(-50%); }
.product-lightbox__tools {
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
  padding: 12px 16px; border-top: 1px solid #e6eef8; background: #f8fbff; font-weight: 700; color: #173a63;
}
.product-lightbox__tools button {
  border: 1px solid #cfe0f5; background: #fff; border-radius: 10px; padding: 8px 12px;
  font-weight: 800; color: #14325a; cursor: pointer;
}

.product-market__gallery .product-gallery { width: 100%; }
.product-market__gallery .product-gallery__stage { min-height: 360px; }
.gallery-card .product-gallery__stage, .side-card.gallery-card .product-gallery__stage { height: 510px; }
.gallery-card .product-gallery__stage img, .side-card.gallery-card .product-gallery__stage img {
  max-height: none; height: 100%; object-fit: cover;
}

@media (max-width: 720px) {
  .product-gallery__stage, .product-gallery__360 { min-height: 260px; }
  .gallery-card .product-gallery__stage, .side-card.gallery-card .product-gallery__stage { height: 300px; }
  .product-lightbox__panel { width: calc(100vw - 12px); height: calc(100vh - 24px); margin-top: 12px; }
  .product-lightbox__nav { width: 36px; height: 36px; font-size: 24px; }
}
/* Single-photo PDP: no thumbs / mode chrome — just the large stage */
.product-gallery--single { gap: 0; }
.product-gallery--single .product-gallery__stage { margin: 0; }
.product-lightbox__nav[hidden] { display: none !important; }
/* 360 restore + video-first (2026-10-19). Natural colours, no image tints/filters. */
.product-gallery__stage { position: relative; }
.product-gallery__badge360 {
  position: absolute; left: 12px; top: 12px; z-index: 2; display: inline-flex; align-items: center; gap: 6px;
  border: 1px solid #d7e3f2; background: #fff; color: #173a63; border-radius: 999px; padding: 6px 12px 6px 9px;
  font-weight: 800; font-size: 13px; cursor: pointer; box-shadow: 0 6px 16px rgba(15,36,68,.12);
}
.product-gallery__badge360:hover { border-color: #2f6fe0; color: #0b4fbf; }
.product-gallery__video { position: relative; border: 1px solid #d9e6f5; border-radius: 18px; overflow: hidden; background: #0f243f; min-height: 320px; display: grid; place-items: center; }
.product-gallery__video[hidden] { display: none; }
.product-gallery__video video { width: 100%; max-height: 520px; display: block; background: #0f243f; }
.product-gallery__360 { user-select: none; -webkit-user-select: none; }
.product-gallery__360 img { transition: transform .15s ease-out; }
.product-gallery__360.is-zoomed img { transform: scale(1.8); }
.product-gallery__360-meta span { display: inline-flex; align-items: center; gap: 6px; background: rgba(255,255,255,.94); color: #173a63; }
.product-gallery__360-tools { position: absolute; right: 12px; top: 12px; display: flex; gap: 6px; flex-wrap: wrap; }
.product-gallery__360-tools button { border: 1px solid #d7e3f2; background: #fff; color: #173a63; border-radius: 999px; padding: 6px 11px; font-weight: 800; font-size: 12px; cursor: pointer; }
.product-gallery__360-tools button[aria-pressed="true"] { border-color: #2f6fe0; color: #0b4fbf; background: #eaf3ff; }
.product-gallery__thumb { position: relative; }
.product-gallery__play { position: absolute; inset: 0; display: grid; place-items: center; pointer-events: none; }
.product-gallery__thumb-badge {
  position: absolute; left: 4px; bottom: 4px; display: inline-flex; align-items: center; gap: 3px;
  background: #fff; color: #173a63; border-radius: 999px; padding: 2px 7px 2px 4px; font-size: 11px; font-weight: 800;
  box-shadow: 0 2px 6px rgba(15,36,68,.18);
}
.product-gallery__thumb-badge svg { width: 14px; height: 14px; }
.product-gallery__stage[hidden], .product-gallery__360[hidden], .product-gallery__video[hidden] { display: none !important; }

/* 3D model-viewer stage (product-3d 2026-10-19) */
.product-gallery__3d { position: relative; min-height: 280px; background: #f4f7fb; border-radius: inherit; overflow: hidden; }
.product-gallery__3d[hidden] { display: none !important; }
.product-gallery__3d-meta { position: absolute; left: 12px; bottom: 12px; right: 12px; display: flex; justify-content: space-between; align-items: center; gap: 8px; pointer-events: none; }
.product-gallery__3d-meta span, .product-gallery__3d-meta button { pointer-events: auto; display: inline-flex; align-items: center; gap: 6px; background: rgba(255,255,255,.94); color: #173a63; border: 1px solid #d7e3f2; border-radius: 999px; padding: 6px 11px; font-weight: 800; font-size: 12px; }
.product-gallery__3d-meta button { cursor: pointer; }
.product-gallery__badge3d { position: absolute; left: 12px; top: 52px; z-index: 2; display: inline-flex; align-items: center; gap: 6px; border: 1px solid #b7e8d4; background: #e8faf3; color: #0b6b4a; border-radius: 999px; padding: 6px 10px; font-weight: 800; font-size: 12px; cursor: pointer; }
.product-gallery__thumb--3d .product-gallery__thumb-badge { background: #0f9f6e; }
.product-gallery__stage[hidden], .product-gallery__360[hidden], .product-gallery__video[hidden], .product-gallery__3d[hidden] { display: none !important; }
