/* GERADO por tools/build-css.js a partir de app.src.css. Não edite aqui. */
/* Tela fixa de 1920x1080, ampliada ou reduzida para caber na janela. Margens de 96px (área segura).
   ARQUIVO-FONTE: edite este e gere css/app.css com tools/build-css.js. O app.css gerado não usa variáveis,
   grid, gap nem inset, porque as TVs Samsung de 2016 a 2021 não entendem esses recursos.
   Aqui também não use grid, gap nem inset: espaçamento entre itens é margem nos filhos. */
:root {
  --bg: #0A0E19; --surf: #131A2B; --surf2: #1B2338; --ink: #EEF0F7; --mut: #8A92AC; --acc: #FFB547; --danger: #EF4444;
  --display: "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; --body: "Manrope", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif;
  --safe-x: 96px;
  --lv-bg: #0C1120; --lv-card: #161D30; --lv-acc: #FFB547; --lv-amber: #F5B83D;
}
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; background: #000; overflow: hidden; }
#stage { position: absolute; width: 1920px; height: 1080px; -webkit-transform-origin: 0 0; transform-origin: 0 0; background: #0A0E19; color: #EEF0F7;
  font: 500 28px/1.35 "Manrope", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; overflow: hidden; }
[hidden] { display: none !important; }
button { font: inherit; color: inherit; border: 0; background: none; }
h1, h2 { font-family: "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; margin: 0; }
.muted { color: #8A92AC; } .small { font-size: 22px; } .accent { color: #FFB547; font-weight: 700; }
.err { color: #FCA5A5; }
.eyebrow { margin: 0 0 8px; font-size: 22px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #FFB547; }

/* Foco (Luma Play): anel âmbar + halo, igual em todo o app; dá para ver de longe, no sofá */
[data-f] { outline: none; transition: box-shadow .12s ease, background .12s ease, -webkit-transform .12s ease; transition: transform .12s ease, box-shadow .12s ease, background .12s ease; transition: transform .12s ease, box-shadow .12s ease, background .12s ease, -webkit-transform .12s ease; }
.focused { box-shadow: 0 0 0 4px #FFB547, 0 0 0 10px rgba(255,181,71,.2), 0 18px 40px rgba(0,0,0,.45) !important; }

/* Barra superior (Início): menu em pílula flutuando sobre o destaque; data, hora e Conta à direita.
   Sem desfoque (backdrop-filter): nas TVs de 2016 a 2018 ele pesa; a pílula usa cor quase sólida. */
#topbar { position: absolute; z-index: 5; left: 0; right: 0; top: 0; height: 190px; padding: 44px 96px 0;
  display: -webkit-flex;
  display: flex; -webkit-align-items: flex-start; align-items: flex-start; background: linear-gradient(rgba(10,14,25,.82), rgba(10,14,25,0)); }
#topbar.solid { background: linear-gradient(#0A0E19 72%, rgba(10,14,25,0)); }
.tb-pill { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; height: 92px; padding: 0 12px 0 22px; border-radius: 46px; background: rgba(20,20,23,.88); border: 2px solid rgba(255,255,255,.1); }
.brand > * + * { margin-left: 14px; }
.brand { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; font: 700 30px "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; white-space: nowrap; }
.brand-mark { width: 64px; height: 64px; border-radius: 16px; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; background: linear-gradient(135deg, #FFB547, #C97A16);
  font: 700 36px "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; color: #fff; }
.tb-pill .brand-mark { width: 54px; height: 54px; border-radius: 14px; font-size: 30px; }
.tb-pill .brand-logo.top { max-height: 54px; max-width: 260px; }
.brand-mark.big { width: 110px; height: 110px; font-size: 64px; border-radius: 24px; }
.tb-sep { width: 2px; height: 44px; background: rgba(255,255,255,.18); margin: 0 14px 0 26px; }
#menu { display: -webkit-flex; display: flex; }
.menu-item + .menu-item { margin-left: 6px; }
.menu-item { height: 68px; padding: 0 30px; border-radius: 34px; color: rgba(245,245,245,.82); font-size: 28px; font-weight: 600; }
.menu-item.on { background: #FFB547; color: #1A1205; font-weight: 700; box-shadow: 0 8px 26px rgba(255,181,71,.45); }
.menu-item.focused { background: rgba(255,255,255,.16); color: #EEF0F7; box-shadow: 0 0 0 4px #FFB547 !important; }
.menu-item.on.focused { background: #FFB547; color: #1A1205; box-shadow: 0 0 0 4px #FFB547, 0 8px 26px rgba(255,181,71,.55) !important; }
.tb-right { margin-left: auto !important; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; height: 92px; }
.tb-date { font-size: 28px; color: rgba(245,245,245,.9); white-space: nowrap; }
.clock { color: #EEF0F7; font-size: 28px; font-weight: 700; margin-left: 18px; -webkit-font-feature-settings: "tnum"; font-feature-settings: "tnum"; font-variant-numeric: tabular-nums; }
.tb-ic { width: 76px; height: 76px; margin-left: 30px; border-radius: 50%; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; background: rgba(20,20,23,.88); border: 2px solid rgba(255,255,255,.2); color: #EEF0F7; }
.tb-ic.focused { background: #FFB547; border-color: #FFB547; box-shadow: 0 0 0 4px #FFB547 !important; }

#screen { position: absolute; top: 0; right: 0; bottom: 0; left: 0; }
.page { position: absolute; top: 0; right: 0; bottom: 0; left: 0; overflow: hidden; padding: 150px 0 60px; }
.center { position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; }
.center.col { -webkit-flex-direction: column; flex-direction: column; }
.center.col > * + * { margin-top: 24px; }
.spinner { width: 72px; height: 72px; border-radius: 50%; border: 6px solid #1B2338; border-top-color: #FFB547; -webkit-animation: spin 1s linear infinite; animation: spin 1s linear infinite; }
@-webkit-keyframes spin { to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }
@keyframes spin { to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }

/* Botões */
.btn { padding: 0 34px; height: 72px; border-radius: 36px; background: rgba(255,255,255,.14); font-weight: 600; white-space: nowrap; }
.btn.primary { background: #EEF0F7; color: #0A0E19; font-weight: 700; }
.btn.danger { background: rgba(239,68,68,.25); }
.actions { display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: -20px; }
.actions > * { margin: 0 20px 20px 0; }

/* Destaque */
.hero { position: relative; margin: 0 96px 40px; height: 480px; border-radius: 24px; overflow: hidden; background: #131A2B; }
.hero-bg, .detail-bg { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-size: cover; background-position: center; }
.hero-bg.blur, .detail-bg.blur { -webkit-filter: blur(36px) brightness(.55) saturate(1.2); filter: blur(36px) brightness(.55) saturate(1.2); -webkit-transform: scale(1.2); transform: scale(1.2); }
.hero-shade { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: linear-gradient(90deg, rgba(10,14,25,.94) 0%, rgba(10,14,25,.6) 55%, rgba(10,14,25,.15) 85%); }
.hero-poster { position: absolute; right: 64px; top: 60px; width: 240px; height: 360px; border-radius: 16px; background-size: cover; background-position: center; box-shadow: 0 18px 50px rgba(0,0,0,.55); }
.hero-body { position: relative; padding: 48px 64px; max-width: 1150px; }
/* Pontinhos dos destaques (passam sozinhos) */
.hero-dots { position: absolute; right: 64px; top: 22px; }
.hero-dots i { display: inline-block; width: 12px; height: 12px; margin-left: 10px; border-radius: 6px; background: rgba(255,255,255,.4); transition: width .3s; }
.hero-dots i.on { width: 34px; background: #fff; }
/* Logo do revendedor */
.brand-logo { display: block; width: auto; height: auto; }
.brand-logo.top { max-height: 64px; max-width: 360px; }
.brand-logo.sm { max-height: 40px; max-width: 200px; }
.hero h1 { font-size: 64px; line-height: 1.05; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.meta { color: #8A92AC; margin: 12px 0; }
.plot { margin: 0 0 28px; max-width: 900px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* Fileiras e capas */
.row { margin-bottom: 36px; }
.row h2 { font-size: 34px; font-weight: 600; margin: 0 96px 18px; }
.row-items { display: -webkit-flex; display: flex; overflow: hidden; padding: 14px 96px 20px; }
.row-items > * + * { margin-left: 32px; }
.poster { -webkit-flex: none; flex: none; width: 220px; border-radius: 14px; }
.poster .art { position: relative; height: 330px; border-radius: 14px; background-size: cover; background-position: center; overflow: hidden; }
.poster.wide { width: 400px; } .poster.wide .art { height: 225px; }
.poster.focused { -webkit-transform: scale(1.06); transform: scale(1.06); box-shadow: none !important; }
.poster.focused .art { box-shadow: 0 0 0 5px #FFB547, 0 0 28px 6px rgba(255,181,71,.55); }
.art-title { position: absolute; left: 16px; right: 16px; bottom: 22px; font: 700 26px/1.15 "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; text-shadow: 0 2px 8px rgba(0,0,0,.6); }
.poster .fav { position: absolute; top: 12px; right: 12px; width: 44px; height: 44px; border-radius: 50%; background: rgba(0,0,0,.6); color: #FACC15; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; font-size: 24px; }
.bar { position: absolute; left: 14px; right: 14px; bottom: 12px; height: 8px; border-radius: 4px; background: rgba(255,255,255,.25); overflow: hidden; }
.bar i { display: block; height: 100%; background: #FFB547; border-radius: 4px; }
.bar.big { position: relative; left: 0; right: 0; bottom: 0; height: 10px; margin: 20px 0; max-width: 700px; }
.cap { margin-top: 14px; font-weight: 600; font-size: 26px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sub { color: #8A92AC; font-size: 22px; }

/* Grade */
.grid-screen { position: absolute; top: 0; right: 0; bottom: 0; left: 0; padding: 170px 96px 0; display: -webkit-flex; display: flex; }
.grid-screen > .cats { -webkit-flex: none; flex: none; width: 380px; }
.grid-screen > .grid-main { -webkit-flex: 1; flex: 1; margin-left: 56px; }
.cats { overflow: hidden; padding: 6px 8px 40px; height: 860px; }
.cat { display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; padding: 14px 22px; border-radius: 12px; color: #8A92AC; margin-bottom: 6px; }
.cat.on { background: #1B2338; color: #EEF0F7; font-weight: 700; box-shadow: inset 6px 0 0 #FFB547; }
.cat .n { -webkit-font-feature-settings: "tnum"; font-feature-settings: "tnum"; font-variant-numeric: tabular-nums; -webkit-flex: none; flex: none; margin-left: 12px; }
/* Nome de categoria longo: uma linha só, cortado com reticências */
.cats .cat > .cat-name, .cat .cat-name { -webkit-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.cat-ic { -webkit-flex: none; flex: none; }
.grid-main { min-width: 0; }
.grid-head { display: -webkit-flex; display: flex; -webkit-align-items: baseline; align-items: baseline; margin-bottom: 18px; }
.grid-head > * + * { margin-left: 20px; }
.grid-head h1 { font-size: 48px; }
/* 5 capas por linha: 5 x 220 + 4 x 34 */
.grid { display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-align-content: flex-start; align-content: flex-start; width: 1264px; height: 780px; overflow: hidden; padding: 14px 14px 40px; box-sizing: content-box; }
.grid > .poster { margin: 0 34px 36px 0; }
.grid > .poster:nth-child(5n) { margin-right: 0; }
.empty { margin-top: 40px; max-width: 800px; }

.hint { color: #8A92AC; font-size: 24px; margin-top: 18px; }
.key { display: inline-block; min-width: 44px; padding: 2px 10px; margin-right: 6px; border-radius: 8px; background: rgba(255,255,255,.16); color: #EEF0F7; font-weight: 700; font-size: 20px; text-align: center; }

/* Detalhe */
.detail { position: absolute; top: 0; right: 0; bottom: 0; left: 0; overflow: hidden; }
.detail-shade { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: linear-gradient(90deg, #0A0E19 0%, rgba(10,14,25,.92) 45%, rgba(10,14,25,.45) 85%), linear-gradient(0deg, #0A0E19 5%, transparent 55%); }
.detail-body { padding-top: 120px; }
.detail-top > * + * { margin-left: 56px; }
.detail-top { display: -webkit-flex; display: flex; margin: 0 192px 48px; -webkit-align-items: flex-start; align-items: flex-start; }
.detail-poster { position: relative; -webkit-flex: none; flex: none; width: 300px; height: 450px; border-radius: 18px; background-size: cover; background-position: center; box-shadow: 0 20px 60px rgba(0,0,0,.6); overflow: hidden; }
.detail-text { min-width: 0; max-width: 1150px; }
.detail-text h1 { font-size: 68px; line-height: 1.05; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.detail-text .plot { -webkit-line-clamp: 4; }
.credits { font-size: 22px; margin: -12px 0 28px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.credits:empty { display: none; }
.ep-plot { margin: 0 192px 24px; height: 98px; font-size: 24px; max-width: 1400px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.detail-body .row h2, .detail-body .row-items { padding-left: 192px; margin-left: 0; }
.detail-body .row-items { padding-top: 22px; }
.badge { display: inline-block; border: 2px solid rgba(255,255,255,.5); border-radius: 6px; padding: 0 10px; margin-left: 8px; font-weight: 700; color: #EEF0F7; }

/* Ativação: QR Code para o teste grátis + MAC e chave para o revendedor */
.act { position: absolute; top: 0; right: 0; bottom: 0; left: 0; padding: 64px 128px; display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column;
  background: linear-gradient(115deg, rgba(255,181,71,.16) 0%, transparent 38%), linear-gradient(295deg, rgba(80,110,255,.14) 0%, transparent 45%), #0A0E19; }
.act-top { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: space-between; justify-content: space-between; height: 72px; }
.act-clock { font: 700 40px "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; color: #8A92AC; }
.act-panel { -webkit-flex: 1; flex: 1; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; }
.act-qr { -webkit-flex: none; flex: none; text-align: center; margin-right: 110px; }
.qr-frame { display: inline-block; padding: 30px; border-radius: 36px; background: #fff; box-shadow: 0 30px 80px rgba(0,0,0,.45), 0 0 0 10px rgba(255,181,71,.18); }
.qr-img { display: block; image-rendering: pixelated; }
.act-qr p { margin: 30px 0 0; font-size: 26px; font-weight: 600; color: #8A92AC; }
.act-info { -webkit-flex: none; flex: none; width: 1000px; }
.act-info h1 { font-size: 76px; line-height: 1.05; margin-bottom: 40px; }
.act-steps { list-style: none; margin: 0 0 48px; padding: 0; }
.act-steps li { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; font-size: 32px; }
.act-steps li + li { margin-top: 22px; }
.act-steps i { -webkit-flex: none; flex: none; width: 54px; height: 54px; line-height: 48px; margin-right: 24px; border-radius: 50%; text-align: center; font: 700 26px "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; font-style: normal;
  color: #FFB547; border: 3px solid rgba(255,181,71,.55); }
.act-ids { display: -webkit-flex; display: flex; }
.act-id { padding: 20px 30px; border-radius: 20px; background: rgba(255,255,255,.06); border: 2px solid rgba(255,255,255,.1); }
.act-id + .act-id { margin-left: 22px; }
.act-id span { display: block; font-size: 20px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #8A92AC; }
.act-id b { display: block; margin-top: 6px; white-space: nowrap; font: 700 46px "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; letter-spacing: .03em; }
.act-id.key b { color: #FFB547; letter-spacing: .1em; }
.act-status { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; margin: 36px 0 0; font-size: 26px; color: #8A92AC; }
.act-status .pulse { -webkit-flex: none; flex: none; width: 16px; height: 16px; margin-right: 16px; border-radius: 50%; background: #FFB547; -webkit-animation: pulse 1.6s ease-in-out infinite; animation: pulse 1.6s ease-in-out infinite; }
.act-status.err { color: #FCA5A5; }
.act-status.err .pulse { background: #EF4444; -webkit-animation: none; animation: none; }
@-webkit-keyframes pulse { 0%, 100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } 50% { opacity: .35; -webkit-transform: scale(.7); transform: scale(.7); } }
@keyframes pulse { 0%, 100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } 50% { opacity: .35; -webkit-transform: scale(.7); transform: scale(.7); } }
.act.over .act-steps, .act.over .act-qr { display: none; }
.act.over .eyebrow { color: #EF4444; }
.act-foot { display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; font-size: 22px; color: #8A92AC; }
.act-foot b { color: #EEF0F7; }
/* Carregando: logo (com o ✓ de acesso liberado na primeira vez), círculo e texto */
.boot { position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center;
  background: radial-gradient(circle at 50% 42%, rgba(255,181,71,.16), transparent 50%), #0A0E19; }
.boot > * + * { margin-top: 34px; }
.boot h1 { font-size: 64px; }
.boot p { margin-top: 26px; font-size: 28px; }
.boot-check { display: inline-block; vertical-align: middle; margin-right: 22px; }
.boot-check svg { display: block; width: 72px; height: 72px; fill: none; stroke-width: 4.5; stroke-linecap: round; stroke-linejoin: round; }
.boot-check circle { stroke: #34D399; stroke-dasharray: 150; stroke-dashoffset: 150; -webkit-animation: draw .6s ease-out forwards; animation: draw .6s ease-out forwards; }
.boot-check path { stroke: #34D399; stroke-dasharray: 40; stroke-dashoffset: 40; -webkit-animation: draw .4s .5s ease-out forwards; animation: draw .4s .5s ease-out forwards; }
.boot-ok { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; font-size: 56px; }
.brand-logo.boot-logo { max-height: 170px; max-width: 560px; -webkit-animation: bootIn .5s ease-out both; animation: bootIn .5s ease-out both; }
@-webkit-keyframes bootIn { from { opacity: 0; -webkit-transform: scale(.92); transform: scale(.92); } to { opacity: 1; -webkit-transform: none; transform: none; } }
@keyframes bootIn { from { opacity: 0; -webkit-transform: scale(.92); transform: scale(.92); } to { opacity: 1; -webkit-transform: none; transform: none; } }
@-webkit-keyframes draw { to { stroke-dashoffset: 0; } }
@keyframes draw { to { stroke-dashoffset: 0; } }
.device { position: absolute; left: 192px; bottom: 80px; }

/* Diálogo e aviso */
#dialog { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 20; background: rgba(0,0,0,.7); display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; }
.dialog-box { width: 820px; background: #131A2B; border-radius: 28px; padding: 56px; }
.dialog-box > * + * { margin-top: 24px; }
.dialog-box h2 { font-size: 44px; }
.dialog-box label { display: block; color: #8A92AC; }
.dialog-box input { font: inherit; color: #EEF0F7; background: #1B2338; border: 0; border-radius: 14px; padding: 18px 22px; outline: none; display: block; width: 100%; margin-top: 10px; }
#toast { position: absolute; z-index: 30; left: 50%; bottom: 80px; -webkit-transform: translateX(-50%); transform: translateX(-50%); background: #EEF0F7; color: #0A0E19; padding: 18px 36px; border-radius: 36px; font-weight: 700; }

/* Vídeo: camada embaixo da interface */
#media { position: absolute; top: 0; right: 0; bottom: 0; left: 0; pointer-events: none; }
#media video { background: #000; object-fit: contain; }
#screen { z-index: 1; }
body.media-on, body.media-on #stage { background: transparent; }
html.media-on { background: transparent; }
body.media-full #screen, body.media-full #topbar { visibility: hidden; }

/* Player */
#player { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 10; background: transparent; }
.osd { position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; -webkit-justify-content: space-between; justify-content: space-between; padding: 72px 96px 56px;
  background: linear-gradient(rgba(0,0,0,.75), transparent 28%, transparent 55%, rgba(0,0,0,.85)); opacity: 0; transition: opacity .3s; }
.osd.show { opacity: 1; }
.osd h1 { font-size: 56px; max-width: 1500px; }
.osd-bottom { margin-top: auto; }
.live-bottom { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; }
.live-bottom > * + * { margin-left: 48px; }
.live-bottom .hint { margin: 0 0 0 48px; }
.seek-wrap { margin: 0 8px; }
.seek { position: relative; height: 10px; border-radius: 5px; background: rgba(255,255,255,.25); }
.seek i { position: absolute; left: 0; top: 0; bottom: 0; background: #FFB547; border-radius: 5px; }
.seek b { position: absolute; top: 50%; width: 30px; height: 30px; border-radius: 50%; background: #fff; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); box-shadow: 0 2px 10px rgba(0,0,0,.5); }
.balloon { position: absolute; bottom: 34px; -webkit-transform: translateX(-50%); transform: translateX(-50%); background: #EEF0F7; color: #0A0E19; font-weight: 700; padding: 8px 18px; border-radius: 12px; white-space: nowrap; -webkit-font-feature-settings: "tnum"; font-feature-settings: "tnum"; font-variant-numeric: tabular-nums; }
.times { display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; margin-top: 16px; -webkit-font-feature-settings: "tnum"; font-feature-settings: "tnum"; font-variant-numeric: tabular-nums; color: #8A92AC; }
.ctrls { display: -webkit-flex; display: flex; -webkit-justify-content: center; justify-content: center; margin-top: 8px; }
.ctrl + .ctrl { margin-left: 56px; }
.ctrl { display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; -webkit-align-items: center; align-items: center; cursor: pointer; }
.ctrl .lb { margin-top: 8px; }
.ctrl .ic { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; width: 96px; height: 96px; border-radius: 50%; background: rgba(255,255,255,.16); font-size: 36px; }
.ctrl.main .ic { width: 112px; height: 112px; background: #EEF0F7; color: #0A0E19; font-size: 40px; }
.ctrl .lb { font-size: 22px; font-weight: 600; }
.ctrl.focused { box-shadow: none !important; }
.ctrl.focused .ic { box-shadow: 0 0 0 5px #FFB547, 0 0 28px 6px rgba(255,181,71,.55); -webkit-transform: scale(1.08); transform: scale(1.08); }
.ctrl.focused .lb { color: #fff; }
.ctrl-hint { text-align: center; margin: 18px 0 0; }
/* Áudio e legenda (porta do Max Pro 0.7.13): lista de faixas no lugar dos controles; legenda do arquivo desenhada pelo app (Samsung). */
.trk { display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; -webkit-align-items: center; align-items: center; }
.trk-row { display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center; justify-content: center; -webkit-align-items: center; align-items: center; margin-top: 12px; }
.trk-h { font-size: 22px; font-weight: 700; color: #8A92AC; margin-right: 18px; min-width: 110px; text-align: right; }
.trk-row .btn { margin: 6px; }
.trk-o.on { color: #fff; border-color: #FFB547; }
.trk-none { font-size: 26px; margin: 8px 0 4px; }
.vsub { position: absolute; left: 10%; right: 10%; bottom: 70px; text-align: center; font-size: 46px; line-height: 1.25; font-weight: 600; color: #fff;
  text-shadow: 0 0 6px #000, 0 2px 4px #000, 0 0 2px #000; white-space: pre-line; pointer-events: none; }
/* Próximo episódio: cartão no canto de baixo, faltando 30 s para acabar. Com os controles abertos, sobe para cima deles. */
.nxe { position: absolute; right: 96px; bottom: 72px; z-index: 3; width: 600px; padding: 20px; border-radius: 20px; background: rgba(14,14,16,.94);
  box-shadow: 0 16px 48px rgba(0,0,0,.6); transition: bottom .3s; }
.osd.show ~ .nxe { bottom: 400px; }
.nxe-pic { float: left; position: relative; width: 176px; height: 99px; border-radius: 12px; background-size: cover; background-position: center; background-color: #222; }
.nxe-pic span { position: absolute; left: 8px; bottom: 8px; padding: 3px 9px; border-radius: 7px; background: rgba(0,0,0,.75); font-size: 17px; font-weight: 700; }
.nxe-tx { margin-left: 196px; min-height: 99px; }
.nxe-tx .eyebrow { margin: 2px 0 4px; font-size: 17px; }
.nxe-tx h3 { font-size: 27px; line-height: 1.15; margin: 0; max-height: 62px; overflow: hidden; }
.nxe-tx .muted { margin: 6px 0 0; font-size: 19px; }
.nxe-btns { clear: both; display: -webkit-flex; display: flex; padding-top: 16px; }
.nxe-btns .btn { -webkit-flex: 1; flex: 1; font-size: 20px; height: 56px; padding: 0 18px; }
.nxe-btns .btn + .btn { margin-left: 12px; -webkit-flex: none; flex: none; }
.btn.nxe-go { position: relative; overflow: hidden; }
.nxe-sec { opacity: .7; margin-left: 6px; -webkit-font-feature-settings: "tnum"; font-feature-settings: "tnum"; font-variant-numeric: tabular-nums; }
/* Menu do OK no ao vivo em tela cheia: fileira de botões, lista de canais e programação do lado, zoom. */
.osd.okm { background: linear-gradient(rgba(0,0,0,.8), transparent 26%, transparent 40%, rgba(0,0,0,.92)); }
.okbar { display: -webkit-flex; display: flex; margin: 6px 0 4px; }
.okb { display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; -webkit-align-items: center; align-items: center; width: 176px; text-align: center; cursor: pointer; }
.okb + .okb { margin-left: 10px; }
.okb .ic { width: 84px; height: 84px; border-radius: 50%; background: rgba(255,255,255,.14); display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; transition: -webkit-transform .15s; transition: transform .15s; transition: transform .15s, -webkit-transform .15s; }
.okb .ic svg, .okz svg, .ctrl .ic svg { width: 38px; height: 38px; fill: none; stroke: #fff; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.okb .lb { margin-top: 12px; font-size: 22px; font-weight: 600; line-height: 1.15; white-space: nowrap; }
.okb .sub { font-size: 18px; color: #8A92AC; margin-top: 2px; max-width: 170px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.okb.focused { box-shadow: none !important; }
.okb.focused .ic { background: #FFB547; box-shadow: 0 0 0 5px rgba(255,255,255,.35), 0 0 30px 8px rgba(255,181,71,.6); -webkit-transform: scale(1.1); transform: scale(1.1); }
.okb.focused .ic svg { stroke: #0A0E19; }
.okb.on .ic svg { fill: #F5B83D; stroke: #F5B83D; }
.okb.focused.on .ic svg { fill: #C98A12; stroke: #C98A12; }
.okd { position: absolute; top: 0; right: 0; bottom: 0; width: 660px; background: rgba(12,12,15,.95); padding: 56px 36px 40px; display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; box-shadow: -40px 0 80px rgba(0,0,0,.55); }
.okd-head { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: space-between; justify-content: space-between; margin-bottom: 22px; }
.okd-head .eyebrow { margin: 0; }
.okd-cat { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; font-family: "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; font-size: 34px; font-weight: 700; white-space: nowrap; overflow: hidden; }
.okd-cat .arr { color: #8A92AC; font-size: 26px; margin: 0 14px; cursor: pointer; }
.okd-cat .arr:first-child { margin-left: 0; }
.okd-count { -webkit-flex: none; flex: none; color: #8A92AC; font-size: 20px; margin-left: 16px; }
/* Folga em volta da lista: o contorno e o brilho da linha em foco não são cortados nas bordas. */
.okd-list { -webkit-flex: 1; flex: 1; overflow: hidden; padding: 16px 20px; margin: -16px -20px 0; }
.okd-empty { color: #8A92AC; font-size: 24px; margin: 24px 4px; }
.okc { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; height: 104px; padding: 0 18px; border-radius: 16px; margin-bottom: 8px; cursor: pointer; }
.okc > * + * { margin-left: 18px; }
.okc .num { width: 54px; -webkit-flex: none; flex: none; color: #8A92AC; font-size: 22px; }
.okc .ch-logo { width: 72px; height: 72px; border-radius: 14px; background-color: #202941; }
.okc .txt { -webkit-flex: 1; flex: 1; min-width: 0; }
.okc .nm { font-size: 26px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.okc .pr { font-size: 20px; color: #8A92AC; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 2px; }
.okc .pb { height: 4px; border-radius: 2px; background: rgba(255,255,255,.16); margin-top: 8px; overflow: hidden; }
.okc .pb i { display: block; height: 100%; background: #FFB547; }
.okc .now { -webkit-flex: none; flex: none; font-size: 16px; font-weight: 800; letter-spacing: .06em; color: #fff; background: #FFB547; padding: 4px 10px; border-radius: 8px; }
.okc.cur { background: rgba(255,181,71,.12); }
.okc.focused { background: rgba(255,255,255,.1); box-shadow: 0 0 0 4px #FFB547, 0 0 16px 3px rgba(255,181,71,.5) !important; }
.okc.focused .pr { color: #D6D6DC; }
.okd-hint { color: #8A92AC; font-size: 20px; margin: 18px 0 0; }
.okd-hint .key { font-size: 16px; min-width: 36px; }
.okp { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; height: 76px; padding: 0 18px; border-radius: 14px; margin-bottom: 6px; }
.okp > * + * { margin-left: 22px; }
.okp .tm { width: 96px; -webkit-flex: none; flex: none; }
.okp .tm b { display: block; font-size: 24px; }
.okp .tm span { font-size: 18px; color: #8A92AC; }
.okp .tt { -webkit-flex: 1; flex: 1; min-width: 0; font-size: 24px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.okp .tt .live-badge { margin-right: 12px; }
.okp.past { opacity: .5; }
.okp.past.focused { opacity: 1; }
.okp.on { box-shadow: inset 0 0 0 2px #FFB547; background: rgba(255,181,71,.1); }
.okp.on .tm b { color: #FFB547; }
.okp.focused { background: rgba(255,255,255,.1); box-shadow: 0 0 0 4px #FFB547, 0 0 16px 3px rgba(255,181,71,.5) !important; }
.okdays { display: -webkit-flex; display: flex; margin: 0 0 18px; }
.okdays span { padding: 8px 18px; border-radius: 999px; font-size: 20px; font-weight: 600; color: #8A92AC; background: rgba(255,255,255,.08); }
.okdays span + span { margin-left: 10px; }
.okdays span.on { background: #fff; color: #0A0E19; }
.okz { position: absolute; width: 440px; background: rgba(20,20,24,.97); border-radius: 20px; padding: 22px 24px; box-shadow: 0 20px 60px rgba(0,0,0,.6); border: 1px solid rgba(255,255,255,.08); text-align: center; }
.okz h4 { margin: 0 0 14px; font-size: 18px; letter-spacing: .1em; text-transform: uppercase; color: #FFB547; }
.okz-row { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: space-between; justify-content: space-between; }
.okz-btn { width: 72px; height: 72px; border-radius: 50%; background: rgba(255,255,255,.14); display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; font-size: 40px; font-weight: 700; cursor: pointer; }
.okz-btn.off { opacity: .3; }
.okz-val { font-family: "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; font-size: 44px; font-weight: 700; }
.okz p { margin: 14px 0 0; font-size: 20px; color: #8A92AC; }
.live-dot { color: #F87171; font-weight: 700; }
.player-msg { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); background: rgba(0,0,0,.75); padding: 24px 40px; border-radius: 18px; max-width: 1100px; text-align: center; }

/* Ao vivo: trilho | (grupos) | canais | prévia + programação | dias */
.live { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: #0C1120; }
/* Colunas com posição fixa (sem grid): trilho 96 | canais 600 | prévia | dias 76, 24px entre elas.
   Com os grupos abertos: grupos 400 | canais 450 | prévia | dias. */
.live > * { position: absolute; z-index: 1; top: 112px; bottom: 40px; min-width: 0; }
.live > .lv-top { top: 36px; bottom: auto; left: 48px; right: 64px; height: 76px; }
.live > .lv-rail { left: 48px; width: 96px; }
.live > .lv-groups { left: 48px; width: 400px; }
.live > .lv-list { left: 168px; width: 600px; }
.live > .lv-main { left: 792px; right: 164px; }
.live > .lv-days { right: 64px; width: 76px; }
.live.groups-open > .lv-list { left: 472px; width: 450px; }
.live.groups-open > .lv-main { left: 946px; }
/* O painel da prévia fica embaixo dos outros: a sombra que pinta o fundo em volta do vídeo não cobre a lista */
.live > .lv-main { z-index: 0; }
body.media-on .live { background: transparent; }
.lv-top { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; font-size: 30px; }
.lv-top > * + * { margin-left: 18px; }
.lv-top svg, .lv-head svg { width: 30px; height: 30px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; vertical-align: middle; }
.brand-mark.sm { width: 40px; height: 40px; border-radius: 10px; font-size: 22px; }
.lv-crumb b { font-weight: 600; }
.lv-clock { margin-left: auto; font: 700 44px "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; }
.rail-btn + .rail-btn { margin-top: 14px; }
.lv-rail { display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; -webkit-align-items: center; align-items: center; padding: 18px 0; border-radius: 22px; background: rgba(255,255,255,.04); overflow: hidden; }
.live.groups-open .lv-rail { display: none; }
.rail-btn { -webkit-flex: none; flex: none; width: 64px; height: 64px; border-radius: 16px; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; color: #8A92AC; }
.rail-btn svg { width: 32px; height: 32px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.rail-btn.on { background: rgba(255,181,71,.22); color: #EEF0F7; }
.rail-btn.menu { margin-top: auto; }
.lv-groups { display: none; overflow: hidden; padding: 16px 12px 40px; border-radius: 22px; background: #202941; }
.live.groups-open .lv-groups { display: block; }
.lv-head { margin: 4px 10px 14px; font-size: 20px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #8A92AC; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lv-groups .cat > * + * { margin-left: 14px; }
.lv-groups .cat { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; padding: 12px 18px; border-radius: 14px; margin-bottom: 6px; color: #EEF0F7; border: 2px solid transparent; }
.lv-groups .cat.fixed { color: #EEF0F7; font-weight: 600; }
.lv-groups .cat.on { background: rgba(255,181,71,.25); border-color: #FFB547; box-shadow: none; }
.cat-ic svg { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-width: 2; vertical-align: middle; }
.cat-name { -webkit-flex: 1; flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lv-groups .cat .n { color: #8A92AC; -webkit-font-feature-settings: "tnum"; font-feature-settings: "tnum"; font-variant-numeric: tabular-nums; }
.ch-list { overflow: hidden; height: 870px; padding: 4px; }
.ch-row { display: -webkit-flex; display: flex; margin-bottom: 8px; }
.ch-row > .ch-star { margin-left: 10px; }
.ch > * + * { margin-left: 16px; }
.ch { -webkit-flex: 1; flex: 1; min-width: 0; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; height: 64px; padding: 0 16px; border-radius: 14px; background: #161D30; border: 2px solid transparent; }
.ch .num { width: 58px; -webkit-flex: none; flex: none; color: #8A92AC; font-size: 24px; -webkit-font-feature-settings: "tnum"; font-feature-settings: "tnum"; font-variant-numeric: tabular-nums; }
.ch-logo { -webkit-flex: none; flex: none; width: 46px; height: 46px; border-radius: 8px; background: rgba(255,255,255,.06) center / contain no-repeat; }
.ch-logo.none { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; font: 700 22px "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; color: #8A92AC; }
.ch-name { -webkit-flex: 1; flex: 1; min-width: 0; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ch.on { box-shadow: inset 5px 0 0 #FFB547; }
.ch.on .ch-name { color: #FFD08A; }
.ch-star { -webkit-flex: none; flex: none; width: 64px; height: 64px; border-radius: 14px; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; background: #161D30; color: #8A92AC; font-size: 30px; border: 2px solid transparent; }
.ch-star.on { color: #F5B83D; }
.lv-empty { padding: 20px 12px; }
/* Foco na tela de canais: borda azul clara e fundo um pouco mais claro */
.live .focused { box-shadow: none !important; border-color: #FF6B6F !important; background: #2C2C31 !important; }
.live .rail-btn.focused { border: 2px solid #FF6B6F; }

.ch-preview { position: absolute; z-index: 0; top: 0; left: 0; right: 0; height: 470px; border-radius: 20px; background: #000; overflow: hidden; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; }
.ch-preview.idle .pv-logo .ch-logo { width: 200px; height: 150px; background-color: transparent; }
.ch-preview.idle .pv-logo .ch-logo.none { font-size: 90px; }
.pv-hint { position: absolute; right: 24px; bottom: 18px; margin: 0; color: #8A92AC; font-size: 22px; }
/* Prévia tocando: a caixa fica transparente (o vídeo está embaixo) e a sombra pinta o resto da tela */
.ch-preview.playing { background: transparent; box-shadow: 0 0 0 4000px #0C1120; }
.ch-preview.playing.loading { background: rgba(0,0,0,.55); }
.pv-tag { position: absolute; left: 22px; bottom: 18px; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; padding: 8px 16px 8px 8px; border-radius: 12px; background: rgba(0,0,0,.6); max-width: 70%; }
.pv-tag > * + * { margin-left: 14px; }
.pv-tag .ch-logo { width: 40px; height: 40px; }
.pv-tag b { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 26px; }
.pv-msg { font: 600 26px "Manrope", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; background: rgba(0,0,0,.7); padding: 16px 24px; border-radius: 14px; margin: 0 40px; text-align: center; }
.pg-card { position: absolute; z-index: 1; top: 492px; left: 0; right: 0; bottom: 0; overflow: hidden; border-radius: 20px; background: #161D30; padding: 22px 26px; }
.pg-head { display: -webkit-flex; display: flex; -webkit-align-items: baseline; align-items: baseline; -webkit-justify-content: space-between; justify-content: space-between; margin-bottom: 14px; }
.pg-head h3 { margin: 0; font: 600 30px "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; }
.pg-date { color: #FFB547; font-weight: 700; }
.pg-empty { margin: 30px 0; text-align: center; }
/* Lista de programas: rola dentro do cartão; ▲▼ andam pelos horários */
.pg-list { position: absolute; top: 78px; left: 26px; right: 26px; bottom: 14px; overflow: hidden; }
.pg-row.past { opacity: .55; }
.pg-desc { max-height: 420px; overflow: hidden; line-height: 1.45; }
.pg-row > * + * { margin-left: 20px; }
.pg-row { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; height: 66px; padding: 0 14px; margin-bottom: 8px; border-radius: 14px; border: 2px solid transparent; }
.pg-row.on { border-color: #FFB547; background: rgba(255,181,71,.1); }
.pg-time { -webkit-flex: none; flex: none; width: 92px; display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; line-height: 1.1; }
.pg-time b { font-size: 26px; -webkit-font-feature-settings: "tnum"; font-feature-settings: "tnum"; font-variant-numeric: tabular-nums; }
.pg-time span { font-size: 18px; color: #8A92AC; -webkit-font-feature-settings: "tnum"; font-feature-settings: "tnum"; font-variant-numeric: tabular-nums; }
.pg-row.on .pg-time b { color: #FFB547; }
.pg-title { -webkit-flex: 1; flex: 1; min-width: 0; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; }
.pg-title > * + * { margin-left: 14px; }
.pg-title span:last-child { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.live-badge { -webkit-flex: none; flex: none; font-size: 16px; font-weight: 800; letter-spacing: .06em; color: #F5B83D; background: rgba(245,184,61,.14); border: 1px solid rgba(245,184,61,.5); padding: 3px 10px; border-radius: 8px; }
.lv-days { display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; -webkit-justify-content: space-around; justify-content: space-around; padding: 14px 0; border-radius: 22px; background: #161D30; }
.day { display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; -webkit-align-items: center; align-items: center; color: #8A92AC; line-height: 1.15; margin: 0 8px; padding: 8px 0; border-radius: 14px; border: 2px solid transparent; }
.day b { font-size: 26px; } .day span { font-size: 17px; }
.day.on { color: #EEF0F7; background: rgba(255,181,71,.22); } .day.on b { font-weight: 800; }

/* Carregamento: 8 pontinhos girando e a velocidade embaixo */
.loader { display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; -webkit-align-items: center; align-items: center; }
.loader > * + * { margin-top: 18px; }
.dots { position: relative; width: 76px; height: 76px; -webkit-animation: spin 1s steps(8) infinite; animation: spin 1s steps(8) infinite; }
.dots i { position: absolute; left: 50%; top: 0; width: 14px; height: 14px; margin-left: -7px; border-radius: 50%; -webkit-transform-origin: 7px 38px; transform-origin: 7px 38px; background: #FFB547; }
.dots i:nth-child(1) { -webkit-transform: rotate(0deg); transform: rotate(0deg); opacity: 1; }
.dots i:nth-child(2) { -webkit-transform: rotate(-45deg); transform: rotate(-45deg); opacity: .85; background: #3D86E4; }
.dots i:nth-child(3) { -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: .7; background: #5A8FCB; }
.dots i:nth-child(4) { -webkit-transform: rotate(-135deg); transform: rotate(-135deg); opacity: .58; background: #6C93B5; }
.dots i:nth-child(5) { -webkit-transform: rotate(-180deg); transform: rotate(-180deg); opacity: .46; background: #7D97A3; }
.dots i:nth-child(6) { -webkit-transform: rotate(-225deg); transform: rotate(-225deg); opacity: .36; background: #8A99A0; }
.dots i:nth-child(7) { -webkit-transform: rotate(-270deg); transform: rotate(-270deg); opacity: .28; background: #9099A0; }
.dots i:nth-child(8) { -webkit-transform: rotate(-315deg); transform: rotate(-315deg); opacity: .2; background: #9599A0; }
.speed { min-height: 24px; font-size: 20px; font-weight: 600; letter-spacing: .04em; color: #C5CFDD; -webkit-font-feature-settings: "tnum"; font-feature-settings: "tnum"; font-variant-numeric: tabular-nums; }

/* Programação na tela cheia */
.epg { margin: 6px 0 18px; }
.epg-now, .epg-next { display: -webkit-flex; display: flex; -webkit-align-items: baseline; align-items: baseline; -webkit-flex-wrap: wrap; flex-wrap: wrap; margin: 0 0 8px; }
.epg-now > *, .epg-next > * { margin-right: 14px; }
.epg-now b { font-size: 30px; }
.epg-tag { font-size: 18px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: #FFB547; }
.epg-bar { height: 6px; border-radius: 3px; background: rgba(255,255,255,.18); margin: 4px 0 12px; overflow: hidden; }
.epg-bar i { display: block; height: 100%; background: #FFB547; }
.osd-epg { max-width: 1100px; margin-bottom: 24px; }
.osd-epg .epg { margin: 0; }
.poster .art.still { background-size: cover; background-position: center; }

/* Diagnóstico do player */
.diag { position: absolute; z-index: 3; top: 60px; right: 60px; width: 620px; padding: 26px 30px; border-radius: 20px; background: rgba(8,8,10,.88); border: 1px solid rgba(255,255,255,.12); font-size: 24px; }
/* Conta → Informações técnicas: mesma tabela do diagnóstico, dentro da janela. */
.diag.tech { position: static; width: auto; margin: 14px 0; padding: 18px 22px; }
.diag h3 { margin: 0 0 12px; font: 700 28px "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; color: #FFB547; }
.diag-row { display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; padding: 6px 0; border-bottom: 1px solid rgba(255,255,255,.08); }
.diag-row span { color: #8A92AC; }
.diag-row b { font-weight: 600; text-align: right; margin-left: 20px; -webkit-font-feature-settings: "tnum"; font-feature-settings: "tnum"; font-variant-numeric: tabular-nums; }
.diag-hint { margin: 12px 0 0; color: #FCD34D; font-size: 22px; }
.diag-hint:empty { display: none; }

/* Temporadas da série */
.seasons { display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; margin: 8px 192px -8px; }
.seasons > * { margin: 0 14px 14px 0; }
.season { padding: 12px 30px; border-radius: 32px; background: #1B2338; color: #8A92AC; font-weight: 600; font-size: 26px; }
.season.on { background: #EEF0F7; color: #0A0E19; }
.ep-section { margin-bottom: 8px; }
/* Série: topo mais compacto para temporadas, episódios e sinopse caberem na tela sem rolar */
.detail.series .detail-body { padding-top: 64px; }
.detail.series .detail-top { margin-bottom: 24px; }
/* v0.6.32: detalhe da série cabe na tela sem rolar; sinopse em 3 linhas (a do episódio focado usa o mesmo lugar). */
.detail.series .detail-text .plot { -webkit-line-clamp: 3; min-height: 3em; }
.detail.series .detail-poster { width: 260px; height: 390px; }
/* Grupos do Ao vivo: ícone fixo à esquerda e o nome logo depois, igual aos outros grupos */
.lv-groups .cat > .cat-ic { -webkit-flex: none; flex: none; width: 26px; }
.lv-groups .cat > .cat-name { -webkit-flex: 1 1 auto; flex: 1 1 auto; text-align: left; }

/* Filmes e Séries: "Continuar assistindo" e "Pesquisar" no topo das categorias */
.cats .cat { -webkit-align-items: center; align-items: center; }
.cats .cat > .cat-ic { -webkit-flex: none; flex: none; width: 26px; margin-right: 14px; }
.cats .cat > .cat-name { -webkit-flex: 1 1 auto; flex: 1 1 auto; text-align: left; }
.cats .cat.fixed { color: #EEF0F7; font-weight: 600; }

/* Filmes, Séries e Favoritos em tela própria, no molde dos Canais: cabeçalho | categorias 400 | grade */
.vod { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: #0C1120; }
.vod > * { position: absolute; z-index: 1; top: 112px; bottom: 40px; min-width: 0; }
.vod > .lv-top { top: 36px; bottom: auto; left: 48px; right: 64px; height: 76px; }
.vod > .lv-groups { display: block; left: 48px; width: 400px; height: auto; }
.vod > .vod-main { left: 496px; right: 64px; padding-top: 6px; }
.vod .lv-groups .cat > .cat-ic { margin-right: 0; }
.vod .lv-groups .cat.on { color: #EEF0F7; font-weight: 700; }
.vod .lv-groups .cat.focused { box-shadow: none !important; border-color: #FFD08A; background: #2C2C31; }
.vod .grid { height: 800px; }

/* Teclado na tela da pesquisa */
.kb-q { height: 72px; line-height: 72px; padding: 0 22px; margin-bottom: 16px; border-radius: 14px; background: #202941; font-size: 34px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border: 2px solid #FFB547; }
.kb-q.empty { color: #8A92AC; font-weight: 400; border-color: transparent; }
.kb-row { display: -webkit-flex; display: flex; }
.kb-key { -webkit-flex: 1 1 0; flex: 1 1 0; height: 68px; line-height: 68px; margin: 0 8px 8px 0; text-align: center; border-radius: 12px; background: #161D30; color: #EEF0F7; font-size: 30px; font-weight: 600; border: 2px solid transparent; }
.kb-key.wide { font-size: 24px; }
.kb-key:last-child { margin-right: 0; }
.kb-key.focused { box-shadow: none !important; border-color: #FFD08A; background: #FFB547; color: #1A1205; }
.kb-n { min-height: 34px; margin: 10px 0 0; }
.vod-main.search { display: -webkit-flex; display: flex; }
.vod-main.search .kb-box { -webkit-flex: none; flex: none; width: 520px; }
/* Teclado estreito da pesquisa: as teclas de baixo (Espaço, áç&, Apagar, Limpar) do tamanho do texto, sem quebrar linha. */
.vod-main.search .kb-key.wide { -webkit-flex: 1 1 auto; flex: 1 1 auto; padding: 0 8px; white-space: nowrap; font-size: 22px; }
.vod-results { -webkit-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; margin-left: 40px; }
.vod-main.search .grid-head h1 { font-size: 36px; }
.vod-main.search .empty { margin-top: 10px; }
.grid.narrow { width: 728px; height: 780px; }
.grid.narrow > .poster { margin-right: 34px; }
.grid.narrow > .poster:nth-child(3n) { margin-right: 0; }

/* Painel do título em foco (Filmes e Séries) e grade com 6 colunas */
.vod-main { overflow: hidden; }
/* Fundo da grade numa camada própria (Meza 11/10, ▲▼ lento na TV Samsung): sem ela, o fundo desfocado (blur 20px) era
   pintado de novo junto com a grade a cada quadro da rolagem suave. Nada muda no que aparece na tela. */
.vod-bg { position: absolute; z-index: 0; top: -112px; right: -64px; width: 1100px; height: 560px; background-size: cover; background-position: center top; opacity: .45; will-change: transform; }
.vod-bg.blur { -webkit-filter: blur(20px); filter: blur(20px); opacity: .25; }
.vod-bg:after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: linear-gradient(90deg, #0C1120 0%, rgba(14,14,17,.6) 45%, rgba(14,14,17,0) 100%), linear-gradient(0deg, #0C1120 0%, rgba(14,14,17,0) 60%); }
.vod-info { position: relative; z-index: 1; height: 222px; padding-right: 300px; }
.vod-info h1 { font-size: 46px; margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vod-info .meta { margin: 8px 0; font-size: 24px; }
.vi-plot { margin: 0; max-width: 900px; font-size: 22px; color: #8A92AC; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.sort-btn { position: absolute; top: 14px; right: 34px; font-size: 22px; padding: 10px 22px; }
.grid.vod-grid { position: relative; z-index: 1; width: 1326px; height: 690px; padding: 12px 14px 30px; }
.grid.vod-grid > .poster { width: 190px; margin: 0 32px 30px 0; }
.grid.vod-grid > .poster:nth-child(5n) { margin-right: 32px; }
.grid.vod-grid > .poster:nth-child(6n) { margin-right: 0; }
.grid.vod-grid > .poster .art { height: 285px; }
.grid.vod-grid > .poster .cap { font-size: 22px; }
.pb-year { position: absolute; left: 10px; top: 10px; padding: 2px 10px; border-radius: 8px; background: rgba(0,0,0,.65); font-size: 18px; font-weight: 700; color: #fff; }
.pb-new { position: absolute; left: 10px; top: 10px; padding: 2px 10px; border-radius: 8px; background: #FFB547; font-size: 16px; font-weight: 800; letter-spacing: .06em; color: #1A1205; }
/* Buscas recentes embaixo do teclado */
.kb-recent { margin-top: 14px; }
.kb-recent-t { margin: 0 0 10px; font-size: 20px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #8A92AC; }
.chip { display: inline-block; margin: 0 10px 10px 0; padding: 8px 18px; border-radius: 999px; background: #161D30; color: #EEF0F7; font-size: 22px; border: 2px solid transparent; }
.chip.focused { box-shadow: none !important; border-color: #FFD08A; background: #FFB547; color: #1A1205; }
.dialog-box .kb-recent { margin-top: 16px; }

/* Futebol: cartões de jogo (Início e tela Futebol) */
.fb-card { -webkit-flex: none; flex: none; width: 520px; padding: 18px 22px; border-radius: 18px; background: #161D30; border: 2px solid transparent; box-sizing: border-box; }
.fb-card.wide { width: 640px; display: inline-block; vertical-align: top; margin: 0 24px 24px 0; }
.fb-card.wide:nth-child(2n) { margin-right: 0; }
.fb-card.focused { box-shadow: none !important; border-color: #FFD08A; background: #2C2C31; }
.fb-card.is-live { border-color: rgba(255,94,72,.55); }
.fb-card.is-live.focused { border-color: #FF6B6F; }
.fb-top { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; font-size: 20px; color: #8A92AC; }
.fb-top > * + * { margin-left: 10px; }
.fb-league { -webkit-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fb-live { -webkit-flex: none; flex: none; padding: 2px 10px; border-radius: 8px; background: #FF5E48; color: #fff; font-weight: 800; font-size: 18px; }
.fb-end, .fb-day { -webkit-flex: none; flex: none; font-weight: 700; color: #8A92AC; }
.fb-teams { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; margin: 16px 0 12px; }
.fb-team { -webkit-flex: 1 1 0; flex: 1 1 0; min-width: 0; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; font-size: 26px; font-weight: 700; }
.fb-team span:not(.crest) { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fb-team > * + * { margin-left: 12px; }
.fb-team.away { -webkit-justify-content: flex-end; justify-content: flex-end; text-align: right; }
.crest { -webkit-flex: none; flex: none; width: 52px; height: 52px; border-radius: 50%; background: #fff center / 80% no-repeat; display: inline-block; }
.crest.sm { width: 28px; height: 28px; background-size: 85%; }
.crest.txt { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; background: #2B3D5E; color: #fff; font-size: 24px; }
.score, .ko { -webkit-flex: none; flex: none; margin: 0 16px; font: 800 36px "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; }
.ko { color: #FFB547; }
.fb-ch { font-size: 20px; color: #EEF0F7; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fb-list { height: 830px; overflow: hidden; padding: 6px 4px 30px; }
.lv-head.fb-sub { margin-top: 22px; }
.fb-pick { margin: 18px 0; }
.fb-pick .btn { margin: 0 12px 12px 0; }
.fb-card { width: 460px; }
.fb-rows { position: relative; margin: 14px 0 10px; }
.fb-row { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; height: 56px; font-size: 26px; font-weight: 700; }
.fb-row > * + * { margin-left: 12px; }
.fb-row .crest { width: 42px; height: 42px; }
.fb-row span:not(.crest) { -webkit-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fb-row b { -webkit-flex: none; flex: none; font: 800 32px "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; margin-right: 6px; }
.fb-rows .ko.side { position: absolute; right: 0; top: 50%; margin: -24px 0 0; font-size: 36px; }
.fb-rows.sched .fb-row { padding-right: 120px; }
/* Escolha do canal de um jogo: grade simples, 2 colunas */
.fb-grid { max-height: 560px; overflow: hidden; margin: 18px 0 8px; padding: 4px; }
.fb-tile { display: -webkit-inline-flex; display: inline-flex; -webkit-align-items: center; align-items: center; vertical-align: top; width: 336px; height: 72px; margin: 0 12px 12px 0; padding: 0 16px; box-sizing: border-box; border-radius: 14px; background: #161D30; border: 2px solid transparent; overflow: hidden; }
.fb-tile:nth-child(2n) { margin-right: 0; }
.fb-tile .ch-logo { margin-right: 14px; }
.fb-tile .ch-name { -webkit-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 24px; font-weight: 600; }
.fb-tile.focused { box-shadow: none !important; border-color: #FFD08A; background: #FFB547; color: #1A1205; }

/* ---------- v0.6.19: Conta em tela cheia ---------- */
.vod > .acc-main { left: 48px; right: 64px; top: 140px; overflow: hidden; }
.acc-row { display: -webkit-flex; display: flex; margin-bottom: 28px; }
.acc-row > .acc-card + .acc-card { margin-left: 28px; }
.acc-card { -webkit-flex: 1 1 0; flex: 1 1 0; min-width: 0; background: #161D30; border: 2px solid rgba(255,255,255,.06); border-radius: 22px; padding: 30px 34px; }
.acc-card.ok { border-color: rgba(52,199,123,.35); }
.acc-card.bad { border-color: rgba(255,92,92,.5); }
.acc-card.warn { border-color: rgba(245,184,61,.5); }
.acc-h { margin: 0 0 14px; font-size: 24px; color: #8A92AC; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; }
.acc-h svg { width: 30px; height: 30px; margin-right: 12px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.acc-state { margin: 0 0 16px; font-size: 46px; font-weight: 800; line-height: 1.1; }
.acc-card.ok .acc-state { color: #34C77B; }
.acc-card.bad .acc-state { color: #FF6B6B; }
.acc-card.warn .acc-state { color: #F5B83D; }
.acc-card.dev .acc-state { font-size: 38px; letter-spacing: 1px; font-family: monospace; }
.acc-line { margin: 0 0 10px; font-size: 25px; line-height: 1.35; }
.acc-line .small { font-size: 20px; }
.acc-tag { display: inline-block; padding: 4px 14px; border-radius: 99px; background: rgba(255,181,71,.22); color: #FFD08A; font-size: 21px; font-weight: 700; }
.acc-warn { color: #F5B83D; font-weight: 700; }
.acc-bad { color: #FF6B6B; font-weight: 700; }
.acc-actions { -webkit-flex: 0 0 520px; flex: 0 0 520px; }
.acc-actions .btn { display: block; width: 100%; margin: 0 0 16px; text-align: left; font-size: 26px; }

/* ---------- v0.6.66: Conta enxuta: um cartão de assinatura à esquerda e as opções em quatro grupos ---------- */
.acc2 { display: -webkit-flex; display: flex; -webkit-align-items: flex-start; align-items: flex-start; }
.acc2 .acc-sum { -webkit-flex: 0 0 640px; flex: 0 0 640px; padding: 34px 38px; }
.acc-sum .acc-state { font-size: 54px; }
.acc-kvs { margin-top: 22px; padding-top: 18px; border-top: 2px solid rgba(255,255,255,.07); }
.acc-kv { display: -webkit-flex; display: flex; -webkit-align-items: baseline; align-items: baseline; font-size: 24px; line-height: 1.35; margin-bottom: 10px; }
.acc-kv > span { -webkit-flex: 0 0 200px; flex: 0 0 200px; color: #8A92AC; }
.acc-kv > b { -webkit-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; font-weight: 700; }
.acc-kv .mono { font-family: monospace; font-size: 26px; letter-spacing: 1px; }
.acc-opts { -webkit-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; margin-left: 44px; }
.acc-g { margin-bottom: 26px; }
.acc-gh { margin: 0 0 12px 6px; font-size: 21px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #7C7C85; }
.acc-gr { display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; }
.acc-opt { -webkit-flex: 0 0 auto; flex: 0 0 auto; width: 48.9%; height: 104px; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; text-align: left; padding: 0 26px; margin-right: 2.2%; border-radius: 20px;
  background: #161D30; border: 2px solid rgba(255,255,255,.06); color: #EEF0F7; font: inherit; }
.acc-opt:last-child, .acc-opt:nth-child(2n) { margin-right: 0; }
.acc-opt:nth-child(n+3) { margin-top: 14px; }
.ao-ic { -webkit-flex: none; flex: none; width: 58px; height: 58px; border-radius: 16px; background: rgba(255,255,255,.08); display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; margin-right: 22px; }
.ao-ic svg { width: 30px; height: 30px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ao-t { -webkit-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; }
.ao-t b { display: block; font-size: 28px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ao-t small { display: block; font-size: 21px; color: #8A92AC; margin-top: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.acc-opt.danger .ao-ic { background: rgba(239,68,68,.2); color: #FCA5A5; }
.acc-opt.danger b { color: #FCA5A5; }
.acc-opt.focused { background: #FFB547; color: #1A1205; border-color: #FFB547; box-shadow: 0 0 28px 6px rgba(255,181,71,.5) !important; }
.acc-opt.focused small { color: #55555C; }
.acc-opt.focused .ao-ic { background: #FFB547; color: #1A1205; }
.acc-opt.danger.focused b { color: #B91C1C; }
/* Janela "Player e buffer": uma linha por opção, o valor à direita; OK troca o valor. */
.pset { margin-top: 18px; }
.pset-row { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; width: 100%; min-height: 100px; padding: 14px 28px; margin-bottom: 12px; border-radius: 18px; text-align: left;
  background: rgba(255,255,255,.06); border: 2px solid rgba(255,255,255,.06); color: #EEF0F7; font: inherit; }
.ps-t { -webkit-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; }
.ps-t b { display: block; font-size: 29px; }
.ps-t small { display: block; font-size: 21px; color: #8A92AC; margin-top: 4px; line-height: 1.3; }
.ps-v { -webkit-flex: none; flex: none; margin-left: 24px; padding: 8px 20px; border-radius: 99px; background: rgba(255,181,71,.22); color: #FFD08A; font-size: 25px; font-weight: 800; }
.ps-v:after { content: " ›"; }
.pset-row.focused { background: #FFB547; color: #1A1205; box-shadow: 0 0 28px 6px rgba(255,181,71,.5) !important; }
.pset-row.focused small { color: #55555C; }
.pset-row.focused .ps-v { background: #FFB547; color: #1A1205; }

/* ---------- v0.6.19: continuar ou começar de novo ---------- */
.resume { text-align: left; }
.resume h2 { font-size: 46px; margin: 4px 0 6px; }
.resume .eyebrow { margin: 0; }
.resume-ep { margin: 0 0 18px; font-size: 26px; color: #8A92AC; }
.resume-bar { height: 8px; border-radius: 4px; background: rgba(255,255,255,.15); overflow: hidden; margin: 18px 0 10px; }
.resume-bar i { display: block; height: 100%; background: #FFB547; }
.resume .actions { margin-top: 28px; }
.btn.resume-go { position: relative; overflow: hidden; }
.resume-fill { position: absolute; top: 0; left: 0; bottom: 0; width: 0; background: rgba(255,181,71,.45); }
.resume-lbl { position: relative; }
.btn-sub { font-weight: 500; opacity: .75; margin-left: 6px; }
.dialog-box.wide { width: 1040px; }

/* Início: destaque em tela cheia (imagem larga do TMDB), etiquetas, título grande e botões em pílula.
   As fileiras sobem por cima da parte de baixo do destaque, que se apaga no fundo. */
.page.home { padding-top: 0; }
.home .hero { margin: 0; height: 820px; border-radius: 0; background: #0A0E19; }
.home .hero-bg { background-position: center top; }
.home .hero-shade { background: linear-gradient(90deg, rgba(10,14,25,.96) 0%, rgba(10,14,25,.78) 30%, rgba(10,14,25,.2) 62%, rgba(10,14,25,0) 100%),
  linear-gradient(0deg, #0A0E19 0%, rgba(10,14,25,.75) 24%, rgba(10,14,25,0) 52%); }
.home .hero-poster { right: 96px; top: 210px; width: 300px; height: 450px; border-radius: 18px; }
.home .hero-body { padding: 200px 96px 0; max-width: 1240px; }
.hero-tags { display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-align-items: center; align-items: center; }
.tg { margin: 0 12px 10px 0; padding: 4px 14px; border: 2px solid rgba(255,255,255,.28); border-radius: 8px; background: rgba(255,255,255,.06); font-size: 21px; font-weight: 700; color: #EEF2F8; white-space: nowrap; }
.tg.top { background: #FFB547; border-color: #FFB547; color: #1A1205; text-transform: uppercase; letter-spacing: .05em; }
.tg.star { color: #FFD24A; }
.home .hero h1 { margin: 12px 0 0; font-size: 96px; line-height: 1.02; letter-spacing: -2px; text-shadow: 0 4px 30px rgba(0,0,0,.45); }
.home .hero h1.t-md { font-size: 76px; letter-spacing: -1px; }
.home .hero h1.t-sm { font-size: 62px; letter-spacing: -1px; }
.home .hero .plot { margin: 20px 0 34px; max-width: 1000px; font-size: 28px; line-height: 1.42; color: rgba(245,245,245,.88);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.home .hero .actions { -webkit-align-items: center; align-items: center; }
.home .hero .btn { height: 76px; padding: 0 38px; border-radius: 38px; border: 2px solid rgba(255,255,255,.26); background: rgba(20,20,23,.7); font-size: 28px; font-weight: 700; }
.home .hero .btn.primary { background: #FFB547; border-color: #FFB547; color: #1A1205; }
.home .hero .btn.icon { width: 76px; padding: 0; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; }
.home .hero .btn.icon svg { width: 36px; height: 36px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.home .hero .btn.focused { -webkit-transform: scale(1.06); transform: scale(1.06); box-shadow: 0 0 0 5px #FFB547, 0 10px 34px rgba(255,181,71,.6) !important; }
.home .hero-dots { position: static; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; margin: 0 0 20px 14px; }
.home-rows { position: relative; z-index: 1; margin-top: -200px; }
.home-rows.no-hero { margin-top: 0; padding-top: 190px; }
.home .row h2 { font-size: 36px; font-weight: 700; }
.home .poster.focused .art { box-shadow: 0 0 0 5px #FFB547, 0 14px 40px rgba(255,181,71,.55); }

/* ===== v0.6.22: perfis, pesquisa no topo e o visual novo em Canais, Filmes, Séries, Futebol e Conta ===== */
/* Destaque do Início: altura fixa pensada para o pior caso (título e resumo em 2 linhas), assim as fileiras
   nunca sobem por cima dos botões e também não pulam quando o destaque troca de título. */
.home .hero { height: 890px; }
.home .hero h1.t-md { font-size: 80px; }

/* Barra de cima: lupa, engrenagem e o avatar do perfil. */
.tb-ic { margin-left: 22px; }
.tb-right .tb-ic:first-of-type { margin-left: 34px; }
.tb-ic.on { background: rgba(255,181,71,.3); border-color: #FFB547; }
.tb-av { width: 76px; height: 76px; margin-left: 22px; padding: 0; border-radius: 22px; overflow: hidden; border: 3px solid rgba(255,255,255,.25); }
.tb-av .av { width: 100%; height: 100%; border-radius: 0; }
.tb-av.focused { border-color: #FFB547; box-shadow: 0 0 0 4px #FFB547 !important; -webkit-transform: scale(1.06); transform: scale(1.06); }

/* Avatar: rostinho no quadrado colorido. */
.av { display: -webkit-inline-flex; display: inline-flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center;
  width: 100px; height: 100px; border-radius: 22%; overflow: hidden; vertical-align: middle; }
.av svg { width: 72%; height: 72%; }
/* Rostinhos (v0.6.31): o desenho ocupa o quadrado inteiro, a cor de fundo vem do próprio avatar. */
.av.av-face svg { width: 100%; height: 100%; }
.av.av-face { box-shadow: inset 0 0 0 2px rgba(255,255,255,.08); }
.av.add { background: rgba(255,255,255,.06); border: 4px dashed rgba(255,255,255,.3); }
.av.add svg { fill: none; stroke: #8A92AC; stroke-width: 2; stroke-linecap: round; width: 46%; height: 46%; }

/* "Quem está assistindo?" */
.profiles { position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center;
  background: radial-gradient(ellipse at 50% 0%, rgba(255,181,71,.22), rgba(10,14,25,0) 60%), #0A0E19; }
.pf-brand { position: absolute; top: 56px; left: 96px; }
.profiles h1 { font-size: 72px; letter-spacing: -1px; margin-bottom: 64px; }
.pf-row { display: -webkit-flex; display: flex; -webkit-justify-content: center; justify-content: center; }
.pf { position: relative; width: 250px; margin: 0 26px; display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; -webkit-align-items: center; align-items: center; border-radius: 24px; }
.pf .av { width: 230px; height: 230px; border-radius: 28px; border: 5px solid transparent; transition: border-color .12s ease, -webkit-transform .12s ease; transition: transform .12s ease, border-color .12s ease; transition: transform .12s ease, border-color .12s ease, -webkit-transform .12s ease; }
.pf b { margin-top: 22px; font-size: 32px; font-weight: 600; color: #8A92AC; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 250px; }
.pf.focused { box-shadow: none !important; }
.pf.focused .av { border-color: #FFB547; -webkit-transform: scale(1.07); transform: scale(1.07); box-shadow: 0 16px 46px rgba(255,181,71,.5); }
.pf.focused b { color: #EEF0F7; font-weight: 700; }
.pf-pen { position: absolute; top: 0; left: 10px; width: 230px; height: 230px; border-radius: 28px; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; background: rgba(0,0,0,.45); }
.pf-pen svg { width: 76px; height: 76px; fill: none; stroke: #fff; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.pf-note { margin: 44px 0 0; font-size: 24px; }
.pf-actions { margin-top: 40px; display: -webkit-flex; display: flex; }
.pf-actions .btn { margin-right: 20px; border: 2px solid rgba(255,255,255,.26); background: transparent; }
.pf-actions .btn:last-child { margin-right: 0; }
.pf-actions .btn.primary { background: #FFB547; border-color: #FFB547; color: #1A1205; }
.pf-actions .btn.danger { border-color: rgba(239,68,68,.6); color: #FCA5A5; }

/* Novo perfil / editar perfil */
.pf-edit { position: absolute; top: 0; right: 0; bottom: 0; left: 0; padding: 80px 96px 0; background: radial-gradient(ellipse at 50% 0%, rgba(255,181,71,.18), rgba(10,14,25,0) 60%), #0A0E19; }
.pf-edit h1 { font-size: 60px; margin-bottom: 44px; }
.pf-cols { display: -webkit-flex; display: flex; }
.pf-left { -webkit-flex: none; flex: none; width: 760px; }
.pf-big { margin-bottom: 26px; }
.pf-big .av { width: 180px; height: 180px; border-radius: 26px; }
.pf-right { -webkit-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; margin-left: 90px; }
.pf-right .lv-head { margin: 0 0 18px; }
.pf-icons { width: 720px; }
.pf-ic { display: inline-block; margin: 0 22px 22px 0; border-radius: 26px; border: 5px solid transparent; }
.pf-ic:nth-child(4n) { margin-right: 0; }
.pf-ic .av { width: 150px; height: 150px; border-radius: 20px; }
.pf-ic.on { border-color: #FFB547; }
.pf-ic.focused { box-shadow: none !important; border-color: #FFB547; -webkit-transform: scale(1.06); transform: scale(1.06); }
.pf-right .pf-actions { margin-top: 26px; }

/* Pesquisar (lupa no topo): teclado à esquerda, resultados em fileiras à direita. */
.gsearch { position: absolute; top: 172px; right: 0; bottom: 0; left: 96px; display: -webkit-flex; display: flex; }
.gs-kb { -webkit-flex: none; flex: none; width: 600px; padding-top: 6px; }
.gs-res { -webkit-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; height: 868px; margin-left: 50px; overflow: hidden; }
.gs-res .row h2 { margin-left: 0; font-size: 32px; }
.gs-res .row h2 .n { margin-left: 10px; font-size: 24px; color: #8A92AC; font-weight: 500; }
.gs-res .row-items { padding-left: 4px; }
.gs-empty { margin-top: 140px; text-align: center; padding-right: 96px; }
.gs-empty h2 { font-size: 44px; margin: 18px 0 10px; }
.gs-ic svg { width: 110px; height: 110px; fill: none; stroke: #FFB547; stroke-width: 1.6; stroke-linecap: round; }
.gs-ch { -webkit-flex: none; flex: none; width: 300px; height: 190px; margin-right: 24px; border-radius: 18px; background: rgba(255,255,255,.05); border: 2px solid rgba(255,255,255,.08);
  display: -webkit-flex;
  display: flex; -webkit-flex-direction: column; flex-direction: column; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; }
.gs-ch .ch-logo { width: 120px; height: 80px; background-color: transparent; }
.gs-ch b { margin-top: 14px; max-width: 260px; font-size: 24px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gs-ch.focused { box-shadow: 0 0 0 5px #FFB547, 0 12px 34px rgba(255,181,71,.5) !important; -webkit-transform: scale(1.05); transform: scale(1.05); }

/* Telas internas com a mesma cara do Início: a barra em pílula fica em cima, painéis "de vidro", azul nos selecionados. */
.btn.primary { background: #FFB547; color: #1A1205; }
.lv-top { display: none !important; }
.vod, .live { background: radial-gradient(ellipse at 75% -20%, rgba(255,94,72,.2), rgba(10,14,25,0) 55%), #0A0E19; }
.vod > *, .live > * { top: 172px; }
.vod > .vod-main { left: 500px; right: 96px; }
.vod > .lv-groups, .live > .lv-groups, .live > .lv-rail { left: 96px; }
.live > .lv-list { left: 216px; width: 580px; }
.live > .lv-main { left: 820px; right: 196px; }
.live > .lv-days { right: 96px; }
.live.groups-open > .lv-list { left: 520px; width: 440px; }
.live.groups-open > .lv-main { left: 984px; }
.lv-groups, .lv-rail, .lv-days { background: rgba(255,255,255,.045); border: 2px solid rgba(255,255,255,.08); border-radius: 28px; }
.lv-groups .cat { border-radius: 999px; padding: 12px 22px; }
.lv-groups .cat.on, .vod .lv-groups .cat.on { background: #FFB547; border-color: #FFB547; color: #1A1205; font-weight: 700; }
.lv-groups .cat.on .n { color: rgba(255,255,255,.85); }
.lv-groups .cat.focused, .vod .lv-groups .cat.focused, .live .lv-groups .cat.focused { border-color: #FFB547 !important; background: rgba(255,94,72,.45) !important; color: #fff; }
.lv-head { letter-spacing: .14em; }
.ch-list { height: 800px; }
.ch, .ch-star { background: rgba(255,255,255,.05); border-radius: 16px; }
.live .ch.focused, .live .ch-star.focused { border-color: #FFB547 !important; background: rgba(255,94,72,.35) !important; }
.ch.on { box-shadow: inset 6px 0 0 #FFB547; }
/* Caixa da prévia em 16:9 (904x508), o formato do vídeo: o canal enche a caixa sem faixas pretas nem esticar. */
.ch-preview { height: 508px; border-radius: 26px; }
.pg-card { top: 530px; border-radius: 26px; background: rgba(255,255,255,.045); border: 2px solid rgba(255,255,255,.08); }
.day.on { background: #FFB547; color: #1A1205; }
.live .day.focused { border-color: #FFB547 !important; background: rgba(255,94,72,.45) !important; }
.vod-info { height: 236px; overflow: hidden; margin-bottom: 10px; padding-top: 16px; padding-left: 24px; }
.vod-info .eyebrow { margin-bottom: 10px; }
.vod-info .vi-plot { -webkit-line-clamp: 2; }
.vod-info h1 { font-size: 54px; letter-spacing: -1px; }
.vod .grid { height: 640px; }
.sort-btn { border: 2px solid rgba(255,255,255,.22); background: rgba(20,20,23,.7); }
.poster .art { border-radius: 18px; }
.poster.focused .art { box-shadow: 0 0 0 5px #FFB547, 0 14px 40px rgba(255,181,71,.55); }
.pb-new { background: #FFB547 !important; }
.fb-list { height: 760px; }
.vod > .acc-main { left: 96px; right: 96px; top: 172px; }
.acc-card { background: rgba(255,255,255,.045); border-radius: 28px; }

/* Detalhe: título grande, botões em pílula azul e temporadas em pílula. */
.detail-text h1 { font-size: 80px; letter-spacing: -1.5px; }
.detail .btn { height: 76px; padding: 0 38px; border: 2px solid rgba(255,255,255,.26); background: rgba(20,20,23,.7); font-size: 28px; font-weight: 700; }
.detail .btn.primary { background: #FFB547; border-color: #FFB547; color: #1A1205; }
.detail .btn.focused { -webkit-transform: scale(1.06); transform: scale(1.06); box-shadow: 0 0 0 5px #FFB547, 0 10px 34px rgba(255,181,71,.6) !important; }
.season { border: 2px solid rgba(255,255,255,.14); background: rgba(255,255,255,.05); }
.season.on { background: #FFB547; border-color: #FFB547; color: #1A1205; }
.season.focused { box-shadow: 0 0 0 4px #FFB547 !important; }
.detail-poster { border-radius: 22px; }
/* Com a lupa e o avatar à direita, o menu fica um pouco mais justo para a data caber. */
.menu-item { padding: 0 24px; }
.tb-sep { margin: 0 10px 0 22px; }
.tb-right { padding-left: 28px; }
.tb-date { font-size: 26px; }
.clock { font-size: 26px; }
.tb-ic { margin-left: 18px; }
.tb-right .tb-ic:first-of-type { margin-left: 30px; }
.tb-av { margin-left: 18px; }
/* v0.6.23: 30 ícones de perfil em 6 colunas. */
.pf-icons { width: 790px; font-size: 0; }
.pf-ic { margin: 0 12px 12px 0; border-width: 4px; border-radius: 22px; vertical-align: top; }
.pf-ic:nth-child(4n) { margin-right: 12px; }
.pf-ic:nth-child(6n) { margin-right: 0; }
.pf-ic .av { width: 110px; height: 110px; border-radius: 18px; }
.pf-edit h1 { margin-bottom: 30px; }
.pf-busy { margin-top: 8px; font-size: 22px; color: #ffb74d; }
/* v0.6.24: folga em cima e dos lados para a borda e o zoom da capa focada não serem cortados. */
.vod .grid { padding: 26px 20px 40px; height: 628px; }

/* v0.6.31: ativação em duas metades. Esquerda: Provedor + Usuário + Senha. Direita: QR Code (teste grátis) e MAC. */
.act-panel { -webkit-align-items: center; align-items: center; }
.act-login { -webkit-flex: none; flex: none; width: 720px; padding: 52px 56px; border-radius: 36px; background: rgba(19,26,43,.86); border: 2px solid rgba(255,255,255,.08); box-shadow: 0 30px 80px rgba(0,0,0,.45); }
.act-login h1 { font-size: 64px; line-height: 1.05; margin: 0 0 14px; }
.act-lead { margin: 0 0 30px; font-size: 26px; color: #8A92AC; }
.lg-field { display: block; height: 104px; padding: 16px 28px; margin-bottom: 18px; border-radius: 20px; background: #1B2338; border: 3px solid transparent; }
.lg-field span { display: block; font-size: 20px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #8A92AC; }
.lg-field b { display: block; margin-top: 4px; font: 700 38px "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lg-field b em { font: 400 32px "Manrope", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; font-style: normal; color: #6B6B74; }
.lg-field.focused { border-color: #FFB547; background: #232C45; box-shadow: 0 0 0 6px rgba(255,181,71,.22) !important; }
.lg-field.focused span { color: #FFD08A; }
#lg-provider b { letter-spacing: .14em; }
#lg-provider b em { letter-spacing: 0; }
.lg-go { display: block; width: 100%; margin-top: 10px; height: 84px; font-size: 32px; background: #FFB547; color: #1A1205; }
.lg-go.busy { opacity: .6; }
.lg-msg { min-height: 36px; margin: 18px 0 0; font-size: 24px; color: #8A92AC; }
.lg-msg.err { color: #FCA5A5; }
.lg-msg.wait { color: #EEF0F7; }
.act-or { -webkit-flex: none; flex: none; display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; -webkit-align-items: center; align-items: center; width: 140px; height: 560px; }
.act-or i { display: block; -webkit-flex: 1; flex: 1; width: 2px; background: rgba(255,255,255,.12); }
.act-or span { margin: 18px 0; font: 700 26px "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; color: #8A92AC; text-transform: uppercase; letter-spacing: .1em; }
.act-side { -webkit-flex: none; flex: none; width: 760px; }
.act-side h2 { font-size: 52px; line-height: 1.08; margin: 0 0 30px; }
.act-side-row { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; margin-bottom: 30px; }
.act-side .act-qr { margin-right: 44px; }
.act-side .qr-frame { padding: 22px; border-radius: 28px; }
.act-side .act-steps { margin: 0; }
.act-side .act-steps li { font-size: 28px; }
.act-side .act-steps i { width: 48px; height: 48px; line-height: 42px; font-size: 24px; margin-right: 18px; }
.act-side .act-id b { font-size: 42px; }
.act-side .act-status { margin-top: 26px; }
.act.over .act-side-row { display: none; }

/* Teclado de login (letras, números e símbolos) e teclado só de números do Provedor. */
.lg-edit { width: auto; }
.lg-edit h2 { margin: 0 0 18px; }
.kb-full .kb-key { font-size: 28px; text-transform: none; }
.kb-key.on { background: #3A3A40; border-color: #FFD08A; }
.kb-num { width: 520px; margin: 0 auto; }
.kb-num .kb-key { height: 84px; line-height: 84px; font-size: 36px; }

/* Termo de uso: contrato para aceitar na primeira abertura. */
.terms { position: absolute; top: 0; right: 0; bottom: 0; left: 0; padding: 56px 128px 48px; display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column;
  background: linear-gradient(115deg, rgba(255,181,71,.14) 0%, transparent 38%), #0A0E19; }
.terms-doc { -webkit-flex: 1; flex: 1; display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; width: 1360px; margin: 24px auto 0; min-height: 0; }
.terms-doc h1 { font-size: 58px; margin: 0 0 8px; }
.terms-meta { margin: 0 0 22px; font-size: 24px; color: #8A92AC; }
.terms-meta b { color: #EEF0F7; letter-spacing: .03em; }
.terms-text { -webkit-flex: 1; flex: 1; min-height: 0; overflow: hidden; padding: 26px 40px; border-radius: 24px; background: #F4F4F5; color: #18181B; }
.terms-p { padding: 6px 18px; margin: 0 -18px 10px; border-left: 6px solid transparent; border-radius: 8px; }
.terms-p p { margin: 0; font-size: 27px; line-height: 1.5; }
.terms-p ul { margin: 0; padding-left: 36px; font-size: 27px; line-height: 1.55; }
.terms-p.focused { border-left-color: #FFB547; background: rgba(255,181,71,.07); box-shadow: none !important; }
.terms-sign { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; margin-top: 24px; }
.terms-check { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; height: 76px; padding: 0 26px 0 18px; border-radius: 18px; background: #1B2338; border: 3px solid transparent; font-size: 27px; font-weight: 600; }
.terms-check i { -webkit-flex: none; flex: none; width: 40px; height: 40px; margin-right: 16px; border-radius: 10px; border: 3px solid #A3A3AB; position: relative; }
.terms-check.on i { background: #FFB547; border-color: #FFB547; }
.terms-check.on i:after { content: ""; position: absolute; left: 11px; top: 3px; width: 10px; height: 20px; border: solid #fff; border-width: 0 5px 5px 0; -webkit-transform: rotate(45deg); transform: rotate(45deg); }
.terms-check.focused { border-color: #FFB547; box-shadow: 0 0 0 6px rgba(255,181,71,.22) !important; }
.terms-line { margin: 18px 0 0; padding: 0 4px 10px;  border-bottom: 2px dashed rgba(255,255,255,.25); font-size: 22px; color: #8A92AC; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.terms-line b { color: #EEF0F7; }
.terms-sign .actions { margin: 0 0 -20px auto; }
.terms-sign .btn.primary { background: #FFB547; color: #1A1205; }
.terms-sign .btn[disabled] { opacity: .45; }

/* ---------- v0.6.34: Minhas listas (Conta) ---------- */
.acc-card.ml { max-width: 1240px; margin: 0 auto; }
.ml-lead { margin: 0 0 22px; font-size: 25px; line-height: 1.35; }
.ml-row { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; height: 104px; padding: 0 28px; margin-bottom: 14px; border-radius: 20px; background: #1B2338; border: 3px solid transparent; }
.ml-row.on { border-color: rgba(255,181,71,.55); }
.ml-n { -webkit-flex: none; flex: none; width: 52px; height: 52px; margin-right: 24px; border-radius: 50%; background: rgba(255,255,255,.08); font-size: 24px; font-weight: 800; line-height: 52px; text-align: center; }
.ml-row.on .ml-n { background: #FFB547; }
.ml-t { -webkit-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; }
.ml-t b, .ml-t small { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.ml-t b { font-size: 30px; }
.ml-t small { margin-top: 4px; font-size: 21px; color: #8A92AC; }
.ml-tag, .ml-use { -webkit-flex: none; flex: none; margin-left: 20px; }
.ml-use { font-size: 21px; opacity: 0; }
.ml-row.focused .ml-use { opacity: 1; }
.ml-foot { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; margin-top: 22px; }
.ml-foot .btn { margin-right: 26px; font-size: 26px; }
.ml-foot .muted { font-size: 23px; }
.ml-add-main { text-align: center; }
.ml-add-main .act-login { display: inline-block; text-align: left; }
/* Opções da Conta em duas colunas: com Minhas listas e Sair desta lista, a coluna única passava da tela. */
.acc-actions { -webkit-flex: 0 0 900px; flex: 0 0 900px; }
.acc-actions .btn { display: inline-block; vertical-align: top; width: 49%; margin: 0 0 16px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 25px; }
.acc-actions .btn:nth-of-type(odd) { margin-right: 2%; }

/* ---------- v0.6.35: nome do episódio em até duas linhas ---------- */
.poster[data-ep] .cap { white-space: normal; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-height: 1.25; font-size: 24px; }
/* Filme: mesma página compacta da série, para "Mais em" caber sem rolar (título nunca é cortado). */
.detail:not(.series) .detail-body { padding-top: 64px; }
.detail:not(.series) .detail-top { margin-bottom: 20px; }
.detail:not(.series) .detail-poster { width: 260px; height: 390px; }
.detail:not(.series) .detail-text .plot { -webkit-line-clamp: 3; }
.detail:not(.series) .credits { -webkit-line-clamp: 1; margin-bottom: 22px; }
.detail:not(.series) .row h2 { margin-top: 0; margin-bottom: 0; }

/* v0.6.36: Filmes e Séries mostram 2 fileiras inteiras (capa e nome). Cabeçalho mais baixo, capas um pouco menores. */
.vod-info { height: 186px; margin-bottom: 0; padding-top: 8px; }
.vod-info .eyebrow { margin-bottom: 4px; }
.vod-info h1 { font-size: 44px; line-height: 1.15; }
.vod-info .meta { margin: 4px 0 6px; }
.vod .grid.vod-grid { padding: 22px 20px 26px; height: 620px; }
.grid.vod-grid > .poster { width: 172px; margin: 0 52px 24px 0; }
.grid.vod-grid > .poster:nth-child(5n) { margin-right: 52px; }
.grid.vod-grid > .poster:nth-child(6n) { margin-right: 0; }
.grid.vod-grid > .poster .art { height: 258px; }
.grid.vod-grid > .poster .cap { margin-top: 12px; }

/* v0.6.36: Início com 2 fileiras inteiras (capa e nome). Na abertura, o nome dos Lançamentos já aparece abaixo do destaque. */
.home .hero { height: 830px; }
.home .hero-body { padding-top: 176px; }
.home .hero h1 { font-size: 86px; }
.home .hero h1.t-md { font-size: 70px; }
.home .hero h1.t-sm { font-size: 58px; }
.home .hero .plot { margin: 16px 0 28px; font-size: 27px; }
.home .row { margin-bottom: 28px; }
.home .row h2 { margin-bottom: 10px; }
.home .row-items > .poster { width: 190px; }
.home .row-items > .poster .art { height: 285px; }
.home .row-items > .poster.wide { width: 360px; }
.home .row-items > .poster.wide .art { height: 203px; }
.home .row-items > .poster .cap { font-size: 24px; margin-top: 12px; }
.home .hero-poster { top: 190px; width: 260px; height: 390px; }

/* v0.6.36: a bolinha da barra do vídeo recebe o foco (▲ dos botões). Focada, cresce e ganha o anel vermelho. */
.seek { cursor: pointer; }
.seek.focused { box-shadow: none !important; outline: none; -webkit-transform: none; transform: none; background: rgba(255,255,255,.35); }
.seek.focused b { width: 46px; height: 46px; border: 6px solid #fff; background: #FFB547; box-shadow: 0 0 0 6px rgba(255,181,71,.45), 0 4px 18px rgba(0,0,0,.6); }
.seek.focused i { background: #FFB547; }
.seek-wrap { padding-top: 18px; }

.seasons { margin: 6px 192px 0; }
/* Filmes e Séries: sem a linha da categoria em cima, a sinopse aparece inteira. */
.vod-info { padding-top: 14px; }
.vod-info .vi-plot { line-height: 1.35; }
/* v0.6.37: temporadas num botão "Temporada N ▾" que abre a lista ao lado. */
.season-pick { display: -webkit-inline-flex; display: inline-flex; -webkit-align-items: center; align-items: center; height: 64px; padding: 0 30px; border-radius: 32px; border: 2px solid rgba(255,255,255,.22); background: rgba(20,20,23,.7); color: #EEF0F7; font-size: 26px; }
.season-pick b { font-weight: 700; }
.season-pick .sp-n { margin-left: 16px; color: #8A92AC; font-size: 22px; }
.season-pick .sp-ar { margin-left: 16px; font-size: 22px; }
.season-pick.focused { background: #FFB547; border-color: #FFB547; box-shadow: 0 0 0 4px #FFB547 !important; }
.season-pick.focused .sp-n { color: rgba(255,255,255,.85); }
.season-pick.one { border-color: transparent; background: none; padding-left: 0; }
#dialog .dialog-box.side { position: absolute; top: 0; right: 0; bottom: 0; width: 600px; border-radius: 0; padding: 64px 56px; }
.season-list h2 { margin: 0; }
.season-list .muted { margin: 6px 0 24px; }
.sl-items { height: 820px; overflow: hidden; padding: 6px; }
.sl-item { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; width: 100%; height: 76px; padding: 0 26px; margin-bottom: 12px; border-radius: 18px; background: rgba(255,255,255,.05); color: #EEF0F7; font-size: 28px; text-align: left; }
.sl-item b { -webkit-flex: 1; flex: 1; font-weight: 600; }
.sl-item span { color: #8A92AC; font-size: 22px; }
.sl-item .sl-ck { margin-left: 18px; font-style: normal; color: #FFB547; font-weight: 700; }
.sl-item.on { background: rgba(255,181,71,.18); }
.sl-item.focused { background: #FFB547; box-shadow: 0 0 0 4px #FFB547 !important; }
.sl-item.focused span, .sl-item.focused .sl-ck { color: #fff; }

/* v0.6.56: Limpar histórico (Conta). Abas à esquerda; à direita os botões e as linhas com caixa de marcar, capa, nome e lixeira. */
.hs-main .grid-head { margin-bottom: 4px; }
.hs-lead { margin: 0 0 22px; font-size: 24px; line-height: 1.35; }
.hs-lead b { color: #EEF0F7; }
.hs-main .empty { margin: 10px 0 26px; font-size: 26px; }
.hs-acts { padding: 6px; white-space: nowrap; }
.hs-acts .btn { margin-right: 18px; height: 64px; padding: 0 30px; font-size: 25px; }
.hs-acts .btn.off { opacity: .45; }
.hs-list { position: absolute; top: 232px; bottom: 0; left: 0; right: 0; overflow: hidden; padding: 8px 8px 40px; }
.hs-row { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; margin-bottom: 14px; }
.hs-pick { -webkit-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; height: 104px; padding: 0 26px; border-radius: 20px; background: #1B2338; border: 3px solid transparent; }
.hs-row.on .hs-pick { border-color: rgba(255,181,71,.6); background: #2A1A1C; }
.hs-box { -webkit-flex: none; flex: none; width: 42px; height: 42px; margin-right: 24px; border-radius: 10px; border: 3px solid rgba(255,255,255,.45); color: #fff; font-size: 26px; font-weight: 800; line-height: 36px; text-align: center; }
.hs-row.on .hs-box { background: #FFB547; border-color: #FFB547; }
.hs-art { -webkit-flex: none; flex: none; width: 52px; height: 78px; margin-right: 24px; border-radius: 8px; background-size: cover; background-position: center; }
.hs-art.q { height: 52px; padding-top: 11px; background: rgba(255,255,255,.08); color: #8A92AC; text-align: center; }
.hs-art.q svg { width: 30px; height: 30px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; }
.hs-pick .ch-logo { width: 64px; height: 64px; margin-right: 24px; }
.hs-t { -webkit-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; }
.hs-t b, .hs-t small { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.hs-t b { font-size: 29px; }
.hs-t small { margin-top: 5px; font-size: 21px; color: #8A92AC; }
.hs-del { -webkit-flex: none; flex: none; width: 80px; height: 80px; margin-left: 16px; border-radius: 50%; background: rgba(255,255,255,.08); color: #8A92AC; }
.hs-del svg { width: 34px; height: 34px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; vertical-align: middle; }
.hs-del.focused { background: #FFB547; color: #1A1205; box-shadow: 0 0 0 4px #FFB547 !important; }
.hs-hint { display: inline-block; vertical-align: middle; margin-left: 8px; font-size: 22px; }
.acc-actions.many .acc-h { margin-bottom: 10px; }
.acc-actions.many .btn { height: 60px; margin-bottom: 12px; font-size: 24px; }
/* O botão do próximo episódio começa vermelho escuro e vai enchendo de vermelho até abrir. */
.nxe .btn.nxe-go { background: #5C0A0F; color: #fff; }
.nxe .btn.nxe-go .resume-fill { background: #FFB547; }

/* Correção 4 na TV: ficha do título. Topo com frase, classificação, gêneros e equipe; embaixo elenco com foto e "Sobre". */
.d-tag { font-size: 28px; font-style: italic; color: #C9C9D1; margin: -2px 0 12px; }
.d-tag:empty { display: none; }
.cert { display: inline-block; min-width: 40px; padding: 2px 8px; border-radius: 7px; font-size: 22px; font-weight: 800; text-align: center; color: #fff; vertical-align: 2px; margin-left: 6px; }
.cert.cL { background: #0A9B48; } .cert.c10 { background: #0F7DC2; } .cert.c12 { background: #E8B400; color: #111; }
.cert.c14 { background: #E06A0E; } .cert.c16 { background: #D21F26; } .cert.c18 { background: #111; border: 2px solid #fff; }
.d-gen { color: #8A92AC; margin-left: 10px; }
.d-crew { font-size: 22px; margin: -12px 0 26px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.d-crew:empty { display: none; }
.d-prog { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; margin-top: 18px; width: 520px; font-size: 20px; color: #8A92AC; }
.d-prog-bar { -webkit-flex: 1; flex: 1; height: 6px; border-radius: 3px; background: rgba(255,255,255,.2); margin-right: 16px; overflow: hidden; }
.d-prog-bar i { display: block; height: 100%; background: #FFB547; }
.d-cast { margin: 0 192px 30px; }
.d-cast:empty { display: none; }
.d-cast h2, .d-about h2 { font-size: 32px; margin: 0 0 18px; }
.pp-row { display: -webkit-flex; display: flex; }
.pp { -webkit-flex: none; flex: none; width: 150px; margin-right: 22px; text-align: center; }
.pp i { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; width: 124px; height: 124px; margin: 0 auto 12px; border-radius: 50%; font-style: normal; font-size: 40px; font-weight: 700; color: #fff;
  background-size: cover; background-position: center 20%; box-shadow: 0 6px 18px rgba(0,0,0,.45); }
.pp b { display: block; font-size: 20px; line-height: 1.2; font-weight: 600; }
.pp span { display: block; margin-top: 4px; font-size: 17px; line-height: 1.2; color: #8A92AC; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.d-about { margin: 18px 192px 90px; padding: 30px 36px 18px; border-radius: 24px; background: rgba(22,22,26,.8); }
.d-about:empty { display: none; }
.d-about.focused { box-shadow: 0 0 0 4px rgba(255,255,255,.55) !important; }
.ab-grid { overflow: hidden; }
.ab { float: left; width: 25%; padding: 0 28px 22px 0; }
.ab span { display: block; font-size: 19px; color: #8A92AC; margin-bottom: 4px; }
.ab b { display: block; font-size: 23px; font-weight: 600; line-height: 1.3; }
.stars { position: relative; display: inline-block; letter-spacing: 3px; color: rgba(255,255,255,.2); }
.stars:before { content: "★★★★★"; }
.stars i { position: absolute; top: 0; left: 0; overflow: hidden; white-space: nowrap; color: #FACC15; }
.stars i:before { content: "★★★★★"; }

/* Limpar histórico (0.6.70): cartão no padrão da Conta (Minhas listas e Player e buffer). */
.hs-card { max-height: 860px; overflow: hidden; }
.hs-card .ps-v.zero { background: rgba(255,255,255,.08); color: #8A92AC; }
.hs-card .pset-row.focused .ps-v.zero { background: #2A2A30; color: #fff; }
.hs-item { min-height: 104px; }
.hs-item .hs-art, .hs-item .ch-logo { -webkit-flex: none; flex: none; margin-right: 24px; }
.hs-item .ch-logo { width: 64px; height: 64px; }
.hs-item .ps-t b, .hs-item .ps-t small { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.hs-trash { -webkit-flex: none; flex: none; margin-left: 24px; padding: 8px 20px; border-radius: 99px; color: #8A92AC; font-size: 23px; font-weight: 800; opacity: .55; }
.hs-trash svg { width: 28px; height: 28px; margin-right: 8px; vertical-align: -6px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.hs-item.focused .hs-trash { background: #FFB547; color: #1A1205; opacity: 1; }
.hs-card .btn.off { opacity: .45; }

/* Sair do app (Voltar no Início): logo em cima, pergunta e botões centralizados, no tema do app. */
.exit-box { text-align: center; }
.exit-box .exit-logo { height: 84px; width: auto; display: block; margin: 0 auto; }
.exit-box h2 { margin-top: 28px; }
.exit-box .actions { -webkit-justify-content: center; justify-content: center; margin-top: 40px; }
.exit-box .actions > * { margin: 0 12px 20px; }
.exit-box .actions .btn { min-width: 220px; }

/* Elenco na ficha (TV): o cursor anda pelos artistas; a fileira rola para o lado quando passa da tela. */
.d-cast .pp-row { position: relative; overflow: hidden; padding: 8px 8px 6px; }
.d-cast .pp i { transition: box-shadow .15s; }
.d-cast .pp.focused { box-shadow: none !important; }
.d-cast .pp.focused i { box-shadow: 0 0 0 5px #FFB547, 0 0 24px 4px rgba(255,181,71,.55); }
.d-cast .pp.focused b { color: #fff; }

/* ===== 0.6.75: seta de voltar na tela (Meza) =====
   Só nas telas sem a barra de cima (detalhe, perfis): bolinha no canto de cima. Player: bolinha no alto, à esquerda do título.
   Nas telas com o menu em cima não tem seta (Meza). */
.scr-back[hidden] { display: none !important; }
.scr-back svg { width: 40px; height: 40px; }
.scr-back { position: absolute; z-index: 6; top: 52px; left: 96px; margin: 0 !important; background: rgba(20,20,23,.78); border-color: rgba(255,255,255,.3); }
.scr-back.focused { -webkit-transform: scale(1.08); transform: scale(1.08); }
body.media-full .scr-back { visibility: hidden; }
.osd-top { position: relative; padding-left: 116px; min-height: 84px; }
.osd-back { position: absolute; left: 0; top: 0; width: 84px; height: 84px; border-radius: 50%; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center;
  -webkit-justify-content: center; justify-content: center; background: rgba(20,20,23,.72); border: 3px solid rgba(255,255,255,.4); color: #fff; padding: 0; }
.osd-back svg { width: 44px; height: 44px; fill: none; stroke: currentColor; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.osd-back.focused { background: #FFB547; border-color: #FFB547; box-shadow: 0 0 0 5px #FFB547 !important; -webkit-transform: scale(1.08); transform: scale(1.08); }
/* Celular: as telas de toque já têm o voltar delas (mobile.css). */
html.mobile #scr-back, html.mobile .osd-back { display: none !important; }
html.mobile .osd-top { padding-left: 0; min-height: 0; }
/* Perfis com a seta no canto: o logo e o título andam para a direita. */
html:not(.mobile) .scr-back-on .pf-brand { left: 206px; }
html:not(.mobile) .scr-back-on .pf-edit h1 { padding-left: 110px; }

/* v0.6.78: na Pesquisa, as 2 fileiras de resultados aparecem inteiras, com o nome embaixo (antes a de baixo saía cortada).
   Mesmo tamanho de capa das grades de Filmes e Séries; o espaço entre as fileiras esconde a ponta da 3ª. */
.grid.narrow > .poster { width: 172px; margin: 0 52px 40px 0; }
.grid.narrow > .poster:nth-child(5n) { margin-right: 52px; }
.grid.narrow > .poster:nth-child(3n) { margin-right: 0; }
.grid.narrow > .poster .art { height: 258px; }
.grid.narrow > .poster .cap { font-size: 22px; margin-top: 12px; }

/* v0.6.78: senha do conteúdo adulto. Categoria adulta com cadeado no lugar do número; teclado de números no meio da tela. */
.cat.lock .n svg { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-width: 2; vertical-align: middle; }
.pin { text-align: center; }
.pin-ic svg { width: 60px; height: 60px; fill: none; stroke: #FFB547; stroke-width: 2; }
.pin .eyebrow { margin: 10px 0 4px; }
.pin h2 { margin: 0; }
.pin-lead { margin: 12px auto 0; max-width: 620px; font-size: 24px; }
.pin-dots { display: -webkit-flex; display: flex; -webkit-justify-content: center; justify-content: center; margin-top: 30px; }
.pin-dots i { width: 30px; height: 30px; margin: 0 14px; border-radius: 50%; border: 3px solid rgba(255,255,255,.45); }
.pin-dots i.on { background: #fff; border-color: #fff; }
.pin-msg { min-height: 32px; margin: 14px 0 10px; font-size: 24px; color: #8A92AC; }
.pin-msg.err { color: #FF4D57; font-weight: 600; }
.pin-pad { display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; width: 480px; margin: 0 auto; }
.pin-k { width: 144px; height: 80px; margin: 0 24px 20px 0; padding: 0; border-radius: 20px; font-size: 36px; font-weight: 700; }
.pin-k:nth-child(3n) { margin-right: 0; }
.pin-k.pin-x { font-size: 24px; font-weight: 600; }

/* ---------- Redesenho 2026-10 (Meza escolheu: perfis B, canais A, menu B) ---------- */
/* Menu do topo no estilo Netflix: só texto, a aba atual sublinhada em vermelho; o cursor ganha um fundo claro suave. */
#topbar { background: linear-gradient(rgba(10,14,25,.8), rgba(10,14,25,.45) 60%, rgba(10,14,25,0)); }
.tb-pill { background: none; border: 0; padding: 0; }
.tb-sep { display: none; }
.menu-item { position: relative; height: 66px; padding: 0 22px; border-radius: 14px; color: rgba(245,245,245,.62); font-size: 31px; font-weight: 600; background: none; box-shadow: none; white-space: nowrap; -webkit-flex: none; flex: none; }
.menu-item + .menu-item { margin-left: 18px; }
#menu .menu-item:first-child { margin-left: 40px; }
.menu-item.on { background: none; color: #fff; font-weight: 700; box-shadow: none; }
.menu-item.on:after, .tb-ic.on:after { content: ""; position: absolute; left: 22px; right: 22px; bottom: 0; height: 5px; border-radius: 3px; background: #FFB547; }
.menu-item.focused, .menu-item.on.focused { background: rgba(255,255,255,.16); color: #fff; box-shadow: none !important; }
.tb-ic { position: relative; background: none; border-color: transparent; }
.tb-ic.on { background: none; border-color: transparent; }
.tb-ic.focused { background: rgba(255,255,255,.16); border-color: transparent; box-shadow: none !important; }
.tb-date { color: rgba(245,245,245,.6); }
/* Menu sem quebra de linha (Meza 11/10: "Ao vivo" em duas linhas na TV com a data de domingo): os itens não encolhem;
   faltando espaço, só a data encolhe e termina em "…" (ícones e relógio ficam do tamanho de sempre). */
.tb-right { min-width: 0; }
.tb-right > * { -webkit-flex: none; flex: none; }
.tb-right > .tb-date { -webkit-flex: 0 1 auto; flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; }

/* Ao vivo: categorias, canais e prévia sempre na tela (nada recolhe). A coluna de dias saiu: o dia muda com ◀ ▶
   no cabeçalho da Programação. Embaixo, uma linha com as teclas do controle. */
.live.fixed > .lv-rail, .live.fixed > .lv-days { display: none; }
.live.fixed > .lv-groups { display: block; left: 96px; width: 400px; bottom: 96px; }
.live.fixed > .lv-list { left: 516px; width: 640px; bottom: 96px; }
.live.fixed > .lv-main { left: 1180px; right: 96px; bottom: 96px; }
.live.fixed .lv-groups .cat { padding: 13px 22px; font-size: 29px; }
.live.fixed .lv-groups .cat > .cat-name { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.live.fixed .ch-list { height: 740px; }
.live.fixed .ch, .live.fixed .ch-star { height: 68px; }
.live.fixed .ch-star { width: 60px; }
.live.fixed .ch-name { font-size: 29px; }
/* Prévia em 16:9 na largura da coluna (644x362). */
.live.fixed .ch-preview { height: 362px; }
.live.fixed .pg-card { top: 382px; }
.pg-days { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; }
.pg-days .pg-date { margin: 0 6px; }
.pg-step { width: 52px; height: 52px; border-radius: 12px; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; color: #8A92AC; font-size: 24px; border: 2px solid transparent; }
.pg-step.off { opacity: .25; }
.live .pg-step.focused { border-color: #FFB547 !important; background: rgba(255,94,72,.45) !important; color: #fff; }
.live > .lv-hint { top: auto; bottom: 30px; left: 96px; right: 96px; height: 44px; margin: 0; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; color: #8A92AC; font-size: 24px; }
.lv-hint span { margin: 0 30px; }
.lv-hint i { font-style: normal; color: #fff; font-weight: 700; background: rgba(255,255,255,.1); border-radius: 8px; padding: 2px 10px; margin-right: 8px; }

/* Primeiro acesso (ainda sem perfil): usar o Principal ou criar o seu, em dois cartões grandes. */
.profiles.first h1 { margin-bottom: 0; }
.pf-sub { margin: 18px 0 56px; font-size: 30px; }
.pf-opt { width: 640px; margin: 0 22px; padding: 44px 40px; border-radius: 32px; background: rgba(255,255,255,.05); border: 4px solid rgba(255,255,255,.1); display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; -webkit-align-items: center; align-items: center; text-align: center; }
.pf-opt .av { width: 200px; height: 200px; border-radius: 28px; }
.pf-opt h2 { margin: 30px 0 12px; font-size: 44px; }
.pf-opt p { margin: 0; font-size: 27px; color: #8A92AC; line-height: 1.4; }
.pf-btn { margin-top: 30px; height: 72px; padding: 0 44px; border-radius: 36px; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; font-size: 28px; font-weight: 700; border: 2px solid rgba(255,255,255,.3); }
.pf-opt.focused { border-color: #FFB547; background: rgba(255,181,71,.22); box-shadow: 0 18px 50px rgba(255,181,71,.4) !important; -webkit-transform: scale(1.04); transform: scale(1.04); }
.pf-opt.focused .pf-btn { background: #FFB547; border-color: #FFB547; }

/* Ao vivo, lista limpa: sem caixa em cada canal; um destaque só (faixa branca no cursor); a categoria ativa ganha
   só o tracinho vermelho; a estrela aparece apagada e fica amarela nos favoritos. */
.live.fixed > .lv-groups { background: none; border: 0; padding-left: 0; padding-right: 10px; }
.live.fixed .lv-groups .cat { border-radius: 12px; color: rgba(245,245,245,.72); }
.live.fixed .lv-groups .cat.on { background: rgba(255,255,255,.06); border-color: transparent; color: #fff; font-weight: 700; box-shadow: inset 6px 0 0 #FF5E48; }
.live.fixed .lv-groups .cat.on .n { color: #8A92AC; }
.live.fixed .lv-groups .cat.focused { background: #FFB547 !important; border-color: #FFB547 !important; color: #1A1205 !important; }
.live.fixed .lv-groups .cat.focused .n { color: #555; }
.live.fixed > .lv-list { border-left: 2px solid rgba(255,255,255,.07); padding-left: 14px; }
.live.fixed .ch, .live.fixed .ch-star { background: none; border-radius: 14px; }
.live.fixed .ch { height: 76px; }
.live.fixed .ch-star { height: 76px; width: 56px; color: rgba(255,255,255,.3); }
.live.fixed .ch-star.on { color: #F5B83D; }
.live.fixed .ch-row { margin-bottom: 4px; }
.live.fixed .ch-name { -webkit-flex: 0 1 auto; flex: 0 1 auto; font-size: 30px; }
.ch-q { -webkit-flex: none; flex: none; margin-left: 12px; font-style: normal; font-size: 16px; font-weight: 800; letter-spacing: .05em; padding: 2px 7px; border-radius: 6px; border: 2px solid rgba(255,255,255,.3); color: rgba(255,255,255,.75); }
.live.fixed .ch.on { box-shadow: inset 6px 0 0 #FFB547; }
.live.fixed .ch.focused, .live.fixed .ch-star.focused { background: #FFB547 !important; border-color: #FFB547 !important; color: #1A1205; }
.live.fixed .ch.focused .ch-name { color: #1A1205; }
.live.fixed .ch.focused .num { color: #555; }
.live.fixed .ch.focused .ch-q { color: #333; border-color: #999; }
.live.fixed .ch-star.focused { color: #1A1205; }
.live.fixed .ch-star.on.focused { color: #C98A00; }
.live.fixed > .lv-main .pg-card { background: none; border: 0; border-top: 2px solid rgba(255,255,255,.07); border-radius: 0; padding-left: 4px; padding-right: 4px; }
/* Filmes, Séries e Futebol: a coluna de categorias no mesmo jeito limpo do Ao vivo. */
.vod > .lv-groups { background: none; border: 0; padding-left: 0; padding-right: 10px; }
.vod .lv-groups .cat { border-radius: 12px; color: rgba(245,245,245,.72); }
.vod .lv-groups .cat.on { background: rgba(255,255,255,.06); border-color: transparent; color: #fff; font-weight: 700; box-shadow: inset 6px 0 0 #FFB547; }
.vod .lv-groups .cat.on .n { color: #8A92AC; }
.vod .lv-groups .cat.focused { background: #FFB547 !important; border-color: #FFB547 !important; color: #1A1205 !important; }
.vod .lv-groups .cat.focused .n { color: #555; }

/* ---------- Revisão geral 08/10 (itens 1 e 2): um jeito só de mostrar a seleção; vermelho só no essencial ----------
   Objetos (capas, perfis, botões, cartões): contorno branco e um leve aumento, com sombra escura (sem brilho vermelho).
   Linhas (listas, teclado, temporadas, Configurações): fundo branco com texto escuro, como no Ao vivo. */
.focused { box-shadow: 0 0 0 5px #FFB547, 0 12px 30px rgba(0,0,0,.55) !important; }
.poster.focused .art, .home .poster.focused .art { box-shadow: 0 0 0 5px #FFB547, 0 14px 34px rgba(0,0,0,.6); }
.home .hero .btn.focused, .detail .btn.focused { box-shadow: 0 0 0 5px #FFB547, 0 10px 30px rgba(0,0,0,.5) !important; }
.ctrl.focused .ic { box-shadow: 0 0 0 5px #FFB547, 0 8px 24px rgba(0,0,0,.5); }
.okb.focused .ic { box-shadow: 0 0 0 5px rgba(255,255,255,.35), 0 8px 24px rgba(0,0,0,.5); }
.okc.focused, .okp.focused { box-shadow: 0 0 0 4px #FFB547 !important; }
.gs-ch.focused { box-shadow: 0 0 0 5px #FFB547, 0 12px 30px rgba(0,0,0,.5) !important; }
.d-cast .pp.focused i { box-shadow: 0 0 0 5px #FFB547, 0 10px 24px rgba(0,0,0,.5); }
.pf.focused .av { box-shadow: 0 16px 40px rgba(0,0,0,.6); }
.tb-av.focused { box-shadow: 0 0 0 4px #FFB547 !important; }
.pf-opt.focused { background: rgba(255,255,255,.1); box-shadow: 0 18px 46px rgba(0,0,0,.55) !important; }
.pf-opt.focused .pf-btn { background: #FFB547; border-color: #FFB547; color: #1A1205; }
.acc-opt.focused, .pset-row.focused { box-shadow: 0 12px 30px rgba(0,0,0,.45) !important; }
.acc-opt.focused .ao-ic, .pset-row.focused .ps-v { background: #18203A; color: #fff; }
.kb-key.focused, .chip.focused, .fb-tile.focused { background: #FFB547; border-color: #FFB547; color: #1A1205; }
.fb-card.focused, .fb-card.is-live.focused { border-color: #FFB547; }
.season-pick.focused, .sl-item.focused, .hs-del.focused, .hs-item.focused .hs-trash { background: #FFB547; border-color: #FFB547; color: #1A1205; box-shadow: none !important; }
.season-pick.focused .sp-n { color: #555; }
.sl-item.focused span, .sl-item.focused .sl-ck { color: #1A1205; }
.osd-back.focused { background: #FFB547; border-color: #FFB547; color: #1A1205; box-shadow: 0 0 0 5px rgba(255,255,255,.3) !important; }
.live .pg-row.focused { background: #FFB547 !important; border-color: #FFB547 !important; }
.live .pg-row.focused, .live .pg-row.focused span, .live .pg-row.focused b { color: #1A1205; }
.live .pg-row.focused .live-badge { color: #fff; }
.live .pg-step.focused { background: #FFB547 !important; border-color: #FFB547 !important; color: #1A1205; }
.lg-field.focused { border-color: #FFB547; box-shadow: 0 0 0 6px rgba(255,255,255,.14) !important; }
.lg-field.focused span { color: #fff; }
.terms-p.focused { border-left-color: #fff; background: rgba(255,255,255,.06); }
.terms-check.focused { border-color: #FFB547; box-shadow: 0 0 0 6px rgba(255,255,255,.14) !important; }
/* Vermelho fica no Assistir, no AO VIVO / TOCANDO, no sublinhado do menu e na barra do que você já assistiu.
   Selos, títulos pequenos, a data da programação, o tracinho da categoria e as barrinhas dos canais viram branco. */
.eyebrow { color: rgba(245,245,245,.62); }
.tg.top { background: #F5F5F5; border-color: #F5F5F5; color: #111; }
.pg-date { color: #fff; }
.live.fixed .lv-groups .cat.on, .vod .lv-groups .cat.on { box-shadow: inset 6px 0 0 #fff; }

/* Item 3: destaque do Início sem imagem larga: a capa (ou o degradê dela) desfocada no fundo, em vez do bloco preto. */
.home .hero-bg.soft { -webkit-filter: blur(40px) brightness(.5) saturate(1.2); filter: blur(40px) brightness(.5) saturate(1.2); -webkit-transform: scale(1.25); transform: scale(1.25); }
.lite .home .hero-bg.soft { -webkit-filter: brightness(.35); filter: brightness(.35); -webkit-transform: none; transform: none; }

/* ---------- Ao vivo profissional (Meza escolheu a B, 08/10) ----------
   Categorias (300) | lista de canais (700) | prévia 16:9 com o programa de agora, sinopse, próximos e botões.
   Logos num quadro escuro igual para todos; sem logo, as iniciais coloridas. O canal da prévia mostra barrinhas
   vermelhas no lugar do número. Sem a coluna da estrela: favoritar é o botão do painel da direita. */
.live.fixed > .lv-groups { left: 96px; width: 312px; top: 176px; bottom: 40px; padding: 0 12px 0 0; }
.live.fixed .lv-groups .lv-head { margin: 0 0 14px 20px; font-size: 19px; letter-spacing: .16em; color: rgba(245,245,247,.42); }
.live.fixed .lv-groups .cat { height: 60px; padding: 0 20px; margin-bottom: 2px; font-size: 27px; font-weight: 600; color: rgba(245,245,247,.7); }
.live.fixed .lv-groups .cat .n { font-size: 21px; color: rgba(245,245,247,.38); }
.live.fixed .lv-groups .cat.on { background: rgba(255,255,255,.08); color: #fff; font-weight: 700; box-shadow: none; }
.live.fixed .lv-groups .cat.on .n { color: rgba(245,245,247,.6); }
.live.fixed .lv-groups .cat.focused, .live.fixed .lv-groups .cat.on.focused { background: #FFB547 !important; color: #1A1205 !important; }
.live.fixed .lv-groups .cat.focused .n { color: #666; }
.live.fixed > .lv-list { left: 424px; width: 732px; top: 176px; bottom: 0; padding-left: 32px; border-left: 2px solid rgba(255,255,255,.06); }
.live.fixed .lv-list > .lv-head { display: -webkit-flex; display: flex; -webkit-align-items: baseline; align-items: baseline; height: 56px; margin: 0 0 12px 12px; padding: 0; letter-spacing: 0; text-transform: none; font-size: 24px; font-weight: 600; color: rgba(245,245,247,.45); }
.live.fixed .lv-list > .lv-head b { font: 700 38px "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; color: #fff; margin-right: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.live.fixed .lv-list > .lv-head span { white-space: nowrap; }
.live.fixed .ch-list { height: 836px; }
.live.fixed .ch-row { margin-bottom: 6px; }
.live.fixed .ch { height: 96px; padding: 0 20px 0 8px; border-radius: 14px; background: none; }
.live.fixed .ch > * + * { margin-left: 0; }
.live.fixed .ch .num { width: 58px; text-align: center; font-size: 22px; font-weight: 600; color: rgba(245,245,247,.45); }
.live.fixed .ch .num .eq { display: none; }
.live.fixed .ch.on .num .eq { display: -webkit-inline-flex; display: inline-flex; }
.live.fixed .ch.on .num span { display: none; }
.live.fixed .ch.on { box-shadow: none; }
.eq { -webkit-align-items: flex-end; align-items: flex-end; height: 22px; vertical-align: middle; }
.eq b { display: block; width: 4px; margin: 0 1.5px; border-radius: 1px; background: #FF5E48; }
.eq b:nth-child(1) { height: 11px; } .eq b:nth-child(2) { height: 22px; } .eq b:nth-child(3) { height: 15px; }
.ch-tile { -webkit-flex: none; flex: none; width: 104px; height: 64px; border-radius: 10px; background: #1A2236; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; font: 800 26px "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; letter-spacing: .02em; }
.ch-tile.img { background: #1A2236 center / contain no-repeat; background-origin: content-box; padding: 8px 10px; box-sizing: border-box; }
.live.fixed .ch-tx { -webkit-flex: 1; flex: 1; min-width: 0; margin-left: 20px; }
.ch-l1 { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; }
.live.fixed .ch-l1 .ch-name { -webkit-flex: 0 1 auto; flex: 0 1 auto; min-width: 0; font-size: 28px; font-weight: 600; color: #F5F5F7; }
.ch-fav { display: none; -webkit-flex: none; flex: none; margin-left: 10px; font-style: normal; font-size: 22px; color: #F5B83D; }
.ch-row.fav .ch-fav { display: inline-block; }
.ch-nl { display: -webkit-flex; display: flex; -webkit-align-items: baseline; align-items: baseline; margin-top: 2px; font-size: 22px; color: rgba(245,245,247,.6); }
.ch-nl span { -webkit-flex: 0 1 auto; flex: 0 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ch-nl em { -webkit-flex: none; flex: none; margin-left: 14px; font-style: normal; font-size: 20px; color: rgba(245,245,247,.38); }
.ch-bar { height: 4px; margin-top: 8px; border-radius: 2px; background: rgba(255,255,255,.1); overflow: hidden; }
.ch-bar b { display: block; height: 100%; background: rgba(255,255,255,.55); }
.live.fixed .ch.focused { background: #FFB547 !important; border-color: #FFB547 !important; }
.live.fixed .ch.focused .ch-name { color: #1A1205; }
.live.fixed .ch.focused .num { color: #666; }
.live.fixed .ch.focused .ch-nl { color: #444; }
.live.fixed .ch.focused .ch-nl em { color: #777; }
.live.fixed .ch.focused .ch-bar { background: rgba(0,0,0,.12); }
.live.fixed .ch.focused .ch-bar b { background: #1A1205; }
.live.fixed .ch.focused .ch-fav { color: #C98A00; }
/* Painel da direita. */
.live.fixed > .lv-main { left: 1196px; right: 96px; top: 176px; bottom: 30px; }
.live.fixed .ch-preview { height: 354px; border-radius: 16px; }
.ch-preview.idle .pv-logo .ch-tile { width: 240px; height: 150px; border-radius: 20px; font-size: 72px; background-color: #1A2236; }
.ch-preview.idle .pv-logo .ch-tile.img { padding: 20px 26px; }
.pv-tag { left: 20px; bottom: 16px; padding: 0; background: none; max-width: 62%; }
.pv-tag .ch-tile { width: 72px; height: 44px; border-radius: 8px; font-size: 18px; background-color: rgba(0,0,0,.6); }
.pv-tag .ch-tile.img { padding: 4px 6px; }
.pv-tag b { font-size: 24px; text-shadow: 0 2px 8px rgba(0,0,0,.7); }
.ch-preview.playing:after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 120px; background: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,.7)); }
.ch-preview.playing.loading:after { display: none; }
.pv-tag, .pv-live, .pv-ok { z-index: 1; }
.pv-live { position: absolute; left: 18px; top: 18px; padding: 5px 12px; border-radius: 8px; background: #FF5E48; font-size: 17px; font-weight: 800; letter-spacing: .08em; color: #fff; }
.pv-ok { position: absolute; right: 20px; bottom: 22px; font-size: 20px; font-weight: 600; color: rgba(255,255,255,.85); }
.pv-ok b { display: inline-block; padding: 1px 9px; margin-right: 6px; border-radius: 6px; background: rgba(255,255,255,.22); font-size: 17px; }
.live.fixed > .lv-main .pg-card { top: 384px; bottom: 0; padding: 0; border: 0; border-radius: 0; background: none; }
.live.fixed > .lv-main .pg-card:not(.info) { padding-top: 6px; border-top: 2px solid rgba(255,255,255,.07); }
.live.fixed .pg-card:not(.info) .pg-list { left: 0; right: 0; }
.lv-ag { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; margin: 0; font-size: 19px; font-weight: 700; letter-spacing: .14em; color: rgba(245,245,247,.5); }
.lv-ag i { width: 10px; height: 10px; margin-right: 10px; border-radius: 5px; background: #FF5E48; }
.lv-ag .ch-q { margin-left: 14px; letter-spacing: .05em; }
.lv-ttl { margin: 10px 0 0; font: 700 38px/1.15 "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; letter-spacing: -.3px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.lv-pr { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; margin: 16px 0 14px; }
.lv-pr .ch-bar { -webkit-flex: 1; flex: 1; height: 6px; margin: 0; background: rgba(255,255,255,.14); }
.lv-pr .ch-bar b { background: #FFB547; }
.lv-pr span { margin-left: 16px; font-size: 21px; color: rgba(245,245,247,.55); white-space: nowrap; }
.lv-syn { margin: 10px 0 0; font-size: 23px; line-height: 1.45; color: rgba(245,245,247,.72); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.lv-nx { margin-top: 18px; padding-top: 14px; border-top: 2px solid rgba(255,255,255,.07); }
.lv-nx p { display: -webkit-flex; display: flex; -webkit-align-items: baseline; align-items: baseline; margin: 0; height: 40px; font-size: 24px; color: rgba(245,245,247,.75); }
.lv-nx b { -webkit-flex: none; flex: none; width: 104px; font-size: 22px; color: rgba(245,245,247,.45); }
.lv-nx span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lv-acts { display: -webkit-flex; display: flex; margin-top: 28px; }
.lv-bt { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; height: 62px; padding: 0 28px; margin-right: 16px; border-radius: 31px; border: 2px solid rgba(255,255,255,.22); font-size: 24px; font-weight: 700; white-space: nowrap; }
.live .lv-bt.focused { background: #FFB547 !important; border-color: #FFB547 !important; color: #1A1205; }
.live .pg-row.focused .live-badge { background: #FF5E48; border-color: #FF5E48; color: #fff; }

/* ---------- Telas profissionais (desenhos 7, 08/10): Início, Filmes e Séries, detalhe e Configurações ----------
   Mesmo padrão do Ao vivo B: margens de 96px, títulos de cartaz (Bebas Neue) no destaque e no detalhe, dados em texto
   corrido separados por pontinhos, selos brancos e o vermelho só no Assistir e na barra do que já assistiu. */
:root { --poster-font: "Bebas Neue", var(--display); }

/* Início: destaque com o selo branco, dados em linha, título de cartaz e a primeira fileira aparecendo embaixo. */
.home .hero-shade { background: linear-gradient(90deg, rgba(11,11,14,.96) 0%, rgba(11,11,14,.75) 32%, rgba(11,11,14,.1) 62%, rgba(11,11,14,0) 80%),
  linear-gradient(0deg, #0A0F1B 22%, rgba(11,11,14,.85) 34%, rgba(11,11,14,0) 55%); }
.home .hero-body { padding-top: 190px; max-width: 1240px; }
.home .tg { margin: 0; padding: 0; border: 0; background: none; font-size: 24px; font-weight: 600; color: rgba(245,245,247,.75); }
.home .tg + .tg:before { content: "·"; margin: 0 12px; color: rgba(245,245,247,.35); }
.home .tg.top { margin-right: 18px; padding: 5px 14px; border-radius: 8px; background: #F5F5F7; color: #111; font-size: 19px; font-weight: 800; letter-spacing: .06em; }
.home .tg.top + .tg:before { content: none; }
.home .tg.star { color: #F5B83D; }
.home .hero h1 { margin: 18px 0 0; font: 400 150px/.92 "Bebas Neue", "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; letter-spacing: 6px; text-transform: uppercase; text-shadow: 0 6px 40px rgba(0,0,0,.5); }
.home .hero h1.t-md { font-size: 108px; letter-spacing: 4px; }
.home .hero h1.t-sm { font-size: 86px; letter-spacing: 3px; }
.home .hero .plot { margin: 18px 0 34px; max-width: 880px; font-size: 28px; line-height: 1.45; color: rgba(245,245,247,.85); }
.home .hero-dots { margin: 0 0 20px 6px; }
.home .hero-dots i { width: 10px; height: 10px; margin-left: 9px; border-radius: 5px; background: rgba(255,255,255,.35); }
.home .hero-dots i.on { width: 30px; background: #fff; }
.home-rows { margin-top: -140px; }
.home .row h2 { font: 700 32px "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; margin-bottom: 8px; }
.home .row-items > .poster.wide { width: 404px; }
.home .row-items > .poster.wide .art { height: 227px; }
.home .row-items > .poster.wide .cap { font-size: 24px; }
.home .row-items > .poster .sub { margin-top: 2px; font-size: 20px; color: rgba(245,245,247,.45); }
/* Barra do que já assistiu: fina, vermelha, por cima de um degradê no pé da imagem. */
.poster .bar { z-index: 1; height: 5px; border-radius: 3px; }
.poster .bar i { background: #FFB547; border-radius: 3px; }
.poster.wide .art:after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 55%; background: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,.65)); }
.poster.wide .bar { left: 16px; right: 16px; bottom: 14px; }

/* Filmes e Séries: categorias iguais às do Ao vivo, linha separando, e a grade com 6 capas, nome e "ano · duração". */
.vod > .lv-groups { left: 96px; width: 328px; top: 176px; bottom: 40px; padding: 0 16px 0 0; border-right: 2px solid rgba(255,255,255,.06); border-radius: 0; }
.vod .lv-groups .lv-head { margin: 0 0 14px 20px; font-size: 19px; letter-spacing: .16em; color: rgba(245,245,247,.42); }
.vod .lv-groups .cat { height: 60px; padding: 0 20px; margin-bottom: 2px; font-size: 27px; font-weight: 600; color: rgba(245,245,247,.7); }
.vod .lv-groups .cat .n { font-size: 21px; color: rgba(245,245,247,.38); }
.vod .lv-groups .cat.on { background: rgba(255,255,255,.08); color: #fff; font-weight: 700; box-shadow: none; }
.vod .lv-groups .cat.on .n { color: rgba(245,245,247,.6); }
.vod .lv-groups .cat.focused, .vod .lv-groups .cat.on.focused { background: #FFB547 !important; color: #1A1205 !important; }
.vod .lv-groups .cat.focused .n { color: #666; }
.vod > .vod-main { left: 456px; right: 96px; top: 176px; }
.vod-info { height: 150px; padding: 0 300px 0 0; }
.vod-info h1 { font: 700 40px/1.2 "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; letter-spacing: -.5px; }
.vod-info .meta { margin: 6px 0 4px; font-size: 22px; color: rgba(245,245,247,.55); }
.vod-info .vi-plot { font-size: 22px; line-height: 1.35; color: rgba(245,245,247,.68); }
.vod-info.is-cat h1 { display: inline; font-size: 38px; }
.vod-info.is-cat .meta { display: inline; margin: 0 0 0 16px; font-size: 24px; font-weight: 600; color: rgba(245,245,247,.45); }
.vod-info .sort-btn { top: 0; right: 0; height: 52px; padding: 0 22px; border-radius: 26px; border: 2px solid rgba(255,255,255,.2); background: none; font-size: 22px; font-weight: 700; color: rgba(245,245,247,.85); }
.vod .grid.vod-grid { width: auto; height: 754px; margin-left: -16px; padding: 18px 16px 30px; }
.grid.vod-grid > .poster, .grid.vod-grid > .poster:nth-child(5n) { width: 180px; margin: 0 51px 26px 0; }
.grid.vod-grid > .poster:nth-child(6n) { margin-right: 0; }
.grid.vod-grid > .poster .art { height: 270px; border-radius: 12px; }
.grid.vod-grid > .poster .cap { margin-top: 14px; font-size: 23px; }
.grid.vod-grid > .poster .sub { margin-top: 2px; font-size: 19px; color: rgba(245,245,247,.42); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.grid.vod-grid > .poster.focused { -webkit-transform: none; transform: none; }
.grid.vod-grid > .poster.focused .art { -webkit-transform: scale(1.04); transform: scale(1.04); box-shadow: 0 0 0 5px #FFB547, 0 10px 26px rgba(0,0,0,.5); }
.pb-new, .pb-added { background: #F5F5F7 !important; color: #111; font-size: 15px; font-weight: 800; letter-spacing: .06em; border-radius: 6px; padding: 3px 9px; }

/* Detalhe do filme e da série: imagem do título na tela inteira, escurecida à esquerda; sem a capa pequena. */
.detail-shade { background: linear-gradient(90deg, rgba(11,11,14,.97) 0%, rgba(11,11,14,.88) 24%, rgba(11,11,14,.55) 44%, rgba(11,11,14,.1) 68%, rgba(11,11,14,0) 84%),
  linear-gradient(0deg, #0A0F1B 22%, rgba(11,11,14,.8) 40%, rgba(11,11,14,0) 62%); }
.detail .detail-body, .detail.series .detail-body, .detail:not(.series) .detail-body { padding-top: 148px; }
.detail .detail-top, .detail.series .detail-top, .detail:not(.series) .detail-top { margin: 0 96px 34px; }
.detail .detail-poster { display: none; }
.detail .detail-top > .detail-text { margin-left: 0; max-width: 1180px; }
.d-line { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; margin: 0; font-size: 24px; font-weight: 600; color: rgba(245,245,247,.75); }
.d-kind { margin-right: 18px; padding: 5px 14px; border-radius: 8px; background: rgba(255,255,255,.14); color: #fff; font-size: 19px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.dl + .dl:before { content: "·"; margin: 0 12px; color: rgba(245,245,247,.35); }
.dl.star { color: #F5B83D; }
.dl .cert { margin-left: 0; font-size: 19px; vertical-align: 1px; }
.detail-text h1, .detail.series .detail-text h1 { margin: 14px 0 0; font: 400 140px/.95 "Bebas Neue", "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; letter-spacing: 6px; text-transform: uppercase; text-shadow: 0 6px 40px rgba(0,0,0,.5); }
.detail-text h1.t-md { font-size: 104px; letter-spacing: 4px; }
.detail-text h1.t-sm { font-size: 84px; letter-spacing: 3px; }
.detail .d-tag { margin: 8px 0 0; font-size: 27px; color: rgba(245,245,247,.9); }
.detail .detail-text .plot, .detail.series .detail-text .plot { margin: 14px 0 0; max-width: 900px; min-height: 0; font-size: 26px; line-height: 1.45; color: rgba(245,245,247,.78); -webkit-line-clamp: 3; max-height: 4.35em; }
.detail .d-crew { margin: 12px 0 0; font-size: 22px; color: rgba(245,245,247,.8); }
.detail .d-crew .muted { color: rgba(245,245,247,.5); }
.detail .detail-text .actions { margin-top: 30px; }
.detail .btn .btn-sub { margin-left: 14px; font-size: 21px; font-weight: 600; opacity: .8; }
.detail .d-prog { margin-top: 18px; }
.detail .seasons { margin: 0 96px; }
.detail .season-pick { height: 52px; padding: 0 22px; border-radius: 26px; font: 700 26px "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; }
.detail .season-pick .sp-n { font: 600 22px "Manrope", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; }
.detail-body .row h2, .detail-body .row-items { padding-left: 96px; }
.ep-plot { margin-left: 96px; margin-right: 96px; }
.d-cast, .d-about { margin-left: 96px; margin-right: 96px; }
/* Episódios em 16:9 com o número grande, selo de Continuar ou Assistido e a barra no pé da imagem. */
.detail .poster[data-ep] { width: 384px; }
.detail .poster[data-ep] .art { height: 216px; border-radius: 12px; }
.detail .poster[data-ep] .art:after { height: 55%; }
.ep-n { position: absolute; z-index: 1; left: 16px; bottom: 18px; font: 400 56px/1 "Bebas Neue", "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; color: rgba(255,255,255,.92); text-shadow: 0 2px 10px rgba(0,0,0,.5); }
.ep-chip { position: absolute; z-index: 1; right: 12px; top: 12px; padding: 3px 10px; border-radius: 6px; background: #F5F5F7; color: #111; font-size: 16px; font-weight: 800; letter-spacing: .06em; }
.ep-chip.done { background: rgba(0,0,0,.6); color: #fff; }
.detail .poster[data-ep] .bar { left: 0; right: 0; bottom: 0; height: 6px; border-radius: 0; background: rgba(255,255,255,.22); }
.detail .poster[data-ep] .bar i { border-radius: 0; }
.detail .poster[data-ep] .cap { display: block; margin-top: 12px; font-size: 24px; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.detail .poster[data-ep] .sub { margin-top: 2px; font-size: 20px; color: rgba(245,245,247,.45); }
/* Seta de voltar: bolinha clara no canto, como no desenho. */
.scr-back.tb-ic { width: 64px; height: 64px; top: 56px; padding: 0; border: 0; background: rgba(38,38,44,.92); }
.scr-back.tb-ic svg { width: 30px; height: 30px; }
.scr-back.tb-ic.focused { background: #FFB547; color: #1A1205; }

/* Configurações: título, cartão da assinatura (estado com bolinha, barra da validade, dados em linhas) e opções em pares. */
.vod > .acc-title { top: 176px; bottom: auto; left: 96px; margin: 0; font: 700 44px "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; }
.acc-title span { margin-left: 16px; font: 600 26px "Manrope", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; color: rgba(245,245,247,.45); }
.vod > .acc-main.acc2 { top: 262px; left: 96px; right: 96px; }
.acc2 .acc-sum { -webkit-flex: 0 0 560px; flex: 0 0 560px; padding: 36px 40px; border: 0; border-radius: 20px; background: #121929; }
.acc-sum .acc-h { margin: 0; font-size: 19px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: rgba(245,245,247,.45); }
.acc-sum .acc-h svg { width: 26px; height: 26px; }
.acc-sum .acc-state, .acc-card.ok .acc-state, .acc-card.bad .acc-state, .acc-card.warn .acc-state { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; margin: 22px 0 6px; font: 700 52px "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; color: #fff; }
.acc-dot { -webkit-flex: none; flex: none; width: 16px; height: 16px; margin-right: 18px; border-radius: 8px; background: #8A8A93; box-shadow: 0 0 0 6px rgba(138,138,147,.18); }
.acc-card.ok .acc-dot { background: #3FB950; box-shadow: 0 0 0 6px rgba(63,185,80,.18); }
.acc-card.warn .acc-dot { background: #F5B83D; box-shadow: 0 0 0 6px rgba(245,184,61,.18); }
.acc-card.bad .acc-dot { background: #FF5C5C; box-shadow: 0 0 0 6px rgba(255,92,92,.18); }
.acc-sum .acc-line { margin: 10px 0 0; font-size: 25px; line-height: 1.4; }
.acc-meter { height: 8px; margin: 18px 0 8px; border-radius: 4px; background: rgba(255,255,255,.12); overflow: hidden; }
.acc-meter b { display: block; height: 100%; border-radius: 4px; background: #F5F5F7; }
.acc-meter.low b { background: #F5B83D; }
.acc-sum .acc-kvs { margin-top: 26px; padding-top: 0; border-top: 2px solid rgba(255,255,255,.07); }
.acc-sum .acc-kvs.acc-dev { margin-top: 0; border-top: 0; }
.acc-sum .acc-kv { -webkit-justify-content: space-between; justify-content: space-between; margin: 0; padding: 13px 0; border-bottom: 2px solid rgba(255,255,255,.07); font-size: 23px; }
.acc-sum .acc-kv > span { -webkit-flex: none; flex: none; color: rgba(245,245,247,.5); font-weight: 600; }
.acc-sum .acc-kv > b { margin-left: 24px; text-align: right; font-weight: 600; }
.acc-sum .acc-kv .mono { font-size: 22px; }
.acc2 .acc-opts { margin-left: 48px; }
.acc-g { margin-bottom: 24px; }
.acc-gh { margin: 0 0 12px 4px; font-size: 19px; font-weight: 700; letter-spacing: .16em; color: rgba(245,245,247,.42); }
.acc-opt { width: 49%; margin-right: 2%; border: 0; border-radius: 16px; background: #121929; }
.acc-opt.wide { width: 100%; margin-right: 0; }
.ao-ic { width: 56px; height: 56px; border-radius: 14px; }
.ao-ic svg { width: 28px; height: 28px; }
.ao-chev { -webkit-flex: none; flex: none; margin-left: 16px; font-size: 32px; line-height: 1; color: rgba(245,245,247,.3); }
.acc-opt.danger .ao-ic { background: rgba(255,181,71,.14); color: #FF6B6B; }
.acc-opt.danger b { color: inherit; }
.acc-opt.focused { -webkit-transform: scale(1.02); transform: scale(1.02); }
.acc-opt.focused .ao-chev { color: #1A1205; }
.acc-opt.danger.focused .ao-ic { background: #18203A; color: #FF6B6B; }
.vod > .vod-main { bottom: 0; }
.detail .season-pick.one { padding-left: 0; border-color: transparent; background: none; }
.acc-opt.focused { -webkit-transform: none; transform: none; }
.acc-dot { margin-left: 6px; }
/* Grade sem capa: ícone discreto no meio (o nome já aparece embaixo da capa). */
.poster .art-ph { position: absolute; left: 0; right: 0; top: 50%; margin-top: -32px; text-align: center; }
.poster .art-ph svg { width: 64px; height: 64px; fill: none; stroke: rgba(255,255,255,.4); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
/* Tela do título rolada: faixa escura no alto atrás da seta de voltar (o título passa por baixo dela). */
.detail:after { content: ""; position: absolute; z-index: 3; left: 0; right: 0; top: 0; height: 180px; background: linear-gradient(#0A0E19 50%, rgba(10,14,25,0)); opacity: 0; pointer-events: none; transition: opacity .2s; }
.detail.scrolled:after { opacity: 1; }

/* ---------- Acabamento (Meza 08/10): nada cortado e nenhum nome com "…" ----------
   Fileiras: só capas inteiras entre as margens de 96 px. O recorte da fileira fica 14 px para fora da margem,
   folga do tamanho da moldura branca da capa em foco; a fileira anda de capa em capa (data-scroll-x = 14). */
.row-items { position: relative; margin: 0 82px; padding: 14px 14px 20px; }
.row-items > .poster, .home .row-items > .poster { width: 188px; }
.row-items > .poster .art, .home .row-items > .poster .art { height: 282px; }
.row-items > .poster.wide, .home .row-items > .poster.wide { width: 408px; }
.row-items > .poster.wide .art, .home .row-items > .poster.wide .art { height: 230px; }
.row-items > .poster.focused { -webkit-transform: none; transform: none; }
.row-items > .poster.focused .art { -webkit-transform: scale(1.04); transform: scale(1.04); }
.detail-body .row-items { margin: 0 82px; padding-left: 14px; padding-right: 14px; }
.detail .poster[data-ep] { width: 408px; }
.detail .poster[data-ep] .art { height: 230px; }
.home .row-items > .fb-card { width: 554px; }
/* Nome embaixo da capa: sempre inteiro, quebrando linha; todos no mesmo tamanho de letra. */
.cap, .grid.vod-grid > .poster .cap, .home .row-items > .poster .cap, .detail .poster[data-ep] .cap, .poster[data-ep] .cap { display: block; white-space: normal; overflow: visible; text-overflow: clip; -webkit-line-clamp: none; line-height: 1.2; }
.grid.vod-grid > .poster .cap { font-size: 21px; line-height: 1.22; }
.row-items > .poster .cap, .home .row-items > .poster .cap { font-size: 22px; }
.home .row-items > .poster.wide .cap, .detail .poster[data-ep] .cap { font-size: 24px; }
/* Filmes e Séries: coluna de categorias um pouco mais larga e nome que não cabe quebra em 2 linhas. A grade ganha
   16 px de folga à esquerda dentro da área visível, para a moldura da primeira capa em foco não ser cortada. */
.vod > .lv-groups { width: 344px; }
.vod > .vod-main { left: 456px; padding: 6px 0 0 16px; }
.lv-groups .cat .cat-name, .vod .lv-groups .cat .cat-name, .live.fixed .lv-groups .cat > .cat-name { white-space: normal; overflow: visible; text-overflow: clip; line-height: 1.15; }
.vod .lv-groups .cat, .live.fixed .lv-groups .cat { height: auto; min-height: 60px; padding-top: 10px; padding-bottom: 10px; box-sizing: border-box; }
/* Busca: a área de resultados termina na margem e cada fileira mostra 5 capas (ou 3 canais) inteiras. */
.gsearch { right: 82px; }
.gs-res { margin-left: 36px; }
.gs-res .row h2 { margin-left: 14px; }
.gs-res .row-items { margin: 0; padding: 14px 14px 20px; }
.gs-res .row-items > .poster { width: 190px; }
.gs-res .row-items > .poster .art { height: 285px; }
.gs-res .row-items > .gs-ch { width: 338px; margin-right: 0; }
/* A sombra da capa em foco não escurece o nome embaixo dela. */
.poster > .cap, .poster > .sub { position: relative; z-index: 1; }

/* ---------- Duas fileiras inteiras (Meza 08/10 14:30): Filmes, Séries e a busca mostram sempre duas fileiras
   completas de capas, com nome e ano, sem nada cortado embaixo. Cada capa tem altura fixa (nome em até 3 linhas),
   a área visível tem a altura exata de duas fileiras e a grade rola de fileira em fileira. ---------- */
/* Grade: 7 capas de 160 x 240 por fileira. Fileira = 345 px de capa + 14 de espaço; 14 px de folga em cima para a moldura. */
.vod .grid.vod-grid { height: 718px; padding: 14px 16px 0; }
.grid.vod-grid > .poster, .grid.vod-grid > .poster:nth-child(5n), .grid.vod-grid > .poster:nth-child(6n) { width: 160px; height: 345px; margin: 0 35px 14px 0; }
.grid.vod-grid > .poster:nth-child(7n) { margin-right: 0; }
.grid.vod-grid > .poster .art { height: 240px; }
.grid.vod-grid > .poster .cap { margin-top: 12px; font-size: 20px; line-height: 1.15; max-height: 69px; overflow: hidden; }
.grid.vod-grid > .poster .sub { font-size: 17px; white-space: nowrap; overflow: visible; text-overflow: clip; }
/* Pesquisar dentro de Filmes/Séries: as mesmas capas da grade, 4 por fileira ao lado do teclado, duas fileiras inteiras. */
.grid.narrow { width: 745px; height: 718px; margin-left: -14px; padding: 14px 14px 0; }
.grid.narrow > .poster, .grid.narrow > .poster:nth-child(3n), .grid.narrow > .poster:nth-child(5n) { width: 160px; height: 345px; margin: 0 35px 14px 0; }
.grid.narrow > .poster:nth-child(4n) { margin-right: 0; }
.grid.narrow > .poster .art { height: 240px; border-radius: 12px; }
.grid.narrow > .poster .cap { margin-top: 12px; font-size: 20px; line-height: 1.15; max-height: 69px; overflow: hidden; }
.grid.narrow > .poster .sub { margin-top: 2px; font-size: 17px; color: rgba(245,245,247,.42); white-space: nowrap; }
.grid.narrow > .poster.focused { -webkit-transform: none; transform: none; }
.grid.narrow > .poster.focused .art { -webkit-transform: scale(1.04); transform: scale(1.04); box-shadow: 0 0 0 5px #FFB547, 0 10px 26px rgba(0,0,0,.5); }
/* Nome comprido: a letra diminui até caber nas 3 linhas (fitCaps no screens.js), em vez de cortar ou pôr "…". */
.grid.vod-grid > .poster .cap.cap-s, .grid.narrow > .poster .cap.cap-s, .gs-res .row-items > .poster .cap.cap-s { font-size: 17px; line-height: 1.15; }
.grid.vod-grid > .poster .cap.cap-xs, .grid.narrow > .poster .cap.cap-xs, .gs-res .row-items > .poster .cap.cap-xs { font-size: 15px; line-height: 1.15; }
.grid.vod-grid > .poster.cap-long .cap, .grid.narrow > .poster.cap-long .cap { max-height: 94px; }
.grid.vod-grid > .poster.cap-long .sub, .grid.narrow > .poster.cap-long .sub { display: none; }
/* Título no alto da grade: nome comprido diminui a letra (fitTitle no screens.js) em vez de terminar em "…". */
.vod-info h1.fit1 { font-size: 32px; line-height: 48px; }
.vod-info h1.fit2 { font-size: 26px; line-height: 48px; }
.vod-info h1.fit3 { font-size: 22px; line-height: 24px; white-space: normal; }
/* Busca: 6 capas de 156 x 234 por fileira; a área de resultados mostra exatamente duas fileiras (Filmes e Séries). */
.gs-res { height: 836px; }
.gs-res .row { margin-bottom: 24px; }
.gs-res .row h2 { margin-bottom: 10px; }
.gs-res .row-items { padding: 14px; }
.gs-res .row-items > .poster { width: 156px; height: 313px; }
.gs-res .row-items > .poster + .poster { margin-left: 28px; }
/* Espaço vazio depois da última fileira: ao descer até ela, ela sobe inteira para o alto (a de cima some inteira). */
.gs-res:after { content: ""; display: block; height: 600px; }
.gs-res .row-items > .poster .art { height: 234px; }
.gs-res .row-items > .poster .cap { margin-top: 10px; font-size: 20px; line-height: 1.15; max-height: 69px; overflow: hidden; }
/* Categorias de Filmes, Séries e Ao vivo: a que não cabe inteira em cima ou embaixo some (d-off, clipCats no screens.js),
   no lugar do degradê de antes, que na tela cheia cortava a categoria do cursor. A categoria com o cursor nunca some.
   O espaço no fim deixa a última categoria subir com a mesma folga de 40 px das outras. */
.vod > .lv-groups:after { content: ""; display: block; height: 40px; }
.lv-groups > .d-off:not(.focused) { visibility: hidden; }

/* ---------- Futebol "Placar" (desenho 8A, 08/10): abas e campeonatos no alto, ao vivo em cartões grandes,
   os outros jogos em linhas largas com horário, times e canal. Nome de time nunca cortado (quebra linha). ---------- */
.fx { position: absolute; top: 150px; left: 0; right: 0; bottom: 0; display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; color: #F5F5F7; }
.fx-head { -webkit-flex: none; flex: none; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; margin: 16px 96px 0; }
.fx-head h1 { margin: 0 40px 0 0; font: 700 44px "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; }
.fx-tabs { display: -webkit-flex; display: flex; }
.fx-tab { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; height: 56px; padding: 0 26px; margin-right: 14px; border-radius: 28px; background: rgba(255,255,255,.07); font-size: 24px; font-weight: 700; color: rgba(245,245,247,.75); }
.fx-tab b { margin-left: 12px; font-size: 20px; opacity: .6; }
.fx-tab i { display: block; width: 12px; height: 12px; margin-right: 12px; border-radius: 6px; background: #FFB547; box-shadow: 0 0 0 5px rgba(255,181,71,.25); }
.fx-tab.on { background: rgba(255,255,255,.16); color: #fff; }
.fx-tab.focused { background: #FFB547; color: #1A1205; }
.fx-pills { -webkit-flex: none; flex: none; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; margin: 22px 96px 0; }
.fx-pill { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; height: 46px; padding: 0 20px; margin: 0 12px 10px 0; border-radius: 23px; border: 2px solid rgba(255,255,255,.14); font-size: 21px; font-weight: 600; color: rgba(245,245,247,.7); white-space: nowrap; }
.fx-pill.on { border-color: rgba(255,255,255,.55); color: #fff; }
.fx-pill.focused { background: #FFB547; border-color: #FFB547; color: #1A1205; }
.fx-lg { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; min-width: 0; }
.fx-lg .crest.sm { width: 26px; height: 26px; margin-right: 10px; }
.fx-dot { display: block; -webkit-flex: none; flex: none; width: 12px; height: 12px; margin-right: 10px; border-radius: 6px; background: rgba(245,245,247,.45); }
.fx .crest:not(.txt) { background-color: transparent; border-radius: 0; background-size: contain; }
.fx-list { position: relative; -webkit-flex: 1 1 auto; flex: 1 1 auto; min-height: 0; overflow: hidden; margin: 6px 82px 0; padding: 0 14px 40px; }
.fx-sec { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; margin: 20px 0 16px; font-size: 20px; font-weight: 800; letter-spacing: .16em; color: rgba(245,245,247,.55); }
.fx-sec i { display: block; width: 12px; height: 12px; margin-right: 12px; border-radius: 6px; background: #FFB547; }
.fx-sec em { font-style: normal; margin-left: 14px; letter-spacing: 0; font-weight: 600; color: rgba(245,245,247,.38); }
.fx-cards { display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; }
.fx-card { position: relative; width: 554px; margin: 0 32px 28px 0; padding: 22px 26px 26px; border-radius: 20px; background: #15151A; box-sizing: border-box; overflow: hidden; }
.fx-card:nth-child(3n) { margin-right: 0; }
.fx-card.focused { box-shadow: 0 0 0 5px #FFB547, 0 16px 40px rgba(0,0,0,.6); -webkit-transform: scale(1.03); transform: scale(1.03); }
.fx-top { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; font-size: 20px; font-weight: 600; color: rgba(245,245,247,.6); }
.fx-on { -webkit-flex: none; flex: none; margin-left: auto; padding: 4px 12px; border-radius: 8px; background: #FFB547; color: #1A1205; font-size: 18px; font-weight: 800; letter-spacing: .06em; }
.fx-teams { display: -webkit-flex; display: flex; -webkit-align-items: flex-start; align-items: flex-start; margin-top: 16px; }
.fx-team { -webkit-flex: 1 1 0; flex: 1 1 0; display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; -webkit-align-items: center; align-items: center; min-width: 0; text-align: center; }
.fx-team .crest { width: 88px; height: 88px; }
.fx-team .crest.txt { font-size: 40px; }
.fx-team span { margin-top: 10px; font-size: 25px; font-weight: 700; line-height: 1.15; }
.fx-score { -webkit-flex: none; flex: none; width: 170px; padding-top: 2px; text-align: center; font: 400 104px/1 "Bebas Neue", "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; letter-spacing: 4px; }
.fx-score small { display: block; margin-top: 4px; font-family: "Manrope", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; font-size: 18px; font-weight: 700; line-height: 1.2; letter-spacing: .04em; color: rgba(245,245,247,.5); }
.fx-card .fx-where { margin-top: 18px; font-size: 21px; }
.fx-pr { position: absolute; left: 0; right: 0; bottom: 0; height: 5px; background: rgba(255,255,255,.08); }
.fx-pr i { display: block; height: 100%; background: #FFB547; }
.fx-row { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; min-height: 92px; padding: 10px 28px; margin-bottom: 12px; border-radius: 16px; background: #121929; box-sizing: border-box; }
.fx-row.focused { background: #192136; box-shadow: 0 0 0 5px #FFB547; }
.fx-hr { -webkit-flex: none; flex: none; width: 130px; font: 400 50px/1 "Bebas Neue", "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; letter-spacing: 2px; }
.fx-row > .fx-lg { -webkit-flex: none; flex: none; width: 260px; padding-right: 16px; box-sizing: border-box; font-size: 21px; font-weight: 600; line-height: 1.15; color: rgba(245,245,247,.55); }
.fx-h, .fx-a { -webkit-flex: 1 1 0; flex: 1 1 0; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; min-width: 0; font-size: 27px; font-weight: 700; line-height: 1.12; }
.fx-h { -webkit-justify-content: flex-end; justify-content: flex-end; text-align: right; }
.fx-h .crest { margin-left: 16px; }
.fx-a .crest { margin-right: 16px; }
.fx-row .crest { width: 52px; height: 52px; }
.fx-x { -webkit-flex: none; flex: none; width: 90px; text-align: center; font-size: 24px; color: rgba(245,245,247,.35); }
.fx-row.fin .fx-x { font: 400 40px/1 "Bebas Neue", "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; letter-spacing: 2px; color: #fff; }
.fx-row.fin { opacity: .72; }
.fx-row.fin.focused { opacity: 1; }
.fx-row .fx-where { -webkit-flex: none; flex: none; width: 440px; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-align-items: center; align-items: center; -webkit-justify-content: flex-end; justify-content: flex-end; text-align: right; font-size: 21px; }
.fx-where b { font-weight: 600; color: rgba(245,245,247,.88); }
.fx-where em { font-style: normal; margin-left: 8px; color: rgba(245,245,247,.42); }
.fx-where em.no { margin-left: 0; }
.fx-soon { margin-right: 14px; padding: 4px 12px; border-radius: 8px; background: rgba(255,255,255,.12); color: #fff; font-size: 18px; font-weight: 800; }
.fx-empty { margin: 40px 96px; font-size: 28px; }
.fx-list.scrolled { -webkit-mask-image: linear-gradient(rgba(0,0,0,0), #000 90px); mask-image: linear-gradient(rgba(0,0,0,0), #000 90px); }
/* Escolha do canal do jogo: nome do canal inteiro (quebra em 2 linhas), cartão um pouco mais alto. */
.fb-tile { height: auto; min-height: 72px; padding-top: 8px; padding-bottom: 8px; }
.fb-tile .ch-name { white-space: normal; overflow: visible; text-overflow: clip; line-height: 1.15; }
/* Fim da lista de jogos: some num degradê suave (a lista rola para baixo). */
.fx:after { content: ""; position: absolute; z-index: 2; left: 0; right: 0; bottom: 0; height: 90px; background: linear-gradient(rgba(10,14,25,0), #0A0E19 85%); pointer-events: none; }
.fx-pill.focused .fx-dot { background: #8A8A90; }

/* ---------- Perfil (criar/editar), pedido do Meza 08/10: o ícone escolhido fica ao lado do nome, e Salvar/Cancelar/Excluir
   ficam embaixo do teclado. À direita, todos os ícones em fileiras inteiras (6 por fileira, 5 fileiras à vista), rolando
   de fileira em fileira; o total de opções aparece no título. ---------- */
.pf-edit { padding-top: 76px; }
.pf-edit h1 { margin: 0 0 24px; font: 700 52px "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; }
.pf-name { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; margin-bottom: 22px; }
.pf-name .pf-big { -webkit-flex: none; flex: none; margin: 0 22px 0 0; }
.pf-name .pf-big .av { width: 112px; height: 112px; border-radius: 22px; }
.pf-name .kb-q { -webkit-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; margin: 0; }
.pf-left .pf-actions { margin-top: 22px; }
.pf-left .pf-actions .btn { height: 68px; padding: 0 36px; font-size: 26px; }
.pf-right .lv-head { margin: 0 0 14px; }
.pf-right .lv-head .pf-n { margin-left: 12px; letter-spacing: 0; text-transform: none; font-weight: 600; color: rgba(245,245,247,.38); }
.pf-icons { box-sizing: content-box; width: 838px; height: 706px; margin-left: -10px; padding: 10px 10px 0; overflow: hidden; }
.pf-ic, .pf-ic:nth-child(4n) { margin: 0 14px 14px 0; }
.pf-ic:nth-child(6n) { margin-right: 0; }
.pf-ic .av { width: 120px; height: 120px; border-radius: 20px; }

/* ---------- Página do título sem cortes (Meza 08/10) ----------
   O nome grande fica numa linha só: a letra diminui conforme o tamanho (detailFit no screens.js). Na série, se os
   episódios (no filme, o elenco) não couberem inteiros na primeira tela, a sinopse fica em 2 linhas (fit-a) e some a
   linha da equipe (fit-b).
   Ao rolar, o bloco que ficaria pela metade some (d-off) e volta inteiro quando a página para nele. */
.detail-text h1, .detail.series .detail-text h1 { white-space: nowrap; }
.detail-text h1.t-md, .detail.series .detail-text h1.t-md { font-size: 104px; letter-spacing: 4px; }
.detail-text h1.t-sm, .detail.series .detail-text h1.t-sm { font-size: 84px; letter-spacing: 3px; }
.detail-text h1.t-xs, .detail.series .detail-text h1.t-xs { font-size: 68px; letter-spacing: 2px; }
.detail-text h1.t-xxs, .detail.series .detail-text h1.t-xxs { font-size: 56px; letter-spacing: 1.5px; }
.detail-text h1.t-wrap, .detail.series .detail-text h1.t-wrap { white-space: normal; }
.detail.fit-a .detail-text .plot { -webkit-line-clamp: 2; max-height: 2.9em; }
.detail.fit-a .detail-text .actions { margin-top: 22px; }
.detail.fit-b .d-crew, .detail.fit-b .d-tag { display: none; }
.detail-body > *, .home > .hero, .home-rows > .row { transition: opacity .18s, visibility .18s; }
.detail-body > .d-off, .home > .hero.d-off, .home-rows > .row.d-off { opacity: 0; visibility: hidden; }
/* Início: o destaque tem sempre a mesma altura (título numa linha só, que diminui se for longo, e sinopse com lugar
   para 2 linhas). Assim os botões ficam sempre no mesmo lugar e a primeira fileira cabe inteira na primeira tela. */
.home .hero-body { padding-top: 176px; }
.home .hero h1 { white-space: nowrap; display: block; overflow: visible; }
.home .hero h1.t-xs { font-size: 68px; letter-spacing: 2px; }
.home .hero h1.t-xxs { font-size: 56px; letter-spacing: 1.5px; }
.home .hero h1.t-wrap { white-space: normal; }
.home .hero .plot { height: 2.9em; margin: 14px 0 28px; }
.home-rows { margin-top: -232px; }
/* Fileiras de capas (Início e "Mais em" do título): nome em até 2 linhas. Nome longo diminui a letra (fitCaps) e, se
   ainda assim não couber, ganha a 3ª linha. Antes um nome enorme fora da tela esticava a fileira toda e abria um buraco. */
.home .row-items > .poster:not(.wide) .cap, .detail-body .row:not(.ep-section) .row-items > .poster .cap { max-height: 2.45em; overflow: hidden; }
.home .row-items > .poster .cap.cap-s, .detail-body .row:not(.ep-section) .row-items > .poster .cap.cap-s { font-size: 20px; }
.home .row-items > .poster .cap.cap-xs, .detail-body .row:not(.ep-section) .row-items > .poster .cap.cap-xs { font-size: 17px; }
.home .row-items > .poster.cap-long .cap, .detail-body .row:not(.ep-section) .row-items > .poster.cap-long .cap { max-height: 3.65em; }
.home .row-items, .detail-body .row-items { -webkit-align-items: flex-start; align-items: flex-start; }

/* ---------- Ao vivo em tela cheia (teste, Meza 08/10) ----------
   Sem o menu de cima: a logo vai para o alto da coluna de categorias, a data e a hora para o alto à direita.
   Ganho: 9 canais inteiros (eram 8 e o 9º cortado), prévia maior e mais categorias à vista.
   ▲ no topo das listas mostra o menu por cima da tela (#topbar.fs.peek); VOLTAR volta ao Início. */
#topbar.fs { -webkit-transform: translateY(-110%); transform: translateY(-110%); opacity: 0; transition: opacity .2s, -webkit-transform .2s; transition: transform .2s, opacity .2s; transition: transform .2s, opacity .2s, -webkit-transform .2s; }
#topbar.fs.peek { -webkit-transform: none; transform: none; opacity: 1; height: 150px; background: #0A0F1B; box-shadow: 0 12px 40px rgba(0,0,0,.6); }
.lv-fs-brand, .lv-fs-top { position: absolute; z-index: 3; }
.lv-fs-brand { left: 112px; top: 46px; height: 52px; }
.lv-fs-brand img { display: block; width: auto; height: 52px; }
.lv-fs-top { right: 96px; top: 50px; height: 48px; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; font-size: 24px; color: rgba(245,245,247,.55); white-space: nowrap; }
.lv-fs-top .clk { margin-left: 14px; font-size: 28px; font-weight: 700; color: #F5F5F7; }
.lv-fs-top .key { margin-right: 34px; font-size: 20px; font-weight: 600; color: rgba(245,245,247,.5); }
.lv-fs-top .key b { display: inline-block; padding: 2px 10px; margin-right: 8px; border-radius: 6px; background: rgba(255,255,255,.14); font-size: 17px; letter-spacing: .06em; color: #F5F5F7; }
.live.fixed > .lv-groups { top: 128px; }
.live.fixed .lv-groups > .lv-head { display: none; }
.live.fixed > .lv-list { top: 44px; width: 664px; }
/* Lista de canais sempre com 9 canais inteiros: altura = 6 + 9 canais de 102 - 6 + 6 e rolagem de um canal por vez
   (data-scroll-min com folga 6), então nunca fica canal pela metade em cima ou embaixo. */
.live.fixed .ch-list { box-sizing: border-box; height: 924px; padding: 6px 4px; }
.live.fixed > .lv-main { top: 112px; bottom: 24px; left: 1124px; }
.live.fixed .ch-preview { height: 394px; }
.live.fixed > .lv-main .pg-card { top: 426px; }
/* Painel do Ao vivo (EPG melhorado, Meza 08/10): Agora + quanto falta, barra com início e fim, sinopse em 2 linhas
   e "A seguir" em linha do tempo (bolinha + traço), com até 3 programas. */
.lv-ag .lv-left { margin-left: auto; font-size: 21px; font-weight: 600; letter-spacing: 0; color: rgba(245,245,247,.62); }
.lv-pr2 { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; margin: 16px 0 0; }
.lv-pr2 > b { -webkit-flex: none; flex: none; font-size: 20px; font-weight: 600; color: rgba(245,245,247,.55); }
.lv-pr2 .ch-bar { -webkit-flex: 1; flex: 1; height: 6px; margin: 0 16px; border-radius: 3px; background: rgba(255,255,255,.14); }
.lv-pr2 .ch-bar b { background: #FFB547; border-radius: 3px; }
.live.fixed .lv-main .lv-syn { margin-top: 14px; -webkit-line-clamp: 2; }
.lv-up { margin-top: 20px; padding-top: 16px; border-top: 2px solid rgba(255,255,255,.07); }
.lv-uph { margin: 0 0 6px; font-size: 18px; font-weight: 700; letter-spacing: .14em; color: rgba(245,245,247,.45); }
.lv-ur { position: relative; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; min-height: 46px; padding: 4px 0 4px 28px; box-sizing: border-box; }
.lv-ur:before { content: ""; position: absolute; left: 3px; top: 50%; width: 10px; height: 10px; margin-top: -5px; border-radius: 5px; background: rgba(245,245,247,.3); }
.lv-ur:after { content: ""; position: absolute; left: 7px; top: 50%; height: 100%; width: 2px; margin-top: 8px; background: rgba(255,255,255,.1); }
.lv-ur:last-child:after { display: none; }
.lv-ur.first:before { background: #F5F5F7; }
.lv-ur b { -webkit-flex: none; flex: none; width: 82px; font-size: 22px; font-weight: 700; color: rgba(245,245,247,.9); }
.lv-ur span { -webkit-flex: 1; flex: 1; min-width: 0; font-size: 24px; line-height: 1.2; color: rgba(245,245,247,.8); }
.lv-ur em { -webkit-flex: none; flex: none; margin-left: 14px; font-style: normal; font-size: 19px; font-weight: 600; color: rgba(245,245,247,.42); }
.lv-ur.first span { color: #F5F5F7; }
.lv-ur.first em { padding: 3px 10px; border-radius: 6px; background: rgba(255,255,255,.12); color: #F5F5F7; }
.live.fixed .lv-main .lv-acts { margin-top: 22px; }


/* ---------- Filmes, Séries e Futebol em tela cheia (teste, Meza 08/10) ----------
   Iguais ao Ao vivo: sem o menu de cima (App.isFs), logo no alto à esquerda, data e hora no alto à direita.
   Filmes e Séries: capas maiores, 6 por fileira (eram 7 menores) e sempre 2 fileiras inteiras:
   grade = 14 + 2 x (capa 410 + 14) = 862 de altura, rolando uma fileira por vez (data-scroll-min com folga 14). */
.vod.fs > .lv-groups { top: 128px; }
.vod.fs .lv-groups > .lv-head { display: none; }
.vod.fs > .vod-main { top: 44px; }
.vod.fs .vod-info { height: 150px; padding-top: 0; padding-right: 440px; }
.vod.fs .vod-info .sort-btn { top: 76px; }
.vod.fs .grid.vod-grid { height: 848px; }
.vod.fs .grid.vod-grid > .poster, .vod.fs .grid.vod-grid > .poster:nth-child(5n), .vod.fs .grid.vod-grid > .poster:nth-child(7n) { width: 200px; height: 410px; margin: 0 27px 14px 0; }
.vod.fs .grid.vod-grid > .poster:nth-child(6n) { width: 200px; height: 410px; margin: 0 0 14px 0; }
.vod.fs .grid.vod-grid > .poster .art { height: 300px; }
.vod.fs .grid.vod-grid > .poster .cap { font-size: 22px; max-height: 76px; }
.vod.fs .grid.vod-grid > .poster .cap.cap-s { font-size: 19px; }
.vod.fs .grid.vod-grid > .poster .cap.cap-xs { font-size: 17px; }
.vod.fs .grid.vod-grid > .poster.cap-long .cap { max-height: 100px; }
/* Pesquisar: o teclado e os resultados ficam na altura das categorias, abaixo da data e da hora. */
.vod.fs > .vod-main.search { top: 128px; }
/* Futebol: a tela sobe e a logo fica ao lado do título; cabe uma fileira de jogo a mais. */
.fx.fs { top: 30px; }
.fx.fs .fx-head h1 { margin-left: 290px; }
.fx.fs > .lv-fs-brand { left: 96px; top: 18px; }
.fx.fs > .lv-fs-top { top: 22px; }
/* Lista de jogos: a rolagem para no começo de um bloco (sem degradê em cima) e o que ficaria cortado no pé some;
   o espaço no fim deixa a última seção subir até o alto da lista. */
.fx-list > .d-off, .fx-cards > .d-off { opacity: 0; visibility: hidden; }
.fx-list:after { content: ""; display: block; height: 420px; }
/* Configurações: Atualizar lista girando o ícone enquanto a lista baixa de novo. */
.acc-opt.busy .ao-ic svg { -webkit-animation: spin 1s linear infinite; animation: spin 1s linear infinite; }
/* Muitas opções (aparelho de toque com "Modo da tela"): botões mais baixos e grupos mais juntos, tudo cabe na tela. */
.acc-opts.tight .acc-opt { height: 88px; }
.acc-opts.tight .acc-g { margin-bottom: 14px; }

/* ---------- Ajustes da 0.6.85 (Meza 08/10) ----------
   Grade de Filmes e Séries: o nome embaixo da capa ocupa sempre a altura de 2 linhas, então a linha
   "ano · temporadas" (ou "ano · duração") fica na mesma altura em todas as capas. Nome que não cabe em 2 linhas
   diminui a letra (fitCaps); se nem assim couber, ganha o lugar da linha de baixo (cap-long, o ano aparece no alto). */
.grid.vod-grid > .poster .cap, .grid.narrow > .poster .cap { height: 46px; max-height: none; }
.vod.fs .grid.vod-grid > .poster .cap { height: 51px; max-height: none; }
.grid.vod-grid > .poster.cap-long .cap, .grid.narrow > .poster.cap-long .cap, .vod.fs .grid.vod-grid > .poster.cap-long .cap { height: auto; }
/* Botão "Ordem da lista": um pouco para dentro, para o contorno branco de seleção não ficar cortado na borda. */
.vod .vod-info .sort-btn { right: 16px; }
/* Ao vivo: Favoritar e Guia do dia centralizados embaixo do painel, com o pé dos botões na mesma linha do pé do último
   canal da lista (lista termina em 112 + 924 - 6 = 1030; painel em 1080 - 24 = 1056, então 26 px do fundo). O texto
   de cima que não couber perde os últimos programas do "A seguir" (fitInfo). Meza 08/10. */
.live.fixed .lv-main .lv-acts { position: absolute; left: 0; right: 0; bottom: 26px; margin: 0; -webkit-justify-content: center; justify-content: center; }
.live.fixed .lv-main .lv-acts .lv-bt { margin: 0 8px; }

/* Pessoa do elenco: foto, nome e os filmes e séries dela que estão na lista (Meza 10/10). */
.page.person { display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; padding: 150px 0 0; }
.ps-head { -webkit-flex: none; flex: none; }
.ps-rows { -webkit-flex: 1 1 auto; flex: 1 1 auto; min-height: 0; overflow: hidden; }
.ps-head { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; margin: 0 96px 40px; }
.ps-face i { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; width: 200px; height: 200px; margin-right: 44px; border-radius: 50%; font-style: normal; font-size: 64px; font-weight: 700; color: #fff; background-size: cover; background-position: center; box-shadow: 0 10px 40px rgba(0, 0, 0, .5); }
.ps-k { margin: 0 0 6px; font-size: 22px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #FFB547; }
.ps-head h1 { margin: 0; font-size: 64px; line-height: 1.1; }
.ps-sub { margin: 12px 0 0; font-size: 28px; }
.ps-wait { height: 420px; }
/* Espaço depois da última fileira: ela também pode subir até o alto da área (nada fica cortado em cima). */
.ps-end { height: 300px; }

/* ===== Luma Play: menu lateral (TV, PC e web). Celular tem o próprio layout (mobile.css). =====
   A barra de cima vira um trilho de 150px à esquerda: símbolo, ícone + nome de cada seção.
   Data, hora, lupa, engrenagem e perfil continuam no canto de cima à direita.
   Telas em tela cheia (Ao vivo, Filmes, Séries, Futebol): o trilho fica escondido e entra pela esquerda com ▲/◀. */
html:not(.mobile) #topbar { top: 0; bottom: 0; left: 0; right: 0; height: auto; padding: 0; background: none; pointer-events: none; }
html:not(.mobile) #topbar > * { pointer-events: auto; }
html:not(.mobile) .tb-pill { position: absolute; left: 0; top: 0; bottom: 0; width: 150px; height: auto; padding: 44px 0 0; border: 0; border-radius: 0;
  -webkit-flex-direction: column; flex-direction: column; -webkit-align-items: center; align-items: center;
  background: linear-gradient(90deg, rgba(6,9,17,.97) 0%, rgba(6,9,17,.9) 70%, rgba(6,9,17,0) 100%); }
html:not(.mobile) .tb-pill .tb-sep { display: none; }
html:not(.mobile) .tb-pill .brand { margin: 0 0 54px; }
.rail-mark { display: block; width: 64px; height: 64px; }
html:not(.mobile) #menu { display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; -webkit-align-items: center; align-items: center; }
html:not(.mobile) #menu .menu-item, html:not(.mobile) #menu .menu-item:first-child { width: 112px; height: auto; margin: 0 0 14px; padding: 16px 0 12px; border-radius: 22px;
  display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; -webkit-align-items: center; align-items: center;
  font-size: 19px; font-weight: 600; color: rgba(238,240,247,.6); background: none; box-shadow: none; }
html:not(.mobile) #menu .menu-item + .menu-item { margin-left: 0; }
html:not(.mobile) #menu .menu-item .mi-ic { display: block; margin-bottom: 8px; }
html:not(.mobile) #menu .menu-item.on { color: #FFB547; background: rgba(255,181,71,.13); box-shadow: none; }
html:not(.mobile) #menu .menu-item.on:after { display: none; }
html:not(.mobile) #menu .menu-item.focused, html:not(.mobile) #menu .menu-item.on.focused { color: #1A1205; background: #FFB547;
  box-shadow: 0 0 0 4px rgba(255,181,71,.35), 0 10px 30px rgba(0,0,0,.5) !important; -webkit-transform: scale(1.06); transform: scale(1.06); }
html:not(.mobile) .tb-right { position: absolute; top: 44px; right: 96px; }
/* Conteúdo das telas com o trilho fixo começa depois dele. */
html:not(.mobile) #stage.rail #screen { left: 150px; }
html:not(.mobile) #stage.rail .home .hero-body { padding-left: 60px; padding-right: 60px; }
/* Telas em tela cheia (Ao vivo, Filmes, Séries, Futebol): o trilho continua fixo; data e hora ficam no cabeçalho da própria tela. */
html:not(.mobile) #topbar.fs, html:not(.mobile) #topbar.fs.peek { -webkit-transform: none; transform: none; opacity: 1; height: auto; background: none; box-shadow: none; }
html:not(.mobile) #topbar.fs .tb-right { display: none; }
/* Filmes e Séries com o trilho: a tela tem 150px a menos; categorias e grade chegam mais para a esquerda e a grade
   continua com os 1336px úteis da TV (6 capas por fileira). */
html:not(.mobile) #stage.rail .vod > .lv-groups { left: 24px; }
html:not(.mobile) #stage.rail .vod > .vod-main { left: 384px; right: 18px; }
html:not(.mobile) #stage.rail .vod > .lv-top { left: 24px; right: 40px; }
html:not(.mobile) #stage.rail .lv-top .brand-logo { display: none; }

/* Títulos grandes (destaque do Início, detalhe, número do episódio): Bricolage Grotesque no lugar da Bebas Neue. */
.home .hero h1 { font: 800 118px/.95 "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; letter-spacing: -3px; text-transform: none; }
.detail-text h1, .detail.series .detail-text h1 { font: 800 110px/.95 "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; letter-spacing: -3px; text-transform: none; }
.ep-n { font: 800 52px/1 "Bricolage Grotesque", "SamsungOne",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; }
html:not(.mobile) #stage.rail .lv-fs-brand { display: none; }
/* Foco preenchido (teclas, fichas, categorias): âmbar com texto escuro no lugar do branco do Max Pro.
   Categoria escolhida (sem foco): fundo elevado, número em âmbar e um traço âmbar à esquerda. */
.kb-key.focused, .chip.focused, .fb-tile.focused { background: #FFB547 !important; border-color: #FFB547 !important; color: #1A1205 !important; }
.lv-groups .cat.on, .vod .lv-groups .cat.on, .live.fixed .lv-groups .cat.on { background: #1B2338 !important; border-color: #1B2338 !important; color: #EEF0F7 !important; box-shadow: inset 4px 0 0 #FFB547; }
.lv-groups .cat.on .n, .vod .lv-groups .cat.on .n, .live.fixed .lv-groups .cat.on .n { color: #FFB547 !important; }
.lv-groups .cat.focused, .vod .lv-groups .cat.focused, .vod .lv-groups .cat.on.focused, .live.fixed .lv-groups .cat.focused, .live.fixed .lv-groups .cat.on.focused { background: #FFB547 !important; border-color: #FFB547 !important; color: #1A1205 !important; box-shadow: 0 0 0 6px rgba(255,181,71,.2) !important; }
.lv-groups .cat.focused .n, .vod .lv-groups .cat.focused .n, .live.fixed .lv-groups .cat.focused .n { color: rgba(26,18,5,.7) !important; }
/* Futebol com o trilho: sem a logo no alto, o título começa na margem da tela. */
html:not(.mobile) #stage.rail .fx.fs .fx-head { margin-left: 96px; }
html:not(.mobile) #stage.rail .fx.fs .fx-head h1 { margin-left: 0; }
/* Pé do menu lateral: lupa, configurações e perfil empilhados embaixo. Canto direito fica só com data e hora. */
html:not(.mobile) .tb-pill { padding-bottom: 36px; }
html:not(.mobile) .tb-pill .rail-sp { display: block; -webkit-flex: 1; flex: 1; }
html:not(.mobile) .rail-foot { display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; -webkit-align-items: center; align-items: center; }
html:not(.mobile) .rail-foot .tb-ic, html:not(.mobile) .rail-foot .tb-ic:first-of-type { width: 72px; height: 72px; margin: 0 0 12px; border-radius: 20px; color: rgba(238,240,247,.6); background: none; border: 0; }
html:not(.mobile) .rail-foot .tb-ic.on { color: #FFB547; background: rgba(255,181,71,.13); }
html:not(.mobile) .rail-foot .tb-ic.focused { color: #1A1205; background: #FFB547; box-shadow: 0 0 0 4px rgba(255,181,71,.35) !important; }
html:not(.mobile) .rail-foot .tb-ic.on:after { display: none; }
html:not(.mobile) .rail-foot .tb-av { width: 68px; height: 68px; margin: 6px 0 0; border-radius: 50%; border: 3px solid rgba(238,240,247,.18); }
html:not(.mobile) .rail-foot .tb-av .av { border-radius: 50%; }
html:not(.mobile) .rail-foot .tb-av.focused { border-color: #FFB547; box-shadow: 0 0 0 6px rgba(255,181,71,.25) !important; }
html:not(.mobile) .tb-right { top: 40px; right: 72px; height: auto; }
html:not(.mobile) .tb-right .tb-date { font-size: 24px; color: #8A92AC; margin-right: 18px; }
html:not(.mobile) .tb-right .clock { font-size: 30px; font-weight: 700; }

/* ===== Luma Play: tela de entrada =====
   Convite à esquerda (título grande, passos numerados, situação) e um cartão à direita com duas faces:
   QR code + código do aparelho, ou usuário e senha do provedor. Luz âmbar no canto e azul embaixo. */
.act.lx { padding: 56px 120px 48px; background: radial-gradient(60% 70% at 88% 18%, rgba(255,181,71,.16), rgba(255,181,71,0) 60%), radial-gradient(50% 60% at 6% 100%, rgba(80,110,255,.14), rgba(80,110,255,0) 70%), #0A0E19; }
.act.lx .act-top .brand-logo.top { max-height: 70px; max-width: 420px; }
.act.lx .act-panel { -webkit-justify-content: space-between; justify-content: space-between; }
.lx-intro { -webkit-flex: none; flex: none; width: 820px; }
.lx-intro .eyebrow { color: #FFB547; font-size: 22px; }
.lx-h { margin: 6px 0 22px; font: 800 96px/.98 "Bricolage Grotesque",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; letter-spacing: -3px; }
.lx-intro h2 { margin: 0 0 40px; font: 600 34px "Manrope", "Manrope",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; color: #8A92AC; }
.act.lx .act-steps { margin: 0; }
.act.lx .act-steps li { font-size: 30px; }
.act.lx .act-steps li + li { margin-top: 20px; }
.act.lx .act-steps i { width: 52px; height: 52px; line-height: 48px; margin-right: 22px; border-radius: 14px; background: #1B2338; border: 2px solid #262F48; color: #EEF0F7; }
.act.lx .act-steps li:first-child i { background: #FFB547; border-color: #FFB547; color: #1A1205; }
.act.lx .act-status { margin-top: 44px; }
.act.lx .act-status .pulse { background: #FFB547; }
.lx-card { -webkit-flex: none; flex: none; width: 700px; padding: 46px 52px; border-radius: 32px; background: #131A2B; border: 2px solid #262F48; box-shadow: 0 40px 90px rgba(0,0,0,.5); }
.lx-face { width: auto; }
.act.lx .lx-form-face { display: none; width: auto; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; }
.act.lx.lx-form .lx-form-face { display: block; }
.act.lx.lx-form .lx-qr-face { display: none; }
.lx-qr-face { display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; -webkit-align-items: center; align-items: center; text-align: center; }
.act.lx .act-qr { margin: 0 0 30px; }
.act.lx .qr-frame { padding: 22px; border-radius: 24px; box-shadow: 0 0 0 8px rgba(255,181,71,.18); }
.lx-demo-ic { width: 220px; height: 220px; margin: 0 0 30px; border-radius: 28px; background: #1B2338; color: #FFB547; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; }
.lx-demo-ic svg { width: 110px; height: 110px; }
.act.lx .act-ids { -webkit-justify-content: center; justify-content: center; }
.act.lx .act-id { padding: 0; background: none; border: 0; text-align: center; }
.act.lx .act-id span { font-size: 18px; }
.act.lx .act-id b { font: 700 50px "JetBrains Mono", Consolas, monospace; letter-spacing: .06em; color: #FFB547; }
.lx-btns { display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; width: 100%; margin-top: 34px; }
.lx-btns .btn { width: 100%; height: 76px; margin: 0 0 14px; -webkit-justify-content: center; justify-content: center; font-size: 26px; }
.lx-form-h { margin: 4px 0 28px; font: 800 48px "Bricolage Grotesque",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; letter-spacing: -1px; }
.act.lx .lg-field { height: 96px; border-radius: 16px; margin-bottom: 14px; }
.act.lx .lg-go { height: 80px; border-radius: 16px; }
.act.lx .lx-flip { display: block; width: 100%; height: 72px; margin-top: 14px; border-radius: 16px; font-size: 24px; background: none; border: 2px solid #262F48; color: #EEF0F7; }
.act.lx .lx-btns .lx-flip { margin-top: 0; }
.act.lx .lx-flip.focused { background: #FFB547; border-color: #FFB547; color: #1A1205; }
.act.lx .act-foot { font-size: 20px; }
.act.lx.over .lx-qr-face .act-qr { display: none; }
/* Luma Play (Meza 27/10): login com o formulário do provedor já aberto, como no Max Pro, no visual âmbar do Luma.
   À esquerda o cartão do provedor, no meio o "ou", à direita QR + passos + MAC. */
.act.lx2 .act-top .brand-logo.top { max-height: 84px; max-width: 360px; }
.act.lx2 .act-panel { -webkit-justify-content: space-between; justify-content: space-between; -webkit-align-items: center; align-items: center; }
.act.lx2 .act-login { width: 700px; padding: 44px 52px 40px; border-radius: 32px; background: #131A2B; border: 2px solid #262F48; box-shadow: 0 40px 90px rgba(0,0,0,.5), 0 -1px 0 rgba(255,181,71,.35) inset; }
.act.lx2 .act-login .eyebrow, .act.lx2 .act-side .eyebrow { color: #FFB547; font-size: 22px; }
.act.lx2 .act-login h1 { margin: 6px 0 12px; font: 800 52px/1.05 "Bricolage Grotesque",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; letter-spacing: -1px; }
.act.lx2 .act-lead { margin: 0 0 26px; font-size: 24px; color: #8A92AC; }
.act.lx2 .lg-field { height: 96px; border-radius: 16px; margin-bottom: 14px; }
.act.lx2 .lg-go { width: 100%; height: 80px; margin-top: 6px; border-radius: 16px; }
.act.lx2 .act-or { width: 120px; height: 520px; }
.act.lx2 .act-or span { margin: 16px 0; padding: 8px 18px; border-radius: 999px; background: #131A2B; border: 2px solid #262F48; color: #FFB547; font-size: 22px; }
.act.lx2 .act-side { width: 820px; }
.act.lx2 .act-side h2 { margin: 6px 0 30px; font: 800 60px/1.02 "Bricolage Grotesque",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; letter-spacing: -2px; }
.act.lx2 .act-side .act-qr { margin-right: 46px; }
.act.lx2 .act-side .qr-frame { padding: 20px; border-radius: 24px; box-shadow: 0 0 0 8px rgba(255,181,71,.18); }
.act.lx2 .act-side .act-steps li { font-size: 28px; }
.act.lx2 .act-side .act-steps li + li { margin-top: 18px; }
.act.lx2 .act-ids { -webkit-justify-content: flex-start; justify-content: flex-start; }
.act.lx2 .act-id { padding: 0; background: none; border: 0; text-align: left; }
.act.lx2 .act-id span { font-size: 18px; }
.act.lx2 .act-id b { font: 700 46px "JetBrains Mono", Consolas, monospace; letter-spacing: .06em; color: #FFB547; }
.act.lx2 .act-status { margin-top: 22px; }
.act.lx2 .lx-demo-ic { margin: 0 46px 0 0; }

/* ===== Luma Play: formas =====
   Botões retangulares de canto 16px (o Max Pro usa pílulas). Primário âmbar com texto escuro. */
.btn, .home .hero .btn, .detail .btn, .pf-actions .btn, .terms-sign .btn, .acc-actions .btn { border-radius: 16px !important; }
.btn.primary, .home .hero .btn.primary, .detail .btn.primary, .pf-actions .btn.primary, .terms-sign .btn.primary { background: #FFB547; border-color: #FFB547; color: #1A1205; }
.btn.icon { border-radius: 16px !important; }

/* ===== Luma Play: perfis =====
   Avatares redondos (o Max Pro usa quadrados), anel âmbar no escolhido, luz suave atrás do título.
   Primeira vez: dois cartões deitados, avatar à esquerda e texto à direita. */
.av, .av-face, .tb-av .av, .pf .av, .pf-opt .av, .pf-ic .av, .pf-big .av { border-radius: 50% !important; }
.profiles { background: radial-gradient(50% 45% at 50% 38%, rgba(255,181,71,.12), rgba(255,181,71,0) 70%), #0A0E19; }
.profiles h1 { font: 800 76px "Bricolage Grotesque",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; letter-spacing: -2px; margin-bottom: 70px; }
.pf .av { width: 210px; height: 210px; border: 0; box-shadow: 0 0 0 6px rgba(238,240,247,.06); }
.pf.focused .av { -webkit-transform: none; transform: none; box-shadow: 0 0 0 6px #FFB547, 0 0 0 16px rgba(255,181,71,.2), 0 20px 50px rgba(0,0,0,.5) !important; }
.pf b { margin-top: 30px; font-size: 30px; }
.pf .av.add { background: none !important; border: 4px dashed #262F48; box-shadow: none; }
.pf-note { margin-top: 40px; font-size: 24px; }
.profiles.first .pf-row { -webkit-flex-direction: column; flex-direction: column; -webkit-align-items: center; align-items: center; margin-top: 56px; }
.pf-opt { width: 1080px; margin: 0 0 26px; padding: 34px 44px; border-radius: 26px; background: #131A2B; border: 3px solid #262F48;
  -webkit-flex-direction: row; flex-direction: row; -webkit-align-items: center; align-items: center; text-align: left; position: relative; }
.pf-opt .av { -webkit-flex: none; flex: none; width: 150px; height: 150px; margin-right: 40px; }
.pf-opt h2 { margin: 0 0 8px; font: 800 40px "Bricolage Grotesque",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; }
.pf-opt p { font-size: 24px; }
.pf-opt .pf-btn { position: absolute; right: 44px; top: 50%; margin-top: -32px; }
.pf-opt.focused, .pf-opt.focused:focus { border-color: #FFB547; background: #1B2338; -webkit-transform: none; transform: none; box-shadow: 0 0 0 8px rgba(255,181,71,.18) !important; }
.pf-opt .av.add { background: #1B2338 !important; border: 3px dashed #3A4566; }
.pf-opt .pf-txt { -webkit-flex: 1; flex: 1; min-width: 0; padding-right: 300px; }
.pf-opt .pf-btn { margin-top: -36px; border-radius: 16px; }

/* ===== Luma Play: menu lateral recolhido =====
   Fechado: 104px, só os ícones. Com o foco (ou o mouse) nele: abre para 320px por cima da tela, com os nomes. */
html:not(.mobile) .tb-pill { width: 104px; -webkit-align-items: flex-start; align-items: flex-start; padding-left: 16px; overflow: hidden; transition: width .18s ease, box-shadow .18s ease; background: #070A13; }
html:not(.mobile) #topbar.open .tb-pill, html:not(.mobile) .tb-pill:hover { width: 320px; box-shadow: 30px 0 80px rgba(0,0,0,.65); }
html:not(.mobile) .tb-pill .brand { margin: 0 0 50px 4px; }
html:not(.mobile) #menu { -webkit-align-items: flex-start; align-items: flex-start; }
html:not(.mobile) #menu .menu-item, html:not(.mobile) #menu .menu-item:first-child { width: 72px; height: 72px; padding: 0 0 0 16px; margin: 0 0 12px;
  -webkit-flex-direction: row; flex-direction: row; -webkit-justify-content: flex-start; justify-content: flex-start; border-radius: 20px; font-size: 26px; white-space: nowrap; overflow: hidden; }
html:not(.mobile) #menu .menu-item .mi-ic { margin: 0; -webkit-flex: none; flex: none; }
html:not(.mobile) #menu .menu-item .mi-t { display: none; margin-left: 22px; }
html:not(.mobile) #topbar.open #menu .menu-item, html:not(.mobile) .tb-pill:hover #menu .menu-item { width: 288px; }
html:not(.mobile) #topbar.open #menu .mi-t, html:not(.mobile) .tb-pill:hover #menu .mi-t { display: block; }
html:not(.mobile) #menu .menu-item.focused, html:not(.mobile) #menu .menu-item.on.focused { -webkit-transform: none; transform: none; }
html:not(.mobile) .rail-foot { -webkit-align-items: flex-start; align-items: flex-start; }
html:not(.mobile) .rail-foot .tb-ic, html:not(.mobile) .rail-foot .tb-ic:first-of-type { width: 72px; -webkit-justify-content: flex-start; justify-content: flex-start; padding-left: 19px; white-space: nowrap; overflow: hidden; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; }
html:not(.mobile) .rail-foot .tb-ic svg { -webkit-flex: none; flex: none; }
html:not(.mobile) #topbar.open .rail-foot .tb-ic, html:not(.mobile) .tb-pill:hover .rail-foot .tb-ic { width: 288px; }
html:not(.mobile) #topbar.open .rail-foot .tb-ic:after, html:not(.mobile) .tb-pill:hover .rail-foot .tb-ic:after { content: attr(aria-label); position: static; display: block; margin-left: 22px; height: auto; background: none; font-size: 26px; font-weight: 600; }
html:not(.mobile) .rail-foot .tb-av { margin-left: 2px; }
/* A tela começa depois do trilho fechado. */
html:not(.mobile) #stage.rail #screen { left: 104px; }
html:not(.mobile) #stage.rail .vod > .lv-groups { left: 40px; }
html:not(.mobile) #stage.rail .vod > .vod-main { left: 400px; right: 48px; }
html:not(.mobile) #stage.rail .vod > .lv-top { left: 40px; right: 56px; }

/* ===== Luma Play: Início =====
   O destaque é um cartão com cantos arredondados (o Max Pro usa a imagem de ponta a ponta); a capa do título fica
   dentro dele, à direita. Embaixo: fileiras com título em Bricolage e uma fileira de canais em fichas. */
.page.home { padding-top: 112px; }
.home .hero, html:not(.mobile) #stage.rail .home .hero { position: relative; height: 600px; margin: 0 56px 40px 40px; border-radius: 30px; overflow: hidden; background: #131A2B; box-shadow: 0 30px 70px rgba(0,0,0,.45); }
.home .hero-shade { background: linear-gradient(90deg, rgba(10,14,25,.97) 0%, rgba(10,14,25,.82) 34%, rgba(10,14,25,.25) 66%, rgba(10,14,25,.05) 100%) !important; }
.home .hero-body, html:not(.mobile) #stage.rail .home .hero-body { padding: 70px 64px 0; max-width: 1180px; }
.home .hero-poster { top: 60px; right: 64px; width: 300px; height: 450px; border-radius: 20px; box-shadow: 0 24px 60px rgba(0,0,0,.6); }
.home .hero h1 { font-size: 100px; margin-top: 14px; }
.home .hero h1.t-md { font-size: 82px; letter-spacing: -2px; }
.home .hero h1.t-sm, .home .hero h1.t-xs { font-size: 66px; letter-spacing: -1px; }
.home .hero h1.t-xxs { font-size: 54px; letter-spacing: -1px; }
.home .tg.top { background: rgba(255,181,71,.16); color: #FFB547; border-radius: 10px; }
.home .hero .btn { background: rgba(27,35,56,.9); border: 2px solid #2E3858; }
.home .hero .btn.primary { background: #FFB547; border-color: #FFB547; color: #1A1205; }
.home .hero-dots i { width: 34px; height: 5px; margin-left: 8px; border-radius: 3px; background: rgba(238,240,247,.22); }
.home .hero-dots i.on { width: 34px; background: #FFB547; }
.home-rows { padding-left: 40px; }
.home .row h2 { font: 800 34px "Bricolage Grotesque",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; letter-spacing: -.5px; margin-bottom: 14px; }
.row-items > .poster .art, .grid.vod-grid > .poster .art, .grid > .poster .art { border-radius: 14px; }
.lx-ch { -webkit-flex: none; flex: none; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; height: 96px; margin-right: 18px; padding: 0 28px 0 14px;
  border-radius: 18px; background: #131A2B; border: 2px solid #262F48; }
.lx-ch .ch-logo { width: 68px; height: 68px; margin: 0 18px 0 0; border-radius: 14px; background-color: #1B2338; background-size: contain; background-position: center; background-repeat: no-repeat; }
.lx-ch .ch-logo.none { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; font: 800 30px "Bricolage Grotesque",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; color: #FFB547; }
.lx-ch-t b { display: block; font-size: 24px; font-weight: 700; white-space: nowrap; }
.lx-ch-t small { display: block; font-size: 18px; color: #8A92AC; white-space: nowrap; }
.lx-ch.focused { border-color: #FFB547; background: #1B2338; box-shadow: 0 0 0 6px rgba(255,181,71,.2) !important; }
.lx-demo-ic img { width: 150px; height: 150px; }
.act.lx .lx-flip.focused { background: #1B2338; border-color: #FFB547; color: #FFB547; box-shadow: 0 0 0 6px rgba(255,181,71,.2) !important; }
.home-rows, .home .home-rows { margin-top: 0 !important; }
/* Destaque + primeira fileira inteiros na tela de 1080. */
.page.home { padding-top: 96px; }
.home .hero, html:not(.mobile) #stage.rail .home .hero { height: 520px; margin-bottom: 30px; }
.home .hero-body, html:not(.mobile) #stage.rail .home .hero-body { padding-top: 56px; }
.home .hero-poster { top: 50px; width: 280px; height: 420px; }
.home .hero h1 { font-size: 92px; }

/* ===== Luma Play: Ao vivo =====
   Grupos num painel próprio; cada canal é um cartão; o canal em foco ganha anel âmbar (sem preencher a linha);
   o canal tocando tem um traço âmbar à esquerda. Prévia e "Agora" em cartões com canto 22px. */
html:not(.mobile) #stage.rail .fs-menu { display: none !important; }
.live.fixed > .lv-groups { background: #131A2B !important; border: 2px solid #262F48 !important; border-radius: 24px !important; padding: 18px 14px !important; }
.live.fixed .ch { background: rgba(19,26,43,.7); border: 2px solid transparent; border-radius: 16px; }
.live.fixed .ch-row + .ch-row .ch { margin-top: 0; }
.live.fixed .ch.on { box-shadow: inset 5px 0 0 #FFB547; }
.live.fixed .ch.focused, .live.fixed .ch.on.focused { background: #1B2338 !important; border-color: #FFB547 !important; box-shadow: 0 0 0 6px rgba(255,181,71,.18) !important; }
.live.fixed .ch.focused .ch-name { color: #EEF0F7 !important; }
.live.fixed .ch.focused .num, .live.fixed .ch.focused .ch-nl, .live.fixed .ch.focused .ch-nl em { color: #8A92AC !important; }
.live.fixed .ch.focused .ch-bar { background: rgba(255,255,255,.12) !important; }
.live.fixed .ch.focused .ch-bar b { background: #FFB547 !important; }
.live.fixed .ch-tile { border-radius: 12px; }
.live .ch-preview { border-radius: 22px !important; outline: 2px solid #262F48; }
.live .pg-card.info { background: #131A2B !important; border: 2px solid #262F48 !important; border-radius: 22px !important; padding: 22px 26px !important; }
.live .lv-ag { color: #FFB547 !important; letter-spacing: .12em; }
.live .lv-ag i { background: #FF5E48 !important; }
.live .lv-ttl { font-family: "Bricolage Grotesque",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif !important; font-weight: 800 !important; }
.live .lv-bt { border-radius: 14px !important; }
.live .lv-bt.focused { background: #FFB547 !important; border-color: #FFB547 !important; color: #1A1205 !important; }
.live .lv-head b, .vod .lv-head b { font-family: "Bricolage Grotesque",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; font-weight: 800; }

/* ===== Luma Play: Filmes e Séries ===== categorias num painel, como no Ao vivo. */
.vod > .lv-groups, html:not(.mobile) #stage.rail .vod > .lv-groups { background: #131A2B !important; border: 2px solid #262F48 !important; border-radius: 24px !important; padding: 18px 14px !important; bottom: 40px; }
.vod .vod-info h1 { font-family: "Bricolage Grotesque",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; font-weight: 800; letter-spacing: -1px; }

/* ===== Luma Play: detalhe =====
   Capa do título à esquerda (o Max Pro esconde a capa), texto à direita; temporadas em abas sublinhadas. */
.detail .detail-poster { display: block; width: 320px; height: 480px; margin-right: 64px; border-radius: 24px; box-shadow: 0 30px 70px rgba(0,0,0,.6), 0 0 0 2px rgba(238,240,247,.08); }
.detail.series .detail-poster, .detail:not(.series) .detail-poster { width: 280px; height: 420px; }
.detail .detail-top > .detail-text { max-width: 1100px; }
.detail .d-kind { background: rgba(255,181,71,.16) !important; color: #FFB547 !important; border-radius: 10px !important; }
.detail-shade { background: linear-gradient(90deg, rgba(10,14,25,.97) 0%, rgba(10,14,25,.85) 45%, rgba(10,14,25,.45) 100%), linear-gradient(0deg, #0A0E19 0%, rgba(10,14,25,0) 50%) !important; }
.season, .detail .season { padding: 10px 6px 14px !important; margin-right: 34px !important; border: 0 !important; border-radius: 10px !important; background: none !important; color: #8A92AC !important; box-shadow: inset 0 -4px 0 transparent; }
.season.on, .detail .season.on { color: #EEF0F7 !important; font-weight: 800 !important; box-shadow: inset 0 -4px 0 #FFB547; }
.season.focused, .detail .season.focused { color: #1A1205 !important; background: #FFB547 !important; box-shadow: 0 0 0 6px rgba(255,181,71,.2) !important; padding: 10px 18px 14px !important; }

/* ===== Luma Play: Conta =====
   Opções numa lista de uma coluna (o Max Pro usa grade de duas), resumo da assinatura num cartão à esquerda. */
.acc-opt, .acc-opt:nth-child(n+3) { width: 100% !important; height: 84px !important; margin: 0 0 10px !important; border-radius: 16px !important; background: #131A2B; border: 2px solid #262F48; }
.acc-opt.focused { background: #1B2338 !important; border-color: #FFB547 !important; color: #EEF0F7 !important; box-shadow: 0 0 0 6px rgba(255,181,71,.18) !important; }
.acc-opt.focused .ao-ic { background: #FFB547 !important; color: #1A1205 !important; }
.acc-gh { color: #FFB547 !important; font-size: 18px !important; }
.acc2 .acc-sum { border-radius: 26px; background: #131A2B; border: 2px solid #262F48; }
.acc-state { font-family: "Bricolage Grotesque",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; }
/* Busca: campo com borda âmbar, teclas de canto 12px. */
.kb-key { border-radius: 12px !important; }
.gsearch .kb-q, .vod-main.search .kb-q, .kb-q { border-radius: 16px !important; border: 2px solid #FFB547 !important; background: #131A2B !important; }
.gs-empty h2 { font-family: "Bricolage Grotesque",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; font-weight: 800; }

/* ===== Luma Play: termo de uso ===== documento escuro com texto claro (o Max Pro usa a folha branca). */
.terms { background: radial-gradient(50% 50% at 90% 0%, rgba(255,181,71,.12), rgba(255,181,71,0) 70%), #0A0E19; }
.terms-doc h1 { font: 800 60px "Bricolage Grotesque",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; letter-spacing: -1.5px; }
.terms-text { background: #131A2B; color: #DDE1EC; border: 2px solid #262F48; border-radius: 26px; }
.terms-check { border-radius: 16px; }
.terms-check.focused { border-color: #FFB547; box-shadow: 0 0 0 6px rgba(255,181,71,.2) !important; }
.terms-check.on i { background: #FFB547 !important; border-color: #FFB547 !important; }
.terms-p.focused { border-left-color: #FFB547 !important; background: rgba(255,181,71,.08) !important; }

/* ===== Luma Play: Ao vivo em formato de guia (TV, PC e web) =====
   Em cima: prévia 16:9 (640x360) e o cartão "Agora / A seguir". Embaixo: grupos sempre à vista à esquerda e a lista de
   canais, cada um com a faixa de programas de 2h30; régua de horários e linha âmbar do "agora" por cima da lista. */
html:not(.mobile) #stage.rail .live.fixed > .lv-main { top: 88px !important; left: 40px !important; right: 48px !important; bottom: auto !important; height: 360px; }
html:not(.mobile) #stage.rail .live.fixed .ch-preview { top: 0; left: 0; right: auto; width: 640px; height: 360px !important; }
html:not(.mobile) #stage.rail .live.fixed > .lv-main .pg-card { top: 0 !important; left: 672px; right: 0; bottom: 0 !important; height: auto; padding: 22px 28px !important; }
html:not(.mobile) #stage.rail .live.fixed > .lv-groups { top: 476px !important; left: 40px !important; width: 300px !important; bottom: 32px !important; }
html:not(.mobile) #stage.rail .live.fixed > .lv-list { top: 476px !important; left: 364px !important; right: 48px !important; width: auto !important; bottom: 32px !important; padding: 0 !important; border: 0 !important; }
html:not(.mobile) #stage.rail .live.fixed > .lv-list .lv-head { margin: 0 0 4px 8px; }
html:not(.mobile) #stage.rail .live.fixed .ch-list { height: 486px !important; padding: 4px 4px !important; }
html:not(.mobile) #stage.rail .live.fixed .ch { position: relative; height: 72px !important; }
html:not(.mobile) #stage.rail .live.fixed .ch-tx { -webkit-flex: none; flex: none; width: 300px; }
html:not(.mobile) #stage.rail .live.fixed .ch-now { display: none; }
html:not(.mobile) #stage.rail .lv-fs-top .lv-fs-brand { display: none; }
.ch-tl { display: none; }
html:not(.mobile) #stage.rail .live.fixed .ch-tl { display: block; position: absolute; left: 470px; right: 10px; top: 8px; bottom: 8px; }
.ch-tl .gp { position: absolute; top: 0; bottom: 0; box-sizing: border-box; padding: 6px 12px; border-left: 3px solid #0C1120; border-radius: 10px; background: #131A2B; overflow: hidden; white-space: nowrap; }
.ch-tl .gp b { display: block; font-size: 20px; font-weight: 600; color: #8A92AC; overflow: hidden; text-overflow: ellipsis; }
.ch-tl .gp span { display: block; font: 500 16px "JetBrains Mono", Consolas, monospace; color: #5E6784; }
.ch-tl .gp.now { background: #1B2338; }
.ch-tl .gp.now b { color: #EEF0F7; }
.ch-tl .gp.past b { color: #5E6784; }
.live.fixed .ch.focused .ch-tl .gp.now { background: #26304A; }
.lxg-times { display: none; }
html:not(.mobile) #stage.rail .live.fixed .lxg-times { display: block; position: absolute; left: 0; right: 0; top: 6px; height: 30px; }
.lxg-times span { position: absolute; top: 0; font: 500 18px "JetBrains Mono", Consolas, monospace; color: #8A92AC; }
.lxg-now { display: none; }
html:not(.mobile) #stage.rail .live.fixed .lxg-now { display: block; position: absolute; z-index: 4; top: 36px; bottom: 0; width: 3px; margin-left: -1px; background: #FFB547; box-shadow: 0 0 12px rgba(255,181,71,.6); pointer-events: none; }

/* ===== Luma Play: Filmes e Séries com painel lateral =====
   Categorias: coluna fina de 72px (nome da categoria na vertical) enquanto o foco está nas capas; com o foco nelas,
   abrem para 360px por cima da grade. Grade com 4 capas por fileira; painel do título à direita (480px). */
html:not(.mobile) #stage.rail .vod > .lv-groups { left: 40px !important; top: 40px !important; bottom: 40px !important; width: 360px !important; z-index: 6;
  box-shadow: 30px 0 60px rgba(0,0,0,.55); }
html:not(.mobile) #stage.rail .vod.cats-min > .lv-groups { -webkit-transform: translateX(-328px); transform: translateX(-328px); box-shadow: none; }
html:not(.mobile) #stage.rail .vod.cats-min > .lv-groups:after { content: "◀"; display: block; position: absolute; z-index: 3; top: 0; bottom: 0; right: 0; left: auto; width: 72px; height: auto; padding-top: 26px; box-sizing: border-box;
  text-align: center; font-size: 22px; color: #FFB547; background: #131A2B; border-radius: 0 22px 22px 0; }
html:not(.mobile) #stage.rail .vod.cats-min > .lv-groups:before { content: attr(data-cur); position: absolute; z-index: 4; right: 22px; top: 74px; white-space: nowrap;
  -webkit-writing-mode: vertical-rl; writing-mode: vertical-rl; font: 700 24px "Manrope",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; letter-spacing: .04em; color: #EEF0F7; }
html:not(.mobile) #stage.rail .vod .grid.vod-grid { margin-left: 0 !important; left: 0 !important; }
html:not(.mobile) #stage.rail .vod > .lv-top, html:not(.mobile) #stage.rail .vod .lv-fs-top { display: none !important; }
html:not(.mobile) #stage.rail .vod > .vod-main { left: 136px !important; right: 40px !important; top: 40px !important; bottom: 0 !important; padding: 0 !important; }
.vg-head { display: none; }
html:not(.mobile) #stage.rail .vod .vg-head { display: -webkit-flex; display: flex; -webkit-align-items: baseline; align-items: baseline; height: 76px; width: 1120px; }
html:not(.mobile) #stage.rail .vod .vg-head b { font: 800 46px "Bricolage Grotesque",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; letter-spacing: -1px; margin-right: 18px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 700px; }
html:not(.mobile) #stage.rail .vod .vg-head span { font-size: 24px; }
html:not(.mobile) #stage.rail .vod .vg-head .sort-btn { position: static !important; margin-left: auto; height: 56px; font-size: 22px; }
html:not(.mobile) #stage.rail .vod .grid.vod-grid { width: 1140px !important; height: 940px !important; padding: 10px 10px 30px !important; }
html:not(.mobile) #stage.rail .vod .grid.vod-grid > .poster, html:not(.mobile) #stage.rail .vod .grid.vod-grid > .poster:nth-child(n) { width: 255px !important; height: auto !important; margin: 0 26px 26px 0 !important; }
html:not(.mobile) #stage.rail .vod .grid.vod-grid > .poster:nth-child(4n) { margin-right: 0 !important; }
html:not(.mobile) #stage.rail .vod .grid.vod-grid > .poster .art { height: 382px !important; }
html:not(.mobile) #stage.rail .vod .grid.vod-grid > .poster .cap { font-size: 22px !important; }
/* Painel do título em foco */
html:not(.mobile) #stage.rail .vod .vod-bg { position: absolute !important; left: auto !important; right: 0 !important; top: 0 !important; width: 480px !important; height: 300px !important; bottom: auto !important;
  border-radius: 26px 26px 0 0; z-index: 1; -webkit-filter: none !important; filter: none !important; -webkit-transform: none !important; transform: none !important; opacity: 1 !important; background-color: #1B2338; }
html:not(.mobile) #stage.rail .vod .vod-bg:after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 160px; background: linear-gradient(rgba(19,26,43,0), #131A2B); }
html:not(.mobile) #stage.rail .vod .vod-info { position: absolute !important; left: auto !important; right: 0 !important; top: 0 !important; bottom: 40px !important; width: 480px !important; height: auto !important;
  padding: 250px 34px 30px !important; box-sizing: border-box; border-radius: 26px; background: #131A2B; border: 2px solid #262F48; overflow: visible; z-index: auto !important; }
html:not(.mobile) #stage.rail .vod .vod-info > * { position: relative; z-index: 2; }
html:not(.mobile) #stage.rail .vod .vod-info h1 { font: 800 44px/1.02 "Bricolage Grotesque",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif !important; letter-spacing: -1px; white-space: normal !important; margin: 0 0 12px; }
html:not(.mobile) #stage.rail .vod .vod-info .meta { font-size: 22px; margin: 0 0 16px; color: #8A92AC; white-space: normal; }
html:not(.mobile) #stage.rail .vod .vod-info .vi-plot { font-size: 22px; line-height: 1.5; color: #C9CDDC; max-height: 9em; overflow: hidden; display: block; -webkit-line-clamp: none; }
html:not(.mobile) #stage.rail .vod .vod-info.is-cat { padding-top: 40px !important; }
.vi-acts { display: none; }
html:not(.mobile) #stage.rail .vod .vi-acts { display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; position: absolute !important; left: 34px; right: 34px; bottom: 30px; }
html:not(.mobile) #stage.rail .vod .vi-acts[hidden] { display: none; }
html:not(.mobile) #stage.rail .vod .vi-acts .btn { height: 68px; margin: 12px 0 0; width: 100%; font-size: 24px; }

/* ===== Luma Play: página da série =====
   Esquerda (96–800px): capa, dados e botões; embaixo deles as temporadas numa coluna vertical.
   Direita (860px até a margem): episódios em lista vertical com imagem, nome, duração e resumo. */
html:not(.mobile) .detail.series .detail-body { position: absolute; top: 0; right: 0; bottom: 0; left: 0; padding: 0 !important; overflow: hidden; }
html:not(.mobile) .detail.series .detail-top { position: absolute; left: 96px; top: 120px; width: 720px; margin: 0 !important; }
html:not(.mobile) .detail.series .detail-poster { width: 200px !important; height: 300px !important; margin-right: 36px; }
html:not(.mobile) .detail.series .detail-text h1 { font-size: 64px !important; letter-spacing: -2px; white-space: normal !important; }
html:not(.mobile) .detail.series .detail-text .d-plot, html:not(.mobile) .detail.series #d-plot { font-size: 22px; max-height: 4.4em; overflow: hidden; }
html:not(.mobile) .detail.series #d-cast, html:not(.mobile) .detail.series .detail-body .row:not(.ep-section) { display: none !important; }
.lxs-h { margin: 0 0 14px 4px; font-size: 20px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: #FFB547; }
html:not(.mobile) .detail.series .lx-seasons { position: absolute; left: 96px; top: 520px; bottom: 40px; width: 720px; margin: 0 !important; overflow: hidden; display: block; }
.lxs-season { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; width: 100%; height: 76px; margin: 0 0 10px; padding: 0 24px; box-sizing: border-box; border-radius: 16px;
  background: rgba(19,26,43,.85); border: 2px solid #262F48; color: #EEF0F7; text-align: left; font-size: 26px; }
.lxs-season b { -webkit-flex: 1; flex: 1; font-weight: 700; }
.lxs-season span { font-size: 20px; color: #8A92AC; }
.lxs-season.on { box-shadow: inset 6px 0 0 #FFB547; border-color: #3A4566; }
.lxs-season.focused { background: #FFB547 !important; border-color: #FFB547 !important; color: #1A1205 !important; box-shadow: 0 0 0 6px rgba(255,181,71,.2) !important; }
.lxs-season.focused span { color: rgba(26,18,5,.7); }
html:not(.mobile) .detail.series .ep-section { position: absolute; left: 860px; right: 80px; top: 120px; bottom: 30px; margin: 0 !important; padding: 0 !important; }
html:not(.mobile) .detail.series #ep-row { display: block !important; height: 870px; overflow: hidden; padding: 6px 8px 30px !important; white-space: normal; }
html:not(.mobile) .detail.series #ep-row > .poster[data-ep] { position: relative; display: block; width: auto !important; height: 168px; margin: 0 0 14px !important; padding: 16px 20px 0 300px; box-sizing: border-box;
  border-radius: 18px; background: rgba(19,26,43,.85); border: 2px solid #262F48; -webkit-transform: none !important; transform: none !important; }
html:not(.mobile) .detail.series #ep-row > .poster[data-ep] .art { position: absolute; left: 14px; top: 14px; width: 266px !important; height: 136px !important; margin: 0; border-radius: 12px; -webkit-transform: none !important; transform: none !important; box-shadow: none !important; }
html:not(.mobile) .detail.series #ep-row > .poster[data-ep] .ep-n { font-size: 40px; }
html:not(.mobile) .detail.series #ep-row > .poster[data-ep] .cap { margin: 0; font-size: 26px !important; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-height: none; height: auto; }
html:not(.mobile) .detail.series #ep-row > .poster[data-ep] .sub { margin: 2px 0 6px; font: 500 19px "JetBrains Mono", Consolas, monospace; color: #8A92AC; }
.ep-plot { display: none; }
html:not(.mobile) .detail.series .ep-plot { display: block; font-size: 20px; line-height: 1.4; color: #A9B0C5; max-height: 2.8em; overflow: hidden; }
html:not(.mobile) .detail.series #ep-row > .poster[data-ep].focused { background: #1B2338; border-color: #FFB547; box-shadow: 0 0 0 6px rgba(255,181,71,.2) !important; }
html:not(.mobile) .detail.series #d-about { display: none !important; }
html:not(.mobile) .detail.series #ep-row { margin-left: 0 !important; padding-left: 4px !important; padding-right: 4px !important; }

/* Ao vivo: os botões do cartão "Agora" ficam embaixo à direita, e o "A seguir" ocupa só o lado esquerdo (não passam por cima). */
html:not(.mobile) #stage.rail .live.fixed .lv-main .lv-acts { left: auto !important; right: 28px !important; bottom: 22px !important; -webkit-justify-content: flex-end; justify-content: flex-end; }
html:not(.mobile) #stage.rail .live.fixed .lv-main .lv-acts .lv-bt { margin: 0 0 0 12px; }
html:not(.mobile) #stage.rail .live.fixed .lv-main .lv-up { margin-right: 460px; }
/* Painel de Filmes e Séries: imagem limpa em cima (sem a sombra lateral herdada) e o título começa embaixo dela. */
html:not(.mobile) #stage.rail .vod .vod-bg:after { top: auto !important; height: 90px !important; background: linear-gradient(rgba(19,26,43,0), #131A2B) !important; }
html:not(.mobile) #stage.rail .vod .vod-bg:before { display: none !important; }
html:not(.mobile) #stage.rail .vod .vod-info { padding-top: 322px !important; }
/* Página da série: coluna da esquerda em fluxo (capa e dados, botões, temporadas um embaixo do outro), sem sobrepor. */
html:not(.mobile) .detail.series .detail-top { position: relative !important; left: auto; top: auto; margin: 110px 0 0 96px !important; width: 720px; }
html:not(.mobile) .detail.series .lx-seasons { position: relative !important; left: auto; top: auto; bottom: auto; margin: 34px 0 0 96px !important; max-height: 400px; }
html:not(.mobile) .detail.series .detail-text { min-width: 0; }
html:not(.mobile) .detail.series .detail-text .actions { -webkit-flex-wrap: wrap; flex-wrap: wrap; }
html:not(.mobile) .detail.series .detail-text .actions .btn { height: 64px !important; padding: 0 26px !important; font-size: 24px !important; margin: 0 14px 12px 0 !important; }
html:not(.mobile) .detail.series #ep-row > .poster[data-ep] .cap, html:not(.mobile) .detail.series #ep-row > .poster[data-ep] .sub, html:not(.mobile) .detail.series .ep-plot {
  display: block !important; float: none !important; position: static !important; margin-left: 0 !important; padding-left: 0 !important; text-indent: 0 !important; text-align: left !important; width: auto !important; }
html:not(.mobile) .detail.series .ep-plot { max-width: none !important; }
html:not(.mobile) #stage.rail .vod > .vod-main { left: 100px !important; }

/* ===== Luma Play: Início em painel =====
   Topo com dois blocos: destaque (cartão, à esquerda) e "Ao vivo agora" (à direita, 560px) com os canais vistos por
   último, o programa no ar e a barrinha. Embaixo, as fileiras. */
.lx-top { display: -webkit-flex; display: flex; height: 520px; margin: 0 56px 34px 40px; }
.lx-top > .hero, html:not(.mobile) #stage.rail .home .lx-top > .hero { -webkit-flex: 1; flex: 1; min-width: 0; height: 520px; margin: 0 !important; }
.lx-top .hero-poster { display: none !important; }
.lx-top .hero-body, html:not(.mobile) #stage.rail .home .lx-top .hero-body { max-width: none; padding-right: 56px; }
.lx-top .hero h1 { font-size: 84px; }
.lx-live { -webkit-flex: none; flex: none; width: 560px; margin-left: 24px; padding: 26px 24px 20px; box-sizing: border-box; border-radius: 30px; background: #131A2B; border: 2px solid #262F48;
  display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; }
.lx-top.solo .lx-live { width: 100%; margin-left: 0; }
.lx-live-h { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; margin: 0 0 14px 4px; font: 800 30px "Bricolage Grotesque",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; letter-spacing: -.5px; }
.lx-live-h i { width: 12px; height: 12px; margin-right: 12px; border-radius: 50%; background: #FF5E48; box-shadow: 0 0 0 5px rgba(255,94,72,.2); }
.lx-lv { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; height: 70px; margin: 0 0 6px; padding: 0 14px 0 8px; border-radius: 16px; border: 2px solid transparent; }
.lx-lv .ch-tile { -webkit-flex: none; flex: none; width: 60px; height: 50px; margin-right: 16px; border-radius: 12px; }
.lx-lv-t { -webkit-flex: 1; flex: 1; min-width: 0; }
.lx-lv-t > b { display: block; font-size: 22px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lx-lv-now { display: block; font-size: 18px; color: #8A92AC; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lx-lv .ch-bar { height: 4px; margin-top: 5px; border-radius: 2px; background: rgba(255,255,255,.1); overflow: hidden; }
.lx-lv .ch-bar b { display: block; height: 100%; background: #FFB547; }
.lx-lv.focused { background: #1B2338; border-color: #FFB547; box-shadow: 0 0 0 6px rgba(255,181,71,.18) !important; }
.lx-live-all { margin-top: auto; height: 58px; border-radius: 14px; border: 2px solid #262F48; color: #EEF0F7; font-size: 22px; font-weight: 700; }
.lx-live-all.focused { background: #FFB547; border-color: #FFB547; color: #1A1205; }
html:not(.mobile) .tb-right { padding: 8px 18px; border-radius: 14px; background: rgba(7,10,19,.88); }

/* ===== Luma Play: Início estilo Netflix (TV, PC e web) =====
   O destaque é um outdoor na tela toda; as fileiras ficam na metade de baixo (a partir de 600px). Com o foco nas
   fileiras (classe rowmode) o outdoor mostra o título em foco, os botões somem e as fileiras sobem para 470px; a
   fileira em foco fica sempre no alto dessa área. Top 10 com o número grande vazado atrás de cada capa. */
html:not(.mobile) .page.home.nf { position: absolute; top: 0; right: 0; bottom: 0; left: 0; padding: 0 !important; overflow: hidden; }
html:not(.mobile) .home.nf .hero, html:not(.mobile) #stage.rail .home.nf .hero { position: absolute; top: 0; right: 0; bottom: 0; left: 0; height: auto; margin: 0 !important; border-radius: 0; box-shadow: none; overflow: hidden; background: #0A0E19; }
html:not(.mobile) .home.nf .hero-shade { background: linear-gradient(90deg, #0A0E19 0%, rgba(10,14,25,.88) 28%, rgba(10,14,25,.3) 62%, rgba(10,14,25,0) 82%), linear-gradient(0deg, #0A0E19 0%, rgba(10,14,25,.92) 40%, rgba(10,14,25,0) 68%) !important; }
html:not(.mobile) .home.nf .hero-poster { display: none !important; }
html:not(.mobile) .home.nf .hero-body, html:not(.mobile) #stage.rail .home.nf .hero-body { padding: 110px 60px 0; max-width: 1150px; }
html:not(.mobile) .home.nf .hero h1 { font-size: 100px; margin-top: 16px; }
html:not(.mobile) .home.nf .hero .plot { max-width: 860px; height: auto; max-height: 2.9em; overflow: hidden; }
html:not(.mobile) .home.nf .hero .actions { margin-top: 6px; }
html:not(.mobile) .home.nf .hero-dots { margin-left: 20px; }
html:not(.mobile) .home.nf.rowmode .hero .actions, html:not(.mobile) .home.nf.rowmode .hero-dots { opacity: 0; pointer-events: none; }
html:not(.mobile) .home.nf.rowmode .hero-body { padding-top: 90px; }
.nf-prog { display: none; }
html:not(.mobile) .home.nf .nf-prog { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; margin: 0 0 10px; font-size: 22px; color: #C9CDDC; }
html:not(.mobile) .home.nf .nf-prog:empty { display: none; }
html:not(.mobile) .home.nf .nf-prog .ch-bar { width: 420px; height: 6px; margin-right: 18px; border-radius: 3px; background: rgba(255,255,255,.18); overflow: hidden; }
html:not(.mobile) .home.nf .nf-prog .ch-bar b { display: block; height: 100%; background: #FFB547; }
.home .tg.top.live { background: #FF5E48 !important; color: #fff !important; }
html:not(.mobile) .home.nf .nf-rows { position: absolute; left: 0; right: 0; top: 640px; bottom: 0; overflow: hidden; padding: 0 0 0 60px; transition: top .2s ease; }
html:not(.mobile) .home.nf.rowmode .nf-rows { top: 470px; }
html:not(.mobile) .home.nf .nf-rows > .row { margin: 0 0 34px; }
html:not(.mobile) .home.nf .nf-rows > .row h2 { margin: 0 0 14px; font: 800 32px "Bricolage Grotesque",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; letter-spacing: -.5px; }
/* Top 10 */
.nf-tw { display: -webkit-flex; display: flex; -webkit-flex-direction: row-reverse; flex-direction: row-reverse; -webkit-align-items: flex-end; align-items: flex-end; -webkit-flex: none; flex: none; margin-right: 22px; }
.nf-tw > .poster { position: relative; z-index: 1; width: 188px !important; margin: 0 !important; }
.nf-tw > .poster .art { height: 282px !important; }
.nf-tw > .poster .cap { display: none !important; }
.nf-num { position: relative; z-index: 0; margin-right: -30px; font: 800 250px/.74 "Bricolage Grotesque",-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans, sans-serif; letter-spacing: -16px; color: #0A0E19; -webkit-text-stroke: 3px #5E6784; }
.nf-tw > .poster.focused + .nf-num { -webkit-text-stroke-color: #FFB547; color: rgba(255,181,71,.12); }
/* Seus canais */
.nf-ch { -webkit-flex: none; flex: none; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; width: 430px; height: 112px; margin-right: 18px; padding: 0 22px; box-sizing: border-box;
  border-radius: 18px; background: #131A2B; border: 2px solid #262F48; }
.nf-ch .ch-tile { width: 96px; height: 64px; margin-right: 18px; border-radius: 12px; }
.nf-ch .lx-lv-t > b { font-size: 24px; }
.nf-ch .lx-lv-now { font-size: 19px; }
.nf-ch.focused { background: #1B2338; border-color: #FFB547; box-shadow: 0 0 0 6px rgba(255,181,71,.18) !important; }
html:not(.mobile) .home.nf .nf-top .row-items { padding-left: 24px; }

/* Início Netflix: título e capas da fileira alinhados na mesma margem (60px) e com o título do outdoor. */
html:not(.mobile) .home.nf .nf-rows > .row h2 { margin-left: 0 !important; margin-right: 0 !important; }
html:not(.mobile) .home.nf .nf-rows .row-items { margin: 0 !important; padding: 14px 14px 20px 4px !important; }
html:not(.mobile) .home.nf .nf-top .row-items { padding-left: 28px !important; }
html:not(.mobile) .home.nf .nf-rows { padding-left: 60px; }
html:not(.mobile) .home.nf .hero-dots { display: none !important; }

/* Filmes e Séries: a grade ocupa toda a largura até o painel, com 5 capas por fileira (sem sobra de espaço). */
html:not(.mobile) #stage.rail .vod .grid.vod-grid { width: calc(100% - 504px) !important; box-sizing: border-box; }
html:not(.mobile) #stage.rail .vod .vg-head { width: calc(100% - 504px) !important; }
html:not(.mobile) #stage.rail .vod .grid.vod-grid > .poster, html:not(.mobile) #stage.rail .vod .grid.vod-grid > .poster:nth-child(n) { width: 18.2% !important; margin: 0 2.25% 24px 0 !important; }
html:not(.mobile) #stage.rail .vod .grid.vod-grid > .poster:nth-child(4n) { margin-right: 2.25% !important; }
html:not(.mobile) #stage.rail .vod .grid.vod-grid > .poster:nth-child(5n) { margin-right: 0 !important; }
html:not(.mobile) #stage.rail .vod .grid.vod-grid > .poster .art { height: 318px !important; }
html:not(.mobile) #stage.rail .vod .grid.vod-grid > .poster .cap { font-size: 20px !important; }
/* Folga no fim da fileira: o cartão em foco sempre para alinhado na margem (nenhum cartão cortado pela metade). */
html:not(.mobile) .home.nf .nf-rows .row-items:after { content: ""; display: block; -webkit-flex: none; flex: none; width: 1800px; height: 1px; }

/* Início Netflix: o título fica numa linha só e diminui em degraus quando é comprido (fitLine); sinopse em 2 linhas.
   Assim o bloco de cima nunca invade as fileiras. */
html:not(.mobile) .home.nf .hero h1 { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 1500px; }
html:not(.mobile) .home.nf .hero h1.t-md { font-size: 80px; letter-spacing: -2px; }
html:not(.mobile) .home.nf .hero h1.t-sm { font-size: 66px; letter-spacing: -1.5px; }
html:not(.mobile) .home.nf .hero h1.t-xs { font-size: 56px; letter-spacing: -1px; }
html:not(.mobile) .home.nf .hero h1.t-xxs { font-size: 48px; letter-spacing: -1px; }
html:not(.mobile) .home.nf .hero h1.t-wrap { white-space: nowrap; }
html:not(.mobile) .home.nf .hero .plot { margin: 12px 0 18px; max-height: 2.9em; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
html:not(.mobile) .home.nf .hero h1.t-xxs.t-wrap { font-size: 60px; line-height: 1; white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; text-overflow: clip; max-width: 1100px; }
/* Fileiras do Início: 30px de folga à esquerda (o cartão em foco cresce e ganha o anel âmbar sem ser cortado);
   a margem negativa mantém os cartões alinhados com o título da fileira. */
html:not(.mobile) .home.nf .nf-rows .row-items { margin-left: -30px !important; padding: 18px 14px 22px 30px !important; }
/* Top 10: cada número ocupa uma caixa fixa de 150px, alinhado à direita, encostando na capa (o 1 não some atrás dela). */
html:not(.mobile) .home.nf .nf-top .row-items { padding-left: 30px !important; }
.nf-num { width: 150px; text-align: right; margin-right: -22px; letter-spacing: -10px; }
/* Uma fileira por vez com o foco nas fileiras (Meza 14/10): a área de baixo começa em 580px e cada fileira ocupa a
   altura toda dela, então a de baixo não aparece cortada; ▼ traz a próxima inteira. No outdoor, a primeira aparece
   pela metade embaixo, como convite para descer. */
html:not(.mobile) .home.nf.rowmode .nf-rows { top: 580px; }
html:not(.mobile) .home.nf .nf-rows > .row { min-height: 500px; box-sizing: border-box; }
.nf-num { width: auto; min-width: 150px; padding-right: 14px; margin-right: -20px; letter-spacing: -12px; box-sizing: border-box; }
.nf-num { width: 150px; min-width: 0; padding-right: 0; margin-right: -8px; letter-spacing: 0; text-align: right; }
.nf-num.two { font-size: 170px; letter-spacing: -10px; padding-right: 10px; }
.nf-num { margin-right: 6px; }

/* Início: duas fileiras inteiras com o foco nas fileiras (Meza 14/10). Cada fileira tem 360px de altura e a área de
   baixo começa em 360px, então a atual e a de baixo aparecem inteiras e a terceira fica fora. Capas menores no
   Início (150x225; cartões largos 320x180) e o outdoor um pouco mais alto, para tudo caber. */
html:not(.mobile) .home.nf.rowmode .nf-rows { top: 360px; }
html:not(.mobile) .home.nf .nf-rows > .row { height: 360px; min-height: 0; margin: 0 !important; }
html:not(.mobile) .home.nf .nf-rows > .row h2 { font-size: 28px; margin-bottom: 4px; }
html:not(.mobile) .home.nf .nf-rows .row-items { padding-top: 16px !important; padding-bottom: 16px !important; }
html:not(.mobile) .home.nf .row-items > .poster { width: 150px !important; margin-right: 22px !important; }
html:not(.mobile) .home.nf .row-items > .poster .art { height: 225px !important; }
html:not(.mobile) .home.nf .row-items > .poster.wide { width: 320px !important; }
html:not(.mobile) .home.nf .row-items > .poster.wide .art { height: 180px !important; }
html:not(.mobile) .home.nf .row-items > .poster .cap { font-size: 19px !important; margin-top: 8px; }
html:not(.mobile) .home.nf .row-items > .poster .sub { font-size: 16px !important; }
html:not(.mobile) .home.nf .nf-tw > .poster { width: 150px !important; }
html:not(.mobile) .home.nf .nf-tw > .poster .art { height: 225px !important; }
html:not(.mobile) .home.nf .nf-num { width: 120px; font-size: 200px; }
html:not(.mobile) .home.nf .nf-num.two { font-size: 136px; }
html:not(.mobile) .home.nf.rowmode .hero-body { padding-top: 64px; }
html:not(.mobile) .home.nf.rowmode .hero h1 { font-size: 84px; }
html:not(.mobile) .home.nf.rowmode .hero h1.t-md { font-size: 70px; }
html:not(.mobile) .home.nf.rowmode .hero h1.t-sm { font-size: 60px; }
html:not(.mobile) .home.nf.rowmode .hero h1.t-xs, html:not(.mobile) .home.nf.rowmode .hero h1.t-xxs { font-size: 50px; }
html:not(.mobile) .home.nf.rowmode .hero .plot { margin: 8px 0 12px; }
html:not(.mobile) .home.nf.rowmode .nf-rows { top: auto; bottom: 0; height: 720px; }