/* A mesma miniatura compacta nas páginas presenciais e na página virtual. */
.virtual-stories,
.city-stories { margin: 4px 0 12px; }
.virtual-stories h2,
.city-stories h2 { margin: 0 0 8px; font-size: 16px; font-weight: 500; line-height: 1.2; }
.virtual-stories h2 small,
.city-stories h2 small { color: #535b6b; font-size: 12px; font-weight: 400; }
.virtual-stories-row,
.city-page-shell #stories.stories.carousel {
    display: flex;
    gap: 2px;
    overflow-x: auto;
    padding: 2px 0 6px;
    scrollbar-width: none;
}
.virtual-stories-row { flex: 1; min-width: 0; }
.virtual-stories-row::-webkit-scrollbar,
.city-page-shell #stories::-webkit-scrollbar { display: none; }
.virtual-story,
.city-page-shell #stories.stories.carousel .story {
    box-sizing: border-box;
    flex: 0 0 66px;
    width: 66px;
    min-width: 0;
    max-width: 66px;
    margin: 0;
    padding: 0;
    color: #252525;
    text-align: center;
    text-decoration: none;
}
.virtual-story img,
.city-page-shell #stories .story > .item-link > .item-preview {
    box-sizing: border-box;
    display: block;
    width: 66px;
    height: 66px;
    max-width: 66px;
    max-height: 66px;
    margin: 0;
    padding: 2px;
    border: 2px solid #ff3d0a;
    border-radius: 50%;
    background: #fff;
    object-fit: cover;
    opacity: 1;
}
.city-page-shell #stories .item-preview img {
    display: block;
    padding: 0;
    border: 0;
    border-radius: 50%;
}
.city-page-shell #stories .story > .item-link { display: block; margin: 0; color: #252525; text-decoration: none; }
.city-page-shell #stories .item-preview::before,
.city-page-shell #stories .item-preview::after { content: none; }
.city-page-shell #stories .info { margin: 0; padding: 0; }
.virtual-story > span,
.city-page-shell #stories .info .name {
    display: block;
    overflow: hidden;
    margin: 4px 0 0;
    color: #252525;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.4;
    text-overflow: ellipsis;
    text-transform: none;
    white-space: nowrap;
}
.city-page-shell #stories .info .time { display: none; }
.city-page-shell .stories-shell,
.city-page-shell .stories-shell #stories,
.city-page-shell .stories-shell.is-ready #stories {
    height: 95px;
    min-height: 95px;
    max-height: 95px;
    margin-bottom: 0 !important;
}
.city-page-shell .stories-shell:not(.is-ready) { border-radius: 0; background: none; }
.city-page-shell .stories-shell::before {
    inset: 2px 0 auto;
    height: 66px;
    border-radius: 0;
    background: radial-gradient(circle at 33px 33px, #f1f2f4 0 29px, transparent 30px) 0 0 / 68px 66px repeat-x;
}