:root{--bg:#050506;--panel:#0d0d10;--panel2:#141418;--line:#26262d;--text:#fff;--muted:#a3a3ad;--red:#e50914;--red2:#ff2c37;--shadow:0 18px 55px rgba(0,0,0,.45);--radius:18px}
*{box-sizing:border-box}html{background:var(--bg);color-scheme:dark}body{margin:0;background:radial-gradient(circle at 80% -10%,rgba(229,9,20,.13),transparent 35%),var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;min-height:100vh}button,input{font:inherit}button{cursor:pointer;color:inherit}img{max-width:100%}.hidden{display:none!important}.muted{color:var(--muted)}
.app-shell{min-height:100vh}.topbar{height:72px;padding:0 4vw;display:flex;align-items:center;gap:30px;position:sticky;top:0;z-index:40;background:linear-gradient(180deg,rgba(5,5,6,.98),rgba(5,5,6,.86));backdrop-filter:blur(16px);border-bottom:1px solid rgba(255,255,255,.055)}.brand{border:0;background:none;padding:0;display:flex;align-items:center}.brand img{height:34px;width:auto}.desktop-nav{display:flex;gap:6px;margin:auto}.desktop-nav button{border:0;background:transparent;color:#bdbdc5;padding:10px 14px;border-radius:10px;font-weight:800}.desktop-nav button:hover,.desktop-nav button.active{background:#18181d;color:#fff}.top-actions{display:flex;align-items:center;gap:8px}.round-btn{width:40px;height:40px;border-radius:50%;border:1px solid #2a2a31;background:#101014;display:inline-grid;place-items:center;font-weight:900}.round-btn:hover{border-color:#4a4a55;background:#18181d}.api-badge{font-size:11px;font-weight:900;letter-spacing:.11em;border:1px solid rgba(255,45,55,.38);background:rgba(229,9,20,.09);color:#ff8c92;padding:8px 10px;border-radius:999px}
.setup-view{min-height:calc(100vh - 72px);display:grid;place-items:center;padding:42px 18px}.setup-card{width:min(880px,100%);padding:54px;border:1px solid #26262d;border-radius:28px;background:linear-gradient(135deg,#111116,#09090b 66%);box-shadow:var(--shadow);position:relative;overflow:hidden}.setup-card:after{content:"";position:absolute;right:-180px;top:-180px;width:460px;height:460px;background:radial-gradient(circle,rgba(229,9,20,.22),transparent 68%);pointer-events:none}.setup-logo{width:min(430px,70%);display:block;margin:0 auto 12px}.setup-tag,.eyebrow{color:#ff5a62;font-weight:900;letter-spacing:.15em;font-size:11px}.setup-card h1{font-size:clamp(36px,7vw,72px);line-height:.94;margin:18px 0}.setup-card h1 em{font-style:normal;color:var(--red2)}.setup-card>p{color:#bdbdc6;max-width:680px;font-size:17px;line-height:1.65}.setup-card form{margin-top:28px;position:relative;z-index:2}.setup-card label{display:block;font-size:13px;font-weight:800;margin-bottom:8px}.playlist-input-row{display:flex;gap:10px}.playlist-input-row input{flex:1;min-width:0;background:#07070a;border:1px solid #303039;border-radius:14px;color:#fff;padding:16px 17px;outline:0}.playlist-input-row input:focus{border-color:#b91c24;box-shadow:0 0 0 3px rgba(229,9,20,.12)}.primary-btn,.secondary-btn,.ghost-btn,.danger-btn{border:0;border-radius:13px;padding:13px 18px;font-weight:900;display:inline-flex;align-items:center;justify-content:center;gap:9px}.primary-btn{background:linear-gradient(135deg,var(--red),var(--red2));color:#fff;box-shadow:0 12px 28px rgba(229,9,20,.22)}.primary-btn:hover{filter:brightness(1.08)}.secondary-btn{background:#19191f;border:1px solid #303038}.ghost-btn{background:rgba(15,15,18,.68);border:1px solid rgba(255,255,255,.19);backdrop-filter:blur(10px)}.danger-btn{background:#2a0c0f;border:1px solid #612027;color:#ff8b91}.full{width:100%;margin-top:10px}.remember{display:flex!important;gap:9px;align-items:center;margin-top:12px!important;color:#bbb!important;font-weight:600!important}.remember input{accent-color:var(--red)}.status-box{margin-top:18px;border:1px solid #33343c;background:#101116;padding:13px 15px;border-radius:12px;color:#d4d4da}.status-box.error{border-color:#76202a;color:#ff8c94}.status-box.ok{border-color:#1c6044;color:#8ce0b8}.privacy-note{margin-top:22px;padding:15px;border-radius:14px;background:#0b0b0e;border:1px solid #202026;color:#9b9ba4;font-size:13px;line-height:1.55}.privacy-note strong{color:#fff}
.library-view{padding-bottom:80px}.home-view{padding-bottom:40px}.hero{height:min(66vh,650px);min-height:470px;position:relative;overflow:hidden;border-bottom:1px solid #18181c}.hero-bg{position:absolute;inset:0;background:linear-gradient(90deg,#050506 20%,#101014 100%);background-size:cover;background-position:center 28%;transform:scale(1.01)}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,#050506 0%,rgba(5,5,6,.93) 26%,rgba(5,5,6,.42) 62%,rgba(5,5,6,.23) 100%),linear-gradient(0deg,#050506 0%,transparent 42%)}.hero-content{position:absolute;left:5vw;bottom:12%;z-index:2;width:min(680px,72vw)}.hero h1{font-size:clamp(42px,6.5vw,84px);line-height:.95;margin:10px 0 14px;text-wrap:balance}.hero-meta{display:flex;flex-wrap:wrap;gap:7px;margin:0 0 14px}.hero-meta span{border:1px solid rgba(255,255,255,.2);background:rgba(0,0,0,.26);padding:5px 9px;border-radius:7px;font-size:12px;font-weight:800}.hero-content>p:not(.eyebrow){font-size:16px;line-height:1.55;color:#d0d0d6;max-width:640px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.hero-actions{display:flex;gap:10px;margin-top:21px}.home-section{padding:26px 4vw 4px}.section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:15px}.section-head h2{margin:3px 0 0;font-size:clamp(21px,2.3vw,30px)}.link-btn{border:0;background:transparent;color:#ccc;font-weight:800}.link-btn:hover{color:#fff}.portal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.portal-card{min-height:150px;border:1px solid #282830;border-radius:20px;text-align:left;padding:22px;display:flex;align-items:flex-end;justify-content:space-between;overflow:hidden;position:relative;background:#111115}.portal-card:before{content:"";position:absolute;inset:0;opacity:.92}.portal-card.live:before{background:radial-gradient(circle at 95% 10%,rgba(229,9,20,.45),transparent 45%),linear-gradient(140deg,#19191f,#09090c)}.portal-card.movie:before{background:radial-gradient(circle at 90% 20%,rgba(255,69,80,.28),transparent 44%),linear-gradient(140deg,#17171d,#09090b)}.portal-card.series:before{background:radial-gradient(circle at 95% 25%,rgba(154,0,10,.38),transparent 46%),linear-gradient(140deg,#18181d,#08080a)}.portal-card>div,.portal-card>b{position:relative;z-index:1}.portal-card small{display:block;color:#ff676f;font-size:10px;letter-spacing:.16em;font-weight:900}.portal-card strong{display:block;font-size:31px;margin:3px 0}.portal-card span{color:#a7a7b0;font-size:13px}.portal-card b{font-size:34px;color:#ff5a62}.portal-card:hover{transform:translateY(-2px);border-color:#4a2328}.shelf{display:flex;gap:12px;overflow-x:auto;scrollbar-width:none;padding-bottom:8px;scroll-snap-type:x proximity}.shelf::-webkit-scrollbar{display:none}.shelf-card{flex:0 0 170px;scroll-snap-align:start;position:relative}.shelf-card .art{aspect-ratio:2/3;border-radius:13px;background:#121216;overflow:hidden;border:1px solid #25252d;position:relative}.shelf-card.live-card{flex-basis:240px}.shelf-card.live-card .art{aspect-ratio:16/9}.art img{width:100%;height:100%;object-fit:cover;display:block}.art:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.66),transparent 50%);opacity:.7}.shelf-card h3{font-size:13px;margin:8px 2px 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.shelf-card p{font-size:11px;color:#888891;margin:0 2px}.logo-fallback{width:100%;height:100%;display:grid;place-items:center;background:linear-gradient(135deg,#17171b,#0b0b0e);font-size:28px;font-weight:900;color:#777784}.rating-pill{position:absolute;left:7px;top:7px;z-index:2;background:rgba(0,0,0,.7);border:1px solid rgba(255,255,255,.18);font-size:10px;font-weight:900;border-radius:6px;padding:4px 6px}
.browse-view{padding:32px 4vw 80px}.browse-top{display:flex;justify-content:space-between;align-items:end;gap:22px}.browse-top h1{font-size:clamp(35px,5vw,64px);margin:3px 0 4px}.search-box{width:min(430px,42vw);height:48px;border:1px solid #2a2a31;background:#0d0d11;border-radius:13px;display:flex;align-items:center;padding:0 13px;gap:8px}.search-box input{flex:1;background:none;border:0;outline:0;color:#fff;min-width:0}.search-box button{border:0;background:none;color:#888;font-size:24px}.category-row-wrap{display:grid;grid-template-columns:42px 1fr 42px;gap:8px;align-items:center;margin-top:28px}.category-row{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;scroll-behavior:smooth}.category-row::-webkit-scrollbar{display:none}.category-chip{flex:0 0 auto;border:1px solid #282830;background:#111116;color:#c3c3ca;border-radius:999px;padding:10px 14px;font-size:12px;font-weight:800}.category-chip:hover,.category-chip.active{background:var(--red);border-color:var(--red);color:#fff}.cat-arrow{border:1px solid #2d2d35;background:#101014;width:42px;height:42px;border-radius:50%;font-size:25px}.browse-toolbar{display:flex;justify-content:space-between;gap:15px;margin:18px 2px 14px;color:#aaaab3;font-size:12px}.media-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:16px 12px}.media-card{min-width:0}.media-card button.card-main{display:block;width:100%;text-align:left;border:0;background:none;padding:0}.media-card .poster{aspect-ratio:2/3;border:1px solid #24242c;background:#111115;border-radius:12px;overflow:hidden;position:relative;box-shadow:0 8px 30px rgba(0,0,0,.2)}.media-card.tv .poster{aspect-ratio:16/10}.media-card .poster img{width:100%;height:100%;object-fit:cover}.media-card.tv .poster img{object-fit:contain;padding:15px;background:#0d0d10}.media-card:hover .poster{border-color:#713039;transform:translateY(-2px)}.media-card h3{font-size:13px;margin:8px 1px 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.media-card p{font-size:11px;color:#85858e;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.fav-mini{position:absolute;right:7px;top:7px;z-index:3;border:1px solid rgba(255,255,255,.2);background:rgba(0,0,0,.66);width:29px;height:29px;border-radius:50%;display:grid;place-items:center}.loading-grid,.empty-state{min-height:300px;display:grid;place-items:center;align-content:center;color:#aaa;text-align:center}.loading-grid p,.empty-state p{margin:8px 0}.empty-state h2{margin:7px 0 0}.spinner{display:inline-block;width:30px;height:30px;border:3px solid #333;border-top-color:var(--red);border-radius:50%;animation:spin .8s linear infinite}.load-more{display:block;margin:28px auto 0}@keyframes spin{to{transform:rotate(360deg)}}
.modal{position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.82);backdrop-filter:blur(7px);padding:24px;display:grid;place-items:center}.detail-card{position:relative;width:min(1050px,96vw);max-height:92vh;overflow:auto;background:#0b0b0e;border:1px solid #2a2a31;border-radius:24px;box-shadow:var(--shadow);min-height:580px}.detail-backdrop{position:absolute;inset:0 0 auto 0;height:440px;background:#111;background-size:cover;background-position:center 25%}.detail-shade{position:absolute;inset:0;background:linear-gradient(0deg,#0b0b0e 37%,rgba(11,11,14,.64) 67%,rgba(11,11,14,.2) 100%);pointer-events:none}.modal-close{position:absolute;z-index:4;right:16px;top:16px;width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,.2);background:rgba(0,0,0,.7)}.detail-content{position:relative;z-index:2;padding:300px 38px 38px;display:grid;grid-template-columns:190px 1fr;gap:28px;align-items:end}.detail-poster{width:190px;aspect-ratio:2/3;object-fit:cover;border-radius:14px;box-shadow:0 20px 50px rgba(0,0,0,.55)}.detail-copy h2{font-size:clamp(34px,5vw,64px);line-height:.98;margin:8px 0 12px}.detail-meta{display:flex;flex-wrap:wrap;gap:7px}.detail-meta span{font-size:12px;padding:5px 8px;border:1px solid #3a3a43;border-radius:6px;color:#ddd}.detail-plot{color:#c8c8cf;line-height:1.55;max-width:780px}.detail-actions{display:flex;gap:10px;margin-top:18px}.season-area{grid-column:1/-1;margin-top:25px}.season-tabs{display:flex;gap:8px;overflow:auto;padding-bottom:10px}.season-tabs button{border:1px solid #31313a;background:#121217;border-radius:999px;padding:9px 13px;white-space:nowrap}.season-tabs button.active{background:var(--red);border-color:var(--red)}.episode-list{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.episode{border:1px solid #25252d;background:#101014;padding:12px;border-radius:12px;display:flex;align-items:center;gap:12px;text-align:left}.episode b{width:42px;height:42px;border-radius:9px;background:#1b1b21;display:grid;place-items:center;color:#ff646b}.episode span{overflow:hidden}.episode strong,.episode small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.episode small{color:#888;margin-top:3px}
.player-modal{padding:0;background:#000}.player-shell{width:100%;height:100%;display:grid;grid-template-rows:66px 1fr 40px;background:#000}.player-bar,.player-foot{display:flex;align-items:center;justify-content:space-between;padding:0 18px;background:#09090c}.player-bar{border-bottom:1px solid #202026}.player-bar>div:last-child{display:flex;gap:7px}.now{display:flex;align-items:center;gap:10px;min-width:0}.now img{width:38px;height:38px;border-radius:8px;object-fit:contain;background:#111}.now div{min-width:0}.now small,.now strong{display:block}.now small{color:#ff5c65;font-size:9px;letter-spacing:.14em;font-weight:900}.now strong{max-width:60vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.video-stage{position:relative;display:grid;place-items:center;min-height:0}.video-stage video{width:100%;height:100%;object-fit:contain;background:#000}.player-loading,.player-error{position:absolute;inset:0;display:grid;place-items:center;align-content:center;text-align:center;background:#050505}.player-error div{width:48px;height:48px;border:1px solid #7c2930;background:#2a0b0e;border-radius:50%;display:grid;place-items:center;color:#ff6670;font-size:25px;font-weight:900}.player-error p{max-width:650px;color:#b6b6bd;line-height:1.55}.player-foot{border-top:1px solid #1b1b20;color:#888;font-size:11px}
.settings-card{width:min(520px,95vw);background:#0e0e12;border:1px solid #2b2b33;border-radius:20px;padding:24px;box-shadow:var(--shadow)}.settings-head{display:flex;align-items:center;justify-content:space-between}.settings-head img{height:32px;width:auto}.settings-card h2{font-size:30px}.settings-card label{display:block;color:#b8b8c0;font-size:12px;font-weight:900;margin:16px 0 7px}.url-box,.setting-info{background:#08080b;border:1px solid #25252c;border-radius:11px;padding:12px;color:#aaa;word-break:break-all;font-size:12px}.setting-info{margin-top:10px;line-height:1.5}.version{margin-top:18px;color:#666;text-align:center;font-size:11px}.toast{position:fixed;z-index:140;left:50%;bottom:28px;transform:translateX(-50%);background:#16161b;border:1px solid #34343d;box-shadow:var(--shadow);padding:11px 16px;border-radius:999px;font-weight:800;font-size:12px}.mobile-nav{display:none}
@media(max-width:1180px){.media-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:900px){.desktop-nav{display:none}.api-badge{display:none!important}.topbar{height:62px;padding:0 15px}.brand img{height:29px}.library-view{padding-bottom:72px}.hero{height:560px;min-height:0}.hero-content{left:18px;right:18px;width:auto;bottom:11%}.hero-shade{background:linear-gradient(0deg,#050506 0%,rgba(5,5,6,.82) 47%,rgba(5,5,6,.2) 100%),linear-gradient(90deg,rgba(5,5,6,.4),transparent)}.portal-grid{grid-template-columns:1fr}.portal-card{min-height:112px}.home-section{padding-left:15px;padding-right:15px}.browse-view{padding:25px 15px 95px}.browse-top{display:block}.search-box{width:100%;margin-top:17px}.category-row-wrap{grid-template-columns:1fr;margin-top:19px}.cat-arrow{display:none}.media-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px 9px}.mobile-nav{position:fixed;bottom:0;left:0;right:0;z-index:60;height:67px;background:rgba(8,8,10,.96);border-top:1px solid #25252c;display:grid;grid-template-columns:repeat(5,1fr);padding-bottom:env(safe-area-inset-bottom)}.mobile-nav button{border:0;background:none;color:#81818a;display:grid;place-items:center;align-content:center;gap:2px}.mobile-nav button span{font-size:18px}.mobile-nav button small{font-size:9px;font-weight:800}.mobile-nav button.active{color:#ff4d56}.detail-card{width:100%;height:100%;max-height:none;border-radius:0}.detail-content{grid-template-columns:110px 1fr;padding:250px 18px 25px;gap:15px}.detail-poster{width:110px}.detail-backdrop{height:350px}.detail-copy h2{font-size:34px}.episode-list{grid-template-columns:1fr}.setup-card{padding:28px 20px}.setup-logo{width:82%}.playlist-input-row{display:block}.playlist-input-row .primary-btn{width:100%;margin-top:9px}}
@media(max-width:600px){.top-actions .round-btn:first-of-type{display:none}.hero{height:510px}.hero h1{font-size:42px}.hero-content>p:not(.eyebrow){font-size:14px;-webkit-line-clamp:2}.hero-actions{flex-wrap:wrap}.hero-actions button{padding:12px 14px}.section-head h2{font-size:20px}.shelf-card{flex-basis:135px}.shelf-card.live-card{flex-basis:205px}.media-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.media-card h3{font-size:11px}.media-card p{font-size:10px}.browse-top h1{font-size:39px}.category-chip{padding:9px 12px;font-size:11px}.detail-content{display:block;padding-top:245px}.detail-poster{display:none!important}.detail-meta{margin-top:10px}.detail-plot{font-size:13px}.season-area{margin-top:20px}.player-bar{padding:0 10px}.player-bar .round-btn{width:36px;height:36px}.player-foot{padding:0 10px}.setup-card h1{font-size:42px}}
@media(max-width:390px){.media-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.shelf-card{flex-basis:128px}.hero h1{font-size:37px}.portal-card strong{font-size:27px}}

/* VelloxPlay 1.6 — refinamentos para Android/mobile */
.subscription-panel{margin:14px 0 16px;padding:15px;border:1px solid #2a2a32;border-radius:14px;background:linear-gradient(145deg,#111116,#09090c)}
.subscription-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.subscription-head small{display:block;color:#ff5c65;font-size:9px;letter-spacing:.15em;font-weight:900}.subscription-head strong{display:block;margin-top:3px;font-size:17px}.expiry-badge{flex:0 0 auto;border:1px solid #34343d;background:#17171c;color:#d5d5da;border-radius:999px;padding:6px 9px;font-size:10px;font-weight:900}.expiry-badge.ok{border-color:#275a3a;background:#0f2518;color:#75e39b}.expiry-badge.warn{border-color:#6b4d1e;background:#2a1d0a;color:#ffc568}.expiry-badge.expired{border-color:#6d242b;background:#2a0d11;color:#ff717a}.expiry-info{margin-top:12px;padding:11px 12px;border-radius:10px;background:#09090c;border:1px solid #232329;color:#c4c4ca;font-size:12px;line-height:1.5}.expiry-row{display:grid;grid-template-columns:1fr auto auto;gap:8px;align-items:center}.expiry-row input{height:43px;width:100%;border:1px solid #303038;border-radius:10px;background:#08080b;color:#fff;padding:0 11px;color-scheme:dark}.expiry-row .secondary-btn{height:43px;padding:0 14px}.expiry-row .round-btn{width:43px;height:43px}.expiry-note{display:block;margin-top:9px;color:#777781;line-height:1.45}

/* Pseudo-fullscreen funciona também dentro do Android WebView. */
.player-modal.app-fullscreen{padding:0!important;background:#000!important}.player-modal.app-fullscreen .player-shell{position:fixed;inset:0;z-index:160;grid-template-rows:1fr;background:#000}.player-modal.app-fullscreen .player-bar,.player-modal.app-fullscreen .player-foot{display:none}.player-modal.app-fullscreen .video-stage{position:fixed;inset:0;background:#000}.player-modal.app-fullscreen video{width:100vw;height:100vh;max-width:none;max-height:none;object-fit:contain;background:#000}.player-modal.app-fullscreen #fullscreenBtn{display:none}

/* Cards sempre ocupam a mesma caixa, mesmo com imagens de origens diferentes. */
.art img,.media-card .poster img,.detail-poster{display:block;object-position:center center}.media-card .poster,.shelf-card .art{contain:layout paint}.media-card.movie .poster,.media-card.series .poster{aspect-ratio:2/3}.media-card.tv .poster{aspect-ratio:16/10}.media-card .poster img{min-width:100%;min-height:100%}

@media(max-width:900px){
  .setup-view{padding:18px 12px}.setup-card{text-align:center;margin-inline:auto}.setup-card form,.setup-card .privacy-note{text-align:left}.setup-tag{margin-inline:auto}.setup-card h1{margin-left:auto;margin-right:auto}.setup-card>p{margin-left:auto;margin-right:auto}
  .portal-card{text-align:center;align-items:center;justify-content:center}.portal-card>div{width:100%}.portal-card>b{display:none}.portal-card small,.portal-card strong,.portal-card span{text-align:center}
  .settings-card{max-height:92vh;overflow:auto;padding:20px}.expiry-row{grid-template-columns:1fr auto}.expiry-row .round-btn{grid-column:2}.expiry-row .secondary-btn{grid-column:1}
}
@media(orientation:landscape) and (max-height:650px){
  .player-shell{grid-template-rows:50px 1fr 30px}.player-bar{padding:0 10px}.player-foot{padding:0 10px}.now img{width:31px;height:31px}.player-bar .round-btn{width:34px;height:34px}.player-foot{font-size:9px}
  .detail-card{max-height:100vh;border-radius:0}.detail-content{padding-top:180px}.detail-backdrop{height:260px}
  .mobile-nav{height:52px}.library-view{padding-bottom:55px}.home-section{padding-top:16px}.hero{height:350px}
}

/* VelloxPlay 1.7 — player único, rotação estável e imagens normalizadas */
html,body{max-width:100%;overflow-x:hidden}body.player-fullscreen{overflow:hidden!important;overscroll-behavior:none}.modal.player-modal{height:var(--app-height,100dvh);min-height:0;overflow:hidden}.player-shell{height:var(--app-height,100dvh);min-height:0}.video-stage{overflow:hidden;min-width:0;min-height:0;isolation:isolate}.video-stage video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#000;z-index:1;touch-action:manipulation}
.video-controls{position:absolute;z-index:30;left:0;right:0;bottom:0;display:flex;align-items:center;gap:9px;padding:34px max(14px,env(safe-area-inset-right)) max(12px,calc(10px + env(safe-area-inset-bottom))) max(14px,env(safe-area-inset-left));background:linear-gradient(0deg,rgba(0,0,0,.88) 0%,rgba(0,0,0,.5) 48%,transparent 100%);pointer-events:none}.video-controls>*{pointer-events:auto}.video-control{width:42px;height:42px;flex:0 0 42px;border-radius:50%;border:1px solid rgba(255,255,255,.22);background:rgba(10,10,12,.78);color:#fff;display:grid;place-items:center;font-size:18px;backdrop-filter:blur(8px)}.video-control:active{transform:scale(.94)}.primary-control{background:var(--red);border-color:var(--red)}.video-control-title{min-width:0;max-width:42vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px;font-weight:800;text-shadow:0 1px 3px #000}.video-control-spacer{flex:1}.volume-slider{width:min(145px,18vw);accent-color:var(--red)}.player-loading,.player-error{z-index:20}.player-error{padding:18px}.player-error+.video-controls{z-index:31}

/* Tela cheia do próprio app: um único botão, sempre visível, inclusive para sair. */
.player-modal.app-fullscreen{position:fixed!important;inset:0!important;width:100dvw!important;height:var(--app-height,100dvh)!important;z-index:200!important;padding:0!important;background:#000!important}.player-modal.app-fullscreen .player-shell{position:fixed!important;inset:0!important;width:100dvw!important;height:var(--app-height,100dvh)!important;z-index:201!important;display:block!important;background:#000!important}.player-modal.app-fullscreen .player-bar,.player-modal.app-fullscreen .player-foot{display:none!important}.player-modal.app-fullscreen .video-stage{position:fixed!important;inset:0!important;width:100dvw!important;height:var(--app-height,100dvh)!important;background:#000!important}.player-modal.app-fullscreen video{width:100dvw!important;height:var(--app-height,100dvh)!important;max-width:none!important;max-height:none!important;object-fit:contain!important}.player-modal.app-fullscreen #fullscreenBtn{display:grid!important;background:rgba(229,9,20,.88);border-color:rgba(255,255,255,.28)}.player-modal.app-fullscreen .video-control-title{max-width:55vw}

/* Caixas previsíveis. A imagem preenche a caixa; TV mantém logo sem corte. */
.shelf-card .art,.media-card .poster{position:relative;overflow:hidden}.shelf-card:not(.live-card) .art,.media-card .poster.art-poster{aspect-ratio:2/3!important}.shelf-card.live-card .art,.media-card.tv .poster{aspect-ratio:16/9!important}.shelf-card .art .media-img-poster,.media-card .poster .media-img-poster{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;min-width:0!important;min-height:0!important;max-width:none!important;max-height:none!important;padding:0!important;margin:0!important;object-fit:cover!important;object-position:center!important;background:#111!important}.shelf-card.live-card .art .media-img-tv,.media-card.tv .poster .media-img-tv{position:absolute!important;inset:9%!important;width:82%!important;height:82%!important;min-width:0!important;min-height:0!important;max-width:none!important;max-height:none!important;padding:0!important;margin:0!important;object-fit:contain!important;object-position:center!important;background:transparent!important}.shelf-card.live-card .art,.media-card.tv .poster{background:radial-gradient(circle at 50% 45%,#18181d 0%,#0b0b0e 72%)!important}.detail-poster{aspect-ratio:2/3!important;object-fit:cover!important;object-position:center!important;background:#111}

@media(max-width:900px){.library-view{padding-bottom:calc(78px + env(safe-area-inset-bottom))}.player-shell{grid-template-rows:58px minmax(0,1fr) 32px}.player-bar{padding:0 max(10px,env(safe-area-inset-left))}.player-foot{padding:0 max(10px,env(safe-area-inset-left))}.video-controls{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right));padding-bottom:max(10px,calc(8px + env(safe-area-inset-bottom))}.volume-slider{display:none}.video-control-title{max-width:38vw}.media-grid{align-items:start}.media-card{width:100%;min-width:0}.media-card .poster{width:100%}.shelf-card{min-width:0}}

@media(orientation:landscape) and (max-height:650px){body:not(.player-fullscreen) .browse-view{padding-top:14px;padding-bottom:66px}.browse-top{display:grid;grid-template-columns:1fr minmax(260px,42vw);align-items:end}.search-box{margin-top:0}.category-row-wrap{margin-top:12px}.media-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}.player-modal:not(.app-fullscreen) .player-shell{height:var(--app-height,100dvh);grid-template-rows:48px minmax(0,1fr) 28px}.player-modal:not(.app-fullscreen) .video-controls{padding-top:28px;padding-bottom:max(7px,env(safe-area-inset-bottom))}.player-modal:not(.app-fullscreen) .video-control{width:36px;height:36px;flex-basis:36px;font-size:15px}.detail-card{height:var(--app-height,100dvh);max-height:var(--app-height,100dvh);overflow:auto}.mobile-nav{height:50px}.library-view{padding-bottom:calc(58px + env(safe-area-inset-bottom))}}

@media(orientation:landscape) and (max-height:500px){.player-modal:not(.app-fullscreen) .player-bar,.player-modal:not(.app-fullscreen) .player-foot{display:none}.player-modal:not(.app-fullscreen) .player-shell{display:block}.player-modal:not(.app-fullscreen) .video-stage{position:absolute;inset:0}.video-control-title{display:none}.media-grid{grid-template-columns:repeat(7,minmax(0,1fr))}}


/* VelloxPlay 1.8 — cards maiores e controles que somem durante reprodução */
.shelf-card{flex-basis:190px}
.shelf-card.live-card{flex-basis:270px}
.shelf-card .art{display:block!important;width:100%!important;min-width:100%!important;padding:0!important;margin:0!important;appearance:none;-webkit-appearance:none}
.shelf-card .art.art-poster{aspect-ratio:2/3!important}
.shelf-card .art.art-tv{aspect-ratio:16/9!important}
.shelf-card .art img{display:block!important}
.video-controls{transition:opacity .22s ease,transform .22s ease;will-change:opacity,transform}
.player-modal.controls-hidden .video-controls{opacity:0;transform:translateY(14px);pointer-events:none!important}
.player-modal.controls-hidden .video-controls>*{pointer-events:none!important}
.player-modal.controls-hidden .video-stage{cursor:none}
.player-modal.controls-visible .video-controls{opacity:1;transform:none}
.player-modal .video-stage{touch-action:manipulation}
.player-modal .video-stage::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none}

@media(max-width:900px){
  .shelf-card{flex-basis:152px}
  .shelf-card.live-card{flex-basis:220px}
  .home-section{padding-left:16px;padding-right:16px}
}
@media(max-width:430px){
  .shelf-card{flex-basis:144px}
  .shelf-card.live-card{flex-basis:210px}
}
@media(max-width:370px){.shelf-card{flex-basis:136px}.shelf-card.live-card{flex-basis:198px}}

/* VelloxPlay 1.9 — Home: tamanhos explícitos para evitar colapso do aspect-ratio em WebView/navegadores */
.home-section .shelf{align-items:flex-start;min-height:338px}
.home-section .shelf-card{flex:0 0 210px!important;width:210px!important;min-width:210px!important;max-width:210px!important}
.home-section .shelf-card .art{display:block!important;box-sizing:border-box!important;width:210px!important;min-width:210px!important;max-width:210px!important;height:315px!important;min-height:315px!important;max-height:315px!important;aspect-ratio:auto!important;border-radius:14px!important;overflow:hidden!important;position:relative!important}
.home-section .shelf-card .art.art-poster{height:315px!important;min-height:315px!important;max-height:315px!important;aspect-ratio:auto!important}
.home-section .shelf-card.live-card{flex-basis:300px!important;width:300px!important;min-width:300px!important;max-width:300px!important}
.home-section .shelf-card.live-card .art,.home-section .shelf-card .art.art-tv{width:300px!important;min-width:300px!important;max-width:300px!important;height:169px!important;min-height:169px!important;max-height:169px!important;aspect-ratio:auto!important}
.home-section .shelf-card .art .media-img-poster{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;min-width:100%!important;min-height:100%!important;max-width:100%!important;max-height:100%!important;object-fit:cover!important;object-position:center!important}
.home-section .shelf-card.live-card .art .media-img-tv{position:absolute!important;inset:8%!important;width:84%!important;height:84%!important;min-width:0!important;min-height:0!important;max-width:none!important;max-height:none!important;object-fit:contain!important}
.home-section .shelf-card h3{font-size:14px!important;line-height:1.25;margin-top:10px}
.home-section .shelf-card p{font-size:11px!important;line-height:1.3;margin-top:3px}

@media (max-width:900px){
  .home-section .shelf{min-height:270px}
  .home-section .shelf-card{flex-basis:158px!important;width:158px!important;min-width:158px!important;max-width:158px!important}
  .home-section .shelf-card .art,.home-section .shelf-card .art.art-poster{width:158px!important;min-width:158px!important;max-width:158px!important;height:237px!important;min-height:237px!important;max-height:237px!important}
  .home-section .shelf-card.live-card{flex-basis:228px!important;width:228px!important;min-width:228px!important;max-width:228px!important}
  .home-section .shelf-card.live-card .art,.home-section .shelf-card .art.art-tv{width:228px!important;min-width:228px!important;max-width:228px!important;height:128px!important;min-height:128px!important;max-height:128px!important}
}
@media (max-width:430px){
  .home-section .shelf{min-height:248px;gap:10px}
  .home-section .shelf-card{flex-basis:146px!important;width:146px!important;min-width:146px!important;max-width:146px!important}
  .home-section .shelf-card .art,.home-section .shelf-card .art.art-poster{width:146px!important;min-width:146px!important;max-width:146px!important;height:219px!important;min-height:219px!important;max-height:219px!important}
  .home-section .shelf-card.live-card{flex-basis:210px!important;width:210px!important;min-width:210px!important;max-width:210px!important}
  .home-section .shelf-card.live-card .art,.home-section .shelf-card .art.art-tv{width:210px!important;min-width:210px!important;max-width:210px!important;height:118px!important;min-height:118px!important;max-height:118px!important}
}

/* VelloxPlay 2.0 — Minha Lista + auto-hide definitivo dos controles */
.portal-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.portal-card.favorites:before{background:radial-gradient(circle at 90% 15%,rgba(229,9,20,.34),transparent 45%),linear-gradient(140deg,#17171d,#09090b)}
.portal-card.favorites strong:before{content:'★ ';color:#ff5962}

/* O atributo data-controls é a fonte de verdade. Visibility impede o WebView de manter a barra clicável/visível. */
.player-modal[data-controls="hidden"] .video-controls{opacity:0!important;visibility:hidden!important;transform:translateY(18px)!important;pointer-events:none!important}
.player-modal[data-controls="hidden"] .video-controls *{pointer-events:none!important}
.player-modal[data-controls="visible"] .video-controls{opacity:1!important;visibility:visible!important;transform:translateY(0)!important}
.player-modal[data-controls="hidden"] .video-stage{cursor:none}

/* Minha Lista usa os mesmos cards padronizados das demais prateleiras. */
#homeFavoritesSection .shelf{min-height:338px}

@media(max-width:1180px) and (min-width:901px){.portal-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){
  .portal-grid{grid-template-columns:1fr}
  #homeFavoritesSection .shelf{min-height:270px}
  .mobile-nav{grid-template-columns:repeat(5,1fr)}
}
@media(max-width:430px){#homeFavoritesSection .shelf{min-height:248px}}


/* VelloxPlay 2.1 — fallback duro para cards da Home (WebView/cache/CSS antigos) */
#homeMovieShelf .shelf-card,#homeSeriesShelf .shelf-card,#homeFavoritesShelf .shelf-card,#recentShelf .shelf-card{flex:0 0 clamp(155px,13vw,220px)!important;width:clamp(155px,13vw,220px)!important;min-width:clamp(155px,13vw,220px)!important;max-width:clamp(155px,13vw,220px)!important}
#homeMovieShelf .art,#homeSeriesShelf .art,#homeFavoritesShelf .art,#recentShelf .art{display:block!important;width:100%!important;height:clamp(233px,19.5vw,330px)!important;min-height:clamp(233px,19.5vw,330px)!important;max-height:clamp(233px,19.5vw,330px)!important;padding:0!important;overflow:hidden!important;position:relative!important}
#homeLiveShelf .shelf-card{flex:0 0 clamp(220px,17vw,300px)!important;width:clamp(220px,17vw,300px)!important;min-width:clamp(220px,17vw,300px)!important;max-width:clamp(220px,17vw,300px)!important}
#homeLiveShelf .art{display:block!important;width:100%!important;height:clamp(124px,9.55vw,169px)!important;min-height:clamp(124px,9.55vw,169px)!important;max-height:clamp(124px,9.55vw,169px)!important;padding:0!important;overflow:hidden!important;position:relative!important}

/* VelloxPlay 2.2 — player definitivo: proporção segura, timeline/seek e controles autohide */
.video-stage video{object-fit:contain!important;object-position:center center!important;transform:none!important}
.video-stage video[data-fit="contain"]{object-fit:contain!important}
.video-stage video[data-fit="cover"]{object-fit:cover!important}
.video-stage video[data-fit="fill"]{object-fit:fill!important}

.video-controls{
  position:absolute!important;left:0!important;right:0!important;bottom:0!important;z-index:40!important;
  display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:8px!important;
  padding:42px max(14px,env(safe-area-inset-right)) max(12px,calc(10px + env(safe-area-inset-bottom))) max(14px,env(safe-area-inset-left))!important;
  background:linear-gradient(0deg,rgba(0,0,0,.94) 0%,rgba(0,0,0,.66) 52%,transparent 100%)!important;
  transition:opacity .2s ease,transform .2s ease,visibility .2s linear!important;
  pointer-events:auto!important;
}
.timeline-row,.control-row{display:flex;align-items:center;width:100%;min-width:0}
.timeline-row{gap:10px;height:24px}
.control-row{gap:9px}
.time-label{flex:0 0 auto;min-width:42px;font-size:11px;font-weight:800;font-variant-numeric:tabular-nums;color:#fff;text-shadow:0 1px 3px #000}
.duration-time{text-align:right}
.seek-bar{flex:1 1 auto;min-width:70px;height:18px;margin:0;accent-color:var(--red);cursor:pointer}
.seek-bar:disabled{opacity:.45;cursor:not-allowed}
.live-badge{font-size:11px;font-weight:900;color:#fff;letter-spacing:.08em;background:rgba(229,9,20,.88);padding:5px 9px;border-radius:999px}
.video-control{position:relative!important}
.seek-control small{position:absolute;font-size:8px;font-weight:900;line-height:1;bottom:8px;left:50%;transform:translateX(-50%)}
.fit-control{font-size:17px!important}

/* Nada do mouse/touch pode manter a barra visível depois do timer. */
.player-modal[data-controls="hidden"] .video-controls{
  opacity:0!important;visibility:hidden!important;transform:translateY(20px)!important;pointer-events:none!important;
}
.player-modal[data-controls="hidden"] .video-controls *{pointer-events:none!important}
.player-modal[data-controls="visible"] .video-controls{
  opacity:1!important;visibility:visible!important;transform:translateY(0)!important;pointer-events:auto!important;
}

/* Em fullscreen o vídeo ocupa todo o viewport, sempre sem distorção por padrão. */
.player-modal.app-fullscreen .video-stage,.player-modal.app-fullscreen video{inset:0!important;width:100dvw!important;height:var(--app-height,100dvh)!important}
.player-modal.app-fullscreen video[data-fit="contain"]{object-fit:contain!important}
.player-modal.app-fullscreen video[data-fit="cover"]{object-fit:cover!important}
.player-modal.app-fullscreen video[data-fit="fill"]{object-fit:fill!important}

@media(max-width:900px){
  .video-controls{gap:6px!important;padding-top:36px!important;padding-bottom:max(9px,calc(7px + env(safe-area-inset-bottom)))!important}
  .timeline-row{gap:7px}
  .time-label{font-size:10px;min-width:38px}
  .control-row{gap:7px}
  .video-control{width:40px!important;height:40px!important;flex:0 0 40px!important}
  .video-control-title{font-size:11px!important;max-width:28vw!important}
  .volume-slider{display:none!important}
}
@media(max-width:520px){
  .video-control-title{display:none!important}
  .control-row .video-control-spacer{display:block!important}
  .video-controls{padding-left:max(10px,env(safe-area-inset-left))!important;padding-right:max(10px,env(safe-area-inset-right))!important}
}
@media(orientation:landscape) and (max-height:550px){
  .video-controls{padding-top:24px!important;gap:4px!important;padding-bottom:max(5px,env(safe-area-inset-bottom))!important}
  .timeline-row{height:18px}
  .video-control{width:36px!important;height:36px!important;flex-basis:36px!important}
  .time-label,.live-badge{font-size:9px}
}


/* VelloxPlay 2.4 — entrada simplificada por usuário/senha */
.credentials-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;position:relative;z-index:2}
.credential-field label{margin-bottom:8px!important}
.credential-field input{width:100%;background:#07070a;border:1px solid #303039;border-radius:14px;color:#fff;padding:16px 17px;outline:0;min-height:54px}
.credential-field input:focus{border-color:#b91c24;box-shadow:0 0 0 3px rgba(229,9,20,.12)}
.password-field{position:relative}.password-field input{padding-right:52px}.password-toggle{position:absolute;right:7px;top:7px;width:40px;height:40px;border-radius:11px;border:0;background:#15151a;color:#d8d8de;font-size:18px;display:grid;place-items:center}.password-toggle:hover{background:#202027}
.login-actions{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:14px}.login-actions .remember{margin:0!important}.login-actions .primary-btn{min-width:150px}
.provider-hint{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-top:14px;padding:11px 13px;border:1px solid #222229;border-radius:12px;background:#09090c;color:#9e9ea8;font-size:12px}.provider-hint span{color:#74747f}.provider-hint strong{color:#fff}.provider-hint small{margin-left:auto;color:#767680}
@media(max-width:620px){.setup-card{padding:32px 20px}.credentials-grid{grid-template-columns:1fr}.login-actions{align-items:stretch;flex-direction:column}.login-actions .primary-btn{width:100%}.provider-hint small{width:100%;margin-left:0}.setup-card>p{text-align:center}.setup-tag{display:block;text-align:center}}

/* VelloxPlay iPhone Web App 1.0 */
:root{--red:#e30613;--red2:#ff1f2d}
html{-webkit-text-size-adjust:100%;touch-action:manipulation}
body{padding-top:env(safe-area-inset-top);background:radial-gradient(circle at 80% -10%,rgba(227,6,19,.15),transparent 35%),var(--bg)}
.topbar{padding-top:0}
.ios-install-tip{margin:16px 0 4px;padding:12px 14px;border:1px solid rgba(227,6,19,.35);border-radius:13px;background:rgba(227,6,19,.09);color:#d7d7dc;font-size:13px;line-height:1.5;position:relative;z-index:2}.ios-install-tip strong{color:#fff}.ios-install-tip b{color:#ff6069}
.login-tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:22px;padding:5px;border-radius:14px;background:#08080b;border:1px solid #25252c;position:relative;z-index:2}.login-tab{min-height:44px;border:0;border-radius:10px;background:transparent;color:#8f8f98;font-weight:900}.login-tab.active{background:#e30613;color:#fff;box-shadow:0 8px 22px rgba(227,6,19,.2)}
.m3u-login-fields{position:relative;z-index:2}.m3u-login-fields label{margin-top:0}.m3u-login-fields input,.pin-row input{width:100%;background:#07070a;border:1px solid #303039;border-radius:14px;color:#fff;padding:16px 17px;outline:0;min-height:54px}.m3u-login-fields input:focus,.pin-row input:focus{border-color:#e30613;box-shadow:0 0 0 3px rgba(227,6,19,.13)}
.settings-section{margin:14px 0 16px;padding:15px;border:1px solid #2a2a32;border-radius:14px;background:linear-gradient(145deg,#111116,#09090c)}.settings-section>small{display:block;color:#ff5963;font-size:9px;letter-spacing:.15em;font-weight:900}.settings-section>strong{display:block;margin-top:3px;font-size:17px}.settings-section>p{color:#8e8e98;font-size:12px;line-height:1.5;margin:8px 0 12px}.pin-row{display:grid;grid-template-columns:1fr auto;gap:8px}.pin-row input{min-height:44px;padding:10px 12px}.pin-row .secondary-btn{min-height:44px}.toggle-row{display:flex!important;align-items:center;gap:9px;margin:13px 0 6px!important;font-weight:700!important}.toggle-row input{accent-color:#e30613}
.mobile-nav{padding-bottom:max(env(safe-area-inset-bottom),6px);height:calc(67px + env(safe-area-inset-bottom))}.library-view{padding-bottom:calc(80px + env(safe-area-inset-bottom))}.toast{bottom:calc(28px + env(safe-area-inset-bottom))}
@media(max-width:620px){.login-tabs{margin-top:18px}.m3u-login-fields{text-align:left}.settings-card{padding-bottom:calc(20px + env(safe-area-inset-bottom))}.pin-row{grid-template-columns:1fr}.pin-row .secondary-btn{width:100%}}
@media(display-mode:standalone){.topbar{padding-top:max(0px,env(safe-area-inset-top));height:calc(62px + env(safe-area-inset-top))}.setup-view{min-height:100dvh;padding-top:18px}.mobile-nav{background:rgba(8,8,10,.99)}}

/* VelloxPlay Web App 1.1 — player mobile estável, botões normalizados e ajuda de instalação */
:root{--vellox-red:#e30613;--vellox-red-hover:#ff1825;--vellox-panel:#111116;--vellox-border:#2a2a32}
button,input{font:inherit;-webkit-tap-highlight-color:transparent}
.primary-btn,.secondary-btn,.ghost-btn,.danger-btn,.install-action{
  appearance:none;-webkit-appearance:none;border-radius:13px!important;min-height:46px!important;
  padding:11px 16px!important;font-weight:900!important;line-height:1!important;display:inline-flex!important;
  align-items:center!important;justify-content:center!important;gap:8px!important;white-space:nowrap!important;
  text-decoration:none!important;box-sizing:border-box!important
}
.primary-btn{background:var(--vellox-red)!important;border:1px solid var(--vellox-red)!important;color:#fff!important;box-shadow:0 10px 28px rgba(227,6,19,.2)!important}
.primary-btn:active{background:var(--vellox-red-hover)!important;transform:translateY(1px)}
.secondary-btn{background:#17171d!important;border:1px solid #34343d!important;color:#fff!important}
.ghost-btn{background:rgba(8,8,11,.68)!important;border:1px solid rgba(255,255,255,.2)!important;color:#fff!important}
.danger-btn{background:#321015!important;border:1px solid #7a232c!important;color:#ffb1b7!important}
.round-btn{appearance:none;-webkit-appearance:none;display:grid!important;place-items:center!important;padding:0!important;min-width:40px!important;width:40px!important;height:40px!important;border-radius:50%!important;line-height:1!important}
.full{width:100%!important;margin-top:8px!important}
.settings-section .secondary-btn+.secondary-btn{margin-top:8px!important}
.setting-info{border:1px solid #2b2b33;border-radius:11px;padding:10px 12px;background:#09090c;color:#a7a7b0;font-size:12px;line-height:1.45}

.install-banner{position:fixed;z-index:240;left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));top:max(12px,calc(env(safe-area-inset-top) + 8px));display:grid;grid-template-columns:46px minmax(0,1fr) auto 34px;align-items:center;gap:10px;padding:10px;background:rgba(13,13,17,.97);border:1px solid #34343d;border-radius:16px;box-shadow:0 18px 60px rgba(0,0,0,.45);backdrop-filter:blur(14px)}
.install-icon{width:46px;height:46px;border-radius:12px;overflow:hidden;background:#050505}.install-icon img{width:100%;height:100%;object-fit:cover}.install-copy{min-width:0}.install-copy strong,.install-copy span{display:block}.install-copy strong{font-size:13px}.install-copy span{margin-top:3px;color:#9a9aa4;font-size:11px;line-height:1.3}.install-action{min-height:38px!important;padding:9px 12px!important;background:var(--vellox-red)!important;border:0!important;color:white!important;font-size:11px!important}.install-dismiss{width:34px;height:34px;border:0;background:transparent;color:#aaa;font-size:25px;line-height:1}

/* O player sempre tem uma saída visível no Web App. */
.player-back-float{position:absolute;z-index:90;top:max(10px,env(safe-area-inset-top));left:max(10px,env(safe-area-inset-left));width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.28);background:rgba(0,0,0,.68);color:#fff;font-size:34px;line-height:35px;display:none;place-items:center;box-shadow:0 6px 20px rgba(0,0,0,.35)}
.player-modal.app-fullscreen .player-back-float{display:grid!important}
.player-modal[data-controls="hidden"] .player-back-float{opacity:.88!important;visibility:visible!important;pointer-events:auto!important}
.player-modal:not(.app-fullscreen) .player-bar{position:relative;z-index:95}

/* Evita que o player “estoure” o viewport após rotação/retorno do fullscreen. */
.modal.player-modal{width:100vw!important;max-width:100vw!important;height:var(--app-height,100dvh)!important;max-height:var(--app-height,100dvh)!important;inset:0!important}
.player-modal .player-shell{width:100%!important;max-width:100%!important;height:100%!important;max-height:100%!important;overflow:hidden!important}
.player-modal .video-stage{width:100%!important;max-width:100%!important;min-width:0!important;overflow:hidden!important}
.player-modal .video-stage video{max-width:100%!important;max-height:100%!important}

@media(max-width:700px){
  .install-banner{grid-template-columns:42px minmax(0,1fr) 34px}.install-icon{width:42px;height:42px}.install-action{grid-column:2/4;width:100%}.install-dismiss{grid-column:3;grid-row:1}
  .settings-card{width:100vw!important;max-width:100vw!important;max-height:var(--app-height,100dvh)!important;border-radius:0!important}
  .player-shell{grid-template-rows:58px minmax(0,1fr) 30px!important}
  .player-bar{min-width:0!important}.now{min-width:0!important}.now strong{max-width:55vw!important}
  .control-row{display:grid!important;grid-template-columns:40px 40px 40px 1fr 40px 40px!important;gap:6px!important}
  .control-row .video-control-spacer,.video-control-title,.volume-slider{display:none!important}
  .video-control{width:40px!important;height:40px!important;min-width:40px!important;max-width:40px!important;padding:0!important}
  .timeline-row{width:100%!important;min-width:0!important}.seek-bar{min-width:0!important;width:100%!important}
}
@media(orientation:landscape) and (max-height:520px){
  /* Não removemos mais a barra superior inteira: o usuário precisa sempre poder fechar o player. */
  .player-modal:not(.app-fullscreen) .player-bar{display:flex!important;height:46px!important}
  .player-modal:not(.app-fullscreen) .player-foot{display:none!important}
  .player-modal:not(.app-fullscreen) .player-shell{display:grid!important;grid-template-rows:46px minmax(0,1fr)!important}
  .player-modal:not(.app-fullscreen) .video-stage{position:relative!important;inset:auto!important}
}


/* VelloxPlay Web App 1.2 — login compacto e consistente em Android/iPhone */
.setup-wordmark{width:min(360px,82%)!important;height:auto!important;margin:0 auto 18px!important;object-fit:contain!important}
.login-tab{appearance:none!important;-webkit-appearance:none!important;width:100%!important;min-height:46px!important;border:1px solid transparent!important;border-radius:11px!important;background:#141419!important;color:#b7b7c0!important;font-weight:900!important;padding:0 12px!important;box-shadow:none!important}
.login-tab.active{background:#e30613!important;border-color:#e30613!important;color:#fff!important;box-shadow:0 8px 24px rgba(227,6,19,.22)!important}
.m3u-login-fields input,.credential-field input{font-size:16px!important}
.provider-hint{display:grid!important;grid-template-columns:auto minmax(0,1fr)!important;align-items:center!important;gap:3px 10px!important}
.provider-hint span{grid-column:1!important}.provider-hint strong{grid-column:2!important;min-width:0!important;overflow-wrap:anywhere!important}.provider-hint small{grid-column:1/-1!important;margin:4px 0 0!important;width:auto!important;line-height:1.35!important}
.remember{min-height:44px!important;display:flex!important;align-items:center!important;gap:10px!important}.remember input{width:20px!important;height:20px!important;flex:0 0 20px!important}
.setup-card .status-box{font-size:14px!important;line-height:1.45!important;text-align:center!important}
@media(max-width:700px){
  body{padding-top:0!important}
  .setup-view{min-height:100dvh!important;padding:12px 10px calc(24px + env(safe-area-inset-bottom))!important;display:block!important}
  .setup-card{width:100%!important;max-width:520px!important;margin:0 auto!important;padding:24px 18px 22px!important;border-radius:22px!important;overflow:hidden!important;text-align:center!important}
  .setup-wordmark{width:min(290px,78vw)!important;margin-bottom:14px!important}
  .setup-tag{display:inline-block!important;font-size:10px!important;margin-top:2px!important}
  .setup-card h1{font-size:clamp(36px,11vw,48px)!important;line-height:1.02!important;margin:14px 0 12px!important}
  .setup-card>p{font-size:14px!important;line-height:1.5!important;margin:0 auto!important;max-width:420px!important}
  .ios-install-tip{font-size:12px!important;margin:14px 0 0!important;padding:10px 12px!important;text-align:center!important}
  .login-tabs{margin-top:16px!important;gap:7px!important;padding:4px!important}
  .setup-card form{margin-top:16px!important;text-align:left!important}
  .credentials-grid{gap:10px!important}
  .credential-field label,.m3u-login-fields label{font-size:12px!important;margin-bottom:6px!important}
  .credential-field input,.m3u-login-fields input{min-height:50px!important;padding:13px 14px!important;border-radius:12px!important}
  .login-actions{margin-top:12px!important;gap:10px!important}
  .login-actions .primary-btn{min-height:50px!important;width:100%!important;font-size:16px!important}
  .provider-hint{margin-top:10px!important;padding:10px 12px!important;border-radius:11px!important;font-size:11px!important}
  .privacy-note{margin-top:14px!important;padding:12px!important;font-size:11px!important;text-align:left!important}
  .install-banner{top:max(8px,env(safe-area-inset-top))!important}
}
@media(max-width:390px){
  .setup-card{padding-left:14px!important;padding-right:14px!important;border-radius:18px!important}
  .setup-wordmark{width:min(260px,76vw)!important}
  .setup-card h1{font-size:36px!important}
  .login-tab{font-size:13px!important;padding:0 8px!important}
}
\n\n/* VelloxPlay Web App 1.3 — configurações simplificadas para clientes */
.client-settings{width:min(520px,96vw)}
.client-settings h2{margin:16px 0 14px}
.optional-setting{margin-top:12px;border-top:1px solid #26262d;padding-top:10px}
.optional-setting summary{cursor:pointer;color:#b8b8c0;font-size:12px;font-weight:800;list-style:none}
.optional-setting summary::-webkit-details-marker{display:none}
.optional-setting summary:after{content:'›';float:right;color:#e30613;font-size:18px;transition:transform .2s}
.optional-setting[open] summary:after{transform:rotate(90deg)}
.settings-actions-grid{display:grid;grid-template-columns:1fr;gap:8px}
.change-access-btn{margin-top:4px!important;border-color:#4a171b!important;background:#170b0d!important;color:#ff9da3!important}
.developer-only{display:none!important}
@media(max-width:620px){
  .client-settings{border-radius:0!important;width:100vw!important;max-width:100vw!important;min-height:var(--app-height,100dvh);padding:18px 16px calc(26px + env(safe-area-inset-bottom))!important}
  .client-settings h2{font-size:26px!important;margin-top:14px!important}
  .settings-section{padding:14px!important;margin:12px 0!important}
  .settings-section>strong{font-size:16px!important;margin-top:5px!important}
  .settings-section>p{margin:7px 0 10px!important}
  .settings-section .secondary-btn{min-height:48px!important}
}
@media(display-mode:standalone){
  .install-banner,.install-client-section{display:none!important}
  body{padding-top:env(safe-area-inset-top)}
}


/* VelloxPlay Web App 1.4 — boot sem flash de login */
.boot-view{min-height:100dvh;display:grid;place-items:center;padding:24px;background:#050505;position:fixed;inset:0;z-index:5000}
.boot-view.hidden{display:none!important}
.boot-card{display:flex;flex-direction:column;align-items:center;gap:18px;text-align:center}
.boot-card img{width:min(72vw,320px);height:auto;display:block}
.boot-card strong{font-size:14px;letter-spacing:.02em;color:#d7d7db}
.boot-spinner{width:30px;height:30px;border:3px solid #2a2a2f;border-top-color:#e30613;border-radius:50%;animation:velloxBootSpin .8s linear infinite}
@keyframes velloxBootSpin{to{transform:rotate(360deg)}}
:fullscreen .install-banner{display:none!important}
:-webkit-full-screen .install-banner{display:none!important}
:fullscreen .library-view,:-webkit-full-screen .library-view{min-height:100vh}

/* VelloxPlay Web App 1.5 — mobile compact + safe areas */
@media(max-width:900px){
  html,body,.app-shell{max-width:100vw;overflow-x:hidden}
  .topbar{
    box-sizing:border-box!important;
    height:calc(60px + env(safe-area-inset-top))!important;
    min-height:calc(60px + env(safe-area-inset-top))!important;
    padding:max(env(safe-area-inset-top),0px) 14px 0!important;
    gap:12px!important;
  }
  .brand{min-width:0!important;flex:1 1 auto!important}
  .brand img{height:30px!important;max-width:min(235px,68vw)!important;object-fit:contain!important;object-position:left center!important}
  .top-actions{flex:0 0 auto!important;gap:6px!important}
  #settingsBtn{display:inline-grid!important;width:46px!important;height:46px!important;min-width:46px!important;min-height:46px!important;font-size:20px!important;touch-action:manipulation!important;position:relative!important;z-index:2!important}

  .hero{
    height:min(430px,56dvh)!important;
    min-height:390px!important;
    max-height:430px!important;
  }
  .hero-bg{background-position:center 22%!important}
  .hero-content{left:18px!important;right:18px!important;bottom:7.5%!important;width:auto!important}
  .hero h1{font-size:clamp(32px,9.2vw,38px)!important;line-height:.98!important;margin:8px 0 11px!important;max-width:92%!important}
  .hero-meta{gap:5px!important;margin-bottom:10px!important}
  .hero-meta span{padding:4px 7px!important;font-size:10px!important}
  .hero-content>p:not(.eyebrow){font-size:13px!important;line-height:1.45!important;-webkit-line-clamp:2!important;max-width:95%!important}
  .hero-actions{gap:8px!important;margin-top:14px!important}
  .hero-actions button{min-height:44px!important;padding:10px 14px!important;font-size:13px!important}

  .home-section{padding:18px 15px 3px!important}
  .section-head{margin-bottom:11px!important}
  .section-head h2{font-size:19px!important}
  .portal-grid{gap:10px!important}
  .portal-card{min-height:94px!important;padding:15px 17px!important;border-radius:17px!important}
  .portal-card small{font-size:9px!important}
  .portal-card strong{font-size:25px!important;margin:1px 0!important}
  .portal-card span{font-size:11px!important}
  .portal-card b{font-size:28px!important}

  .shelf{gap:10px!important}
  .shelf-card{flex-basis:128px!important}
  .shelf-card.live-card{flex-basis:192px!important}
  .shelf-card h3{font-size:12px!important;margin-top:6px!important}
  .shelf-card p{font-size:10px!important}

  .library-view{padding-bottom:calc(88px + env(safe-area-inset-bottom))!important}
  .browse-view{padding-bottom:calc(102px + env(safe-area-inset-bottom))!important}
  .mobile-nav{
    height:calc(76px + env(safe-area-inset-bottom))!important;
    min-height:calc(76px + env(safe-area-inset-bottom))!important;
    padding:4px 4px env(safe-area-inset-bottom)!important;
    align-items:stretch!important;
  }
  .mobile-nav button{
    min-width:0!important;
    min-height:68px!important;
    padding:7px 2px 5px!important;
    gap:3px!important;
    touch-action:manipulation!important;
  }
  .mobile-nav button span{font-size:25px!important;line-height:1!important}
  .mobile-nav button small{font-size:10px!important;line-height:1.15!important;font-weight:900!important}

  .settings-card.client-settings{
    padding-top:max(18px,calc(env(safe-area-inset-top) + 10px))!important;
  }
  .settings-head{min-height:48px!important}
  .settings-head .round-btn{width:46px!important;height:46px!important;min-width:46px!important;min-height:46px!important}
}

@media(max-width:600px){
  .hero{height:min(410px,54dvh)!important;min-height:370px!important;max-height:410px!important}
  .hero h1{font-size:34px!important}
  .portal-card{min-height:90px!important}
}

/* Quando o Chrome entra em fullscreen real, o viewport cresce. Mantemos o layout compacto. */
@media(max-width:900px){
  :fullscreen .topbar,
  :-webkit-full-screen .topbar{
    height:calc(58px + env(safe-area-inset-top))!important;
    min-height:calc(58px + env(safe-area-inset-top))!important;
    padding-top:env(safe-area-inset-top)!important;
  }
  :fullscreen .hero,
  :-webkit-full-screen .hero{
    height:min(405px,52dvh)!important;
    min-height:360px!important;
    max-height:405px!important;
  }
  :fullscreen .portal-card,
  :-webkit-full-screen .portal-card{min-height:88px!important}
}

/* No atalho da Tela de Início o próprio app cuida das áreas do notch/gestos. */
@media(display-mode:standalone){
  body{padding-top:0!important}
  @media(max-width:900px){
    .topbar{padding-top:env(safe-area-inset-top)!important}
  }
}