/* Story viewer, modern look (2026-10-22): dark backdrop, rounded card, profile header, gradient CTA */
.wpstories-window-container {font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;}
.wpstories-window-overlay {background:#0e0f11;}
.wpstories-window-overlay-bg {opacity:.35; filter:blur(40px);}
.wpstories-window {background:transparent;}
.wpstories-window-in {background:#1f2123; transform:translateZ(0);}
@media (min-width:700px) {
.wpstories-window {transform:scale(.94);}
.wpstories-window-in {border-radius:22px; box-shadow:0 30px 80px rgba(0,0,0,.55);}
}

.wpstories-frame::before, .wpstories-frame::after {content:''; position:absolute; left:0; right:0; z-index:1; pointer-events:none;}
.wpstories-frame::before {top:0; height:150px; background:linear-gradient(rgba(0,0,0,.55), rgba(0,0,0,0));}
.wpstories-frame::after {bottom:0; height:220px; background:linear-gradient(rgba(0,0,0,0), rgba(0,0,0,.6));}
.wpstories-frame__body {position:relative; z-index:2;}

.wpstories-slide-progress {top:12px; left:12px; right:12px;}
.wpstories-slide-progress__item {height:3px; margin:0 2px; background:rgba(255,255,255,.35); box-shadow:none;}
.wpstories-slide-progress__item span {height:3px; border-radius:3px; background:#fff;}

.ik-st-head {position:absolute; top:26px; left:14px; right:60px; z-index:20; display:flex; align-items:center; gap:10px; pointer-events:none;}
.ik-st-ava {flex:none; width:38px; height:38px; padding:2px; border-radius:50%; background:linear-gradient(45deg,#ffb33f,#ff6a2c 40%,#e84c2e 60%,#d81b6a);}
.ik-st-ava img {display:block; width:100%; height:100%; margin:0; border:2px solid #1f2123; border-radius:50%; object-fit:cover; object-position:center top;}
.ik-st-name {overflow:hidden; color:#fff; font-size:15px; font-weight:700; line-height:1.2; white-space:nowrap; text-overflow:ellipsis; text-shadow:0 1px 3px rgba(0,0,0,.35);}
.ik-st-tag {flex:none; padding:3px 8px; border-radius:20px; background:rgba(255,255,255,.18); color:#fff; font-size:11px; font-weight:600; line-height:1.2; -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);}

.wpstories-window .wpstories-frame__button {right:16px; bottom:18px; left:16px; display:flex; align-items:center; justify-content:center; gap:8px; padding:15px 20px; border-radius:14px;
background:linear-gradient(90deg,#ff7a2f,#e84c2e 55%,#d81b6a); color:#fff; font-size:16px; font-weight:700; letter-spacing:.01em; box-shadow:0 10px 24px rgba(232,76,46,.45);}
.wpstories-window .wpstories-frame__button svg {width:18px; height:18px; transition:transform .2s;}
.wpstories-window .wpstories-frame__button:hover {transform:none; color:#fff; filter:brightness(1.08);}
.wpstories-window .wpstories-frame__button:hover svg {transform:translateX(3px);}

.wpstories-window .wpstories-window__close {top:26px; right:12px; display:flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:50%;
background:rgba(0,0,0,.35); color:#fff; filter:none; -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);}
.wpstories-window .wpstories-window__close svg {width:20px; height:20px;}
.wpstories-window .wpstories-window__next, .wpstories-window .wpstories-window__prev {top:calc(50% - 24px); display:flex; align-items:center; justify-content:center; width:48px; height:48px; border-radius:50%;
background:rgba(255,255,255,.14); color:#fff; filter:none; -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);}
.wpstories-window .wpstories-window__next {right:-72px;}
.wpstories-window .wpstories-window__prev {left:-72px;}
.wpstories-window .wpstories-window__next svg, .wpstories-window .wpstories-window__prev svg {width:26px; height:26px;}
.wpstories-window .wpstories-window__next:hover, .wpstories-window .wpstories-window__prev:hover {background:rgba(255,255,255,.26);}

/* Топ-20: плашка «+N» (фото и видео в анкете), в стиле Яделуса */
.wpstories-feed .wpstories-preview { position: relative; }
.wpstories-feed .wpstories-preview__badge { position: absolute; top: calc(var(--ik-st-size, 62px) - 18px); right: -6px; z-index: 2; min-width: 22px; padding: 0 5px; border-radius: 9px; background: #fbd9c0; box-shadow: 0 0 0 2px #fff; color: #8f3a0b; font: 600 10px/17px Inter, system-ui, sans-serif; text-align: center; pointer-events: none; }
