/* Фото к новости: рамка, карусель, превью, просмотр (2026-10-19) */
.pcar{--pc-r:var(--radius,18px);--pc-sig:var(--signal,#008BF9);margin:0 0 clamp(18px,3vw,28px);min-width:0}
.pcar__stage{position:relative;overflow:hidden;border-radius:var(--pc-r);background:#0b1220;isolation:isolate;aspect-ratio:4/3;outline:0;box-shadow:0 14px 40px -26px rgba(0,0,0,.6)}
/* высота рамки подгоняется под пропорции текущего кадра (как во ВКонтакте): без обрезки и без пустых полей */
.pcar.is-fit .pcar__stage{aspect-ratio:auto;height:var(--pcar-h);transition:height .38s cubic-bezier(.3,.8,.3,1)}
.pcar__stage:focus-visible{box-shadow:0 0 0 3px color-mix(in srgb,var(--pc-sig) 60%,transparent)}
.pcar__bg{position:absolute;inset:-30px;z-index:-1;background:var(--pcar-bg) center/cover;filter:blur(26px) saturate(1.25) brightness(.6);transform:scale(1.05);transition:background-image .4s}
.pcar__track{position:absolute;inset:0;display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.pcar__track::-webkit-scrollbar{display:none}
.pcar__slide{flex:0 0 100%;min-width:0;height:100%;position:relative;overflow:hidden;scroll-snap-align:center;scroll-snap-stop:always;cursor:zoom-in}
.pcar__slide img{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;object-fit:contain;animation:pcIn .5s both}
@keyframes pcIn{from{opacity:0;transform:scale(.985)}to{opacity:1;transform:none}}
.pcar__chip,.pcar__count{position:absolute;top:12px;z-index:3;display:flex;align-items:center;gap:7px;padding:7px 12px;border-radius:99px;background:rgba(8,14,28,.62);color:#fff;font:700 12.5px/1 var(--font-display,system-ui);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.16);pointer-events:none}
.pcar__chip{left:12px}.pcar__count{right:12px;font-variant-numeric:tabular-nums}
.pcar__chip svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.pcar__chip i{font-style:normal;font-weight:600;color:#9bdcff;max-width:120px;overflow:hidden;white-space:nowrap;transition:max-width .5s,opacity .4s}
.pcar:not(.is-touched) .pcar__chip i{animation:pcHint 1.6s ease-in-out infinite}
.pcar.is-touched .pcar__chip i{max-width:0;opacity:0;margin-left:-7px}
@keyframes pcHint{0%,100%{transform:translateX(0)}50%{transform:translateX(4px)}}
.pcar__count b{display:inline-block;animation:pcBump .35s}
@keyframes pcBump{from{transform:translateY(5px);opacity:.3}to{transform:none;opacity:1}}
.pcar__nav,.pcar__full{position:absolute;z-index:3;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.2);background:rgba(8,14,28,.55);color:#fff;cursor:pointer;backdrop-filter:blur(8px);transition:transform .2s,background .2s,opacity .25s}
.pcar__nav{top:50%;margin-top:-22px}.pcar__nav--prev{left:12px}.pcar__nav--next{right:12px}
.pcar__full{right:12px;bottom:34px;width:38px;height:38px}
.pcar--one .pcar__full{bottom:12px}
.pcar__nav svg,.pcar__full svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pcar__nav:hover,.pcar__full:hover{background:var(--pc-sig);transform:scale(1.08)}
.pcar__nav[disabled]{opacity:0;pointer-events:none}
.pcar__segs{position:absolute;left:14px;right:60px;bottom:14px;z-index:3;display:flex;gap:5px;pointer-events:none}
.pcar__segs i{flex:1;height:4px;border-radius:4px;background:rgba(255,255,255,.28);overflow:hidden;position:relative}
.pcar__segs i::after{content:"";position:absolute;inset:0;background:#fff;transform:scaleX(0);transform-origin:left;transition:transform .45s}
.pcar__segs i.is-on::after,.pcar__segs i.is-done::after{transform:scaleX(1)}
.pcar__segs i.is-done::after{opacity:.65}
.pcar__thumbs{display:flex;gap:8px;overflow-x:auto;padding:10px 2px 6px;scrollbar-width:thin;scroll-snap-type:x proximity}
.pcar__thumb{flex:none;padding:0;border:0;background:none;cursor:pointer;border-radius:12px;overflow:hidden;position:relative;scroll-snap-align:center;opacity:.62;transform:scale(.96);transition:opacity .25s,transform .25s,box-shadow .25s;box-shadow:0 0 0 2px transparent}
.pcar__thumb img{display:block;width:88px;height:64px;object-fit:cover}
.pcar__thumb:hover{opacity:.95}
.pcar__thumb.is-on{opacity:1;transform:none;box-shadow:0 0 0 2px var(--pc-sig),0 8px 18px -10px var(--pc-sig)}
.pcar__thumb:focus-visible{outline:2px solid var(--pc-sig);outline-offset:2px}
.pcar__cap{display:flex;flex-wrap:wrap;gap:6px 18px;justify-content:space-between;align-items:center;margin-top:8px;font-size:13px;line-height:1.4;color:var(--muted,#6b7787)}
.pcar__note{display:inline-flex;align-items:center;gap:8px}
.pcar__note svg{width:17px;height:17px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;color:var(--pc-sig)}
.pcar__credit{font-family:var(--font-mono,ui-monospace,monospace);font-size:12px}
@media(max-width:700px){
  .pcar{margin-left:-12px;margin-right:-12px}
  .pcar__stage{border-radius:0}
  .pcar__thumbs,.pcar__cap{padding-left:12px;padding-right:12px}
  .pcar__nav{width:38px;height:38px;margin-top:-19px}
  .pcar__chip i{display:none}
}
/* полноэкранный просмотр */
.pviewer{position:fixed;inset:0;z-index:400;display:grid;grid-template-rows:auto 1fr;background:rgba(5,9,18,.96);color:#fff;opacity:0;visibility:hidden;transition:opacity .25s,visibility .25s}
.pviewer.is-open{opacity:1;visibility:visible}
.pviewer__bar{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;font:700 14px/1 var(--font-display,system-ui)}
.pviewer__close{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);color:#fff;cursor:pointer}
.pviewer__close svg,.pviewer__nav svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pviewer__body{position:relative;display:grid;place-items:center;min-height:0;padding:0 64px 22px}
.pviewer__img{max-width:100%;max-height:calc(100vh - 110px);object-fit:contain;border-radius:8px;box-shadow:0 30px 80px -30px #000}
.pviewer__img.is-swap{animation:pvIn .35s both}
@keyframes pvIn{from{opacity:0;transform:translateX(var(--pv-dir,18px)) scale(.98)}to{opacity:1;transform:none}}
.pviewer__nav{position:absolute;top:50%;margin-top:-24px;display:grid;place-items:center;width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);color:#fff;cursor:pointer;transition:transform .2s,background .2s}
.pviewer__nav:hover{background:var(--signal,#008BF9);transform:scale(1.08)}
.pviewer__nav--prev{left:10px}.pviewer__nav--next{right:10px}
@media(max-width:700px){.pviewer__body{padding:0 8px 16px}.pviewer__nav{display:none}.pviewer__img{max-height:calc(100vh - 100px)}}
@media(prefers-reduced-motion:reduce){.pcar.is-fit .pcar__stage{transition:none}.pcar__slide img,.pcar__count b,.pviewer__img.is-swap,.pcar:not(.is-touched) .pcar__chip i{animation:none}.pcar__bg,.pcar__thumb,.pcar__nav,.pcar__full,.pcar__segs i::after,.pviewer{transition:none}}