:root{font-family:system-ui,-apple-system,Segoe UI,sans-serif;color:#f4f5fa;background:#0d1220}*{box-sizing:border-box}body{margin:0}header{display:flex;align-items:center;justify-content:space-between;padding:20px max(24px,calc((100vw - 1250px)/2));background:#141c2d;border-bottom:1px solid #283348;gap:20px}a{color:inherit;text-decoration:none}.brand{font-weight:900;letter-spacing:1px;font-size:21px}.brand span{color:#56b9ef}nav{display:flex;gap:22px;flex-wrap:wrap}nav a:hover{color:#56b9ef}main{max-width:1250px;margin:auto;padding:28px 24px 60px}.hero{background:linear-gradient(110deg,#1c3154,#151e33);padding:34px;border-radius:16px}.hero h1{font-size:34px;margin:0}.hero p,.muted{color:#a6b2c7}.stats{display:flex;gap:45px;margin-top:28px;flex-wrap:wrap}.stats div{display:flex;flex-direction:column}.stats b{font-size:25px}.stats small{color:#a6b2c7}.toolbar{display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;margin:28px 0}.toolbar form,.actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}input,select,textarea{background:#1b2639;color:white;border:1px solid #40506b;border-radius:8px;padding:11px;font:inherit;max-width:100%}button,.button{background:#268ccf;border:0;border-radius:8px;color:white;padding:11px 16px;cursor:pointer;font:inherit;display:inline-block}.secondary{background:#34425b}.danger{background:#a42d44;margin-top:30px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:22px}.movie{background:#182235;border-radius:12px;overflow:hidden;transition:transform .15s}.movie:hover{transform:translateY(-4px)}.poster{aspect-ratio:2/3;background:#28364e}.poster img,.bigposter{width:100%;height:100%;object-fit:cover}.placeholder{display:grid;place-items:center;height:100%;font-size:65px}.movieinfo{padding:12px}.movieinfo strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.movieinfo span{display:block;color:#aab8cc;font-size:13px;margin-top:5px}.details{display:grid;grid-template-columns:260px 1fr;gap:35px}.bigposter{border-radius:12px;aspect-ratio:2/3;background:#27354a}.details h1{font-size:36px;margin:0 0 18px}.details h1 span{font-weight:400}.details p{line-height:1.65}.pill{background:#293b55;padding:7px 12px;border-radius:18px;display:inline-block;margin:3px}.tmdb{margin-top:30px;padding:20px;background:#172238;border-radius:12px}.result{display:flex;align-items:center;gap:14px;border-bottom:1px solid #36435a;padding:12px 0}.result img{width:45px;min-height:60px;object-fit:cover}.result span{flex:1}.editor{display:grid;gap:16px;max-width:760px}.editor label{display:grid;gap:7px}.editor input,.editor textarea,.editor select{width:100%}code{overflow-wrap:anywhere;color:#91caff}footer{padding:25px;text-align:center;color:#8795aa;font-size:12px}.empty{grid-column:1/-1;padding:40px;text-align:center;color:#aab8cc}@media(max-width:700px){header{flex-direction:column;align-items:flex-start}.details{grid-template-columns:1fr}.details>div:first-child{max-width:230px}.hero h1{font-size:27px}.toolbar form input{width:100%}}

.notice{padding:14px 18px;margin:16px 0;border-radius:10px;background:#18364a;color:#fff}

.library-list{display:grid;gap:14px;margin:20px 0}.library-card{background:#182331;border:1px solid #33465c;border-radius:15px;padding:20px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}.library-card h3{margin:0 0 10px}.library-card p{overflow-wrap:anywhere}.library-form{display:grid;gap:12px;min-width:min(480px,100%)}.library-form label{display:grid;gap:6px}.library-form input{width:100%;padding:10px}.library-card .actions{display:flex;align-items:center;flex-wrap:wrap;gap:8px}

.player-controls{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:12px 0}.player-controls select{min-width:160px;max-width:100%;padding:9px;border-radius:8px}.player-controls label{font-weight:600}.player-controls button{cursor:pointer}#moviePlayer{background:#080b13;border-radius:10px;max-height:70vh}

/* Reproductor integrado v1.4 */
.cinema-player{position:relative;background:#080d17;border-radius:14px;overflow:hidden;aspect-ratio:16/9;color:#fff;isolation:isolate}
.cinema-player video{display:block;width:100%;height:100%;object-fit:contain;background:#05070b}
.cinema-center{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}
.cinema-center button{pointer-events:auto;border:0;border-radius:100%;width:76px;height:76px;background:#111b2bba;color:#fff;font-size:32px;cursor:pointer}
.cinema-player:has(video:not([src])) .cinema-center{display:grid}
.cinema-player:has(video[src]) .cinema-center{opacity:0;transition:opacity .2s}
.cinema-player:has(video[src]):hover .cinema-center{opacity:1}
.cinema-controls{position:absolute;bottom:0;left:0;right:0;padding:20px 14px 10px;background:linear-gradient(transparent,#000e);display:grid;gap:8px;opacity:1}
.cinema-timeline{display:flex;gap:7px;align-items:center;font-variant-numeric:tabular-nums;font-size:12px}
.cinema-timeline input{flex:1;min-width:40px;accent-color:#39a8ff;cursor:pointer}
.cinema-buttons{display:flex;gap:7px;align-items:center}
.cinema-buttons button,.cinema-settings button,.cinema-resume button{background:#182a41c9;color:white;border:1px solid #ffffff38;border-radius:8px;padding:7px 11px;cursor:pointer}
.cinema-buttons button:hover,.cinema-settings button:hover{background:#286298}
.cinema-spacer{flex:1}
#movieVolume{width:75px;accent-color:#39a8ff}
.cinema-settings,.cinema-resume{position:absolute;right:15px;bottom:80px;width:min(330px,calc(100% - 30px));background:#111e2ef2;border:1px solid #ffffff3b;padding:15px;border-radius:12px;display:grid;gap:10px;z-index:4}
.cinema-settings[hidden],.cinema-resume[hidden],.cinema-loading[hidden]{display:none!important}
.cinema-settings select{width:100%;padding:8px;background:#f8fafc;color:#111827;border-radius:6px}
.cinema-loading{position:absolute;top:15px;left:15px;background:#000a;padding:10px;border-radius:8px}
.cinema-player:fullscreen{aspect-ratio:auto;width:100vw;height:100vh}
@media(max-width:540px){.cinema-buttons{gap:3px}.cinema-buttons button{padding:6px;font-size:12px}#movieVolume{width:45px}.cinema-center button{width:58px;height:58px}}

/* Videoteca v1.5: fullscreen cinema and auto-hiding controls */
.cinema-player:fullscreen,
.cinema-player:-webkit-full-screen{width:100vw;height:100vh;max-height:none;aspect-ratio:auto;border-radius:0;background:#000;display:flex;align-items:center;justify-content:center}
.cinema-player:fullscreen #moviePlayer,
.cinema-player:-webkit-full-screen #moviePlayer{width:100%;height:100%;max-height:none!important;object-fit:contain;border-radius:0;position:absolute;inset:0}
.cinema-player:fullscreen .cinema-controls{z-index:5;bottom:0;left:0;right:0;padding:22px 24px 18px;transition:opacity .25s ease,visibility .25s ease}
.cinema-player:fullscreen.controls-hidden .cinema-controls{opacity:0;visibility:hidden;pointer-events:none}
.cinema-player:fullscreen.controls-hidden{cursor:none}
.cinema-player:fullscreen .cinema-center{z-index:2}
.cinema-player:fullscreen .cinema-settings,.cinema-player:fullscreen .cinema-resume{z-index:8}
.cinema-player video::cue{color:#fff;background:rgba(0,0,0,.6);font-size:clamp(16px,2.2vw,30px);text-shadow:1px 2px 3px #000}
.cinema-player:fullscreen video::cue{font-size:clamp(18px,2.2vw,34px)}

/* Videoteca v1.5 - Ocultar boton central durante reproduccion */
.cinema-player:has(video[src]:not(:paused)) .cinema-center,
.cinema-player:has(video[src]:not(:paused)):hover .cinema-center {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
}




/* Videoteca v1.5 - Control de volumen corregido */
#movieVolume {
    -webkit-appearance: none;
    appearance: none;
    width: 100px;
    min-width: 100px;
    height: 6px;
    padding: 0;
    margin: 0;
    background: #555;
    border-radius: 4px;
    cursor: pointer;
    outline: none;
}

#movieVolume::-webkit-slider-runnable-track {
    height: 6px;
    background: transparent;
    border-radius: 4px;
}

#movieVolume::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 14px;
    height: 14px;
    margin-top: -4px;
    border: none;
    border-radius: 50%;
    background: #39a8ff;
    cursor: pointer;
}

#movieVolume::-moz-range-track {
    height: 6px;
    background: #555;
    border-radius: 4px;
}

#movieVolume::-moz-range-thumb {
    width: 14px;
    height: 14px;
    border: none;
    border-radius: 50%;
    background: #39a8ff;
}

@media (max-width: 540px) {
    #movieVolume {
        width: 65px;
        min-width: 65px;
    }
}




/* Videoteca - Relleno de volumen unificado */
#movieVolume {
    background: linear-gradient(
        to right,
        #39a8ff 0%,
        #39a8ff var(--volumen-porcentaje, 100%),
        #555 var(--volumen-porcentaje, 100%),
        #555 100%
    ) !important;
}

#movieVolume::-webkit-slider-runnable-track {
    background: transparent !important;
}

/* Videoteca v1.5 - Barra de volumen gris */
#movieVolume {
    background: #555 !important;
}

#movieVolume::-webkit-slider-runnable-track {
    background: transparent !important;
}

#movieVolume::-webkit-slider-thumb {
    background: #39a8ff !important;
}


/* Videoteca v2.1: volumen con relleno proporcional, sin alterar su longitud */
#movieVolume {background:linear-gradient(to right,#39a8ff 0%,#39a8ff var(--volumen-porcentaje,100%),#555 var(--volumen-porcentaje,100%),#555 100%) !important;}
#movieVolume::-webkit-slider-runnable-track {background:transparent !important;}
#movieVolume::-moz-range-track {background:transparent !important;}
.cinema-loading {z-index:6;top:50%;left:50%;transform:translate(-50%,-50%);background:#101c2eea;border:1px solid #ffffff55;padding:18px 24px;border-radius:12px;font-weight:600;box-shadow:0 10px 35px #0008;pointer-events:none;text-align:center;}
.cinema-loading::before {content:"";display:block;width:26px;height:26px;margin:0 auto 12px;border:3px solid #ffffff55;border-top-color:#39a8ff;border-radius:50%;animation:videoteca-spin .8s linear infinite;}
@keyframes videoteca-spin {to{transform:rotate(360deg)}}

/* Videoteca v2.1.1 - Relleno de volumen definitivo */
#movieVolume {
    -webkit-appearance: none !important;
    appearance: none !important;
    width: 100px;
    min-width: 100px;
    height: 6px;
    padding: 0;
    border-radius: 4px;
    background: linear-gradient(
        to right,
        #39a8ff 0%,
        #39a8ff var(--volumen-porcentaje, 100%),
        #555 var(--volumen-porcentaje, 100%),
        #555 100%
    ) !important;
}

#movieVolume::-webkit-slider-runnable-track {
    background: transparent !important;
    height: 6px;
}

#movieVolume::-moz-range-track {
    background: transparent !important;
    height: 6px;
}

@media (max-width: 540px) {
    #movieVolume {
        width: 65px;
        min-width: 65px;
    }
}

/* Videoteca v2.2 - Progreso de reproduccion bajo cada caratula */
.movie .watch-progress {height:5px;background:#555;overflow:hidden;width:100%;}
.movie .watch-progress-fill {height:100%;background:#39a8ff;border-radius:0 3px 3px 0;}

/* Videoteca v2.2.1 - Texto del progreso */
.watch-progress-text {
    font-size: 12px;
    color: #aebed6;
    margin: 4px 10px 2px;
    line-height: 1.4;
}

/* Videoteca v2.2.1 - Progreso debajo del titulo */
.movie > .watch-progress {
    margin: 8px 10px 0;
}

.movie > .watch-progress-text {
    margin: 4px 10px 10px;
    font-size: 12px;
    color: #aebed6;
}

/* Videoteca v2.2.2 - Barra de progreso centrada */
.movie > .watch-progress {
    margin-left: 10px !important;
    margin-right: 10px !important;
    width: calc(100% - 20px) !important;
    box-sizing: border-box !important;
}

/* Videoteca v2.3 - revisión de desaparecidas */
.missing-list{display:grid;gap:10px;margin:18px 0 26px}.missing-item{display:flex;align-items:flex-start;gap:14px;padding:15px;background:#172237;border:1px solid #33445e;border-radius:10px;cursor:pointer}.missing-item input{margin-top:4px;flex-shrink:0}.missing-item span{min-width:0}.missing-item small{display:block;color:#a6b2c7;overflow-wrap:anywhere;margin-top:5px}


/* Mantener el ultimo fotograma durante los saltos */
.cinema-freeze {
    position:absolute;
    inset:0;
    z-index:1;
    background-color:#05070b;
    background-position:center;
    background-repeat:no-repeat;
    background-size:contain;
    pointer-events:none;
}
.cinema-freeze[hidden] {
    display:none!important;
}
.cinema-loading {
    z-index:6;
}


/* Ocultar cursor durante reproduccion a pantalla completa */
.cinema-player:fullscreen.controls-hidden,
.cinema-player:fullscreen.controls-hidden * {
    cursor: none !important;
}