@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@600;700;800&display=swap');
:root{--bg:#07111f;--surface:#0e1b2d;--text:#f5f9ff;--muted:#91a4bd;--blue:#1c8cff;--cyan:#53d9ff;--purple:#7357ff;--line:rgba(255,255,255,.1)}*{box-sizing:border-box}body{margin:0;font-family:'DM Sans',sans-serif;color:var(--text);background:var(--bg)}button,input,select{font:inherit}.hidden{display:none!important}.eyebrow{font-size:.72rem;letter-spacing:.17em;font-weight:800;color:var(--cyan)}h1,h2,h3{font-family:Manrope,sans-serif;margin:0}.primary-btn{border:0;color:#fff;background:linear-gradient(120deg,var(--blue),var(--purple));padding:14px 22px;border-radius:12px;font-weight:800;cursor:pointer;box-shadow:0 12px 28px rgba(28,140,255,.25)}.secondary-btn{display:block;margin:30px auto 60px;background:transparent;border:1px solid var(--line);color:#fff;padding:12px 22px;border-radius:12px;cursor:pointer}
.login-page{min-height:100vh;background:radial-gradient(circle at 15% 20%,rgba(28,140,255,.25),transparent 30%),radial-gradient(circle at 80% 80%,rgba(115,87,255,.18),transparent 35%),#07111f}.login-shell{min-height:100vh;display:grid;grid-template-columns:1.2fr .8fr;align-items:center;gap:8vw;max-width:1180px;margin:auto;padding:60px}.login-copy{max-width:650px}.brand-logo{width:185px;height:70px;object-fit:contain;object-position:left;margin-bottom:48px}.login-copy h1{font-size:clamp(3rem,6vw,5.8rem);line-height:.95;margin:14px 0 25px}.login-copy p{font-size:1.15rem;color:var(--muted);max-width:550px;line-height:1.7}.feature-row{display:flex;gap:12px;margin-top:36px}.feature-row span{background:rgba(255,255,255,.06);border:1px solid var(--line);border-radius:99px;padding:9px 15px;font-size:.85rem}.feature-row span:first-child{color:#68efb1}.login-card{background:rgba(14,27,45,.82);backdrop-filter:blur(20px);border:1px solid var(--line);border-radius:24px;padding:38px;box-shadow:0 30px 80px #0006}.login-card h2{font-size:2rem;margin:8px 0}.login-card p,.login-card small{color:var(--muted)}.login-card form{display:grid;gap:20px;margin:32px 0 22px}.login-card label{display:grid;gap:8px;font-size:.85rem;font-weight:600}.login-card input,.filters input,.filters select{width:100%;background:#091524;border:1px solid var(--line);color:#fff;border-radius:12px;padding:14px 15px;outline:none}.login-card input:focus,.filters input:focus{border-color:var(--blue);box-shadow:0 0 0 3px #1c8cff22}.password-wrap{position:relative}.password-wrap button{position:absolute;right:8px;top:7px;background:none;border:0;padding:8px;cursor:pointer}.form-error{min-height:20px!important;color:#ff8291!important;margin:0!important}
.topbar{height:72px;position:fixed;inset:0 0 auto;z-index:30;display:flex;align-items:center;padding:0 4vw;gap:26px;background:#07111fd6;backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}.topbar>img{width:115px;height:48px;object-fit:contain}.topbar nav{display:flex}.topbar nav button,.sidebar button{border:0;background:none;color:var(--muted);padding:10px 14px;cursor:pointer}.topbar nav button.active,.topbar nav button:hover{color:#fff}.top-actions{margin-left:auto;display:flex;align-items:center;gap:12px}.icon-btn,.avatar{border:1px solid var(--line);color:#fff;background:#ffffff0d;width:40px;height:40px;border-radius:12px;cursor:pointer}.avatar{border-radius:50%;background:linear-gradient(135deg,var(--blue),var(--purple));font-weight:800}.sidebar{position:fixed;z-index:40;top:72px;bottom:0;left:0;width:260px;background:#091524;border-right:1px solid var(--line);padding:30px 18px;display:flex;flex-direction:column;gap:6px;transform:translateX(-100%);transition:.25s}.sidebar.open{transform:none}.sidebar>img{width:72px;height:72px;object-fit:cover;border-radius:20px;margin:0 auto}.sidebar>strong{text-align:center;margin-bottom:22px}.sidebar button{text-align:left;border-radius:10px}.sidebar button:hover{color:#fff;background:#ffffff0f}.sidebar hr{width:100%;border:0;border-top:1px solid var(--line);margin:16px 0}.sidebar small{color:var(--muted);padding:0 14px}
#content{padding-top:72px;min-height:100vh}.hero{height:480px;position:relative;display:flex;align-items:flex-end;background:linear-gradient(90deg,#07111f 0%,#07111f66 55%,#07111f 100%),url('../../img/background.png') center 34%/cover}.hero-shade{position:absolute;inset:0;background:linear-gradient(0deg,#07111f,transparent 65%)}.hero-content{position:relative;padding:0 7vw 76px;max-width:700px}.hero-content h1{font-size:clamp(2.6rem,5vw,5rem);line-height:1;margin:12px 0 18px}.hero-content p{color:#cad6e5;font-size:1.05rem;margin:0 0 25px}.hero.compact{height:220px}.hero.compact .hero-content{padding-bottom:42px}.hero.compact h1{font-size:2.2rem}.catalog-head{padding:34px 6vw 20px;display:flex;justify-content:space-between;align-items:end;gap:20px}.catalog-head h2{font-size:2rem;margin-top:5px}.filters{display:flex;gap:10px}.filters input,.filters select{width:230px;padding:11px 13px}#rails{padding:10px 6vw 20px}.home-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.home-cards button{min-height:240px;text-align:left;background:linear-gradient(145deg,#10243d,#0b1728);border:1px solid var(--line);border-radius:20px;color:#fff;padding:25px;cursor:pointer;transition:.25s}.home-cards button:hover{transform:translateY(-5px);border-color:#53d9ff88}.home-cards img{display:block;height:72px;margin-bottom:35px}.home-cards span{display:block;font:700 1.5rem Manrope}.home-cards small{color:var(--muted)}.poster-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(155px,1fr));gap:26px 17px}.poster{min-width:0;cursor:pointer}.poster-image{aspect-ratio:2/3;position:relative;border-radius:14px;overflow:hidden;background:var(--surface);border:1px solid var(--line)}.poster-image img{width:100%;height:100%;object-fit:cover;transition:.3s}.poster-image button{position:absolute;left:12px;bottom:12px;width:42px;height:42px;border:0;border-radius:50%;background:#fff;color:#07111f;opacity:0;transition:.25s}.poster:hover img{transform:scale(1.04);filter:brightness(.7)}.poster:hover button{opacity:1}.poster h3{font-size:.94rem;margin:11px 2px 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.poster p{font-size:.78rem;color:var(--muted);margin:0 2px}.fallback{height:100%;display:grid;place-items:center;font:800 4rem Manrope;color:#53d9ff44;background:radial-gradient(circle,#1c8cff33,transparent)}.empty{grid-column:1/-1;padding:70px;text-align:center;color:var(--muted);display:grid;gap:8px}.loading{text-align:center;color:var(--muted);padding:30px}
.modal{position:fixed;z-index:100;inset:0;background:#000d;display:grid;place-items:center;padding:24px;backdrop-filter:blur(4px)}.modal-card{width:min(1020px,96vw);max-height:92vh;overflow:auto;background:#0a0a0c;border:1px solid #ffffff18;border-radius:10px;position:relative;box-shadow:0 35px 120px #000}.modal-close{position:absolute;z-index:4;right:18px;top:18px;background:#171719;color:#fff;border:1px solid #ffffff2a;width:40px;height:40px;border-radius:50%;font-size:1.4rem;cursor:pointer}.detail-backdrop{height:min(56vw,570px);min-height:370px;background-position:center 20%;background-size:cover;position:relative}.detail-backdrop:empty{background:radial-gradient(circle at 65% 35%,#183d67,#080d15 55%)}.detail-gradient{position:absolute;inset:0;background:linear-gradient(0deg,#0a0a0c 0%,transparent 58%),linear-gradient(90deg,#0a0a0ccc,transparent 65%)}.main-play{position:absolute;z-index:2;left:34px;bottom:38px;border:0;border-radius:5px;padding:12px 24px;background:#fff;color:#080808;font-weight:800;font-size:1rem;cursor:pointer}.main-play:hover{background:#ddd}.video-wrap{aspect-ratio:16/9;background:#000;position:relative;display:grid;place-items:center}.video-wrap video{width:100%;height:100%;background:#000}.video-wrap #playerMessage{position:absolute;max-width:520px;text-align:center;color:#d6d6d6;background:#0009;padding:14px 20px;border-radius:8px}.player-info{padding:10px 34px 36px;display:grid;grid-template-columns:minmax(0,1fr) 370px;gap:42px}.player-info h2{font-size:2.2rem;margin:8px 0 10px}.player-info p{color:#d2d2d2;line-height:1.65;font-size:.98rem}.player-meta{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}.player-meta span{color:#d8e4ee;border:1px solid #ffffff26;padding:4px 8px;border-radius:4px;font-size:.78rem}.player-info dl{color:#9b9b9b;font-size:.83rem}.player-info dl div{display:flex;gap:6px;margin:5px 0}.player-info dt{color:#666}.player-info dd{margin:0}.player-info #episodes{max-height:330px;overflow:auto;display:grid;gap:7px;padding-right:5px}.player-info #episodes h3{margin-bottom:7px}.player-info #episodes button{text-align:left;background:#1b1b1e;color:#eee;border:0;border-left:3px solid transparent;padding:11px 13px;border-radius:4px;cursor:pointer;display:grid;grid-template-columns:60px 1fr;gap:8px}.player-info #episodes button:hover{background:#28282c;border-left-color:var(--cyan)}.player-info #episodes button span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.toast{position:fixed;z-index:200;right:25px;bottom:25px;background:#fff;color:#07111f;padding:14px 18px;border-radius:12px;box-shadow:0 15px 50px #000}
.rail-section{margin-bottom:38px}.rail-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.rail-title h3{font-size:1.35rem}.rail-title button{background:none;border:0;color:var(--muted);cursor:pointer}.rail-title button:hover{color:#fff}.content-rail{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(150px,12.5vw);gap:9px;overflow-x:auto;overflow-y:hidden;padding:4px 2px 18px;scroll-snap-type:x proximity;scrollbar-width:thin}.content-rail .poster{scroll-snap-align:start}.content-rail .poster-image{border-radius:6px}.content-rail .poster:hover{position:relative;z-index:2}.content-rail .poster:hover .poster-image{transform:scale(1.035);box-shadow:0 14px 35px #000}.content-rail::-webkit-scrollbar{height:5px}.content-rail::-webkit-scrollbar-thumb{background:#ffffff28;border-radius:10px}
@media(max-width:800px){.login-shell{grid-template-columns:1fr;padding:28px}.login-copy{display:none}.topbar{padding:0 16px}.topbar nav,#userName{display:none}.hero{height:390px}.hero-content{padding:0 22px 45px}.catalog-head{align-items:stretch;flex-direction:column;padding:28px 20px 15px}.filters{flex-direction:column}.filters input,.filters select{width:100%}#rails{padding:10px 20px}.home-cards{grid-template-columns:1fr}.home-cards button{min-height:160px}.poster-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 10px}.content-rail{grid-auto-columns:minmax(135px,38vw)}.player-info{grid-template-columns:1fr}}
@media(max-width:480px){.poster-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.login-card{padding:27px}.login-shell{padding:18px}}
.app-page{background:#050505}.topbar{inset:0 auto 0 0;width:88px;height:100vh;padding:22px 0 18px;display:flex;flex-direction:column;gap:28px;background:#080808f2;border:0;border-right:1px solid #ffffff12;z-index:50}.topbar>img{width:52px;height:52px;border-radius:12px}.topbar nav{display:flex;flex:1;flex-direction:column;justify-content:center;gap:17px;width:100%}.topbar nav button{width:100%;height:54px;padding:0;display:grid;place-items:center;position:relative;color:#aaa}.topbar nav button span{font-size:1.45rem}.topbar nav button small{position:absolute;left:76px;background:#171719;color:#fff;padding:7px 10px;border-radius:4px;opacity:0;pointer-events:none;transform:translateX(-5px);transition:.2s;white-space:nowrap}.topbar nav button:hover small{opacity:1;transform:none}.topbar nav button.active{color:#fff}.topbar nav button.active:before{content:'';position:absolute;left:0;top:7px;bottom:7px;width:4px;background:#18a0fb}.top-actions{margin:0;display:flex;flex-direction:column;gap:10px}.top-actions #userName{display:none}.icon-btn,.avatar{background:#151515;border-color:#ffffff20}.sidebar{display:none}#content{padding:0 0 0 88px}.hero{height:min(68vw,720px);min-height:590px;background-color:#050505;background-position:center 20%;background-size:cover;align-items:center}.hero-shade{background:linear-gradient(90deg,#050505 0%,#050505ee 17%,#05050599 43%,transparent 72%),linear-gradient(0deg,#050505 0%,transparent 36%)}.hero-content{padding:40px 0 40px 5.5vw;max-width:650px}.hero-brand{display:flex;align-items:center;gap:10px;margin-bottom:20px}.hero-brand img{width:74px;height:34px;object-fit:contain}.hero-brand span{letter-spacing:.28em;font-size:.68rem;color:#ddd;font-weight:800}.hero-content h1{font-size:clamp(3rem,5.2vw,5.7rem);line-height:.94;letter-spacing:-.04em;text-shadow:0 3px 24px #000;margin:0 0 17px}.hero-meta{display:flex;align-items:center;gap:11px;color:#ddd;font-weight:600;margin-bottom:15px}.hero-meta b{color:#46d369}.quality{font-size:.72rem;border:1px solid #aaa;padding:2px 5px;border-radius:2px}.hero-content p{max-width:570px;font-size:1.05rem;line-height:1.55;color:#e1e1e1;text-shadow:0 2px 12px #000}.hero-buttons{display:flex;gap:10px;margin-top:23px}.hero-play,.hero-info{border:0;border-radius:4px;padding:12px 22px;font-weight:800;font-size:1rem;cursor:pointer}.hero-play{background:#fff;color:#080808}.hero-info{background:#6d6d6eb3;color:#fff}.hero-play:hover{background:#d9d9d9}.hero-info:hover{background:#858585c9}.hero.compact{height:270px;min-height:270px}.hero.compact .hero-content{display:none}.catalog-head{position:relative;z-index:2;margin-top:-105px;padding:0 4vw 20px 5.5vw;align-items:end}.hero.compact+.catalog-head{margin-top:0;padding-top:30px}.catalog-head h2{font-size:1.7rem}#rails{position:relative;z-index:2;padding:0 4vw 50px 5.5vw}.filters input,.filters select{background:#111;border-color:#ffffff2a}.rail-section{margin-bottom:40px}.rail-poster{min-width:0;cursor:pointer;scroll-snap-align:start}.rail-image{aspect-ratio:16/9;background:#151515;overflow:hidden;position:relative;border-radius:5px;transition:.25s}.rail-image>img{width:100%;height:100%;object-fit:cover;transition:.3s}.rail-overlay{position:absolute;inset:0;display:flex;align-items:flex-end;gap:9px;padding:12px;background:linear-gradient(0deg,#000e,transparent 65%);opacity:0;transition:.25s}.rail-overlay button{flex:none;width:34px;height:34px;border-radius:50%;border:0;background:#fff;color:#000}.rail-overlay span{font-weight:700;font-size:.88rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rail-poster:hover .rail-image{transform:scale(1.06);box-shadow:0 18px 35px #000}.rail-poster:hover .rail-overlay{opacity:1}
@media(max-width:800px){.topbar{inset:auto 0 0 0;width:100%;height:68px;padding:0 10px;flex-direction:row;justify-content:center;border-top:1px solid #ffffff18}.topbar>img,.top-actions{display:none}.topbar nav{flex:initial;width:100%;flex-direction:row;justify-content:space-around;gap:0}.topbar nav button{height:58px;width:25%}.topbar nav button small{position:static;opacity:1;transform:none;background:none;padding:0;font-size:.65rem}.topbar nav button span{font-size:1.1rem}.topbar nav button.active:before{top:auto;left:18%;right:18%;bottom:-5px;width:auto;height:3px}#content{padding:0 0 68px}.hero{height:570px;min-height:570px;background-position:65% center}.hero-shade{background:linear-gradient(0deg,#050505 4%,#05050544 60%,#05050599)}.hero-content{align-self:flex-end;padding:25px 22px 105px;text-align:center}.hero-content h1{font-size:2.7rem}.hero-brand,.hero-meta,.hero-buttons{justify-content:center}.hero-content p{font-size:.92rem}.catalog-head{margin-top:-75px;padding:0 20px 16px}.catalog-head>div:first-child{display:none}#rails{padding:0 0 35px 20px}.rail-title{padding-right:20px}.content-rail{grid-auto-columns:minmax(220px,64vw)}.hero.compact{height:120px;min-height:120px}.hero.compact+.catalog-head{padding-top:18px}.player-info{padding:20px;grid-template-columns:1fr}.detail-backdrop{min-height:330px}}

/* Streaming UI v3 — navbar, carousel and large poster cards */
.app-page{background:#141414}.topbar{position:fixed;inset:0 0 auto 0;width:100%;height:72px;padding:0 4vw;display:flex;flex-direction:row;align-items:center;gap:30px;background:linear-gradient(180deg,#000c,transparent);border:0;transition:background .3s ease;z-index:80}.topbar.scrolled{background:#141414;box-shadow:0 5px 20px #0005}.topbar>.nav-logo{display:block;width:118px;height:48px;border-radius:0;object-fit:contain}.topbar nav{display:flex;flex:initial;flex-direction:row;justify-content:flex-start;gap:4px;width:auto}.topbar nav button{width:auto;height:44px;padding:0 9px;display:block;color:#e5e5e5;font-size:.9rem;white-space:nowrap}.topbar nav button:hover,.topbar nav button.active{color:#fff}.topbar nav button.active:before{display:none}.top-actions{margin-left:auto;display:flex;flex-direction:row;align-items:center;gap:12px}.top-actions #userName{display:block;color:#ddd;max-width:110px;overflow:hidden;text-overflow:ellipsis}.nav-search{height:38px;display:flex;align-items:center;border:1px solid transparent;transition:.3s}.nav-search span{padding:8px;font-size:1.25rem}.nav-search input{width:0;padding:0;border:0;outline:0;background:transparent;color:#fff;transition:.3s}.nav-search:focus-within,.nav-search.open{border-color:#fff;background:#000b}.nav-search:focus-within input,.nav-search.open input{width:230px;padding:0 10px 0 0}.top-actions>.icon-btn{display:none}.sidebar{display:none}#content{padding:0}.hero{height:78vh;min-height:610px;max-height:860px;background-position:center 20%;background-size:cover}.hero-content{padding:80px 4vw 100px;max-width:670px}.hero-content h1{font-size:clamp(3.2rem,5.6vw,6.1rem)}.hero-shade{background:linear-gradient(90deg,#141414 0%,#141414df 18%,#14141466 52%,transparent 78%),linear-gradient(0deg,#141414 0%,transparent 40%)}.hero.compact{height:190px;min-height:190px}.catalog-head{margin-top:-80px;padding:0 4vw 24px}.hero.compact+.catalog-head{margin-top:0;padding-top:100px}#rails{padding:0 0 60px}.carousel-section{position:relative;margin:0 0 42px;padding-left:4vw}.carousel-heading{height:36px;padding-right:4vw;display:flex;align-items:center;gap:14px}.carousel-heading h2{font-size:1.45rem;color:#fff}.carousel-heading span{font-size:.78rem;color:#54b9ff;opacity:0;transform:translateX(-8px);transition:.25s}.carousel-section:hover .carousel-heading span{opacity:1;transform:none}.carousel-shell{position:relative}.carousel-track{display:flex;gap:9px;overflow-x:auto;overflow-y:visible;padding:9px 4vw 28px 0;scroll-behavior:smooth;scrollbar-width:none}.carousel-track::-webkit-scrollbar{display:none}.media-card{flex:0 0 clamp(180px,13.2vw,245px);min-width:0;cursor:pointer;position:relative;z-index:1;transition:z-index 0s .15s}.card-art{aspect-ratio:2/3;position:relative;overflow:hidden;border-radius:8px;background:#18181c;box-shadow:0 4px 14px #0008;transition:transform .3s cubic-bezier(0.25,1,0.5,1),box-shadow .3s ease}.card-poster-img{width:100%;height:100%;object-fit:cover;transition:opacity .3s ease}.media-card:hover{z-index:15;transition-delay:0s}.media-card:hover .card-art{transform:scale(1.12);box-shadow:0 22px 55px #000c}

/* Netflix Style Card Hover Preview */
.card-hover-preview{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;opacity:0;transition:opacity .25s ease;border-radius:8px;overflow:hidden;pointer-events:none;z-index:2}
.media-card:hover .card-hover-preview{opacity:1;pointer-events:auto}
.card-backdrop-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;filter:brightness(0.75)}
.card-backdrop-blur{position:absolute;inset:-10px;background-size:cover;background-position:center;filter:blur(14px) brightness(0.45);transform:scale(1.15)}
.hover-overlay-gradient{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0.15) 0%,rgba(0,0,0,0.45) 45%,#0a0a0c 92%)}
.hover-content{position:relative;z-index:3;padding:12px 14px;display:flex;flex-direction:column;gap:5px;color:#fff}
.hover-top-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:2px}
.hover-play-btn{width:36px;height:36px;border-radius:50%;border:0;background:#fff;color:#000;font-size:1.05rem;cursor:pointer;display:grid;place-items:center;box-shadow:0 4px 12px #0008;transition:transform .2s ease,background .2s ease}
.hover-play-btn:hover{transform:scale(1.12);background:#e50914;color:#fff}
.hover-type-tag{font-size:.62rem;font-weight:800;letter-spacing:.06em;background:rgba(255,255,255,0.12);backdrop-filter:blur(4px);padding:3px 7px;border-radius:4px;color:#53d9ff;border:1px solid rgba(83,217,255,0.25)}
.hover-title{font-size:.92rem;font-weight:700;margin:0;line-height:1.2;color:#fff;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-shadow:0 2px 8px #000}
.hover-meta{display:flex;align-items:center;gap:7px;font-size:.75rem;font-weight:700}
.hover-rating{color:#46d369;font-weight:800}
.hover-year{color:#ccc}
.hover-quality{border:1px solid #ffffff55;padding:1px 4px;border-radius:2px;font-size:.6rem;color:#aaa}
.hover-genre{font-size:.71rem;color:#aaa;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.live-badge{position:absolute;left:9px;top:9px;background:#e50914;color:#fff;padding:4px 7px;border-radius:3px;font-size:.63rem;font-weight:800;z-index:4}
.coming-soon-badge{position:absolute;right:9px;top:9px;background:#7357ff;color:#fff;padding:4px 7px;border-radius:3px;font-size:.63rem;font-weight:800;z-index:4}

/* Landing Page & Public Showcase Styles (Estilo Netflix com paleta NexPlay) */
.landing-body{background:#07111f;color:#fff;overflow-x:hidden}
.landing-header{position:fixed;top:0;left:0;right:0;height:76px;z-index:90;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;background:rgba(7,17,31,0.85);backdrop-filter:blur(20px);border-bottom:1px solid rgba(255,255,255,0.08)}
.landing-logo{width:130px;height:48px;object-fit:contain}
.landing-nav{display:flex;align-items:center;gap:24px}
.landing-nav a{color:#91a4bd;text-decoration:none;font-weight:600;font-size:0.92rem;transition:color .2s}
.landing-nav a:hover{color:#fff}
.landing-header-actions{display:flex;align-items:center;gap:12px}
.btn-login-outline{background:transparent;border:1px solid rgba(255,255,255,0.2);color:#fff;padding:10px 18px;border-radius:10px;font-weight:700;cursor:pointer;transition:.2s}
.btn-login-outline:hover{background:rgba(255,255,255,0.1);border-color:#fff}
.btn-whatsapp-cta{background:linear-gradient(135deg,#25d366,#128c7e);color:#fff;border:0;padding:14px 26px;border-radius:10px;font-weight:800;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;box-shadow:0 8px 24px rgba(37,211,102,0.3);transition:transform .2s,box-shadow .2s;font-size:1.05rem;white-space:nowrap}
.btn-whatsapp-cta:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(37,211,102,0.45)}

/* Hero com Fundo de Pôsteres Reais (Poster Wall Matrix) estilo Netflix + Fallback Estático */
.landing-hero{min-height:85vh;position:relative;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden;padding:110px 5vw 80px;background:#07111f url('../img/backgorund.png') center/cover no-repeat}
.hero-poster-wall{position:absolute;inset:-15% -10% -15% -10%;display:grid;grid-template-columns:repeat(6,1fr);gap:12px;transform:rotate(-4deg) scale(1.1);opacity:0.32;pointer-events:none;z-index:1;filter:brightness(0.65) saturate(1.1)}
.hero-poster-wall img{width:100%;aspect-ratio:2/3;object-fit:cover;border-radius:8px;box-shadow:0 4px 14px #000}
.hero-shade-overlay{position:absolute;inset:0;z-index:2;background:radial-gradient(circle at 50% 35%,rgba(7,17,31,0.65),#07111fe6 78%),linear-gradient(180deg,rgba(7,17,31,0.85) 0%,#07111f 100%)}
.landing-hero-content{position:relative;z-index:3;max-width:850px;margin:0 auto}
.landing-hero h1{font-size:clamp(2.9rem,5.5vw,5.4rem);line-height:1.02;margin-bottom:16px;letter-spacing:-0.03em;font-family:Manrope,sans-serif;font-weight:800;text-shadow:0 4px 20px #000}
.landing-hero p{font-size:clamp(1.1rem,1.9vw,1.35rem);color:#c5d4e8;max-width:640px;margin:0 auto 32px;line-height:1.55}

/* Input Bar CTA Estilo Netflix */
.cta-input-bar{display:flex;align-items:center;justify-content:center;gap:10px;max-width:620px;margin:0 auto;width:100%}
.cta-input-bar input{flex:1;height:54px;background:rgba(9,21,36,0.85);border:1px solid rgba(255,255,255,0.2);border-radius:10px;padding:0 18px;color:#fff;font-size:1.05rem;outline:none;backdrop-filter:blur(8px)}
.cta-input-bar input:focus{border-color:#53d9ff;box-shadow:0 0 0 3px rgba(83,217,255,0.2)}
.cta-input-bar button{height:54px;padding:0 28px}

/* Faixa de Oferta / Destaque Promo */
.landing-promo-banner{width:100%;background:linear-gradient(90deg,#0f2747,#1b0d38);border-y:1px solid rgba(255,255,255,0.12);padding:18px 5vw;display:flex;align-items:center;justify-content:center;gap:16px;font-size:1.05rem;font-weight:600;text-align:center;position:relative;z-index:4}
.landing-promo-banner button{background:rgba(255,255,255,0.12);border:1px solid rgba(255,255,255,0.2);color:#fff;padding:6px 14px;border-radius:6px;font-size:.85rem;cursor:pointer;transition:.2s}
.landing-promo-banner button:hover{background:#fff;color:#000}

/* Vitrine e Carrosséis Densos Numerados (Estilo Netflix Top 10) */
.landing-showcase-section{padding:60px 0 80px;position:relative;z-index:4}
.landing-section-title{text-align:center;margin-bottom:46px;padding:0 5vw}
.landing-section-title h2{font-size:2.2rem;margin-bottom:10px}
.landing-section-title p{color:#91a4bd;font-size:1.05rem}

.media-card.numbered-card{position:relative;flex:0 0 clamp(185px,14.2vw,245px);margin-left:28px}
.media-card.numbered-card::before{content:attr(data-rank);position:absolute;left:-30px;bottom:-10px;z-index:5;font-size:7.5rem;font-weight:900;font-family:Manrope,sans-serif;line-height:0.8;color:#07111f;-webkit-text-stroke:3px #53d9ff;text-shadow:0 6px 24px #000;pointer-events:none}

/* Seção 4 Cards "Mais Motivos para Assinar" */
.landing-features-section{padding:80px 5vw;background:#091524;border-top:1px solid rgba(255,255,255,0.06);border-bottom:1px solid rgba(255,255,255,0.06)}
.features-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;max-width:1180px;margin:0 auto}
@media(max-width:980px){.features-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:580px){.features-grid{grid-template-columns:1fr}}
.feature-card{position:relative;background:#0d1929;border:1px solid rgba(255,255,255,0.08);border-radius:18px;padding:30px 24px;min-height:190px;display:flex;flex-direction:column;justify-content:flex-start;overflow:hidden;transition:transform .25s,border-color .25s}
.feature-card:hover{transform:translateY(-5px);border-color:#53d9ff44;background:#102138}
.feature-card-icon{position:absolute;right:16px;bottom:16px;font-size:2.8rem;opacity:0.25;pointer-events:none}
.feature-card h3{font-size:1.2rem;margin-bottom:10px;font-family:Manrope,sans-serif}
.feature-card p{color:#91a4bd;font-size:0.92rem;line-height:1.55;margin:0;max-width:85%}

/* FAQ em Acordeão (Estilo Netflix) */
.landing-faq-section{padding:80px 5vw;background:#07111f}
.faq-container{max-width:860px;margin:0 auto;display:grid;gap:10px}
.faq-item{background:#0e1c2e;border:1px solid rgba(255,255,255,0.08);border-radius:10px;overflow:hidden;transition:background .2s}
.faq-item:hover{background:#13243a}
.faq-question{padding:22px 28px;display:flex;align-items:center;justify-content:space-between;font-size:1.2rem;font-weight:700;color:#fff;cursor:pointer;user-select:none}
.faq-toggle{font-size:1.6rem;font-weight:400;transition:transform .25s ease;color:#53d9ff}
.faq-answer{padding:0 28px 24px;color:#a3b6ce;font-size:1.02rem;line-height:1.65;display:none;border-top:1px solid rgba(255,255,255,0.06);margin-top:4px;padding-top:16px}
.faq-item.open .faq-answer{display:block}
.faq-item.open .faq-toggle{transform:rotate(45deg)}

/* Chamada Final CTA */
.landing-cta-banner{padding:80px 5vw;text-align:center;background:radial-gradient(circle at 50% 50%,rgba(115,87,255,0.18),transparent 60%),#07111f}
.cta-box{max-width:850px;margin:0 auto;background:linear-gradient(135deg,rgba(28,140,255,0.15),rgba(115,87,255,0.15));border:1px solid rgba(255,255,255,0.12);border-radius:24px;padding:50px 30px}
.cta-box h2{font-size:2.4rem;margin-bottom:14px}
.cta-box p{color:#91a4bd;font-size:1.1rem;margin-bottom:30px}

/* Modal de incentivo para assinar */
.subscribe-modal-card{max-width:480px;padding:36px;text-align:center;background:#0d1929;border-radius:20px;border:1px solid rgba(255,255,255,0.15);color:#fff}
.subscribe-modal-card h3{font-size:1.6rem;margin:12px 0 8px}
.subscribe-modal-card p{color:#91a4bd;font-size:0.98rem;margin-bottom:24px;line-height:1.5}


.account-card{max-width:520px;padding:32px;background:#141417;border-radius:14px;box-shadow:0 25px 80px #000;color:#fff}
.account-header{margin-bottom:24px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff15;padding-bottom:14px}
.account-header h2{font-size:1.6rem;margin:0}
.user-status-badge{background:#10b98122;color:#10b981;border:1px solid #10b98144;padding:5px 10px;border-radius:20px;font-size:.72rem;font-weight:800}
.account-body{display:grid;gap:14px;margin-bottom:28px}
.account-info-row{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;background:#1e1e24;border-radius:8px;font-size:.9rem}
.account-info-row span{color:#999}
.account-info-row strong{color:#fff}
.account-footer{display:flex;justify-content:flex-end}
.danger-btn{background:#e50914;color:#fff;border:0;padding:12px 22px;border-radius:8px;font-weight:700;cursor:pointer;transition:.2s}
.danger-btn:hover{background:#b80710}
#userName{cursor:pointer;font-weight:700}
.carousel-arrow{position:absolute;z-index:20;top:9px;bottom:28px;width:52px;border:0;background:#141414cc;color:#fff;font-size:3.5rem;opacity:0;cursor:pointer;transition:.25s}.carousel-shell:hover .carousel-arrow{opacity:1}.carousel-arrow.prev{left:0;transform:translateX(-100%)}.carousel-arrow.prev.visible{transform:none}.carousel-arrow.next{right:0}.carousel-arrow:hover{background:#0a0a0aee;font-size:4rem}.catalog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:34px 12px;padding:0 4vw}.catalog-grid .media-card{width:100%;max-width:none}.catalog-grid .media-card:hover .card-art{transform:scale(1.045)}.detail-actions{position:absolute;z-index:3;left:34px;bottom:38px;display:flex;gap:10px}.detail-actions .main-play{position:static}.add-list{border:1px solid #aaa;border-radius:5px;padding:11px 18px;background:#252525cc;color:#fff;font-weight:700;cursor:pointer}.add-list:hover{background:#3a3a3a}.similar-section{padding:0 34px 38px}.similar-section>h3{margin-bottom:16px}.similar-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}.similar-grid .media-card{width:100%;min-width:0}.similar-grid .card-hover{padding:8px}.similar-grid .card-hover>button{width:32px;height:32px}.site-footer{max-width:1100px;margin:30px auto 0;padding:45px 30px 70px;color:#808080}.socials{display:flex;gap:16px;margin-bottom:22px}.socials a{color:#bbb;font-size:1.35rem;text-decoration:none}.footer-links{display:grid;grid-template-columns:repeat(4,1fr);gap:14px 30px;margin-bottom:30px}.footer-links a{color:#808080;text-decoration:none;font-size:.82rem}.footer-links a:hover{text-decoration:underline}.site-footer small{font-size:.72rem}.filters input,.filters select{background:#181818}
@media(max-width:1050px){.topbar{padding:0 2.5vw;gap:16px}.topbar>.nav-logo{width:90px}.topbar nav button{padding:0 6px;font-size:.79rem}.top-actions #userName{display:none}.nav-search:focus-within input,.nav-search.open input{width:170px}.media-card{flex-basis:clamp(165px,18vw,220px)}.similar-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.topbar{inset:0 0 auto;height:62px;padding:0 15px;justify-content:space-between;background:#141414}.topbar>.nav-logo{display:block;width:90px;height:40px}.topbar nav{position:fixed;inset:auto 0 0;z-index:90;height:62px;background:#101010;justify-content:space-around;border-top:1px solid #ffffff18}.topbar nav button{font-size:.68rem;padding:0 6px}.topbar nav button:nth-child(5),.topbar nav button:nth-child(6){display:none}.top-actions{margin:0}.nav-search{position:absolute;right:66px}.nav-search:focus-within,.nav-search.open{position:fixed;left:12px;right:12px;top:11px;z-index:95}.nav-search:focus-within input,.nav-search.open input{width:100%}.top-actions .avatar{display:block}.hero{height:68vh;min-height:550px;background-position:65% center}.hero-content{padding:90px 20px 100px;text-align:left;align-self:flex-end}.hero-content h1{font-size:2.65rem}.hero-brand,.hero-meta,.hero-buttons{justify-content:flex-start}.hero-content p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.catalog-head{margin-top:-55px;padding:0 20px 18px}.hero.compact+.catalog-head{padding-top:85px}.carousel-section{padding-left:20px;margin-bottom:28px}.carousel-heading{padding-right:20px}.carousel-heading h2{font-size:1.16rem}.carousel-track{padding-right:20px;gap:8px}.media-card{flex-basis:42vw}.carousel-arrow{display:none}.catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr));padding:0 16px;gap:22px 9px}.similar-grid{grid-template-columns:repeat(2,1fr)}.site-footer{padding-bottom:100px}.footer-links{grid-template-columns:repeat(2,1fr)}.player-info{grid-template-columns:1fr}.detail-actions{left:20px;bottom:22px}.detail-backdrop{min-height:380px}}
.channel-section{padding:0 4vw;margin-bottom:48px}.channel-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.channel-heading h2{font-size:1.45rem}.channel-heading span{font-size:.76rem;color:#888}.channel-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(145px,1fr));gap:28px 12px}.channel-grid .media-card{width:100%;max-width:none}.channel-grid .card-art{aspect-ratio:1/1;background:#f2f4f6}.channel-grid .card-art>img{object-fit:contain}.channel-grid .media-card:hover .card-art{transform:scale(1.055)}.skeleton-section{padding-left:4vw;margin-bottom:38px}.skeleton-title{width:230px;height:24px;border-radius:4px;margin-bottom:16px;background:#272727}.skeleton-track{display:flex;gap:9px;overflow:hidden}.skeleton-card{flex:0 0 clamp(180px,13.2vw,245px);aspect-ratio:2/3;border-radius:6px;background:linear-gradient(100deg,#202020 20%,#303030 42%,#202020 64%);background-size:200% 100%;animation:skeletonShimmer 1.35s infinite linear}@keyframes skeletonShimmer{to{background-position:-200% 0}}.browse-error{margin:40px 4vw;padding:65px 24px;text-align:center;border:1px solid #ffffff15;border-radius:8px;background:#191919;display:grid;justify-items:center;gap:10px;color:#aaa}.browse-error b{color:#fff;font-size:1.15rem}.browse-error button{margin-top:10px;border:0;border-radius:4px;padding:11px 18px;background:#e50914;color:#fff;font-weight:700}.empty-row{margin:10px 4vw 15px 0;padding:26px;border:1px dashed #ffffff22;border-radius:6px;color:#777}.catalog-head .filters{position:relative;z-index:5}
@media(max-width:760px){.channel-section{padding:0 16px}.channel-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 8px}.skeleton-section{padding-left:20px}.skeleton-card{flex-basis:42vw}}
.live-guide{margin-top:26px;border-top:1px solid #ffffff1f;padding-top:20px;max-width:720px}.guide-title{display:flex;align-items:center;gap:12px;margin-bottom:14px}.guide-title>span{font-size:.68rem;letter-spacing:.2em;color:#54d6ff;font-weight:800}.guide-title>b{padding:4px 8px;border-radius:3px;background:#e50914;color:#fff;font-size:.7rem;text-transform:uppercase}.guide-current{padding:17px 18px 13px;border:1px solid #ffffff18;border-radius:8px;background:#ffffff0a}.guide-current time,.guide-next time{color:#aaa;font-size:.76rem}.guide-current h3{margin:4px 0 6px;font-size:1.22rem}.guide-current p{margin:0;color:#c8c8c8;line-height:1.45;font-size:.86rem}.guide-progress{height:4px;margin-top:14px;border-radius:5px;overflow:hidden;background:#ffffff18}.guide-progress i{display:block;height:100%;border-radius:inherit;background:#e50914}.guide-next{padding:13px 5px 0}.guide-next>strong{display:block;margin-bottom:7px;color:#aaa;font-size:.75rem;text-transform:uppercase}.guide-next>div{display:grid;grid-template-columns:54px 1fr;gap:10px;padding:7px 0;border-top:1px solid #ffffff12}.guide-next span{font-size:.86rem}.guide-loading,.guide-empty{padding:16px;border-radius:6px;background:#ffffff08;color:#aaa;font-size:.85rem}


/* ===== MOBILE RESPONSIVE PATCH v2.0 ===== */

/* ======================================================
   NEXPLAY MOBILE RESPONSIVE PATCH v2.0
   Breakpoints: 640px (landing) | 760px (app) | 480px | 360px
   ====================================================== */

/* ─── 1. LANDING PAGE ─── */

@media (max-width: 640px) {
  .landing-nav { display: none; }
  .landing-header { padding: 0 4vw; height: 64px; }
  .landing-logo { width: 105px; height: 38px; }

  .landing-hero {
    min-height: 100svh;
    padding: 80px 5vw 80px;
    align-items: flex-end;
    text-align: left;
    background-position: center top !important;
  }
  .landing-hero-content { max-width: 100%; text-align: left; }
  .landing-hero h1 { font-size: clamp(2rem, 8.5vw, 2.6rem); margin-bottom: 12px; }
  .landing-hero p { font-size: 0.95rem; margin-bottom: 20px; max-width: 100%; }

  .cta-input-bar {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    max-width: 100%;
  }
  .cta-input-bar input {
    height: 52px;
    font-size: 1rem;
    width: 100%;
    box-sizing: border-box;
  }
  .cta-input-bar button { height: 52px; width: 100%; padding: 0; font-size: 1rem; border-radius: 10px; }

  .landing-promo-banner { flex-direction: column; gap: 10px; padding: 14px 4vw; font-size: 0.9rem; }

  .landing-showcase-section { padding: 40px 0 50px; }
  .landing-section-title { margin-bottom: 28px; padding: 0 4vw; }
  .landing-section-title h2 { font-size: 1.6rem; }
  .landing-section-title p { font-size: 0.9rem; }

  .media-card.numbered-card { flex-basis: 44vw; margin-left: 20px; }
  .media-card.numbered-card::before { font-size: 5.5rem; left: -20px; }

  .features-grid { grid-template-columns: 1fr !important; gap: 12px; }
  .landing-features-section { padding: 50px 4vw; }
  .landing-faq-section { padding: 50px 4vw; }

  .landing-footer-links { flex-direction: column; gap: 14px; }
}

/* ─── 2. CATALOG / APP ─── */

@media (max-width: 760px) {
  .hero { height: 55vh !important; min-height: 420px !important; }
  .hero-content h1 { font-size: clamp(1.9rem, 7vw, 2.65rem) !important; }
  .hero-content p { font-size: 0.85rem; }
  .hero-buttons .btn { padding: 10px 16px !important; font-size: 0.85rem !important; }

  .catalog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 14px 8px !important; padding: 0 12px !important; }

  .media-card { flex-basis: 42vw !important; }

  .carousel-heading h2 { font-size: 1rem !important; }
  .carousel-section { padding-left: 14px !important; margin-bottom: 22px !important; }
  .carousel-track { gap: 6px !important; padding-right: 14px !important; -webkit-overflow-scrolling: touch; scroll-snap-type: x proximity; }
  .media-card { scroll-snap-align: start; }

  /* Touch card: hover visivel ao toque */
  .media-card .card-hover { transition: opacity 0.2s; }
  .media-card.touch-active .card-hover { opacity: 1 !important; pointer-events: auto !important; }
  .media-card.touch-active .card-art { transform: scale(1.06) !important; }

  /* Filters: scroll horizontal */
  .catalog-head .filters {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    flex-wrap: nowrap;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 4px;
    scrollbar-width: none;
  }
  .catalog-head .filters::-webkit-scrollbar { display: none; }
  .catalog-head .filters select,
  .catalog-head .filters input { flex: 0 0 auto; min-width: 130px; font-size: 0.82rem; }

  /* Search expandido */
  .nav-search:focus-within, .nav-search.open {
    left: 10px !important;
    right: 60px !important;
  }

  /* Canais: 3 colunas */
  .channel-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 14px 6px !important; }

  /* Modal de baixo para cima */
  .modal { align-items: flex-end !important; padding: 0 !important; }
  .modal-content {
    border-radius: 18px 18px 0 0 !important;
    max-height: 90vh !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
  }
  .modal-close {
    top: 12px !important;
    right: 12px !important;
    z-index: 10;
    width: 36px !important;
    height: 36px !important;
    min-width: 36px;
  }
  .detail-backdrop { min-height: 320px !important; }
  .detail-actions { left: 16px !important; bottom: 16px !important; gap: 8px !important; }

  /* Footer */
  .site-footer { padding-bottom: 90px !important; }
  .footer-links { grid-template-columns: repeat(2, 1fr) !important; }

  /* Nav tab bar */
  .topbar nav { height: 58px !important; padding: 0 2px !important; }
  .topbar nav button {
    flex: 1;
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-size: 0.62rem !important;
    padding: 0 2px !important;
    min-height: 44px;
  }
  .topbar nav button:nth-child(5) { display: flex !important; }
  .topbar nav button:nth-child(6) { display: none !important; }

  .app-page { padding-bottom: 62px; }
}

/* ─── 3. PLAYER ─── */

@media (max-width: 760px) {
  .modal .player-card {
    width: 100vw !important;
    max-height: 100dvh !important;
    border-radius: 0 !important;
  }
  .video-wrap {
    height: 100dvh !important;
    max-height: none !important;
    aspect-ratio: auto !important;
  }

  .player-top button { width: 44px !important; height: 44px !important; font-size: 1.4rem !important; }
  .player-center button { width: 52px !important; height: 52px !important; }
  .player-center .center-play { width: 70px !important; height: 70px !important; font-size: 1.6rem !important; }
  .player-center { gap: 20px !important; }
  .bottom-controls button { min-width: 44px !important; height: 44px !important; }

  .timeline-wrap input { height: 6px !important; touch-action: none; }
  .timeline-wrap input:active { height: 12px !important; }

  .playing-copy { max-width: 100% !important; margin-bottom: 8px !important; }
  .playing-copy h2 { font-size: clamp(1rem, 4vw, 1.4rem) !important; }
  .playing-copy p { font-size: 0.78rem !important; }

  #volumeBar { display: none !important; }
  .up-next { display: none !important; }

  /* Live panel: bottom sheet */
  .live-panel {
    position: fixed !important;
    inset: auto 0 0 !important;
    top: auto !important;
    width: 100% !important;
    height: 75vh !important;
    max-height: 75vh !important;
    border-radius: 20px 20px 0 0 !important;
    border-left: none !important;
    border-top: 1px solid rgba(255,255,255,0.2) !important;
    transform: translateY(100%) !important;
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1) !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    z-index: 100 !important;
  }
  .live-panel.open {
    transform: translateY(0) !important;
  }
  .live-panel::before {
    content: '';
    display: block;
    width: 40px;
    height: 4px;
    background: rgba(255,255,255,0.3);
    border-radius: 2px;
    margin: 12px auto 16px;
    flex-shrink: 0;
  }
}

/* ─── 4. LOGIN PAGE ─── */

@media (max-width: 480px) {
  .auth-container .login-card {
    width: calc(100vw - 24px) !important;
    min-width: 0 !important;
    padding: 24px 18px !important;
    border-radius: 18px !important;
  }
  .nexplay-login-logo { height: 70px !important; }
  .auth-container input.form-control {
    font-size: 1rem !important;
    height: 50px !important;
    padding: 0 14px !important;
  }
  .auth-container button[type="submit"] {
    height: 50px !important;
    font-size: 1rem !important;
  }
}

/* ─── 5. ADMIN PANEL ─── */

@media (max-width: 767px) {
  .data-table-container, .table-responsive {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }
  .dashboard-container { width: calc(100% - 20px) !important; margin: 12px auto !important; }
  .dashboard-container .row .col-md-3 { flex: 0 0 50% !important; max-width: 50% !important; }
  .dashboard-container .metric-value { font-size: 1.25rem !important; }
}

/* ─── 6. AJUSTES 360px ─── */

@media (max-width: 360px) {
  .landing-hero h1 { font-size: 1.8rem !important; }
  .cta-input-bar input, .cta-input-bar button { height: 48px !important; font-size: 0.9rem !important; }
  .media-card { flex-basis: 46vw !important; }
  .channel-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .catalog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px 6px !important; }
  .hero-content h1 { font-size: 1.75rem !important; }
  .topbar nav button { font-size: 0.58rem !important; }
}

/* ─── 7. LANDSCAPE PHONE ─── */

@media (max-height: 500px) and (orientation: landscape) and (max-width: 900px) {
  .video-wrap { height: 100dvh !important; }
  .player-bottom { padding: 8px 14px 10px !important; }
  .playing-copy h2 { font-size: 1rem !important; }
  .playing-copy p { display: none !important; }
  .live-panel { height: 85vh !important; }
  .landing-hero { min-height: 100dvh; padding: 60px 5vw 60px; }
}

/* ─── 8. TAP TARGET GARANTIAS ─── */

@media (hover: none) {
  .btn-login-outline,
  .topbar nav button,
  .bottom-controls button,
  .player-top button,
  .modal-close,
  .live-panel > button {
    min-height: 44px;
    min-width: 44px;
  }
}