/* Отчёты со встреч и просмотр фото — общее для главной и для страницы всех отчётов */
.otchety-setka{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:22px}
.otchet{background:#fff;border-radius:26px;overflow:hidden;box-shadow:0 1px 0 rgba(156,31,18,.1),0 24px 50px -36px rgba(120,40,0,.55);display:flex;flex-direction:column}
.otchet .obl{position:relative;aspect-ratio:4/3;overflow:hidden;cursor:zoom-in;border:0;padding:0;background:#eee;display:block;width:100%}
.otchet .obl img{width:100%;height:100%;object-fit:cover;transition:transform 1s}
.otchet .obl:hover img{transform:scale(1.04)}
.otchet .skolko{position:absolute;right:16px;bottom:16px;display:inline-flex;align-items:center;gap:7px;background:rgba(40,8,2,.72);color:#fff3dc;font:600 13px var(--sans);padding:8px 13px;border-radius:999px;backdrop-filter:blur(6px)}
.otchet .skolko svg{width:16px;height:16px}
.otchet .t{padding:24px 26px 26px;display:flex;flex-direction:column;flex:1}
.otchet .kogda{font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--kinovar)}
.otchet h3{font-size:28px;margin:8px 0 10px}
.otchet p{font-size:15px;color:var(--tekst2);margin:0 0 18px}
.otchet .lenta{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:auto}
.otchet .lenta button{aspect-ratio:1;border:0;padding:0;border-radius:12px;overflow:hidden;cursor:zoom-in;position:relative;background:#eee}
.otchet .lenta img{width:100%;height:100%;object-fit:cover}
.otchet .lenta .esche{position:absolute;inset:0;background:rgba(40,8,2,.6);color:#fff3dc;display:flex;align-items:center;justify-content:center;font:600 16px var(--sans)}

/* страница всех отчётов: плитка «кирпичами» */
.kladka{columns:3 260px;column-gap:14px;margin-top:26px}
.kladka button{display:block;width:100%;margin:0 0 14px;border:0;padding:0;border-radius:16px;overflow:hidden;cursor:zoom-in;break-inside:avoid;background:#eee}
.kladka img{width:100%;height:auto;transition:transform .8s}
.kladka button:hover img{transform:scale(1.03)}

/* видео в отчётах: значок ▶ на миниатюре */
.kladka button,.otchet .lenta button{position:relative}
.igrat-znak{position:absolute;left:50%;top:50%;width:58px;height:58px;margin:-29px 0 0 -29px;border-radius:50%;background:rgba(40,8,2,.62);color:#fff3dc;
  display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 3px rgba(255,243,220,.5);pointer-events:none;backdrop-filter:blur(4px)}
.igrat-znak svg{width:26px;height:26px;margin-left:3px}
.otchet .lenta .igrat-znak{width:34px;height:34px;margin:-17px 0 0 -17px}
.otchet .lenta .igrat-znak svg{width:16px;height:16px}

/* просмотр на весь экран */
.prosmotr{position:fixed;inset:0;z-index:200;background:#160501;display:none;overflow:hidden;touch-action:none;-webkit-user-select:none;user-select:none}
.prosmotr.otkryt{display:block}
.lenta-p{position:absolute;inset:0;display:flex;will-change:transform}
.lenta-p.plavno{transition:transform .33s cubic-bezier(.22,.7,.25,1)}
.slayd{flex:0 0 100%;height:100%;display:flex;align-items:center;justify-content:center;overflow:hidden}
.slayd img{max-width:min(92vw,1600px);max-height:84vh;object-fit:contain;border-radius:8px;box-shadow:0 30px 80px rgba(0,0,0,.6);-webkit-user-drag:none;transform-origin:center center;cursor:zoom-in}
.slayd img.plavno{transition:transform .25s ease}
.slayd video{max-width:min(92vw,1600px);max-height:80vh;border-radius:8px;background:#000;box-shadow:0 30px 80px rgba(0,0,0,.6)}
.slayd [hidden]{display:none}
.prosmotr.priblizheno .slayd img{cursor:grab;border-radius:0}
.prosmotr .verh{position:absolute;left:0;right:0;top:0;z-index:2;display:flex;justify-content:space-between;align-items:center;padding:16px 20px;color:#f3d9a8;font:14px var(--sans);gap:16px;background:linear-gradient(180deg,rgba(22,5,1,.75),rgba(22,5,1,0))}
.prosmotr .verh b{font-family:var(--serif);font-size:20px;font-weight:600;color:#fff3dc;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.prosmotr button{border:0;background:rgba(255,243,220,.12);color:#fff3dc;width:52px;height:52px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;flex:none;transition:background .2s,opacity .2s}
.prosmotr button:hover{background:rgba(255,243,220,.24)}
.prosmotr button svg{width:22px;height:22px}
.prosmotr .nazad,.prosmotr .vpered{position:absolute;top:50%;margin-top:-26px;z-index:2}
.prosmotr .nazad{left:18px}.prosmotr .vpered{right:18px}
.prosmotr.priblizheno .nazad,.prosmotr.priblizheno .vpered{opacity:0;pointer-events:none}
.prosmotr .schet{position:absolute;bottom:18px;left:0;right:0;text-align:center;color:#f3d9a8;font:14px var(--sans);opacity:.8;z-index:2;pointer-events:none}
.prosmotr .podskazka{position:absolute;left:50%;bottom:52px;transform:translate(-50%,10px);z-index:2;background:rgba(255,243,220,.95);color:#3b1206;font:600 13.5px var(--sans);padding:10px 16px;border-radius:999px;white-space:nowrap;opacity:0;transition:opacity .4s,transform .4s;pointer-events:none;max-width:92vw;overflow:hidden;text-overflow:ellipsis}
.prosmotr .podskazka.vidna{opacity:1;transform:translate(-50%,0)}
@media (max-width:600px){
  /* телефон: встречи лентой — листаются пальцем вбок */
  .otchety-setka{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;margin:0 -20px;padding:4px 20px 18px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .otchety-setka::-webkit-scrollbar{display:none}
  .otchety-setka .otchet{flex:0 0 84%;scroll-snap-align:center}
  .kladka{columns:2;column-gap:8px}.kladka button{margin-bottom:8px;border-radius:10px}
  .prosmotr .nazad,.prosmotr .vpered{display:none}
  .slayd img{max-width:100vw;max-height:78vh;border-radius:0;box-shadow:none}
  .slayd video{max-width:100vw;max-height:72vh;border-radius:0}
  .prosmotr .podskazka{white-space:normal;text-align:center;width:86vw;border-radius:16px}
}