:root{--bg:#080808;--muted:#c9c9c9;--red:#e50914;--rail:68px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:#fff;font-family:Inter,Arial,sans-serif;overflow-x:hidden}button,input{font:inherit}.rail{position:fixed;inset:0 auto 0 0;width:var(--rail);z-index:50;display:flex;flex-direction:column;align-items:center;gap:12px;padding:155px 0 18px;background:linear-gradient(90deg,rgba(5,5,5,.98),rgba(5,5,5,.7),transparent)}.icon-btn{width:36px;height:36px;border:0;background:transparent;color:#bfc0c2;font-size:22px;cursor:pointer;border-radius:7px;transition:.2s;position:relative}.icon-btn:hover{color:#fff;background:#ffffff10}.icon-btn.active{color:#fff}.icon-btn.active:after{content:"";position:absolute;width:18px;height:3px;border-radius:3px;background:var(--red);left:9px;bottom:-4px}.icon-btn.add{margin-top:auto;font-size:27px}.hero{height:74vh;min-height:640px;position:relative;overflow:hidden}.hero-bg{position:absolute;inset:0;background-image:url('https://images.unsplash.com/photo-1547153760-18fc86324498?auto=format&fit=crop&w=2200&q=88');background-size:cover;background-position:center 37%;transform:scale(1.01)}.shade{position:absolute;inset:0;background:linear-gradient(90deg,#080808 0%,rgba(8,8,8,.92) 15%,rgba(8,8,8,.55) 40%,rgba(8,8,8,.08) 70%),linear-gradient(0deg,#080808 0%,transparent 28%,rgba(0,0,0,.2) 100%)}.hero-content{position:absolute;left:8.3%;top:13%;width:min(560px,40vw);z-index:3}.brand-logo{width:260px;max-height:100px;object-fit:contain;object-position:left center;margin-bottom:14px}.eyebrow{display:flex;align-items:center;gap:10px;font-size:16px;margin-bottom:8px}.badge{font-size:10px;line-height:.8;background:var(--red);font-weight:800;padding:5px 4px;text-align:center}.hero h1{font-size:clamp(50px,4.5vw,78px);line-height:.78;letter-spacing:-5px;margin:9px 0 18px;font-weight:800}.hero h1 span{font-size:.64em;letter-spacing:8px}.hero p{font-size:17px;line-height:1.48;max-width:540px;color:#f2f2f2;text-shadow:0 2px 12px #000;margin:0 0 20px}.actions{display:flex;gap:7px}.primary,.secondary{border:0;border-radius:5px;padding:11px 19px;font-weight:700;font-size:16px;cursor:pointer;transition:.18s}.primary{background:#fff;color:#111}.primary:hover{background:#d8d8d8}.secondary{background:#6d6d6eb8;color:#fff}.secondary:hover{background:#868686d9}.actions span{font-size:18px;margin-right:6px}.level-tag{position:absolute;right:0;bottom:25%;background:#111a;padding:10px 34px 10px 27px;font-size:13px;border-left:3px solid #fff;z-index:4}.catalog{position:relative;z-index:5;margin-top:-92px;padding:0 0 70px 8.3%;min-height:500px}.row{margin:0 0 28px}.row h2{font-size:18px;margin:0 0 10px}.slider-wrap{position:relative}.slider{display:flex;gap:9px;overflow-x:auto;overflow-y:hidden;padding:0 7% 16px 0;scrollbar-width:none;scroll-behavior:smooth}.slider::-webkit-scrollbar{display:none}.card{position:relative;flex:0 0 250px;aspect-ratio:16/9;border-radius:3px;overflow:hidden;background:#222;cursor:pointer;transition:transform .25s,box-shadow .25s;transform-origin:center;box-shadow:0 5px 18px #0005}.card:hover{transform:scale(1.08);z-index:10;box-shadow:0 12px 35px #000}.card img{width:100%;height:100%;object-fit:cover;display:block}.card:after{content:"";position:absolute;inset:45% 0 0;background:linear-gradient(transparent,#000d)}.card-copy{position:absolute;z-index:2;left:11px;right:11px;bottom:9px}.card-copy b{font-size:13px}.card-copy small{display:block;color:#d0d0d0;margin-top:3px}.rank-card{flex-basis:315px;display:flex;overflow:visible;background:transparent;box-shadow:none}.rank{font-size:130px;font-weight:800;line-height:140px;color:#080808;-webkit-text-stroke:4px #777;width:90px;text-align:center}.rank-card .poster{position:relative;width:225px;overflow:hidden;border-radius:3px}.rank-card:hover{box-shadow:none}.search-panel{position:fixed;inset:0 0 auto 0;z-index:100;background:#090909f7;padding:28px 8%;transform:translateY(-120%);transition:.25s}.search-panel.open{transform:none}.search-inner{display:flex;align-items:center;gap:16px;max-width:900px;margin:auto;border-bottom:2px solid #fff}.search-inner span{font-size:34px}.search-inner input{flex:1;background:transparent;border:0;outline:0;color:#fff;font-size:24px;padding:14px}.search-inner button{border:0;background:transparent;color:#fff;font-size:24px;cursor:pointer}.modal{position:fixed;inset:0;background:#000b;z-index:120;display:grid;place-items:center;padding:25px;opacity:0;pointer-events:none;transition:.2s}.modal.open{opacity:1;pointer-events:auto}.modal-card{width:min(850px,95vw);background:#181818;border-radius:9px;overflow:hidden;box-shadow:0 25px 80px #000;position:relative}.modal-close{position:absolute;right:15px;top:15px;z-index:4;width:38px;height:38px;border-radius:50%;border:0;background:#181818;color:#fff;font-size:20px;cursor:pointer}.modal-visual{height:360px;background-size:cover;background-position:center;position:relative}.modal-visual:after{content:"";position:absolute;inset:40% 0 0;background:linear-gradient(transparent,#181818)}.modal-copy{padding:0 35px 35px}.modal-copy h2{font-size:34px;margin:0 0 10px}.modal-copy p{color:#d0d0d0;line-height:1.6}.toast{position:fixed;z-index:200;left:50%;bottom:30px;transform:translate(-50%,80px);background:#fff;color:#111;padding:12px 20px;border-radius:4px;font-weight:700;opacity:0;transition:.25s}.toast.show{transform:translate(-50%,0);opacity:1}@media(max-width:800px){:root{--rail:0px}.rail{inset:auto 0 0 0;width:100%;height:64px;flex-direction:row;justify-content:space-around;padding:0 8px;background:#090909;gap:0}.icon-btn{font-size:24px}.icon-btn.add{margin:0}.hero{height:76vh;min-height:600px}.hero-content{left:6%;top:14%;width:88%}.brand-logo{width:220px}.hero h1{font-size:56px}.hero p{font-size:16px;max-width:90%}.level-tag{display:none}.catalog{margin-top:-90px;padding-left:6%;padding-bottom:100px}.card{flex-basis:230px}.rank-card{flex-basis:310px}.rank{font-size:120px;width:85px}.rank-card .poster{width:225px}.secondary{display:none}.primary{font-size:16px;padding:12px 18px}}

/* YouTube previews + full player */
.modal-visual{overflow:hidden;background:#050505}.video-shell{position:absolute;inset:0;overflow:hidden;background:#050505}.video-shell iframe{position:absolute;left:50%;top:50%;width:177.78%;height:100%;min-width:100%;min-height:56.25vw;transform:translate(-50%,-50%);border:0;pointer-events:none}.modal-video-shade{position:absolute;inset:0;background:linear-gradient(0deg,#181818 0%,rgba(24,24,24,.12) 56%,rgba(0,0,0,.12) 100%);pointer-events:none}.modal-visual:after{display:none}.modal-actions{display:flex;gap:8px;align-items:center}.preview-btn{display:inline-block;background:#6d6d6eb8}.player-overlay{position:fixed;inset:0;z-index:180;background:rgba(0,0,0,.94);display:grid;place-items:center;padding:28px;opacity:0;pointer-events:none;transition:.2s}.player-overlay.open{opacity:1;pointer-events:auto}.player-frame{width:min(1180px,96vw);position:relative;background:#0b0b0b;border-radius:8px;overflow:hidden;box-shadow:0 25px 90px #000}.player-video{aspect-ratio:16/9;background:#000}.player-video iframe{width:100%;height:100%;border:0;display:block}.player-close{position:absolute;z-index:5;right:14px;top:14px;width:38px;height:38px;border-radius:50%;border:0;background:rgba(20,20,20,.88);color:#fff;font-size:20px;cursor:pointer}.player-meta{display:flex;justify-content:space-between;gap:20px;padding:13px 18px;color:#fff}.player-meta span{color:#aaa;font-size:13px}@media(max-width:800px){.modal-actions .secondary{display:inline-block}.modal-visual{height:280px}.player-overlay{padding:8px}.player-meta{padding:10px 12px}.video-shell iframe{width:200%;height:112.5%}}

/* Favorites */
.favorite-btn{width:43px;height:43px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.55);border-radius:50%;background:rgba(42,42,42,.72);color:#fff;font-size:25px;line-height:1;cursor:pointer;transition:.18s;flex:0 0 auto}.favorite-btn:hover{background:#fff;color:#111;transform:scale(1.06)}.favorite-btn.active{background:#fff;color:#e50914;border-color:#fff}.favorite-nav{font-size:24px}.favorite-nav.has-favorites{color:#fff}.favorite-nav.has-favorites:before{content:"";position:absolute;right:5px;top:5px;width:6px;height:6px;border-radius:50%;background:var(--red)}.favorites-view{padding-top:26px;min-height:52vh}.favorites-view .favorites-empty{max-width:650px;color:#aaa;line-height:1.65;padding:10px 8% 60px 0}.favorites-view .favorites-empty b{display:block;color:#fff;font-size:20px;margin-bottom:7px}.favorites-view .slider{flex-wrap:wrap;overflow:visible;padding-right:7%}.favorites-view .card{margin-bottom:5px}.view-title{font-size:28px!important;margin-bottom:18px!important}.card-fav{position:absolute;z-index:5;right:8px;top:8px;width:31px;height:31px;border-radius:50%;border:1px solid #ffffff80;background:#151515d9;color:#fff;font-size:18px;display:grid;place-items:center;cursor:pointer;opacity:0;transition:.18s}.card:hover .card-fav,.card-fav.active{opacity:1}.card-fav.active{color:#e50914;background:#fff}.card-fav:hover{transform:scale(1.08)}
@media(max-width:800px){.favorite-btn{width:40px;height:40px;font-size:22px}.favorite-nav{font-size:22px}.favorites-view .slider{flex-wrap:nowrap;overflow-x:auto}.card-fav{opacity:1}}

/* V5 — navegación, tooltips y botones compactos/cuadrados */
.icon-btn::before{content:attr(data-tooltip);position:absolute;left:48px;top:50%;transform:translateY(-50%) translateX(-5px);white-space:nowrap;background:#1d1d1d;color:#fff;border:1px solid #ffffff1f;border-radius:4px;padding:7px 10px;font-size:12px;font-weight:600;letter-spacing:.1px;opacity:0;pointer-events:none;transition:.16s;box-shadow:0 6px 22px #0009}
.icon-btn:hover::before{opacity:1;transform:translateY(-50%) translateX(0)}
.login-nav{margin-top:auto}
.favorite-btn{width:43px;height:43px;border-radius:5px}.favorite-btn:hover{transform:none}
.card-fav{border-radius:4px}
.special-view{padding-top:26px;min-height:55vh}.special-view .slider{flex-wrap:wrap;overflow:visible;padding-right:7%}.special-view .card{margin-bottom:6px}.special-kicker{font-size:13px;color:#aaa;margin:-8px 0 20px;max-width:700px;line-height:1.5}
@media(max-width:800px){.icon-btn::before{display:none}.login-nav{margin-top:0}.special-view .slider{flex-wrap:nowrap;overflow-x:auto}.favorite-btn{border-radius:5px}}

/* V6 — Login / Registro */
.login-nav svg{width:21px;height:21px;fill:currentColor;display:block;margin:auto}.auth-overlay{position:fixed;inset:0;z-index:220;background:rgba(0,0,0,.82);display:grid;place-items:center;padding:24px;opacity:0;pointer-events:none;transition:.2s}.auth-overlay.open{opacity:1;pointer-events:auto}.auth-card{width:min(440px,95vw);background:#171717;border-radius:8px;padding:34px;position:relative;box-shadow:0 25px 90px #000}.auth-close{position:absolute;right:14px;top:14px;width:34px;height:34px;border:0;border-radius:50%;background:#292929;color:#fff;cursor:pointer}.auth-logo{width:190px;height:70px;object-fit:contain;object-position:left;margin-bottom:12px}.auth-tabs{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid #383838;margin-bottom:24px}.auth-tab{border:0;background:transparent;color:#999;padding:12px 5px;font-weight:700;cursor:pointer;border-bottom:2px solid transparent}.auth-tab.active{color:#fff;border-bottom-color:var(--red)}.auth-form h2,.auth-user h2{margin:0 0 7px;font-size:25px}.auth-form>p,.auth-user p{color:#aaa;margin:0 0 22px;font-size:13px}.auth-form label{display:block;color:#ccc;font-size:12px;font-weight:600;margin:0 0 14px}.auth-form input{display:block;width:100%;margin-top:7px;border:1px solid #444;border-radius:4px;background:#242424;color:#fff;padding:12px 13px;outline:none}.auth-form input:focus{border-color:#aaa}.auth-submit{width:100%;margin-top:6px}.auth-message{min-height:18px;margin-top:12px;color:#ff8e94;font-size:12px}.auth-message.success{color:#83d89b}.hidden{display:none!important}.auth-user{text-align:center;padding:12px 0}.user-avatar{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;margin:0 auto 15px;background:#fff;color:var(--red);font-size:22px}.login-nav.logged-in{color:#fff}.login-nav.logged-in:after{content:"";position:absolute;right:5px;top:5px;width:7px;height:7px;border-radius:50%;background:#36c66a}
@media(max-width:800px){.login-nav svg{width:20px;height:20px}.auth-card{padding:28px 22px}.auth-logo{width:165px}}
/* V7 */
.auth-logo-wrap{text-align:center}.auth-logo{object-position:center;margin:0 auto 12px;display:block}.remember-row{display:flex!important;align-items:center;gap:8px;font-weight:500!important}.remember-row input{width:16px!important;height:16px;margin:0!important;accent-color:var(--red)}
.login-required{max-width:420px;text-align:center}.login-required h2{margin:4px 0 8px}.login-required p{color:#bbb;line-height:1.5}.login-required .primary{margin-top:8px}
.community-head{display:flex;align-items:center;justify-content:space-between;padding-right:7%;gap:20px}.publish-btn{white-space:nowrap}.community-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:16px;padding-right:7%;margin-top:18px}.community-card{background:#151515;border-radius:7px;overflow:hidden;min-width:0}.community-video{aspect-ratio:9/16;background:#000;position:relative}.community-video iframe{width:100%;height:100%;border:0}.community-info{padding:10px 11px 12px}.community-user{font-size:12px;color:#ccc;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.like-btn{margin-top:8px;border:0;background:transparent;color:#ddd;cursor:pointer;padding:4px 0;font-weight:700}.like-btn.liked{color:var(--red)}
.publish-overlay{position:fixed;inset:0;z-index:230;background:#000c;display:grid;place-items:center;padding:24px;opacity:0;pointer-events:none;transition:.2s}.publish-overlay.open{opacity:1;pointer-events:auto}.publish-card{position:relative;width:min(470px,95vw);background:#181818;border-radius:8px;padding:32px}.publish-card h2{margin:0 0 7px}.publish-card>p{color:#aaa;font-size:13px;margin:0 0 22px}.publish-card label{display:block;color:#ccc;font-size:12px;font-weight:600}.publish-card input{display:block;width:100%;margin:8px 0 14px;background:#242424;border:1px solid #444;color:#fff;border-radius:4px;padding:12px}.favorite-btn{border-radius:5px}.auth-card .favorite-btn{border-radius:5px}
@media(max-width:700px){.community-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.community-head{align-items:flex-start;flex-direction:column}.publish-btn{width:auto}}

/* V8 — Comunidad limpia, publicación instantánea y eliminación */
.community-grid{grid-template-columns:repeat(auto-fill,minmax(210px,260px));align-items:start;gap:20px}.community-card{background:#111;border:1px solid #ffffff12;border-radius:8px;overflow:hidden;box-shadow:0 10px 30px #0006;transition:transform .2s,border-color .2s}.community-card:hover{transform:translateY(-3px);border-color:#ffffff28}.community-video{aspect-ratio:9/16;background:#000;overflow:hidden;position:relative}.community-embed{position:absolute;inset:0;overflow:hidden;background:#000}.community-embed iframe{position:absolute;border:0;background:#000}.community-embed.platform-youtube iframe,.community-embed.platform-tiktok iframe{inset:0;width:100%;height:100%}.community-embed.platform-instagram iframe{width:calc(100% + 2px);height:calc(100% + 165px);left:-1px;top:-58px}.community-meta{min-height:58px;padding:9px 10px;display:flex;align-items:center;justify-content:space-between;gap:8px;background:#111}.community-user{display:flex;align-items:center;gap:8px;min-width:0;font-size:11px;color:#aaa}.community-user>span:last-child{min-width:0;display:flex;flex-direction:column}.community-user small{font-size:9px;color:#777;line-height:1.1}.community-user b{font-size:11px;color:#eee;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px}.community-avatar{width:27px;height:27px;border-radius:50%;display:grid;place-items:center;background:#252525;color:#fff;font-size:11px;font-weight:800;flex:0 0 auto}.community-actions{display:flex;align-items:center;gap:3px}.like-btn,.delete-post-btn{margin:0;border:0;background:transparent;color:#bbb;height:30px;min-width:30px;padding:0 6px;border-radius:4px;cursor:pointer;font-weight:700}.like-btn:hover,.delete-post-btn:hover{background:#ffffff10;color:#fff}.like-btn.liked{color:var(--red)}.delete-post-btn{font-size:17px}.publish-btn:disabled,.danger-btn:disabled,.auth-submit:disabled{opacity:.55;cursor:wait}.confirm-card{width:min(420px,95vw)}.confirm-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:24px}.confirm-actions .secondary{display:block}.danger-btn{border:0;border-radius:5px;padding:11px 19px;font-weight:700;font-size:15px;cursor:pointer;background:#e50914;color:#fff}.danger-btn:hover{background:#f21b25}@media(max-width:700px){.community-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding-right:4%}.community-meta{padding:7px}.community-avatar{display:none}.community-user b{max-width:78px}.community-embed.platform-instagram iframe{height:calc(100% + 145px);top:-50px}}
/* V9 — fix indicador favoritos + perfil + responsive */
.favorite-nav.has-favorites:before{content:attr(data-tooltip)!important;right:auto!important;top:50%!important;width:auto!important;height:auto!important;border-radius:4px!important;background:#1d1d1d!important}.favorite-nav.has-favorites:after{content:"";position:absolute;right:5px;top:5px;width:6px;height:6px;border-radius:50%;background:var(--red)}
.profile-avatar{width:72px;height:72px;border-radius:50%;overflow:hidden;display:grid;place-items:center;margin:0 auto 14px;background:#292929;font-size:28px;font-weight:800}.profile-avatar img{width:100%;height:100%;object-fit:cover}.profile-open{width:100%;margin-bottom:8px}.profile-card label{display:block;color:#ccc;font-size:12px;font-weight:600;margin:12px 0}.profile-card input,.profile-card textarea{display:block;width:100%;margin-top:7px;background:#242424;border:1px solid #444;color:#fff;border-radius:4px;padding:12px}.profile-card textarea{min-height:80px;resize:vertical}.profile-card hr{border:0;border-top:1px solid #333;margin:24px 0}.profile-card h3{margin:0 0 10px}
@media(max-width:600px){.rail{width:48px}.icon-btn{width:34px;height:34px;font-size:18px}.hero-content{left:70px;max-width:76vw}.hero-content h1{font-size:clamp(42px,13vw,72px)}.hero-content p{font-size:14px}.catalog{padding-left:70px}.card{min-width:190px}.modal{padding:8px}.modal-card{width:100%;max-height:94vh;overflow:auto}.modal-copy{padding:20px}.modal-actions{gap:7px;flex-wrap:wrap}.modal-actions button{font-size:13px;padding:10px 12px}.community-head{padding-right:2%}.community-grid{padding-right:2%}.auth-overlay,.publish-overlay{padding:10px}.auth-card,.publish-card{width:100%;max-height:94vh;overflow:auto}.search-inner{margin-left:55px;width:calc(100% - 70px)}}
/* V10 — favoritos estable + carruseles drag */
.favorite-nav.has-favorites:before{content:""!important;position:absolute!important;right:4px!important;top:4px!important;width:6px!important;height:6px!important;border-radius:50%!important;background:var(--red)!important;transform:none!important;padding:0!important;opacity:1!important}
.favorite-nav.active:after{content:""!important;position:absolute!important;width:18px!important;height:3px!important;border-radius:3px!important;background:var(--red)!important;left:9px!important;bottom:-4px!important;right:auto!important;top:auto!important}
.favorite-nav.has-favorites.active:before{right:4px!important;top:4px!important}
.slider{cursor:grab;user-select:none;touch-action:pan-y}.slider.dragging{cursor:grabbing;scroll-behavior:auto}.slider.dragging .card{pointer-events:none}.hero h1#heroTitle{line-height:.9;letter-spacing:-3px;max-width:620px}

/* V11 — Favoritos sin indicador de punto */
.favorite-nav.has-favorites:before,.favorite-nav.has-favorites:after{display:none!important;content:none!important}
.slider{cursor:grab;user-select:none;-webkit-user-select:none;touch-action:pan-y pinch-zoom}.slider.dragging{cursor:grabbing;scroll-behavior:auto}.slider.dragging .card{pointer-events:none}

/* V12 — Corazones SVG uniformes en las tarjetas y el modal */
.card-fav,.favorite-btn{display:grid;place-items:center;line-height:0;padding:0}
.card-fav .heart-icon,.favorite-btn .heart-icon{display:block;width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.card-fav.active .heart-icon,.favorite-btn.active .heart-icon{fill:currentColor}
.card-fav{width:34px;height:34px}

.view-counter{display:block;margin-top:5px;opacity:.85;font-size:12px}
