/* VivaCity — Central de Vídeos V1.1.1 | Fundo branco integrado ao tema */
.vvh-page{
    --vvh-accent:var(--v-primary,#31a9e8);
    --vvh-accent-strong:#168fce;
    --vvh-youtube:#ff0033;
    --vvh-page-bg:#ffffff;
    --vvh-card-bg:#ffffff;
    --vvh-text:#26292e;
    --vvh-muted:#6f747c;
    --vvh-soft:#f5f6f7;
    --vvh-border:#e3e5e8;
    --vvh-shadow:none;
    width:100%;
    max-width:none;
    margin:0;
    padding:38px 18px 70px;
    background:var(--vvh-page-bg);
    color:var(--vvh-text);
    font-family:system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
}
.vvh-page *{box-sizing:border-box}
.vvh-shell{
    width:min(1320px,100%);
    margin:0 auto;
    padding:0 0 42px;
    background:transparent;
    border:0;
    border-radius:0;
    box-shadow:none;
}
.vvh-intro{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:24px;
    margin-bottom:22px;
}
.vvh-intro-copy{max-width:790px}
.vvh-kicker{
    display:inline-block;
    margin-bottom:7px;
    color:var(--vvh-accent-strong);
    font-size:12px;
    font-weight:800;
    letter-spacing:.1em;
    text-transform:uppercase;
}
.vvh-intro h1{
    margin:0 0 8px;
    color:var(--vvh-text);
    font-size:clamp(30px,4.2vw,48px);
    line-height:1.04;
    letter-spacing:-.035em;
}
.vvh-intro p{
    margin:0;
    color:var(--vvh-muted);
    font-size:15px;
    line-height:1.62;
}
.vvh-intro-actions{display:flex;align-items:center;gap:10px}
.vvh-channel-link{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    min-height:44px;
    padding:9px 15px;
    border:1px solid var(--vvh-border);
    border-radius:7px;
    background:#fff;
    color:var(--vvh-text);
    font-size:13px;
    font-weight:750;
    text-decoration:none;
    white-space:nowrap;
    transition:border-color .18s ease,color .18s ease,box-shadow .18s ease;
}
.vvh-channel-link svg{width:22px;height:22px;fill:var(--vvh-youtube)}
.vvh-channel-link:hover{
    border-color:var(--vvh-accent);
    color:var(--vvh-accent-strong);
    box-shadow:none;
}
.vvh-toolbar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    margin:0 0 28px;
    padding:12px;
    border:1px solid var(--vvh-border);
    border-radius:8px;
    background:var(--vvh-soft);
}
.vvh-search{
    position:relative;
    display:flex;
    align-items:center;
    flex:1;
    max-width:520px;
}
.vvh-search svg{
    position:absolute;
    left:13px;
    width:19px;
    height:19px;
    fill:var(--vvh-muted);
    pointer-events:none;
}
.vvh-search input{
    width:100%;
    height:44px;
    padding:0 14px 0 41px;
    border:1px solid var(--vvh-border);
    border-radius:7px;
    background:#fff;
    color:var(--vvh-text);
    font:inherit;
    outline:none;
}
.vvh-search input:focus{border-color:var(--vvh-accent);box-shadow:0 0 0 3px rgba(49,169,232,.14)}
.vvh-filters{display:flex;gap:6px}
.vvh-filters button{
    min-height:40px;
    padding:8px 13px;
    border:1px solid transparent;
    border-radius:6px;
    background:#fff;
    color:var(--vvh-muted);
    font-size:12px;
    font-weight:800;
    cursor:pointer;
}
.vvh-filters button:hover{border-color:var(--vvh-border);color:var(--vvh-text)}
.vvh-filters button.is-active{background:var(--vvh-accent);color:#fff}
.vvh-featured,.vvh-carousel-section{position:relative}
.vvh-carousel-section{
    margin-top:34px;
    padding-top:28px;
    border-top:1px solid var(--vvh-border);
}
.vvh-section-heading{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:20px;
    margin:0 0 15px;
}
.vvh-section-heading>div{min-width:0}
.vvh-section-heading span{
    display:block;
    margin-bottom:4px;
    color:var(--vvh-accent-strong);
    font-size:11px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
}
.vvh-section-heading h2{
    margin:0;
    color:var(--vvh-text);
    font-size:24px;
    line-height:1.2;
    letter-spacing:-.02em;
}
.vvh-section-heading p{
    margin:5px 0 0;
    color:#9a9da3;
    font-size:12px;
    font-style:italic;
    line-height:1.45;
}
.vvh-autoplay-toggle{
    min-height:40px;
    padding:8px 13px;
    border:1px solid var(--vvh-border);
    border-radius:7px;
    background:#fff;
    color:var(--vvh-muted);
    font-size:12px;
    cursor:pointer;
}
.vvh-autoplay-toggle strong{color:#9a9da3}
.vvh-autoplay-toggle[aria-pressed="true"] strong{color:#168fce}
.vvh-watch{
    overflow:hidden;
    border:1px solid #d9dce0;
    border-radius:3px;
    background:#fff;
}
.vvh-player-shell{
    position:relative;
    aspect-ratio:16/9;
    background:#111;
}
.vvh-player{
    position:relative;
    width:100%;
    height:100%;
    overflow:hidden;
    background:#111;
}
.vvh-player iframe,.vvh-player video{
    display:block;
    width:100%;
    height:100%;
    border:0;
    object-fit:contain;
    background:#000;
}
.vvh-poster-button{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:#111;
    cursor:pointer;
    overflow:hidden;
}
.vvh-poster-button>img{
    width:100%;
    height:100%;
    object-fit:cover;
    opacity:.96;
    transition:transform .28s ease,filter .28s ease;
}
.vvh-poster-button:hover>img{transform:scale(1.012);filter:brightness(.95)}
.vvh-poster-button:before{
    content:"";
    position:absolute;
    inset:0;
    z-index:1;
    background:linear-gradient(180deg,rgba(0,0,0,.72) 0,rgba(0,0,0,.05) 25%,rgba(0,0,0,.02) 68%,rgba(0,0,0,.55) 100%);
    pointer-events:none;
}
.vvh-poster-top{
    position:absolute;
    z-index:3;
    top:15px;
    left:16px;
    right:16px;
    display:flex;
    align-items:center;
    gap:10px;
    color:#fff;
    text-align:left;
    pointer-events:none;
}
.vvh-poster-top>span:last-child{min-width:0}
.vvh-poster-top strong{
    display:block;
    max-width:760px;
    overflow:hidden;
    color:#fff;
    font-size:16px;
    line-height:1.3;
    white-space:nowrap;
    text-overflow:ellipsis;
    text-shadow:0 1px 3px rgba(0,0,0,.5);
}
.vvh-poster-top small{
    display:block;
    margin-top:1px;
    color:rgba(255,255,255,.82);
    font-size:11px;
}
.vvh-poster-avatar{
    display:grid;
    flex:0 0 36px;
    width:36px;
    height:36px;
    place-items:center;
    border:2px solid rgba(255,255,255,.85);
    border-radius:50%;
    background:linear-gradient(135deg,var(--vvh-accent),#1671aa);
    color:#fff;
    font-size:14px;
    font-weight:900;
}
.vvh-play-icon{
    position:absolute;
    z-index:4;
    top:50%;
    left:50%;
    width:68px;
    height:48px;
    transform:translate(-50%,-50%);
    border-radius:14px;
    background:var(--vvh-youtube);
    box-shadow:none;
    transition:transform .18s ease;
}
.vvh-play-icon:after{
    content:"";
    position:absolute;
    top:14px;
    left:27px;
    border-top:10px solid transparent;
    border-bottom:10px solid transparent;
    border-left:17px solid #fff;
}
.vvh-poster-button:hover .vvh-play-icon{transform:translate(-50%,-50%) scale(1.08)}
.vvh-youtube-label{
    position:absolute;
    z-index:3;
    right:17px;
    bottom:15px;
    padding:7px 10px;
    border-radius:4px;
    background:rgba(0,0,0,.68);
    color:#fff;
    font-size:12px;
    font-weight:750;
}
.vvh-current-meta{padding:17px 18px 19px}
.vvh-current-badges{
    display:flex;
    align-items:center;
    gap:9px;
    margin-bottom:8px;
    color:var(--vvh-muted);
    font-size:11px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.04em;
}
.vvh-current-badges span{
    padding:4px 7px;
    border-radius:4px;
    background:#eff8fd;
    color:var(--vvh-accent-strong);
}
.vvh-current-meta h2{
    margin:0 0 7px;
    color:var(--vvh-text);
    font-size:clamp(20px,2.6vw,29px);
    line-height:1.22;
    letter-spacing:-.022em;
}
.vvh-current-meta p{
    max-width:920px;
    margin:0;
    color:var(--vvh-muted);
    font-size:14px;
    line-height:1.6;
}
.vvh-article-link{
    display:inline-flex;
    margin-top:12px;
    color:var(--vvh-accent-strong);
    font-size:13px;
    font-weight:800;
    text-decoration:none;
}
.vvh-article-link:hover{text-decoration:underline}
.vvh-article-link.is-hidden{display:none}
.vvh-carousel{
    position:relative;
    margin-top:24px;
    padding:0 12px;
}
.vvh-carousel-viewport{
    overflow-x:auto;
    overflow-y:hidden;
    scroll-behavior:smooth;
    scroll-snap-type:x mandatory;
    scrollbar-width:none;
    overscroll-behavior-inline:contain;
}
.vvh-carousel-viewport::-webkit-scrollbar{display:none}
.vvh-carousel-track{
    display:flex;
    align-items:stretch;
    gap:20px;
    width:max-content;
    min-width:100%;
}
.vvh-card{
    flex:0 0 calc((100vw - 176px)/3);
    width:min(330px,calc((100vw - 176px)/3));
    min-width:0;
    scroll-snap-align:start;
    color:var(--vvh-text);
}
@media(min-width:1340px){
    .vvh-card{flex-basis:calc((1296px - 40px)/3);width:calc((1296px - 40px)/3)}
}
.vvh-card[hidden]{display:none}
.vvh-card-media{
    position:relative;
    display:block;
    overflow:hidden;
    aspect-ratio:16/9;
    border-radius:3px;
    background:#d9dce0;
    text-decoration:none;
}
.vvh-card-media img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform .22s ease,filter .22s ease;
}
.vvh-card:hover .vvh-card-media img{transform:scale(1.025);filter:brightness(.94)}
.vvh-card-play{
    position:absolute;
    z-index:3;
    top:50%;
    left:50%;
    width:44px;
    height:44px;
    transform:translate(-50%,-50%);
    border-radius:50%;
    background:rgba(255,255,255,.95);
    box-shadow:none;
}
.vvh-card-play:after{
    content:"";
    position:absolute;
    top:12px;
    left:18px;
    border-top:10px solid transparent;
    border-bottom:10px solid transparent;
    border-left:14px solid #333;
}
.vvh-card-source{
    position:absolute;
    z-index:3;
    top:8px;
    left:8px;
    padding:3px 6px;
    border-radius:3px;
    background:rgba(255,255,255,.88);
    color:#4e535a;
    font-size:9px;
    font-weight:900;
    letter-spacing:.04em;
    text-transform:uppercase;
}
.vvh-now-playing{
    position:absolute;
    z-index:4;
    right:7px;
    bottom:7px;
    display:none;
    padding:4px 7px;
    border-radius:3px;
    background:rgba(0,0,0,.78);
    color:#fff;
    font-size:9px;
    font-weight:800;
    text-transform:uppercase;
}
.vvh-card.is-current .vvh-now-playing{display:block}
.vvh-card.is-current .vvh-card-media{box-shadow:inset 0 0 0 3px var(--vvh-accent)}
.vvh-card.is-current .vvh-card-play{opacity:0}
.vvh-card-body{padding:10px 0 0}
.vvh-card-body h3{
    margin:0 0 6px;
    font-size:14px;
    line-height:1.35;
    font-weight:800;
}
.vvh-card-body h3 a{
    color:var(--vvh-text);
    text-decoration:none;
}
.vvh-card-body h3 a:hover{color:var(--vvh-accent-strong)}
.vvh-card-body p{
    display:-webkit-box;
    overflow:hidden;
    margin:0;
    color:var(--vvh-muted);
    font-size:12px;
    line-height:1.45;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
}
.vvh-card-meta{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin-top:8px;
    color:#9a9da3;
    font-size:10px;
}
.vvh-card-meta span{
    min-width:0;
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
}
.vvh-carousel-arrow{
    position:absolute;
    z-index:6;
    top:76px;
    display:grid;
    width:30px;
    height:30px;
    place-items:center;
    padding:0;
    border:0;
    border-radius:50%;
    background:var(--vvh-accent);
    color:#fff;
    box-shadow:none;
    cursor:pointer;
    transition:transform .15s ease,opacity .15s ease;
}
.vvh-carousel-arrow:hover{transform:scale(1.08)}
.vvh-carousel-arrow:disabled{opacity:.28;cursor:default;transform:none}
.vvh-carousel-arrow svg{width:18px;height:18px;fill:currentColor}
.vvh-carousel-prev{left:-4px}
.vvh-carousel-next{right:-4px}
.vvh-carousel-dots{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    min-height:22px;
    margin-top:17px;
}
.vvh-carousel-dots button{
    width:9px;
    height:9px;
    padding:0;
    border:0;
    border-radius:50%;
    background:#b9e1f4;
    cursor:pointer;
}
.vvh-carousel-dots button.is-active{background:var(--vvh-accent);transform:scale(1.08)}
.vvh-no-results,.vvh-empty{
    margin:24px 0 0;
    padding:34px 20px;
    border:1px solid var(--vvh-border);
    border-radius:7px;
    background:var(--vvh-soft);
    color:var(--vvh-muted);
    text-align:center;
}
.vvh-empty h2{margin:0 0 7px;color:var(--vvh-text)}
.vvh-empty p{margin:0}
.vvh-page a:focus-visible,.vvh-page button:focus-visible,.vvh-page input:focus-visible{
    outline:3px solid rgba(49,169,232,.55);
    outline-offset:3px;
}
html.v-dark-mode .vvh-page{
    --vvh-page-bg:#15171a;
    --vvh-card-bg:#202329;
    --vvh-text:#f4f5f6;
    --vvh-muted:#a9afb7;
    --vvh-soft:#272b31;
    --vvh-border:#363b43;
    --vvh-shadow:none;
}
html.v-dark-mode .vvh-toolbar,
html.v-dark-mode .vvh-search input,
html.v-dark-mode .vvh-filters button,
html.v-dark-mode .vvh-channel-link,
html.v-dark-mode .vvh-autoplay-toggle,
html.v-dark-mode .vvh-watch{background:var(--vvh-card-bg);color:var(--vvh-text)}
html.v-dark-mode .vvh-current-badges span{background:#183444}
html.v-dark-mode .vvh-card-source{background:rgba(20,23,27,.86);color:#fff}
@media(max-width:900px){
    .vvh-page{padding:22px 12px 54px}
    .vvh-shell{padding:0 10px 34px}
    .vvh-intro{align-items:flex-start;flex-direction:column}
    .vvh-toolbar{align-items:stretch;flex-direction:column}
    .vvh-search{max-width:none}
    .vvh-card{flex-basis:calc((100vw - 98px)/2);width:calc((100vw - 98px)/2)}
    .vvh-carousel-arrow{top:64px}
}
@media(max-width:620px){
    .vvh-page{padding:10px 0 42px}
    .vvh-shell{
        padding:0 14px 30px;
        border-right:0;
        border-left:0;
        border-radius:0;
        box-shadow:none;
    }
    .vvh-intro{margin-bottom:17px}
    .vvh-intro h1{font-size:32px}
    .vvh-intro p{font-size:14px}
    .vvh-intro-actions,.vvh-channel-link{width:100%}
    .vvh-toolbar{padding:9px}
    .vvh-filters{display:grid;grid-template-columns:repeat(3,1fr)}
    .vvh-filters button{min-height:44px}
    .vvh-section-heading{align-items:flex-start;flex-direction:column}
    .vvh-autoplay-toggle{width:100%;min-height:44px}
    .vvh-player-shell{aspect-ratio:16/9}
    .vvh-poster-top{top:10px;left:10px;right:10px}
    .vvh-poster-top strong{font-size:13px}
    .vvh-poster-avatar{width:31px;height:31px;flex-basis:31px}
    .vvh-youtube-label{right:10px;bottom:9px;font-size:10px}
    .vvh-current-meta{padding:14px}
    .vvh-current-meta h2{font-size:20px}
    .vvh-carousel{padding:0 4px}
    .vvh-carousel-track{gap:14px}
    .vvh-card{flex-basis:82vw;width:82vw}
    .vvh-carousel-prev{left:-7px}
    .vvh-carousel-next{right:-7px}
    .vvh-carousel-arrow{top:70px;width:32px;height:32px}
    .vvh-card-body h3{font-size:15px}
    .vvh-card-body p{-webkit-line-clamp:3}
}