:root {
      --bg: #0b0912; --panel: #16121f; --card: #211b2f; --line: #2d2640;
      --text: #f4f0fb; --muted: #a49cbb; --accent: #e879a6; --accent2: #8b5cf6;
      --grad: linear-gradient(90deg, #8b5cf6, #e879a6);
      --pad: 4%;
    }
    * { box-sizing: border-box; }
    [hidden] { display: none !important; }
    html, body { margin: 0; }
    body { font-family: system-ui, -apple-system, "Segoe UI", sans-serif; background: var(--bg); color: var(--text); min-height: 100vh; overflow-x: hidden; }
    button, input, select, textarea { font: inherit; color: inherit; }
    button { cursor: pointer; }
    :where(button, a, input, select, textarea, [tabindex], .tile, .programa-card, .episodio-card):focus-visible {
      outline: 4px solid #fff !important;
      outline-offset: 4px;
      box-shadow: 0 0 0 8px rgba(232,121,166,.72), 0 16px 42px rgba(0,0,0,.75) !important;
      position: relative;
      z-index: 30;
    }
    html.modo-tv { font-size: 112%; }
    html.modo-tv button, html.modo-tv input, html.modo-tv select { min-height: 48px; }
    html.modo-tv .aba { padding: 11px 15px; }
    html.modo-tv .tile:focus-visible { transform: scale(1.1); }

    /* ---------- barra superior ---------- */
    #nav { position: fixed; top: 0; left: 0; right: 0; z-index: 20; display: flex; align-items: center; gap: 22px; padding: 14px var(--pad);
      background: linear-gradient(to bottom, rgba(11,9,18,.9), rgba(11,9,18,0)); transition: background .25s; }
    #nav.solido { background: var(--bg); box-shadow: 0 2px 20px rgba(0,0,0,.5); }
    .logo { display:flex; align-items:center; gap:9px; font-weight: 900; font-size: 24px; letter-spacing: -.7px; color:#fff; text-shadow:0 3px 18px #000; }
    .logo span { background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; }

    /* abertura leve: substitui o quadro preto inicial por uma assinatura da marca */
    .splash-pepper { position:fixed; z-index:1000; inset:0; display:grid; place-items:center; pointer-events:none; overflow:hidden; background:radial-gradient(circle at 50% 43%,#281139 0,#0a0710 42%,#030205 100%); animation:pepper-splash 2.15s cubic-bezier(.2,.7,.2,1) forwards; }
    .splash-pepper::before { content:""; position:absolute; width:min(86vw,720px); aspect-ratio:1; border-radius:50%; background:radial-gradient(circle,#b62bd532 0,transparent 66%); animation:pepper-pulso 1.35s ease-out both; }
    .splash-pepper span { position:relative; font-size:clamp(34px,9vw,68px); font-weight:900; letter-spacing:-1.5px; background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; filter:drop-shadow(0 18px 55px #9e31ca50); animation:pepper-logo 1.65s cubic-bezier(.18,.8,.24,1) both; }
    @keyframes pepper-logo { 0%{opacity:0;transform:scale(.72) translateY(18px);filter:blur(10px)} 44%{opacity:1;transform:scale(1.035) translateY(0);filter:blur(0)} 100%{opacity:1;transform:scale(1)} }
    @keyframes pepper-pulso { 0%{opacity:0;transform:scale(.45)} 55%{opacity:1} 100%{opacity:.18;transform:scale(1.25)} }
    @keyframes pepper-splash { 0%,76%{opacity:1;visibility:visible} 100%{opacity:0;visibility:hidden} }
    @media (prefers-reduced-motion:reduce) { .splash-pepper{animation-duration:.65s}.splash-pepper span,.splash-pepper::before{animation:none} }
    .links { display: flex; gap: 6px; }
    .menu-mobile-btn,.menu-mobile,.menu-mobile-fundo,.hud-mobile { display:none; }
    .aba { background: none; border: none; color: var(--muted); font-size: 14px; font-weight: 600; padding: 8px 12px; border-radius: 6px; position: relative; }
    .aba:hover { color: var(--text); }
    .aba.on { color: var(--text); }
    .aba.on::after { content: ""; position: absolute; left: 12px; right: 12px; bottom: 2px; height: 3px; border-radius: 2px; background: var(--grad); }
    .spacer { flex: 1; }
    .busca { width: 44px; height: 38px; padding: 0 14px 0 38px; border-radius: 6px; border: 1px solid transparent; background: transparent url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round'><circle cx='11' cy='11' r='7'/><path d='M20 20l-4-4'/></svg>") no-repeat 12px center;
      outline: none; transition: width .25s, background-color .25s, border-color .25s; cursor: pointer; }
    .busca:focus, .busca:not(:placeholder-shown) { width: min(300px, 50vw); background-color: rgba(0,0,0,.6); border-color: #ffffff55; cursor: text; }
    .btn { padding: 8px 16px; border-radius: 6px; border: 1px solid var(--line); background: rgba(33,27,47,.8); font-size: 14px; white-space: nowrap; }
    .btn:hover { border-color: var(--accent2); }
    .btn.primario { background: var(--grad); border: none; color: #fff; font-weight: 700; }
    .btn.grande { padding: 12px 26px; font-size: 17px; border-radius: 8px; }

    /* ---------- destaque ---------- */
    #hero { position: relative; min-height: 72vh; display: flex; align-items: flex-end; padding: 0 var(--pad) 9vh; overflow: hidden; background: var(--hero-bg, var(--panel)); }
    #hero::after { content: ""; position: absolute; inset: 0; pointer-events: none;
      background: linear-gradient(to top, var(--bg) 3%, transparent 55%), linear-gradient(to right, rgba(0,0,0,.6), transparent 65%); }
.hero-logo { position: absolute; z-index: 1; right: 7%; top: 46%; transform: translateY(-50%); width: min(30vw, 520px); max-height: 38vh; object-fit: contain; filter: drop-shadow(0 8px 30px rgba(0,0,0,.7)); }
.hero-logo.poster { width: auto; max-width: min(28vw, 390px); max-height: 54vh; border-radius: 10px; }
    .hero-banner { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
    .hero-letra { position: absolute; right: 8%; top: 46%; transform: translateY(-50%); font-size: clamp(120px, 24vw, 340px); font-weight: 900; color: rgba(255,255,255,.08); line-height: 1; }
    .hero-conteudo { position: relative; z-index: 1; max-width: 580px; }
    .hero-selo { display: inline-block; font-size: 12px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: var(--accent); margin-bottom: 8px; }
    #hero h1 { margin: 0 0 8px; font-size: clamp(34px, 5.4vw, 72px); line-height: 1.02; letter-spacing: -1.5px; text-shadow: 0 4px 24px rgba(0,0,0,.5); }
    .hero-meta { color: #d4cde6; font-size: 15px; margin-bottom: 20px; }
    .hero-botoes { display: flex; gap: 12px; flex-wrap: wrap; }

    /* ---------- linhas ---------- */
    #linhas { position: relative; z-index: 2; margin-top: -6vh; padding-bottom: 40px; }
    #linhas.sem-hero { margin-top: 0; padding-top: 96px; }
    .mais-vod { display:flex; align-items:center; justify-content:center; gap:14px; padding:28px 24px 8px; color:var(--muted); }
    .mais-vod button { border:1px solid #4a3a63; border-radius:999px; background:#21172f; color:#fff; padding:12px 22px; font-weight:700; cursor:pointer; }
    .mais-vod button:hover { background:#312044; border-color:#ca6adb; }
    .mais-vod button:disabled { opacity:.65; cursor:wait; }
    .linha-cabecalho { display:flex; align-items:center; justify-content:space-between; gap:16px; padding-right:46px; }
    .linha-cabecalho h2 { margin-bottom:12px; }
    .ver-todos, .voltar-vitrine { border:1px solid #554269; background:#20162d; color:#fff; border-radius:999px; padding:9px 16px; font-weight:700; cursor:pointer; }
    .ver-todos:hover, .voltar-vitrine:hover { border-color:#e16ab5; background:#302040; }
    .voltar-vitrine { margin:0 0 22px 46px; }
    .catalogo-vod { padding:0 34px 18px; }
    .catalogo-vod h2 { margin:0 0 18px; }
    .catalogo-vod-topo { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:18px; }
    .catalogo-vod-topo h2 { margin:0; }
    .busca-categoria { width:min(420px, 42vw); border:1px solid #4d3b61; border-radius:999px; background:#171020; color:#fff; padding:12px 18px; font:inherit; outline:none; }
    .busca-categoria:focus { border-color:#dc6dba; box-shadow:0 0 0 3px #dc6dba22; }
    .busca-categoria::placeholder { color:#a99bb7; }
    .catalogo-sem-resultados { color:#b9adca; padding:38px 4px; }
    .pagina-serie { position:fixed; inset:0; z-index:120; overflow:auto; color:#fff; background:#09070e; }
    .pagina-serie::before { content:""; position:absolute; inset:0 0 auto; height:72vh; background:linear-gradient(90deg,#09070e 8%,#09070ecc 48%,#09070e 100%),linear-gradient(0deg,#09070e 0%,transparent 65%),var(--serie-arte) center 24%/cover no-repeat; filter:saturate(.8); opacity:.78; }
    .serie-voltar { position:fixed; z-index:3; top:24px; left:28px; border:1px solid #ffffff35; border-radius:999px; padding:11px 18px; color:#fff; background:#15111dcc; font-weight:700; cursor:pointer; }
    .serie-conteudo { position:relative; z-index:1; width:min(1380px,92vw); margin:auto; padding:110px 0 70px; }
    .serie-cabecalho { min-height:470px; display:flex; align-items:flex-end; gap:34px; }
    .serie-poster { width:230px; aspect-ratio:2/3; object-fit:cover; border-radius:14px; box-shadow:0 24px 70px #000; }
    .serie-info { max-width:720px; padding-bottom:15px; text-shadow:0 2px 18px #000; }
    .serie-plataforma { color:#f079bd; font-weight:900; letter-spacing:.09em; font-size:.82rem; }
    .serie-info h1 { font-size:clamp(2.4rem,5vw,5.4rem); line-height:.95; margin:12px 0 18px; }
    .serie-meta { font-weight:800; font-size:1.05rem; }
    .serie-generos { color:#f08cc8; font-weight:800; }
    .serie-descricao { max-width:650px; color:#ded7e6; line-height:1.65; font-size:1.02rem; }
    .serie-assistir { margin-top:12px; border:0; border-radius:10px; padding:13px 20px; color:#fff; background:linear-gradient(135deg,#914cff,#e66da9); font-weight:900; cursor:pointer; }
    .serie-episodios-area { margin-top:46px; }
    .serie-episodios-area h2 { font-size:1.8rem; }
    .serie-temporadas { display:flex; flex-wrap:wrap; gap:9px; margin:18px 0 24px; }
    .serie-temporadas button { border:1px solid #493a58; border-radius:999px; padding:9px 15px; color:#cfc5d9; background:#17111f; cursor:pointer; }
    .serie-temporadas button.ativa { color:#fff; border-color:#df6db4; background:#5b2852; }
    .serie-episodios { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
    .episodio-card { display:block; overflow:hidden; min-height:120px; text-align:left; padding:0; border:1px solid #33283e; border-radius:12px; color:#fff; background:linear-gradient(145deg,#21182c,#120e18); cursor:pointer; }
    .episodio-card:hover { border-color:#d269b1; transform:translateY(-2px); }
    .episodio-imagem { width:100%; aspect-ratio:16/9; object-fit:cover; display:block; background:#21182c; }
    .episodio-texto { display:grid; gap:7px; padding:14px 15px 16px; }
    .episodio-texto small { color:#bfb3ca; line-height:1.4; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
    .episodio-numero { color:#ec79bc; font-size:.78rem; font-weight:900; }
    .episodio-play { color:#bdb1c9; font-size:.85rem; }
    .serie-credito { display:inline-block; margin-top:24px; color:#a99bb7; font-size:.82rem; }
    @media(max-width:900px){.serie-poster{width:160px}.serie-cabecalho{min-height:400px}.serie-episodios{grid-template-columns:repeat(2,1fr)}}
    @media(max-width:600px){.serie-cabecalho{display:block}.serie-poster{width:130px;margin-bottom:18px}.serie-episodios{grid-template-columns:1fr}}
    .pagina-filme { position:fixed; inset:0; z-index:130; display:grid; place-items:center; overflow:auto; padding:46px 18px; color:#fff; background:#050409dd; backdrop-filter:blur(9px); }
    .filme-painel { position:relative; overflow:hidden; width:min(1050px,94vw); min-height:610px; display:grid; grid-template-columns:minmax(260px,36%) 1fr; border:1px solid #ffffff1f; border-radius:22px; background:#100c17; box-shadow:0 35px 100px #000; isolation:isolate; }
    .filme-painel::before { content:""; position:absolute; z-index:-2; inset:0 0 auto; height:62%; background:var(--filme-arte) center 22%/cover no-repeat; opacity:.5; }
    .filme-painel::after { content:""; position:absolute; z-index:-1; inset:0; background:linear-gradient(90deg,#100c17 4%,#100c17c7 43%,#100c17ad 100%),linear-gradient(0deg,#100c17 28%,transparent 85%); }
    .filme-fechar { position:fixed; z-index:4; top:24px; right:28px; width:44px; height:44px; border:1px solid #ffffff2e; border-radius:50%; color:#fff; background:#15111de8; font-size:30px; line-height:1; }
    .filme-visual { display:flex; align-items:flex-end; justify-content:center; padding:68px 28px 46px; }
    .filme-poster { width:min(260px,100%); aspect-ratio:2/3; object-fit:cover; border-radius:14px; box-shadow:0 20px 60px #000; }
    .filme-conteudo { align-self:end; padding:70px 52px 48px 12px; text-shadow:0 2px 16px #000; }
    .filme-categoria { color:#ef78ba; font-size:.8rem; font-weight:900; letter-spacing:.1em; text-transform:uppercase; }
    .filme-conteudo h1 { margin:10px 0 14px; font-size:clamp(2.4rem,5vw,4.9rem); line-height:.96; letter-spacing:-.04em; }
    .filme-conteudo h2 { margin:28px 0 8px; font-size:1.05rem; }
    .filme-meta { font-weight:850; color:#f4edf8; }
    .filme-generos { color:#ef8cc8; font-weight:800; }
    .filme-acoes { display:flex; flex-wrap:wrap; gap:11px; margin:22px 0; }
    .filme-assistir,.filme-lista { border:0; border-radius:10px; padding:13px 20px; font-weight:900; }
    .filme-assistir { color:#fff; background:linear-gradient(135deg,#914cff,#e66da9); }
    .filme-lista { border:1px solid #ffffff35; color:#fff; background:#191421cc; }
    .filme-lista.ativa { border-color:#e978b6; background:#5b2852dd; }
    .filme-descricao { max-width:650px; margin:0; color:#ddd5e5; line-height:1.65; }
    .filme-carregando { display:flex; align-items:center; gap:9px; margin-top:14px; color:#a99fb2; font-size:.84rem; }
    .filme-carregando::before { content:""; width:13px; height:13px; border:2px solid #ffffff2c; border-top-color:#e978b6; border-radius:50%; animation:filme-girar .7s linear infinite; }
    @keyframes filme-girar { to { transform:rotate(360deg); } }
    .filme-ficha { margin-top:20px; color:#c9bfce; line-height:1.5; }
    .filme-ficha p { margin:7px 0; }
    .filme-ficha strong { color:#fff; }
    .filme-fonte { display:inline-block; margin-top:18px; color:#9f94aa; font-size:.78rem; }
    @media(max-width:760px){.pagina-filme{padding:0}.filme-painel{width:100%;min-height:100vh;border:0;border-radius:0;grid-template-columns:1fr}.filme-visual{padding:90px 24px 10px}.filme-poster{width:150px}.filme-conteudo{padding:22px 24px 48px}.filme-fechar{top:16px;right:16px}.filme-painel::after{background:linear-gradient(0deg,#100c17 48%,transparent 100%)}}
    .catalogo-vod-grade { display:grid; grid-template-columns:repeat(7, minmax(130px, 1fr)); gap:18px 12px; }
    .catalogo-vod-grade .tile { width:auto; min-width:0; }
    .plataforma-catalogo { width:100%; max-width:1180px; margin:0 auto 28px; padding:0 var(--pad); box-sizing:border-box; }
    .plataforma-catalogo h2 { margin:0 0 12px; font-size:19px; }
    #linhas:has(.futebol-cenario) { position:relative; isolation:isolate; overflow:hidden; min-height:100vh; }
    .futebol-cenario { position:absolute; inset:0; z-index:-1; pointer-events:none; overflow:hidden; background:#0b0912; }
    .futebol-cenario::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,#0b0912 0%,rgba(11,9,18,.72) 20%,rgba(11,9,18,.48) 50%,rgba(11,9,18,.78) 82%,#0b0912 100%),linear-gradient(180deg,#0b0912 0%,rgba(11,9,18,.12) 18%,rgba(11,9,18,.7) 76%,#0b0912 100%); }
    .futebol-cenario-imagem { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 8%; opacity:0; filter:saturate(.9) contrast(1.05); transition:opacity 1.8s ease; -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 16%,#000 84%,transparent 100%),linear-gradient(180deg,transparent 0%,#000 10%,#000 78%,transparent 100%); mask-image:linear-gradient(90deg,transparent 0%,#000 16%,#000 84%,transparent 100%),linear-gradient(180deg,transparent 0%,#000 10%,#000 78%,transparent 100%); mask-composite:intersect; -webkit-mask-composite:source-in; }
    .futebol-cenario-imagem.visivel { opacity:.34; }
    .futebol-cabecalho { position:relative; max-width:1180px; margin:0 auto 34px; padding:48px var(--pad) 0; }
    .futebol-cabecalho span { color:#ef72bd; font-size:11px; font-weight:900; letter-spacing:.18em; }
    .futebol-cabecalho h1 { margin:7px 0 3px; font-size:32px; }
    .futebol-cabecalho p { margin:0; color:var(--muted); }
    .futebol-filtros { display:flex; gap:8px; overflow-x:auto; padding:18px 0 4px; scrollbar-width:none; }
    .futebol-filtros button { flex:0 0 auto; border:1px solid #493457; border-radius:999px; padding:9px 14px; background:#171020; color:#cdbed5; font:inherit; font-size:13px; }
    .futebol-filtros button.ativo { background:linear-gradient(135deg,#8a3b9d,#dc6db8); border-color:#e78bca; color:#fff; }
    .futebol-grade { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:14px; max-width:1180px; margin:0 auto; padding:18px var(--pad) 40px; }
    .futebol-card { padding:16px; border:1px solid #ffffff24; border-radius:18px; background:linear-gradient(145deg,rgba(26,18,36,.72),rgba(14,10,20,.62)); backdrop-filter:blur(8px); }
    .futebol-liga { color:#d9c8e2; font-size:12px; font-weight:800; }
    .futebol-status { float:right; color:#ef72bd; font-size:12px; }
    .futebol-favorito { float:right; margin-left:8px; border:0; background:transparent; color:#bda9c9; font-size:22px; line-height:1; }
    .futebol-favorito.ativo { color:#ef72bd; }
    .futebol-confronto { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:18px; position:relative; }
    .futebol-confronto::before { content:'x'; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); color:#ef72bd; font-size:13px; font-weight:900; }
    .futebol-time { display:flex; align-items:center; gap:9px; min-width:0; color:#fff; font-weight:700; }
    .futebol-time img { width:38px; height:38px; object-fit:contain; }
    .futebol-data { margin-top:14px; padding-top:10px; border-top:1px solid #ffffff18; color:#cbbbd3; font-size:12px; text-align:center; }
    @media (max-width:1400px) { .catalogo-vod-grade { grid-template-columns:repeat(5, minmax(130px, 1fr)); } }
    @media (max-width:900px) { .catalogo-vod-grade { grid-template-columns:repeat(3, minmax(110px, 1fr)); } }
    @media (max-width:560px) { .catalogo-vod-grade { grid-template-columns:repeat(2, minmax(110px, 1fr)); } }
    .linha { margin-bottom: 6px; }
    .linha h2 { margin: 0; padding: 0 var(--pad); font-size: 19px; font-weight: 700; }
    .trilho-wrap { position: relative; }
    .trilho { display: flex; gap: 10px; overflow-x: auto; scroll-snap-type: x proximity; padding: 12px var(--pad) 30px; scrollbar-width: none; scroll-padding: 0 var(--pad); }
    .trilho::-webkit-scrollbar { display: none; }
    .seta { position: absolute; top: 12px; bottom: 30px; width: var(--pad); min-width: 36px; z-index: 4; border: none; background: rgba(11,9,18,.6); color: #fff; font-size: 34px; opacity: 0; transition: opacity .2s; }
    .seta.esq { left: 0; } .seta.dir { right: 0; }
    .trilho-wrap:hover .seta { opacity: 1; }
    @media (hover: none) { .seta { display: none; } }

    .tile { flex: 0 0 clamp(150px, 17vw, 250px); aspect-ratio: 16 / 9; border-radius: 8px; position: relative; overflow: hidden; cursor: pointer;
      scroll-snap-align: start; transition: transform .18s ease, box-shadow .18s ease; background: var(--tile-bg); outline: none; }
    .tile.poster { flex-basis: clamp(120px, 12.5vw, 190px); aspect-ratio: 2 / 3; }
    .tile:hover, .tile:focus-visible { transform: scale(1.08); z-index: 3; box-shadow: 0 12px 34px rgba(0,0,0,.65); }
    .tile:focus-visible { box-shadow: 0 0 0 3px var(--accent), 0 12px 34px rgba(0,0,0,.65); }
.tile .card-backdrop { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.tile .card-sombra { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,.82), rgba(0,0,0,.06) 70%); }
.tile .logo-img { position: absolute; inset: 14% 18% 24%; width: 64%; height: 62%; object-fit: contain; filter: drop-shadow(0 2px 6px rgba(0,0,0,.55)); }
    .tile .logo-img.capa { inset: 0; width: 100%; height: 100%; object-fit: cover; filter: none; }
.tile.poster .poster-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
    .tile .letra { position: absolute; inset: 0 0 18% 0; display: grid; place-items: center; font-size: clamp(34px, 5vw, 58px); font-weight: 800; color: rgba(255,255,255,.35); }
    .tile .rotulo { position: absolute; left: 0; right: 0; bottom: 0; padding: 22px 10px 8px; font-size: 13px; font-weight: 600;
      background: linear-gradient(to top, rgba(0,0,0,.85), transparent); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .tile .agora { position: absolute; left: 10px; right: 10px; bottom: 28px; z-index: 2; font-size: 11px; color: #efe9fa; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-shadow: 0 1px 5px #000; }
    .tile .progresso-epg { position: absolute; left: 10px; right: 10px; bottom: 23px; z-index: 2; height: 3px; border-radius: 3px; background: rgba(255,255,255,.25); overflow: hidden; }
    .tile .progresso-epg span { display: block; height: 100%; background: var(--grad); }
    .tile .selo { position: absolute; left: 6px; top: 6px; font-size: 11px; font-weight: 700; padding: 2px 7px; border-radius: 4px; background: rgba(0,0,0,.6); }
    .tile .estrela { position: absolute; top: 6px; right: 6px; width: 30px; height: 30px; border-radius: 50%; border: none; background: rgba(0,0,0,.55); color: #fff; font-size: 16px; opacity: 0; transition: opacity .15s; }
    .tile:hover .estrela, .tile:focus-within .estrela, .estrela.on { opacity: 1; }
    .estrela.on { color: var(--accent); }
    @media (hover: none) { .tile .estrela { opacity: 1; } }

    #resultados { padding: 100px var(--pad) 40px; min-height: 100vh; }
    #resultados h2 { margin: 0 0 16px; font-size: 20px; }
    .grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(clamp(150px, 17vw, 230px), 1fr)); gap: 14px; }
    .grade .tile { flex: none; }
    .grade .tile.poster { }

    .guia-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; padding: 0 var(--pad) 36px; }
    .guia-linha-tempo { padding:0 var(--pad) 42px; }
    .guia-filtros { position:relative; z-index:25; display:flex; gap:9px; overflow-x:auto; margin:0 0 25px; padding:10px 0 12px; background:linear-gradient(180deg,var(--bg) 78%,transparent); scrollbar-width:none; }
    .guia-filtros::-webkit-scrollbar { display:none; }
    .guia-filtros button { flex:0 0 auto; border:1px solid #493a5d; border-radius:999px; padding:10px 17px; color:#bdb3c9; background:#17111f; font-weight:800; }
    .guia-filtros button:hover { color:#fff; border-color:#b45fe4; }
    .guia-filtros button.ativo { color:#fff; border-color:#e678bc; background:linear-gradient(135deg,#743bb2,#b84f91); box-shadow:0 7px 22px #8d46b744; }
    .guia-categorias { position:relative; z-index:26; display:flex; flex-wrap:wrap; gap:8px; margin:-10px 0 28px; }
    .guia-ao-vivo > .guia-categorias { padding:0 var(--pad); margin:0 0 24px; }
    .guia-categorias button { display:flex; align-items:center; gap:8px; border:1px solid #3c324a; border-radius:9px; padding:8px 12px; color:#b9afc5; background:#14101b; font-weight:750; }
    .guia-categorias button:hover { color:#fff; border-color:#8e55bd; background:#1d1528; }
    .guia-categorias button.ativo { color:#fff; border-color:#b765cd; background:#392044; }
    .guia-categorias small { min-width:20px; border-radius:999px; padding:2px 6px; color:#cfc3d8; background:#ffffff0d; font-size:.7rem; text-align:center; }
    .central-ao-vivo { position:relative; width:calc(100% - (var(--pad) * 2)); height:calc(100vh - 155px); min-height:580px; margin:0 var(--pad) 38px; overflow:hidden; border:1px solid #30293a; border-radius:22px; background:#050408; box-shadow:0 25px 70px #0008; }
    .live-palco { position:absolute; inset:0; overflow:hidden; background:#08060d; }
    .live-fundo,.live-video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
    .live-fundo { opacity:.65; filter:blur(2px) saturate(.8); transform:scale(1.02); }
    .live-video { z-index:1; background:transparent; }
    .live-palco::after { content:""; position:absolute; z-index:2; inset:0; pointer-events:none; background:linear-gradient(90deg,#07050bc7 0,#07050b48 42%,transparent 72%),linear-gradient(0deg,#07050bbd,transparent 35%); }
    .live-painel { position:absolute; z-index:5; inset:20px auto 20px 20px; width:min(440px,38vw); display:flex; flex-direction:column; padding:24px; border:1px solid #ffffff26; border-radius:20px; color:#fff; background:#0b09128f; -webkit-backdrop-filter:blur(13px) saturate(1.15); backdrop-filter:blur(13px) saturate(1.15); box-shadow:0 18px 55px #0007; transition:opacity .24s ease,transform .28s cubic-bezier(.2,.8,.2,1); }
    .live-topo { display:flex; align-items:flex-start; justify-content:space-between; gap:15px; }
    .live-topo-resumo { flex:1; display:flex; align-items:baseline; justify-content:space-between; gap:15px; }
    .live-topo h2 { margin:0; font-size:1.8rem; }
    .live-topo span { color:#e77abc; font-weight:850; white-space:nowrap; }
    .live-fechar { flex:0 0 30px; width:30px; height:30px; display:grid; place-items:center; margin:-7px -8px 0 0; border:1px solid transparent; border-radius:50%; padding:0; color:#b9aebf; background:transparent; font-size:1.65rem; line-height:1; transition:.18s; }
    .live-fechar:hover { border-color:#ffffff24; color:#fff; background:#ffffff0d; transform:rotate(8deg); }
    .live-reabrir { position:absolute; z-index:6; left:20px; top:20px; display:flex; align-items:center; gap:7px; border:1px solid #ffffff28; border-radius:999px; padding:8px 12px; color:#eee7f3; background:#09070d8f; -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); font-size:.78rem; font-weight:750; opacity:0; pointer-events:none; transform:translateX(-10px); transition:.22s ease; }
    .live-reabrir:hover { border-color:#e073bb88; color:#fff; background:#17101ba8; }
    .central-ao-vivo.painel-fechado .live-painel { opacity:0; pointer-events:none; transform:translateX(calc(-100% - 40px)); }
    .central-ao-vivo.painel-fechado .live-reabrir { opacity:1; pointer-events:auto; transform:none; }
    .live-busca { width:100%; margin:16px 0; border:1px solid #ffffff18; border-radius:999px; padding:11px 16px; color:#fff; background:#ffffff0b; outline:none; }
    .live-busca:focus { border-color:#d16ab1; box-shadow:0 0 0 3px #d16ab122; }
    .live-painel .guia-categorias { flex-wrap:nowrap; overflow-x:auto; margin:0 0 13px; padding:0 0 10px; scrollbar-width:thin; scrollbar-color:#d76db5 #ffffff12; }
    .live-painel .guia-categorias::-webkit-scrollbar { display:block; height:6px; }
    .live-painel .guia-categorias::-webkit-scrollbar-track { border-radius:999px; background:#ffffff12; }
    .live-painel .guia-categorias::-webkit-scrollbar-thumb { border-radius:999px; background:linear-gradient(90deg,#9b5de5,#e879b4); }
    .live-painel .guia-categorias button { flex:0 0 auto; }
    .live-lista { flex:1; min-height:0; overflow:auto; padding-right:5px; scrollbar-color:#665773 transparent; }
    .live-canal { width:100%; display:grid; grid-template-columns:32px 52px 1fr; align-items:center; gap:10px; border:1px solid transparent; border-radius:13px; padding:9px 10px; color:#fff; background:transparent; text-align:left; }
    .live-canal:hover { background:#ffffff0b; }
    .live-canal.ativo { border-color:#df6dbb; background:#ffffff12; box-shadow:inset 3px 0 #df6dbb; }
    .live-canal.indisponivel { opacity:.48; filter:saturate(.35); }
    .live-canal.indisponivel .live-textos small { color:#ff9eae; }
    .live-numero { color:#756d7f; font-size:.82rem; font-weight:800; text-align:center; }
    .live-canal.ativo .live-numero { color:#f183c5; }
    .live-logo { position:relative; width:52px; height:52px; display:grid; place-items:center; overflow:hidden; border:1px solid #ffffff1d; border-radius:12px; background:#ffffff0b; font-weight:900; }
    .live-logo img { position:absolute; inset:6px; width:calc(100% - 12px); height:calc(100% - 12px); object-fit:contain; }
    .live-textos { display:grid; min-width:0; gap:4px; }
    .live-textos strong,.live-textos small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    .live-textos small { color:#afa5b8; font-size:.78rem; }
    .live-progresso { height:3px; overflow:hidden; border-radius:3px; background:#ffffff1a; }
    .live-progresso i { display:block; height:100%; background:linear-gradient(90deg,#8b5cf6,#e879a6); }
    .live-estado { position:absolute; z-index:6; left:50%; top:50%; display:none; border:1px solid #ffffff22; border-radius:999px; padding:11px 17px; background:#09070dbd; transform:translate(-50%,-50%); }
    .live-estado.visivel { display:block; }
    .live-info { position:absolute; z-index:4; left:min(500px,43vw); right:32px; bottom:198px; display:grid; gap:5px; text-shadow:0 2px 16px #000; transition:left .28s cubic-bezier(.2,.8,.2,1),opacity .32s ease,transform .32s ease; }
    .live-info span { color:#f075ba; font-size:.78rem; font-weight:900; letter-spacing:.08em; }
    .live-info strong { font-size:clamp(1.45rem,2.3vw,2.5rem); }
    .live-info small { color:#e6dfeb; font-size:.92rem; }
    .live-agenda { position:absolute; z-index:4; left:min(500px,43vw); right:28px; bottom:78px; min-width:0; color:#fff; transition:left .28s cubic-bezier(.2,.8,.2,1),opacity .32s ease,transform .32s ease; }
    .central-ao-vivo.painel-fechado .live-info,.central-ao-vivo.painel-fechado .live-agenda { left:28px; }
    .live-controles { position:absolute; z-index:6; left:min(500px,43vw); right:28px; bottom:16px; height:48px; display:flex; align-items:center; gap:10px; border:1px solid #ffffff22; border-radius:15px; padding:0 12px; color:#fff; background:#08060cad; -webkit-backdrop-filter:blur(16px) saturate(1.15); backdrop-filter:blur(16px) saturate(1.15); box-shadow:0 10px 30px #0007; transition:left .28s cubic-bezier(.2,.8,.2,1),opacity .32s ease,transform .32s ease; }
    .central-ao-vivo.painel-fechado .live-controles { left:28px; }
    .live-controle { width:34px; height:34px; display:grid; place-items:center; flex:0 0 34px; border:0; border-radius:9px; padding:0; color:#f7f2f9; background:transparent; font-size:1rem; }
    .live-controle:hover { color:#fff; background:#ffffff12; }
    .live-indicador { flex:0 0 auto; border:1px solid #ffffff1d; border-radius:999px; padding:5px 9px; color:#eee7f2; background:#ffffff0a; font-size:.67rem; font-weight:850; }
    .live-ao-vivo { cursor:pointer; color:#ff8bcd; border-color:#e879b455; transition:.18s ease; }
    .live-ao-vivo:hover,.live-ao-vivo.confirmado { color:#fff; border-color:#ff8bcd; background:#d85fa527; box-shadow:0 0 0 3px #d85fa51f; }
    .live-fonte { color:#c9bfce; font-weight:700; }
    .live-volume { width:92px; height:4px; accent-color:#e374bc; cursor:pointer; }
    .live-tela-cheia { margin-left:auto; font-size:1.15rem; }
    /* "tela" = quadro do vídeo; no computador ela some do layout e os controles continuam por cima do palco */
    .live-tela { display:contents; }
    .live-controle[hidden], .live-menu[hidden] { display:none; }
    .live-faixas, .live-proxima { font-size:1.05rem; }
    .live-menu { position:absolute; z-index:7; right:28px; bottom:74px; min-width:210px; max-width:min(320px,80vw); max-height:60%; overflow:auto; padding:8px; border:1px solid #ffffff26; border-radius:14px; background:#0b0912f2; -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); box-shadow:0 14px 40px #000a; }
    .live-menu-titulo { padding:8px 10px 4px; color:#e78bc6; font-size:.68rem; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
    .live-menu-item { display:block; width:100%; border:0; border-radius:9px; padding:9px 10px; color:#f3edf7; background:transparent; font-size:.82rem; text-align:left; }
    .live-menu-item:hover { background:#ffffff12; }
    .live-menu-item.ativa { color:#fff; background:#d85fa52e; box-shadow:inset 3px 0 #e574bd; }
    .central-ao-vivo.controles-ocultos .live-menu { opacity:0; pointer-events:none; }
    .central-ao-vivo.controles-ocultos .live-info,.central-ao-vivo.controles-ocultos .live-agenda,.central-ao-vivo.controles-ocultos .live-controles { opacity:0; pointer-events:none; transform:translateY(14px); }
    .central-ao-vivo.controles-ocultos.painel-fechado .live-palco { cursor:none; }
    .central-ao-vivo:fullscreen.controles-ocultos .live-reabrir { opacity:0; pointer-events:none; transform:translateY(-8px); }
    .central-ao-vivo:fullscreen .live-agenda-trilho { gap:8px; scroll-padding-inline:0; }
    .central-ao-vivo:fullscreen .live-agenda-item { flex:0 0 calc((100% - 48px) / 7); min-width:0; }
    .central-ao-vivo:fullscreen .live-agenda-item:last-child { margin-right:0; }
    .live-agenda-topo { display:flex; align-items:baseline; justify-content:space-between; gap:16px; margin-bottom:8px; text-shadow:0 2px 12px #000; }
    .live-agenda-topo strong { font-size:1rem; }
    .live-agenda-topo small { color:#d1c8d7; font-size:.72rem; }
    .live-agenda-trilho { display:flex; gap:9px; overflow-x:auto; padding:0 0 10px; scroll-snap-type:x proximity; scrollbar-width:thin; scrollbar-color:#d76db5 #ffffff17; }
    .live-agenda-trilho::-webkit-scrollbar { height:6px; }
    .live-agenda-trilho::-webkit-scrollbar-track { border-radius:999px; background:#ffffff17; }
    .live-agenda-trilho::-webkit-scrollbar-thumb { border-radius:999px; background:linear-gradient(90deg,#9b5de5,#e879b4); }
    .live-agenda-item { flex:0 0 168px; min-height:60px; display:grid; align-content:start; gap:2px; border:1px solid #ffffff20; border-radius:10px; padding:7px 9px; color:#fff; background:#09070d99; -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); text-align:left; scroll-snap-align:start; }
    .live-agenda-item:hover { border-color:#de76bc; background:#17101db8; }
    .live-agenda-item.atual { border-color:#e574bd; box-shadow:inset 3px 0 #e574bd; }
    .live-agenda-item.agendado { border-color:#9c75ed; background:#27183cb8; }
    .live-agenda-item time { color:#f080c3; font-size:.63rem; font-weight:900; text-transform:uppercase; }
    .live-agenda-item strong { overflow:hidden; color:#fff; font-size:.75rem; line-height:1.15; text-overflow:ellipsis; white-space:nowrap; }
    .live-agenda-item small { overflow:hidden; color:#bcb1c4; font-size:.6rem; text-overflow:ellipsis; white-space:nowrap; }
    .live-sem-resultados { padding:32px 10px; color:#a99faf; text-align:center; }
    @media(max-width:850px){.central-ao-vivo{height:auto;min-height:1040px}.live-palco{height:52vh;min-height:440px}.live-painel{inset:calc(52vh - 20px) 10px 10px;width:auto}.live-info{left:20px;right:20px;bottom:172px;top:auto}.live-info strong{font-size:1.65rem}.live-info small{max-width:72vw}.live-agenda{left:20px;right:16px;bottom:68px}.live-agenda-topo small{display:none}.live-agenda-item{flex-basis:145px}.live-controles{left:20px;right:16px;bottom:10px}.live-volume{width:62px}.live-fonte{display:none}.live-reabrir{left:14px;top:14px}.central-ao-vivo.painel-fechado .live-info,.central-ao-vivo.painel-fechado .live-agenda,.central-ao-vivo.painel-fechado .live-controles{left:20px}.live-estado{top:19vh}}
    .guia-faixa { position:relative; margin:0 0 30px; padding-left:78px; }
    .guia-faixa::before { content:""; position:absolute; left:51px; top:35px; bottom:-30px; width:2px; background:linear-gradient(#b35ee3,#31223c); }
    .guia-faixa-titulo { position:relative; margin:0 0 14px; color:#f08ac7; font-size:16px; letter-spacing:.02em; }
    .guia-faixa-titulo::before { content:""; position:absolute; left:-33px; top:50%; width:12px; height:12px; border:3px solid var(--bg); border-radius:50%; background:#dc6db5; box-shadow:0 0 0 2px #743d78; transform:translateY(-50%); }
    .guia-faixa-grade { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:12px; }
    .programa-card { position: relative; min-height: 184px; border: 1px solid var(--line); border-radius: 15px; padding: 15px 16px 18px; overflow: hidden; background: linear-gradient(135deg,rgba(35,26,50,.96),rgba(15,12,23,.98)); cursor: pointer; transition:transform .18s,border-color .18s,box-shadow .18s; }
    .programa-card::before { content:""; position:absolute; inset:0; z-index:0; background:var(--programa-fundo); opacity:.12; pointer-events:none; }
    .programa-card > * { position:relative; z-index:1; }
    .programa-card:hover, .programa-card:focus-visible { border-color:#a967e8; transform:translateY(-3px); box-shadow:0 14px 34px #0006; outline:none; }
    .programa-cabecalho { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:54px; }
    .programa-identidade { display:flex; align-items:center; gap:11px; min-width:0; }
    .programa-logo { position:relative; flex:0 0 54px; width:54px; height:54px; display:grid; place-items:center; overflow:hidden; border:1px solid #ffffff24; border-radius:13px; color:#fff; background:#ffffff0c; font-size:22px; font-weight:900; box-shadow:inset 0 0 18px #ffffff0b; }
    .programa-logo img { position:absolute; inset:7px; width:calc(100% - 14px); height:calc(100% - 14px); object-fit:contain; filter:drop-shadow(0 2px 5px #0008); }
    .programa-card .horario { flex:0 0 auto; color:var(--accent); font-size:11px; line-height:1.35; text-align:right; white-space:pre-line; font-weight:850; letter-spacing:.35px; text-transform:uppercase; }
    .programa-card h3 { margin:14px 0 5px; font-size:18px; line-height:1.18; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
    .programa-card .canal { overflow:hidden; color:#eee7f8; font-size:13px; font-weight:800; text-overflow:ellipsis; white-space:nowrap; }
    .programa-card .descricao { color:#afa4bf; font-size:12px; line-height:1.4; margin-top:7px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
    .programa-card .barra-epg { position: absolute; left: 16px; right: 16px; bottom: 12px; height: 4px; background: rgba(255,255,255,.15); border-radius: 4px; overflow: hidden; }
    .programa-card .barra-epg span { display: block; height: 100%; background: var(--grad); }
    @media(max-width:650px){.guia-linha-tempo{padding-inline:14px}.guia-faixa{padding-left:25px}.guia-faixa::before{left:4px}.guia-faixa-titulo::before{left:-27px}.guia-faixa-grade{grid-template-columns:1fr}}
    .estado-epg { padding: 110px var(--pad) 18px; color: var(--muted); }

    #vazio { text-align: center; padding: 24vh 20px 12vh; color: var(--muted); max-width: 640px; margin: 0 auto; }
    #vazio h2 { color: var(--text); margin: 0 0 10px; }
    #vazio pre { text-align: left; background: var(--panel); border: 1px solid var(--line); border-radius: 10px; padding: 14px; font-size: 12.5px; overflow-x: auto; color: var(--text); }
    footer { text-align: center; color: var(--muted); font-size: 12px; padding: 10px 16px 40px; }

    /* ---------- player ---------- */
    #palco { position: fixed; inset: 0; z-index: 50; background: #000; display: flex; flex-direction: column; }
    #palco video { flex: 1; width: 100%; min-height: 0; background: #000; }
    .topo { position: absolute; top: 0; left: 0; right: 0; z-index: 2; display: flex; align-items: center; gap: 12px; padding: 18px 24px 52px;
      background: linear-gradient(to bottom, rgba(0,0,0,.92), rgba(0,0,0,.5) 60%, transparent); transition: opacity .3s; }
    .topo h3 { margin: 0; font-size: 20px; text-shadow: 0 1px 10px rgba(0,0,0,.9); }
    .topo .cat { color: #cfc8e2; font-size: 14px; text-shadow: 0 1px 8px rgba(0,0,0,.9); }
    .topo .btn, .topo select { background: rgba(0,0,0,.45); border: 1px solid rgba(255,255,255,.12); backdrop-filter: blur(6px); }
    .topo select { padding: 8px 12px; border-radius: 6px; max-width: 220px; }
    .topo select option { background: #1b1626; }
    .topo .btn:hover { background: rgba(255,255,255,.22); }
    .voltar { width: 42px; height: 42px; border-radius: 50%; border: none; background: rgba(255,255,255,.14); color: #fff; font-size: 22px; flex: none; }
    .voltar:hover { background: rgba(255,255,255,.28); }
    #fontes { position: relative; flex: none; }
    #fontes:empty { display: none; }
    #fontes .fontes-gatilho { display: flex; align-items: center; gap: 8px; min-height: 38px; padding: 7px 12px; border-radius: 10px; border: 1px solid rgba(255,255,255,.13); background: rgba(12,9,18,.64); color: #fff; font-size: 12px; font-weight: 700; backdrop-filter: blur(12px); }
    #fontes .fontes-gatilho svg { width: 18px; height: 18px; }
    #fontes .fontes-gatilho:hover, #fontes .fontes-gatilho[aria-expanded="true"] { background: rgba(255,255,255,.16); border-color: rgba(255,255,255,.24); }
    .fontes-painel { position: absolute; top: calc(100% + 9px); right: 0; z-index: 5; width: min(290px, 76vw); padding: 8px; border: 1px solid rgba(255,255,255,.13); border-radius: 14px; background: rgba(16,12,24,.96); box-shadow: 0 18px 48px rgba(0,0,0,.58); backdrop-filter: blur(18px); }
    .fontes-painel[hidden] { display: none; }
    .fontes-cabecalho { padding: 7px 10px 9px; color: #aaa1bc; font-size: 11px; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
    .fontes-opcoes { display: flex; flex-direction: column; gap: 3px; max-height: min(52vh, 390px); overflow-y: auto; padding-right: 2px; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.24) transparent; }
    #fontes .fontes-opcoes button { width: 100%; flex: none; padding: 10px 12px; border-radius: 9px; border: 0; background: transparent; color: #ded8eb; font-size: 13px; font-weight: 650; text-align: left; white-space: nowrap; transition: background .18s, color .18s, transform .15s; }
    #fontes .fontes-opcoes button:hover { color: #fff; background: rgba(255,255,255,.1); }
    #fontes button:active { transform: scale(.97); }
    #fontes .fontes-opcoes button.ativa { color: #fff; background: linear-gradient(90deg, rgba(157,78,221,.34), rgba(221,107,173,.2)); }
    #fontes .fontes-opcoes button.ativa::after { content: "✓"; float: right; color: #e879c4; }
    #aviso { position: absolute; left: 24px; bottom: 124px; z-index: 3; font-size: 14px; padding: 8px 14px; border-radius: 8px; background: rgba(20,16,30,.85); backdrop-filter: blur(8px); transition: opacity .3s; cursor: default; }
    #aviso.erro { color: #fca5a5; }
    #palco.ocioso { cursor: none; }
    #palco.ocioso .topo, #palco.ocioso .controles, #palco.ocioso #aviso:not(.erro) { opacity: 0; pointer-events: none; }

    .spinner { position: absolute; top: 50%; left: 50%; width: 56px; height: 56px; margin: -28px 0 0 -28px; border: 4px solid rgba(255,255,255,.18); border-top-color: var(--accent); border-radius: 50%; animation: gira .8s linear infinite; pointer-events: none; z-index: 1; }
    @keyframes gira { to { transform: rotate(360deg); } }
    .centro { position: absolute; top: 50%; left: 50%; width: 92px; height: 92px; margin: -46px 0 0 -46px; border-radius: 50%; background: rgba(0,0,0,.55); display: grid; place-items: center; opacity: 0; pointer-events: none; z-index: 1; }
    .centro svg { width: 46px; height: 46px; color: #fff; }
    .centro.flash { animation: flash .6s ease-out; }
    @keyframes flash { 0% { opacity: .9; transform: scale(.8); } 100% { opacity: 0; transform: scale(1.35); } }

    .controles { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; padding: 56px 24px 14px; background: linear-gradient(to top, rgba(0,0,0,.9), rgba(0,0,0,.45) 55%, transparent); transition: opacity .3s; }
    .barra { position: relative; height: 20px; display: flex; align-items: center; cursor: pointer; touch-action: none; }
    .barra.oculta { display: none; }
    .barra::before { content: ""; position: absolute; left: 0; right: 0; height: 4px; border-radius: 3px; background: rgba(255,255,255,.22); transition: height .12s; }
    .barra .buf, .barra .prog { position: absolute; left: 0; height: 4px; width: 0; border-radius: 3px; pointer-events: none; transition: height .12s; }
    .barra .buf { background: rgba(255,255,255,.32); }
    .barra .prog { background: var(--grad); }
    .barra:hover::before, .barra:hover .buf, .barra:hover .prog, .barra.arrastando::before, .barra.arrastando .buf, .barra.arrastando .prog { height: 7px; }
    .bolinha { position: absolute; top: 50%; left: 0; width: 16px; height: 16px; margin: -8px 0 0 -8px; border-radius: 50%; background: #fff; box-shadow: 0 0 10px rgba(0,0,0,.6); transform: scale(0); transition: transform .12s; pointer-events: none; }
    .barra:hover .bolinha, .barra.arrastando .bolinha { transform: scale(1); }
    .dica { position: absolute; bottom: 24px; left: 0; transform: translateX(-50%); padding: 3px 9px; border-radius: 6px; background: rgba(20,16,30,.95); font-size: 12px; font-variant-numeric: tabular-nums; opacity: 0; pointer-events: none; transition: opacity .12s; }
    .barra:hover .dica { opacity: 1; }

    .linha-ctl { display: flex; align-items: center; gap: 2px; margin-top: 4px; }
    .ctl { width: 44px; height: 44px; border-radius: 50%; border: none; background: none; color: #fff; display: grid; place-items: center; opacity: .9; transition: background .15s, opacity .15s, transform .1s; padding: 0; }
    .ctl svg { width: 27px; height: 27px; }
    .ctl:hover { background: rgba(255,255,255,.14); opacity: 1; }
    .ctl:active { transform: scale(.92); }
    .ctl[hidden], .pill[hidden], .aovivo[hidden], #c-tempo[hidden], .menu-wrap[hidden] { display: none; }
    .vol { display: flex; align-items: center; }
    .vol input { width: 0; opacity: 0; margin: 0; transition: width .2s, opacity .2s, margin .2s; }
    .vol:hover input, .vol:focus-within input { width: 86px; opacity: 1; margin: 0 10px 0 2px; }
    input[type=range] { -webkit-appearance: none; appearance: none; height: 4px; border-radius: 3px; cursor: pointer; outline: none;
      background: linear-gradient(to right, #fff var(--v, 100%), rgba(255,255,255,.28) var(--v, 100%)); }
    input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; width: 13px; height: 13px; border-radius: 50%; background: #fff; border: none; box-shadow: 0 0 6px rgba(0,0,0,.6); }
    input[type=range]::-moz-range-thumb { width: 13px; height: 13px; border-radius: 50%; background: #fff; border: none; }
    #c-tempo { font-size: 14px; font-variant-numeric: tabular-nums; margin-left: 8px; color: #e8e2f5; white-space: nowrap; }
    .aovivo { margin-left: 8px; border: none; background: rgba(255,255,255,.12); color: #fff; font-size: 12px; font-weight: 800; letter-spacing: 1px; padding: 6px 12px; border-radius: 999px; }
    .aovivo::before { content: "● "; color: #ef4444; }
    .aovivo:hover { background: rgba(255,255,255,.22); }
    .pill { padding: 6px 12px; border-radius: 999px; border: none; background: rgba(255,255,255,.12); color: #fff; font-size: 13px; font-weight: 700; min-width: 54px; }
    .pill:hover { background: rgba(255,255,255,.22); }
    .menu-wrap { position: relative; margin-left: 6px; }
    .menu { position: absolute; bottom: 52px; right: 0; min-width: 150px; padding: 6px; border-radius: 12px; background: rgba(22,18,31,.96); border: 1px solid var(--line); backdrop-filter: blur(10px); box-shadow: 0 12px 34px rgba(0,0,0,.6); display: flex; flex-direction: column; }
    .menu[hidden] { display: none; }
    .menu button { background: none; border: none; color: #fff; text-align: left; padding: 9px 14px; border-radius: 8px; font-size: 14px; white-space: nowrap; }
    .menu button:hover { background: rgba(255,255,255,.1); }
    .menu button.sel { color: var(--accent); font-weight: 700; }
    .menu button.sel::after { content: "  ✓"; }
    @media (max-width: 700px) {
      .vol input { display: none; }
      .controles { padding: 40px 12px 8px; }
      .ctl { width: 38px; height: 38px; } .ctl svg { width: 23px; height: 23px; }
      #c-tempo { font-size: 12px; margin-left: 2px; }
      #aviso { left: 12px; bottom: 100px; }
    }

    /* ---------- importar ---------- */
    dialog { width: min(660px, 92vw); border: 1px solid var(--line); border-radius: 14px; background: var(--panel); color: var(--text); padding: 24px; }
    dialog::backdrop { background: rgba(0,0,0,.7); }
    dialog h3 { margin: 0 0 4px; font-size: 20px; }
    dialog p { color: var(--muted); font-size: 14px; margin: 4px 0 12px; }
    textarea { width: 100%; height: 190px; padding: 12px; border-radius: 10px; border: 1px solid var(--line); background: var(--card); resize: vertical; font-family: ui-monospace, Consolas, monospace; font-size: 12.5px; }
    .linha-dlg { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
    .linha-dlg input[type=url] { flex: 1; min-width: 200px; padding: 9px 12px; border-radius: 8px; border: 1px solid var(--line); background: var(--card); }
    #msg, #epg-msg { font-size: 13px; min-height: 18px; margin-top: 10px; color: var(--muted); }
    #msg.erro, #epg-msg.erro { color: #f87171; } #msg.ok, #epg-msg.ok { color: #86efac; }
    .rodape-dlg { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-top: 16px; flex-wrap: wrap; }
    .rodape-dlg .grupo { display: flex; gap: 8px; flex-wrap: wrap; }

    @media (max-width: 700px) {
      #nav { gap: 8px; padding: 10px var(--pad); flex-wrap: wrap; }
      .logo { font-size: 20px; }
      .links { order: 5; width: 100%; overflow-x: auto; }
  #hero { min-height: 56vh; padding-top: 110px; } .hero-logo { width: min(42vw, 300px); right: 4%; opacity: .78; }
      #linhas.sem-hero { padding-top: 130px; }
      .topo { padding: 12px; flex-wrap: wrap; } #fontes { margin-left: auto; } .fontes-painel { right: 0; }
    }

    /* ---------- segunda tela / conectar TV ---------- */
    .btn-tv { border-color: rgba(232,121,166,.42); background: rgba(79,35,78,.72); }
    .btn-tv:hover { background: rgba(111,43,99,.9); }
    .btn-tv.conectado { border-color: #5ee6ae; color: #dfffee; background: rgba(22,85,65,.72); }
    .btn-tv.conectado::first-letter { color:#5ee6ae; }
    .c-tv { border: 1px solid rgba(232,121,166,.45); background: linear-gradient(135deg,rgba(139,92,246,.5),rgba(232,121,166,.45)); }
    .dlg-tv { width:min(560px,94vw); padding:0; overflow:hidden; border-radius:24px; background:linear-gradient(145deg,#21172e,#120e1a); box-shadow:0 34px 100px #000c; }
    .dlg-tv::backdrop { background:rgba(3,2,7,.8); backdrop-filter:blur(7px); }
    .tv-dialogo-topo { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; padding:26px 28px 16px; }
    .tv-dialogo-topo h3 { margin:3px 0 0; font-size:clamp(23px,4vw,31px); letter-spacing:-.03em; }
    .tv-kicker { color:var(--accent); font-size:11px; font-weight:900; letter-spacing:.16em; }
    .tv-fechar { width:38px; height:38px; border:1px solid #ffffff20; border-radius:50%; background:#ffffff0c; color:#fff; font-size:27px; line-height:1; }
    #tv-desconectado,#tv-conectado { padding:4px 28px 28px; }
    #tv-desconectado p { margin:0 0 22px; line-height:1.55; }
    #tv-endereco { color:#fff; overflow-wrap:anywhere; }
    .tv-codigo-label { display:block; margin-bottom:8px; color:#bdb1cc; font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
    .tv-codigo-linha { display:flex; gap:10px; }
    .tv-codigo { min-width:0; flex:1; padding:14px 16px; border:1px solid #5a466e; border-radius:12px; outline:0; background:#0e0a15; font:800 26px/1 ui-monospace,SFMono-Regular,Consolas,monospace; letter-spacing:.13em; text-align:center; }
    .tv-codigo:focus { border-color:var(--accent); box-shadow:0 0 0 4px rgba(232,121,166,.12); }
    .tv-msg { min-height:20px; margin-top:12px; color:#a8d9c5; font-size:13px; }.tv-msg.erro{color:#fca5a5}
    .tv-status { display:flex; align-items:center; gap:13px; padding:14px 16px; border:1px solid #55d7a43d; border-radius:14px; background:#17392e5c; }
    .tv-status>span { width:12px; height:12px; border-radius:50%; background:#5ee6ae; box-shadow:0 0 18px #5ee6ae; }
    .tv-status div { display:grid; gap:2px; }.tv-status small{color:#b6cfc5}
    .tv-agora { display:grid; gap:5px; min-height:110px; margin:16px 0; padding:18px; border-radius:16px; background:linear-gradient(135deg,#2a1b3a,#171020); }
    .tv-agora small{color:var(--accent);font-size:10px;font-weight:900;letter-spacing:.13em}.tv-agora strong{font-size:20px}.tv-agora span{color:var(--muted);font-size:13px}
    .tv-remoto { display:flex; justify-content:center; align-items:center; gap:18px; padding:8px 0 20px; }
    .tv-remoto button { width:58px; height:58px; border:1px solid #ffffff20; border-radius:50%; background:#ffffff0b; color:#fff; font-size:20px; }.tv-remoto button small{font-size:11px}
    .tv-remoto .tv-play { width:74px;height:74px;border:0;background:var(--grad);font-size:25px;box-shadow:0 12px 35px #8b5cf63d}
    .tv-desconectar { display:block; margin:auto; color:#c4b9d0; background:transparent; }
    @media(max-width:700px){
      #nav .btn-tv { order:2; margin-left:auto; }
      #nav #abrir-epg,#nav #abrir-importar { display:none; }
      #nav .busca { order:3; }
      .tv-codigo-linha{align-items:stretch}.tv-codigo-linha .btn{padding-inline:14px}
      .linha-ctl .c-tv{position:absolute;right:14px;bottom:62px;padding:9px 14px;background:#20162ee8;backdrop-filter:blur(10px)}
    }

    /* ---------- experiência mobile ---------- */
    .player-acoes { display:flex; align-items:center; gap:10px; }
    @media (max-width: 760px) {
      :root { --pad:14px; }
      html { scroll-padding-top:76px; }
      body { padding-bottom:calc(78px + env(safe-area-inset-bottom)); }
      button, select, input { min-height:44px; }

      #nav { top:0; height:calc(72px + env(safe-area-inset-top)); padding:calc(env(safe-area-inset-top) + 8px) 14px 8px; gap:10px; flex-wrap:nowrap; background:linear-gradient(180deg,rgba(10,8,16,.98),rgba(10,8,16,.82),transparent); border-bottom:0; }
      #nav.solido { background:rgba(10,8,16,.94); }
      .menu-mobile-btn { display:grid; place-items:center; flex:none; width:44px; height:44px; min-height:44px; padding:0; border:1px solid #ffffff20; border-radius:15px; background:#181321cc; color:#fff; font-size:25px; }
      .logo { font-size:21px; flex:none; gap:0; }
      #nav>.spacer { display:block; }
      #nav #abrir-epg, #nav #abrir-importar { display:none; }
      #nav .busca, #nav #abrir-tv { display:none; }
      #nav .busca:focus, #nav .busca:not(:placeholder-shown) { display:block; }
      #nav .btn-tv { order:initial; margin:0; width:44px; min-width:44px; height:44px; padding:0; overflow:hidden; color:transparent; font-size:0; border-radius:13px; }
      #nav .btn-tv::before { content:"▣"; display:grid; place-items:center; color:#fff; font-size:19px; }
      .busca { order:initial !important; flex:none; width:44px; height:44px; padding:0; border-radius:13px; background-position:center; }
      .busca:focus, .busca:not(:placeholder-shown) { position:fixed; z-index:102; top:calc(env(safe-area-inset-top) + 9px); left:14px; width:calc(100% - 28px); padding:0 44px 0 42px; background-color:#17131f; border-color:#705185; box-shadow:0 12px 36px #000b; }

      #nav>.links { display:none; }
      .aba { min-width:0; min-height:54px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; padding:4px 1px; border-radius:14px; font-size:9.5px; line-height:1.05; white-space:normal; text-align:center; touch-action:manipulation; }
      .aba::before { height:21px; font-size:18px; line-height:21px; color:#aaa1b8; }
      .aba[data-aba="inicio"]::before { content:"⌂"; }
      .aba[data-aba="series"]::before { content:"▤"; }
      .aba[data-aba="filmes"]::before { content:"▶"; }
      .aba[data-aba="guia"]::before { content:"▦"; }
      .aba[data-aba="aovivo"]::before { content:"●"; font-size:13px; }
      .aba[data-aba="lista"]::before { content:"＋"; }
      .aba.on::before { color:#e879c4; }
      .aba.on { background:linear-gradient(180deg,#a14cd022,#e879a614); }
      .aba.on::after { left:27%; right:27%; top:auto; bottom:1px; height:3px; }

      .hud-mobile { position:fixed; z-index:110; left:50%; bottom:calc(8px + env(safe-area-inset-bottom)); transform:translateX(-50%); width:min(330px,calc(100% - 32px)); height:66px; padding:5px; display:grid; grid-template-columns:repeat(3,1fr); gap:3px; border:1px solid #ffffff22; border-radius:26px; background:rgba(34,29,42,.64); -webkit-backdrop-filter:blur(24px) saturate(1.45); backdrop-filter:blur(24px) saturate(1.45); box-shadow:0 14px 44px #000b,inset 0 1px 0 #ffffff18; }
      .hud-mobile-item { min-width:0; min-height:54px; padding:5px 3px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; border:0; border-radius:21px; background:transparent; color:#c8c0d3; font-size:10px; font-weight:700; }
      .hud-mobile-item span { font-size:24px; line-height:22px; font-weight:400; }
      .hud-mobile-item.on { color:#fff; background:linear-gradient(135deg,#ffffff29,#ffffff10); box-shadow:inset 0 1px 0 #ffffff1f; }
      .hud-mobile-item.on::after,.hud-mobile-item::before { display:none; }
      .menu-mobile-fundo { position:fixed; z-index:198; inset:0; display:block; background:rgba(2,1,5,.58); -webkit-backdrop-filter:blur(5px); backdrop-filter:blur(5px); opacity:0; pointer-events:none; transition:opacity .24s; }
      .menu-mobile-fundo.aberto { opacity:1; pointer-events:auto; }
      .menu-mobile { position:fixed; z-index:199; inset:0 14% 0 0; display:block; padding:calc(env(safe-area-inset-top) + 18px) 24px calc(96px + env(safe-area-inset-bottom)); overflow-y:auto; background:linear-gradient(105deg,rgba(10,8,16,.99),rgba(15,10,22,.94) 75%,rgba(15,10,22,.68)); transform:translateX(-105%); transition:transform .27s cubic-bezier(.2,.72,.2,1); box-shadow:24px 0 55px #000b; }
      .menu-mobile.aberto { transform:translateX(0); }
      .menu-mobile-topo { display:flex; align-items:center; justify-content:space-between; margin-bottom:22px; }
      .menu-mobile-topo strong { font-size:22px; font-weight:900; letter-spacing:-.7px; background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; }
      .menu-mobile-topo button { width:46px; height:46px; min-height:46px; padding:0; border:1px solid #ffffff22; border-radius:50%; background:#ffffff0c; font-size:31px; }
      .menu-mobile-principal { display:grid; gap:2px; }
      .menu-mobile-seletor { min-height:54px; padding:8px 0; border:0; background:transparent; color:#f5f1fa; font-size:25px; font-weight:800; text-align:left; display:flex; justify-content:space-between; align-items:center; }
      .menu-mobile-seletor span { color:#a99fb7; font-size:20px; transition:transform .2s ease; }
      .menu-mobile-seletor.aberto span { transform:rotate(180deg); color:#ef78bd; }
      .menu-mobile-submenu { display:grid; gap:2px; margin:0 0 8px 12px; padding:4px 0 6px 14px; border-left:1px solid rgba(232,121,196,.35); }
      .menu-mobile-submenu { max-height:300px; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:#d76db5 #ffffff12; }
      .menu-mobile-submenu button { min-height:40px; padding:6px 10px; border:0; border-radius:10px; background:transparent; color:#cfc5d8; font-size:16px; text-align:left; }
      .menu-mobile-submenu button:active,.menu-mobile-submenu button:focus-visible { background:rgba(232,121,196,.16); color:#fff; }
      .menu-mobile-principal .aba { min-height:54px; padding:8px 0; display:block; color:#f5f1fa; font-size:25px; font-weight:800; text-align:left; }
      .menu-mobile-principal .aba::before,.menu-mobile-principal .aba::after { display:none; }
      .menu-mobile-acao { min-height:50px; margin-top:8px; padding:8px 0; border:1px solid rgba(232,121,196,.35); border-radius:13px; background:rgba(232,121,196,.12); color:#f4dced; font-size:17px; font-weight:750; text-align:left; }
      .menu-mobile-divisor { width:75%; height:1px; margin:18px 0 24px; background:#ffffff2b; }
      .menu-mobile-legenda { display:block; margin-bottom:11px; color:#a99fb7; font-size:12px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
      .menu-mobile-categorias { display:grid; gap:2px; }
      .menu-mobile-categorias button { min-height:47px; padding:7px 0; border:0; background:transparent; color:#d7d0df; font-size:18px; text-align:left; }
      .menu-mobile { background:linear-gradient(120deg,rgba(20,14,31,.82),rgba(20,12,31,.68) 75%,rgba(14,9,23,.5)); -webkit-backdrop-filter:blur(24px) saturate(1.35); backdrop-filter:blur(24px) saturate(1.35); border-right:1px solid rgba(255,255,255,.13); box-shadow:24px 0 55px rgba(0,0,0,.48),inset -1px 0 rgba(255,255,255,.06); }
      .menu-mobile-categorias button { border-radius:13px; padding-left:12px; transition:background .2s ease,color .2s ease; }
      .menu-mobile-categorias button:active,.menu-mobile-categorias button:focus-visible { background:rgba(232,121,196,.16); color:#fff; }
      .generos-submenu { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:18px 0 34px; }
      .genero-opcao { min-height:58px; padding:12px 16px; border:1px solid rgba(232,121,196,.38); border-radius:16px; background:linear-gradient(135deg,rgba(232,121,196,.18),rgba(93,42,116,.22)); color:#fff; font-size:17px; font-weight:750; text-align:left; }
      .genero-opcao:active { transform:scale(.98); background:rgba(232,121,196,.3); }
      .ver-todos-generos { display:block; margin:0 0 18px auto; }
      .subtitulo-secao { color:#aaa0b5; margin-top:-12px; }
      .titulo-secao { margin:16px 0; }
      .plataforma-cabecalho { padding:18px 4px 2px; }
      .plataforma-cabecalho span { color:#ef72bd; font-size:11px; font-weight:900; letter-spacing:.18em; }
      .plataforma-cabecalho h1 { margin:7px 0 3px; font-size:32px; }
      .plataforma-cabecalho p { margin:0; color:var(--muted); font-size:14px; }
      .plataforma-hero { position:relative; min-height:330px; margin:10px -14px 18px; overflow:hidden; border:0; border-radius:0; background:transparent; box-shadow:none; isolation:isolate; }
      .plataforma-hero::before { content:""; position:absolute; inset:-18px; z-index:-2; background-image:var(--plataforma-hero-img); background-size:cover; background-position:center top; opacity:.78; filter:saturate(1.08); -webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 12%,#000 58%,transparent 100%); mask-image:linear-gradient(180deg,transparent 0%,#000 12%,#000 58%,transparent 100%); transition:opacity .45s ease,background-image .45s ease; }
      .plataforma-hero::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,rgba(11,7,18,.78) 0%,rgba(11,7,18,.28) 42%,rgba(11,7,18,.08) 78%,rgba(11,7,18,.2) 100%),linear-gradient(180deg,var(--bg) 0%,transparent 18%,rgba(9,6,15,.06) 52%,var(--bg) 100%); }
      .plataforma-hero-conteudo { min-height:310px; display:flex; flex-direction:column; justify-content:flex-end; padding:22px 18px 18px; }
      .plataforma-hero-eyebrow { color:#ef72bd; font-size:11px; font-weight:900; letter-spacing:.18em; }
      .plataforma-hero h2 { max-width:85%; margin:7px 0 4px; font-size:clamp(24px,7vw,34px); line-height:1.05; }
      .plataforma-hero p { margin:0 0 15px; color:#ddd4e5; font-size:13px; }
      .plataforma-hero-acoes { display:flex; gap:8px; flex-wrap:wrap; }
      .plataforma-hero-acoes .btn { min-height:42px; padding:9px 14px; font-size:13px; }
      .plataforma-hero-pontos { display:flex; gap:6px; margin-top:16px; }
      .plataforma-hero-pontos i { width:7px; height:7px; border-radius:50%; background:#ffffff66; }
      .plataforma-hero-pontos i.ativo { width:20px; border-radius:99px; background:#ef72bd; }

      #hero { min-height:62svh; padding:calc(96px + env(safe-area-inset-top)) 16px 58px; align-items:flex-end; }
      #hero::after { background:linear-gradient(to top,var(--bg) 3%,transparent 66%),linear-gradient(to right,rgba(0,0,0,.65),transparent 90%); }
      .hero-logo { right:2%; top:38%; width:54vw; max-height:28vh; opacity:.62; }
      .hero-logo.poster { max-width:40vw; max-height:38vh; }
      .hero-conteudo { width:100%; max-width:92%; }
      #hero h1 { max-width:92%; font-size:clamp(32px,10vw,46px); line-height:1.02; }
      .hero-meta { margin-bottom:16px; font-size:14px; }
      .hero-botoes { gap:9px; }
      .btn.grande { min-height:48px; padding:12px 18px; font-size:15px; }

      #linhas { margin-top:-34px; padding-bottom:24px; }
      #linhas.sem-hero { padding-top:90px; }
      .linha { margin-bottom:2px; }
      .linha h2, .linha-cabecalho h2 { padding-left:14px; font-size:17px; line-height:1.2; }
      .linha-cabecalho { padding-right:14px; }
      .ver-todos { min-height:38px; padding:7px 12px; font-size:12px; }
      .trilho { gap:9px; padding:10px 14px 23px; scroll-padding:0 14px; }
      .tile { flex-basis:44vw; max-width:190px; border-radius:9px; }
      .tile.poster { flex-basis:36vw; max-width:160px; }
      .tile:hover, .tile:focus-visible { transform:none; }
      .tile .rotulo { font-size:12px; padding-inline:8px; }
      .tile .estrela { width:34px; height:34px; }
      footer { padding-bottom:22px; }

      #resultados { padding:84px 14px 26px; }
      .grade { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
      .grade .tile, .grade .tile.poster { width:100%; max-width:none; }
      .catalogo-vod { padding:82px 14px 28px; }
      .catalogo-vod-topo { align-items:stretch; flex-direction:column; gap:12px; }
      .catalogo-vod-topo h2 { font-size:21px; }
      .busca-categoria { width:100%; min-height:48px; }
      .catalogo-vod-grade { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 9px; }
      .plataforma-catalogo { width:100%; max-width:560px; margin:0 auto 24px; padding:0 14px; }
      .plataforma-catalogo h2 { font-size:18px; }
      .futebol-cabecalho { padding:0 14px; }
      .futebol-grade { grid-template-columns:1fr; padding:0 14px 30px; }
      .voltar-vitrine { position:relative; z-index:1; margin:78px 0 12px 14px; }

      .pagina-serie::before { height:52svh; background:linear-gradient(0deg,#09070e 0%,transparent 78%),linear-gradient(90deg,#09070e55,#09070e77),var(--serie-arte) center top/cover no-repeat; opacity:.72; }
      .serie-voltar { top:calc(env(safe-area-inset-top) + 12px); left:14px; width:46px; height:46px; overflow:hidden; padding:0; font-size:0; }
      .serie-voltar::before { content:"←"; font-size:20px; }
      .serie-conteudo { width:auto; padding:calc(34svh + 26px) 16px 38px; }
      .serie-cabecalho { min-height:0; display:grid; grid-template-columns:100px 1fr; align-items:end; gap:16px; }
      .serie-poster { width:100px; margin:0; border-radius:10px; }
      .serie-info { min-width:0; padding:0; }
      .serie-plataforma { font-size:.68rem; }
      .serie-info h1 { margin:7px 0 10px; font-size:clamp(1.65rem,8vw,2.35rem); line-height:1; }
      .serie-meta, .serie-generos { font-size:.83rem; }
      .serie-descricao { grid-column:1/-1; margin-top:16px; font-size:.92rem; line-height:1.55; }
      .serie-assistir { grid-column:1/-1; width:100%; min-height:50px; margin-top:12px; }
      .serie-episodios-area { margin-top:32px; }
      .serie-episodios-area h2 { font-size:1.35rem; }
      .serie-temporadas { flex-wrap:nowrap; overflow-x:auto; margin:13px -16px 18px; padding:0 16px 8px; }
      .serie-temporadas button { flex:none; }
      .serie-episodios { grid-template-columns:1fr; gap:10px; }
      .episodio-card { display:grid; grid-template-columns:126px minmax(0,1fr); min-height:82px; }
      .episodio-imagem { width:126px; height:100%; min-height:82px; aspect-ratio:auto; }
      .episodio-texto { align-content:center; padding:10px 12px; }

      .pagina-filme { display:block; padding:0; }
      .filme-painel { width:100%; min-height:100dvh; display:block; border:0; border-radius:0; }
      .filme-painel::before { height:48svh; opacity:.68; }
      .filme-painel::after { background:linear-gradient(0deg,#100c17 49%,transparent 84%); }
      .filme-fechar { top:calc(env(safe-area-inset-top) + 12px); right:14px; }
      .filme-visual { justify-content:flex-start; padding:calc(27svh + 40px) 16px 0; }
      .filme-poster { width:112px; border-radius:10px; }
      .filme-conteudo { padding:16px 16px 42px; }
      .filme-conteudo h1 { margin:7px 0 10px; font-size:clamp(2rem,10vw,3rem); }
      .filme-acoes { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
      .filme-assistir, .filme-lista { min-height:50px; padding:11px 12px; }
      .filme-descricao { font-size:.93rem; line-height:1.55; }

      #palco { height:100dvh; padding:0; }
      #palco video { object-fit:contain; }
      .topo { display:grid; grid-template-columns:46px minmax(0,1fr); align-items:center; gap:8px 10px; padding:calc(env(safe-area-inset-top) + 10px) 12px 70px; }
      .topo>.spacer { display:none; }
      .topo>div:nth-child(2) { min-width:0; }
      .topo h3 { font-size:16px; line-height:1.2; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
      .topo .cat { margin-top:3px; font-size:12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
      .voltar { width:44px; height:44px; }
      .player-acoes { grid-column:1/-1; min-width:0; margin-left:54px; padding-bottom:5px; gap:7px; overflow-x:auto; scrollbar-width:none; }
      .player-acoes::-webkit-scrollbar { display:none; }
      .player-acoes>* { flex:none; }
      .player-acoes .btn, .player-acoes select { min-height:42px; padding:8px 12px; }
      #p-fav { max-width:145px; overflow:hidden; text-overflow:ellipsis; }
      .fontes-painel { position:fixed; top:auto; left:12px; right:12px; bottom:calc(88px + env(safe-area-inset-bottom)); width:auto; max-height:54dvh; border-radius:18px; }
      .controles { padding:48px 12px calc(9px + env(safe-area-inset-bottom)); }
      .barra { height:24px; }
      .linha-ctl { gap:1px; }
      .linha-ctl .spacer { display:block; }
      .ctl { width:40px; height:40px; }
      .ctl svg { width:23px; height:23px; }
      #c-volta, #c-avanca { display:none; }
      .vol input { display:none; }
      #c-tempo { max-width:92px; overflow:hidden; text-overflow:ellipsis; font-size:11px; }
      .menu-wrap { margin-left:2px; }
      .pill { min-width:44px; min-height:38px; padding:6px 8px; font-size:12px; }
      .linha-ctl .c-tv { position:static; right:auto; bottom:auto; padding:6px 9px; background:rgba(32,22,46,.92); }
      .menu { position:fixed; left:12px; right:12px; bottom:calc(78px + env(safe-area-inset-bottom)); min-width:0; border-radius:18px; }
      #aviso { left:12px; right:12px; bottom:calc(92px + env(safe-area-inset-bottom)); padding:11px 13px; font-size:13px; line-height:1.35; }

      /* celular: o quadro é só do tamanho do vídeo (16:9); nome do canal e programação ficam abaixo dele */
      .central-ao-vivo { width:calc(100% - 16px); height:auto; min-height:0; margin:84px 8px 96px; border-radius:16px; background:#120c19; }
      .live-palco { position:relative; inset:auto; height:auto; min-height:0; overflow:visible; background:transparent; }
      .live-tela { display:block; position:relative; width:100%; aspect-ratio:16/9; overflow:hidden; border-radius:16px 16px 0 0; background:#000; }
      .live-tela:fullscreen { aspect-ratio:auto; width:100%; height:100%; border-radius:0; }
      .live-fundo { opacity:.82; filter:blur(18px) brightness(.58) saturate(.85); transform:scale(1.12); }
      .live-video { object-fit:contain; }
      .live-palco::after { display:none; }
      .live-painel { position:fixed; z-index:90; inset:0; width:auto; padding:calc(env(safe-area-inset-top) + 22px) 16px calc(env(safe-area-inset-bottom) + 18px); border:0; border-radius:0; background:rgba(9,7,14,.96); -webkit-backdrop-filter:blur(24px) saturate(1.25); backdrop-filter:blur(24px) saturate(1.25); transform:none; }
      .central-ao-vivo.painel-fechado .live-painel { opacity:0; transform:translateY(105%); }
      .live-topo h2 { font-size:1.5rem; }
      .live-topo-resumo { align-items:center; }
      .live-fechar { width:44px; height:44px; flex-basis:44px; margin:-8px -6px 0 0; background:#ffffff0b; }
      .live-painel-topo h2 { font-size:22px; }
      .live-busca { min-height:48px; margin:15px 0 10px; }
      .live-painel .guia-categorias { margin-bottom:8px; padding-bottom:8px; scrollbar-width:none; }
      .live-painel .guia-categorias::-webkit-scrollbar { display:none; }
      .live-lista { min-height:0; }
      .live-canal { min-height:64px; padding:7px 5px; }
      .live-canal-logo { width:48px; height:48px; }
      .live-canal-nome { font-size:14px; }
      .live-canal-programa { font-size:11px; }
      .live-info, .live-agenda, .live-controles, .live-menu { transition:opacity .2s,transform .2s; }
      .central-ao-vivo:not(.painel-fechado) .live-controles { opacity:0; pointer-events:none; }
      /* nome do canal e programação: textos menores, abaixo do vídeo e sempre visíveis (só os controles se escondem) */
      .live-info, .central-ao-vivo.painel-fechado .live-info, .central-ao-vivo.controles-ocultos .live-info, .central-ao-vivo:not(.painel-fechado) .live-info { position:static; left:auto; right:auto; bottom:auto; padding:10px 14px 0; gap:1px; text-shadow:none; opacity:1; transform:none; pointer-events:auto; }
      .live-info span { font-size:.66rem; }
      .live-info strong, .central-ao-vivo.painel-fechado .live-info strong { font-size:1.12rem; line-height:1.2; }
      .live-info small, .central-ao-vivo.painel-fechado .live-info small { max-width:none; font-size:.84rem; color:#d9d0e0; }
      .live-agenda, .central-ao-vivo.painel-fechado .live-agenda, .central-ao-vivo.controles-ocultos .live-agenda, .central-ao-vivo:not(.painel-fechado) .live-agenda { position:static; left:auto; right:auto; bottom:auto; padding:8px 12px 14px; opacity:1; transform:none; pointer-events:auto; }
      .live-agenda-topo { margin-bottom:5px; text-shadow:none; }
      .live-agenda-topo strong { font-size:.88rem; }
      .live-agenda-topo small { font-size:.66rem; }
      .live-agenda-trilho { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; overflow:visible; padding:0; }
      .live-agenda-item { min-width:0; min-height:44px; padding:6px 8px; }
      .live-agenda-item strong { font-size:.72rem; }
      .live-controles, .central-ao-vivo.painel-fechado .live-controles { left:8px; right:8px; bottom:8px; height:42px; padding:0 6px; gap:6px; }
      .live-menu { right:8px; bottom:58px; }
      .live-volume, .live-fonte { display:none; }
      .live-reabrir { left:8px; top:8px; min-height:34px; padding:6px 10px; }
      .live-estado { top:50%; max-width:84%; font-size:13px; text-align:center; }

      .splash-pepper span { font-size:clamp(34px,11vw,56px); }

      dialog { max-height:calc(100dvh - 24px); overflow:auto; padding:20px 16px; border-radius:18px; }
      .dlg-tv { width:calc(100% - 20px); }
      .tv-dialogo-topo { padding:21px 18px 13px; }
      #tv-desconectado, #tv-conectado { padding:4px 18px 22px; }
      .tv-codigo { font-size:20px; }
    }

    @media (max-width: 390px) {
      .aba { font-size:8.7px; }
      .tile { flex-basis:47vw; }
      .tile.poster { flex-basis:39vw; }
      #c-tempo { display:none; }
      .player-acoes { margin-left:0; }
      .serie-cabecalho { grid-template-columns:86px 1fr; }
      .serie-poster { width:86px; }
    }

    @media (display-mode:standalone) and (max-width:760px) {
      body { padding-bottom:calc(78px + env(safe-area-inset-bottom)); }
      .hud-mobile { bottom:calc(8px + env(safe-area-inset-bottom)); }
    }

.player-aberto .hud-mobile{display:none;}

.menu-mobile-principal{grid-template-columns:1fr;}
.menu-mobile-principal .menu-mobile-selector,.menu-mobile-principal .aba{width:100%;}

.menu-mobile-principal{display:flex!important;flex-direction:column!important;align-items:stretch!important;}
.menu-mobile-principal>.aba,.menu-mobile-principal>.menu-mobile-selector{width:100%!important;display:block!important;text-align:left!important;justify-self:stretch!important;align-self:stretch!important;font-size:22px!important;padding-left:0!important;}
.menu-mobile-principal>.aba{margin:0!important;}
