#rkh-zoom{
  position:fixed; inset:0; background:rgba(10,8,5,0.97); z-index:9999;
  display:none; flex-direction:column; align-items:stretch;
}
#rkh-zoom.open{ display:flex; }
#rkh-zoom .rz-toolbar{
  flex:0 0 auto; display:flex; align-items:center; gap:8px;
  padding:8px 14px; background:rgba(0,0,0,0.6); color:#fff;
  font-family:Georgia, serif; font-size:14px;
}
#rkh-zoom .rz-btn{
  background:rgba(255,255,255,0.1); color:#fff; border:1px solid rgba(255,255,255,0.25);
  padding:5px 10px; font-family:inherit; font-size:14px; cursor:pointer; border-radius:3px;
  min-width:34px;
}
#rkh-zoom .rz-btn:hover{ background:rgba(255,255,255,0.22); }
#rkh-zoom .rz-zoom-val{ font-family:Menlo,Consolas,monospace; font-size:12px; min-width:54px; text-align:center; color:#eee; }
#rkh-zoom .rz-title{ flex:1; font-size:13px; color:#ddd; padding-left:14px; font-style:italic; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#rkh-zoom .rz-close{ background:rgba(122,59,40,0.7); border-color:#7a3b28; font-size:20px; line-height:1; padding:1px 12px; }
#rkh-zoom .rz-close:hover{ background:#5d2c1e; }
#rkh-zoom .rz-canvas{
  flex:1; overflow:hidden; display:flex; align-items:center; justify-content:center;
  cursor:default;
  /* Safari/iOS: flex-элемент по умолчанию не сжимается меньше содержимого
     (min-width/height:auto) — из-за этого коробка картинки считалась неверно. */
  min-width:0; min-height:0;
}
#rkh-zoom .rz-img{
  max-width:100%; max-height:100%; user-select:none; -webkit-user-drag:none;
  transform-origin:center center; transition:none;
  cursor:grab;
  /* 07.2026. Страховка от деформации на iPhone: в Safari картинка-flex-элемент
     с max-height:100% внутри flex:1-контейнера иногда получает коробку по ширине
     экрана с неверной высотой, и при object-fit:fill (значение по умолчанию)
     изображение растягивается. С contain пропорции сохраняются всегда.
     Там, где коробка считается верно (Chrome, компьютер), правило не меняет
     ничего — проверено на живом сайте: 390×532 до и после, пиксель в пиксель. */
  object-fit:contain;
}
#rkh-zoom .rz-hint{
  flex:0 0 auto; padding:5px 14px; font-size:11px; color:#888; font-style:italic;
  background:rgba(0,0,0,0.4); text-align:center;
}
@media (max-width:600px){
  #rkh-zoom .rz-hint{ display:none; }
  #rkh-zoom .rz-title{ display:none; }
}
@media print{ #rkh-zoom{ display:none !important; } }

/* Подпись под изображением в зум-режиме */
#rkh-zoom .rz-caption {
  position: absolute;
  left: 50%; bottom: 60px;
  transform: translateX(-50%);
  max-width: 80%;
  padding: 10px 18px;
  background: rgba(0,0,0,0.7);
  color: #fff;
  font-size: 14px;
  line-height: 1.4;
  text-align: center;
  border-radius: 4px;
  pointer-events: auto;
  z-index: 5;
}
#rkh-zoom .rz-caption a {
  color: #f5cf8a;
  text-decoration: none;
  border-bottom: 1px dotted #f5cf8a;
}
#rkh-zoom .rz-caption a:hover {
  border-bottom-style: solid;
}

/* Имена-ссылки внутри подписи — inline, не flex */
#rkh-zoom .rz-caption a.rel-card {
  display: inline;
  padding: 0;
  background: transparent;
  border: none;
  color: #f5cf8a;
}