:root{
    --bg:#070a12;
    --panel:#101522;
    --panel-2:#151c2e;
    --text:#f5f7fb;
    --muted:#8e99ad;
    --line:rgba(255,255,255,.09);
    --accent:#7c3aed;
    --accent-2:#06b6d4;
    --danger:#ef4444;
    --radius:24px;
}
*{box-sizing:border-box}
body{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text);background:var(--bg);}
.login-body,.app-body{min-height:100vh;background:
    radial-gradient(circle at top left, rgba(124,58,237,.28), transparent 35%),
    radial-gradient(circle at 80% 10%, rgba(6,182,212,.18), transparent 28%),
    linear-gradient(135deg,#050711 0%,#0b1020 55%,#070a12 100%);}
.glass-card{background:linear-gradient(180deg,rgba(18,25,42,.92),rgba(10,14,25,.88));border:1px solid var(--line);box-shadow:0 24px 70px rgba(0,0,0,.35);backdrop-filter:blur(18px);border-radius:var(--radius);}
.login-shell{min-height:100vh;display:grid;place-items:center;padding:24px;}
.login-card{width:min(440px,100%);padding:34px;}
.brand-badge,.nav-logo{width:54px;height:54px;border-radius:18px;display:grid;place-items:center;background:linear-gradient(135deg,var(--accent),var(--accent-2));box-shadow:0 16px 45px rgba(124,58,237,.35);font-size:24px;color:#fff;}
.nav-logo{width:38px;height:38px;border-radius:14px;font-size:18px;box-shadow:none;}
.login-card h1,.hero-card h1{font-weight:850;letter-spacing:-.04em;margin:0;}
.form-label{color:#dbe3f5;font-weight:650;font-size:.92rem;}
.input-premium .input-group-text,.input-premium .form-control{background:rgba(255,255,255,.06);border-color:var(--line);color:var(--text);}
.input-premium .form-control{min-height:52px;}
.input-premium .form-control:focus{box-shadow:0 0 0 .25rem rgba(124,58,237,.18);border-color:rgba(124,58,237,.55);background:rgba(255,255,255,.08);color:#fff;}
.btn-premium{border:0;color:#fff;font-weight:800;border-radius:18px;background:linear-gradient(135deg,var(--accent),var(--accent-2));box-shadow:0 14px 36px rgba(124,58,237,.32);}
.btn-premium:hover{color:#fff;filter:brightness(1.07);}
.app-nav{background:rgba(5,7,17,.82);backdrop-filter:blur(18px);border-bottom:1px solid var(--line);}
.hero-card{padding:24px;display:flex;gap:18px;align-items:center;justify-content:space-between;}
.eyebrow{font-size:.78rem;color:#a78bfa;text-transform:uppercase;letter-spacing:.16em;font-weight:800;margin-bottom:6px;}
.hero-card p,.content-head p{color:var(--muted);margin:6px 0 0;}
.search-box{width:min(420px,82vw);height:50px;border:1px solid var(--line);background:rgba(255,255,255,.06);border-radius:999px;display:flex;align-items:center;padding:0 16px;gap:10px;color:var(--muted);}
.search-box input{border:0;outline:0;background:transparent;color:#fff;width:100%;}
.search-box input::placeholder{color:#707b90;}
.premium-tabs{gap:10px;overflow:auto;flex-wrap:nowrap;padding-bottom:4px;}
.premium-tabs .nav-link{white-space:nowrap;border-radius:999px;color:#cbd5e1;background:rgba(255,255,255,.06);border:1px solid var(--line);font-weight:750;padding:12px 18px;}
.premium-tabs .nav-link.active{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#fff;box-shadow:0 12px 32px rgba(124,58,237,.25);}
.layout-grid{display:grid;grid-template-columns:300px 1fr;gap:18px;align-items:start;}
.category-panel,.content-panel{padding:18px;}
.category-panel{position:sticky;top:86px;max-height:calc(100vh - 106px);overflow:auto;}
.panel-title{font-weight:800;color:#dbeafe;margin:8px 0 12px;font-size:.9rem;}
.category-list{display:flex;flex-direction:column;gap:8px;}
.category-btn{width:100%;border:1px solid transparent;background:rgba(255,255,255,.055);color:#cbd5e1;border-radius:16px;padding:11px 12px;text-align:left;font-weight:650;display:flex;align-items:center;justify-content:space-between;gap:10px;}
.category-btn:hover,.category-btn.active{background:rgba(124,58,237,.18);border-color:rgba(124,58,237,.38);color:#fff;}
.content-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:16px;}
.content-head h2{font-size:1.25rem;margin:0;font-weight:850;letter-spacing:-.02em;}
.media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:14px;}
.media-card{position:relative;overflow:hidden;border-radius:20px;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.035));border:1px solid var(--line);min-height:220px;cursor:pointer;transition:.18s transform,.18s border-color,.18s background;}
.media-card:hover{transform:translateY(-3px);border-color:rgba(6,182,212,.45);background:linear-gradient(180deg,rgba(124,58,237,.16),rgba(255,255,255,.04));}
.poster{height:138px;background:#111827;display:grid;place-items:center;overflow:hidden;}
.poster img{width:100%;height:100%;object-fit:cover;display:block;}
.poster .poster-icon{font-size:42px;color:#64748b;}
.media-body{padding:12px;}
.media-title{font-size:.95rem;font-weight:800;line-height:1.25;margin-bottom:7px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:38px;}
.media-meta{font-size:.78rem;color:var(--muted);display:flex;align-items:center;gap:6px;}
.play-chip{position:absolute;top:10px;right:10px;border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.48);color:#fff;border-radius:999px;padding:6px 9px;backdrop-filter:blur(10px);}
.empty-state{border:1px dashed rgba(255,255,255,.14);border-radius:20px;padding:34px;text-align:center;color:var(--muted);grid-column:1/-1;}
.loading{grid-column:1/-1;color:var(--muted);padding:30px;text-align:center;}
.player-modal{background:#080c16;color:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:0 30px 90px rgba(0,0,0,.65);}
.video-player{width:100%;aspect-ratio:16/9;background:#000;border-radius:18px;outline:0;}
.season-block{border:1px solid var(--line);border-radius:20px;overflow:hidden;margin-bottom:12px;background:rgba(255,255,255,.035);}
.season-title{padding:13px 15px;background:rgba(255,255,255,.055);font-weight:850;}
.episode-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px;padding:12px;}
.episode-btn{border:1px solid var(--line);background:rgba(255,255,255,.05);color:#fff;border-radius:15px;padding:11px;text-align:left;font-weight:650;}
.episode-btn:hover{border-color:rgba(6,182,212,.45);background:rgba(6,182,212,.12);}
.skeleton-lines::before,.skeleton-lines::after{content:"";display:block;height:42px;border-radius:16px;background:linear-gradient(90deg,rgba(255,255,255,.04),rgba(255,255,255,.09),rgba(255,255,255,.04));margin-bottom:8px;animation:pulse 1.2s infinite;}
.skeleton-lines::after{width:78%;}
@keyframes pulse{0%,100%{opacity:.55}50%{opacity:1}}
@media(max-width:992px){.hero-card{display:block}.hero-actions{margin-top:16px}.layout-grid{grid-template-columns:1fr}.category-panel{position:relative;top:auto;max-height:none}.category-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.media-grid{grid-template-columns:repeat(auto-fill,minmax(145px,1fr));}.poster{height:126px}}
@media(max-width:576px){.login-card{padding:24px}.hero-card{padding:18px;border-radius:20px}.category-list{grid-template-columns:1fr}.content-panel,.category-panel{padding:14px;border-radius:20px}.media-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.media-card{min-height:205px;border-radius:18px}.poster{height:115px}.media-body{padding:10px}.media-title{font-size:.88rem}.search-box{width:100%}.episode-list{grid-template-columns:1fr}.premium-tabs .nav-link{padding:10px 14px}}

/* Player track controls */
.player-tools{border:1px solid var(--line);background:rgba(255,255,255,.035);border-radius:18px;padding:14px;}
.track-grid{display:grid;grid-template-columns:1fr 1fr 190px;gap:12px;align-items:end;}
.track-label{font-size:.78rem;font-weight:800;color:#cbd5e1;margin-bottom:6px;display:block;}
.premium-select{background:rgba(255,255,255,.07);border-color:var(--line);color:#fff;border-radius:13px;min-height:40px;}
.premium-select:focus{background:rgba(255,255,255,.09);border-color:rgba(6,182,212,.55);color:#fff;box-shadow:0 0 0 .2rem rgba(6,182,212,.12);}
.premium-select option{background:#0b1020;color:#fff;}
.btn-premium-soft{border:1px solid rgba(6,182,212,.35);color:#e0faff;background:linear-gradient(135deg,rgba(124,58,237,.25),rgba(6,182,212,.18));border-radius:13px;font-weight:800;min-height:40px;}
.btn-premium-soft:hover{color:#fff;border-color:rgba(6,182,212,.65);filter:brightness(1.08);}
.player-notice{margin-top:12px;border-radius:14px;padding:10px 12px;font-size:.86rem;border:1px solid var(--line);color:#dbeafe;background:rgba(255,255,255,.045);}
.player-notice-info{border-color:rgba(6,182,212,.25);background:rgba(6,182,212,.08);}
.player-notice-ok{border-color:rgba(34,197,94,.28);background:rgba(34,197,94,.08);color:#dcfce7;}
.player-notice-warn{border-color:rgba(245,158,11,.32);background:rgba(245,158,11,.09);color:#fdecc8;}
@media(max-width:768px){.track-grid{grid-template-columns:1fr}.btn-premium-soft{width:100%;}}

.quick-player-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .6rem;
}

.quick-player-actions .btn {
    border-radius: 999px;
    padding: .55rem .85rem;
    font-weight: 700;
}

.btn-vlc {
    color: #fff;
    border: 1px solid rgba(255, 148, 54, .55);
    background: linear-gradient(135deg, rgba(255, 148, 54, .25), rgba(255, 103, 34, .12));
}

.btn-vlc:hover {
    color: #fff;
    border-color: rgba(255, 148, 54, .9);
    background: linear-gradient(135deg, rgba(255, 148, 54, .38), rgba(255, 103, 34, .2));
}

.btn-mx {
    color: #fff;
    border: 1px solid rgba(67, 176, 255, .55);
    background: linear-gradient(135deg, rgba(67, 176, 255, .25), rgba(0, 214, 201, .12));
}

.btn-mx:hover {
    color: #fff;
    border-color: rgba(67, 176, 255, .9);
    background: linear-gradient(135deg, rgba(67, 176, 255, .38), rgba(0, 214, 201, .2));
}

@media (max-width: 576px) {
    .quick-player-actions .btn {
        flex: 1 1 calc(50% - .6rem);
        white-space: nowrap;
    }
}

.stat-card {
    padding: 1rem;
    border-radius: 1.25rem;
    background: rgba(255, 255, 255, .055);
    border: 1px solid rgba(255, 255, 255, .08);
    min-height: 100px;
}

.stat-value {
    font-size: 2rem;
    line-height: 1;
    font-weight: 900;
    color: #fff;
}

.stat-label {
    margin-top: .45rem;
    color: rgba(255, 255, 255, .62);
    font-size: .9rem;
}


.version-chip{
    align-items:center;
    justify-content:center;
    padding:.35rem .7rem;
    border-radius:999px;
    font-size:.75rem;
    font-weight:800;
    letter-spacing:.04em;
    color:#8ee8ff;
    background:rgba(14,165,233,.14);
    border:1px solid rgba(125,211,252,.35);
    box-shadow:0 0 24px rgba(14,165,233,.14);
}

.hero-quick-actions{
    display:flex;
    gap:.65rem;
    flex-wrap:wrap;
    justify-content:flex-end;
}

.update-card{
    max-width:760px;
    margin:4rem auto;
    padding:1.5rem;
}

.update-list{
    display:grid;
    gap:.75rem;
    margin-top:1rem;
}

.update-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
    padding:.85rem 1rem;
    border-radius:1rem;
    background:rgba(255,255,255,.06);
    border:1px solid rgba(255,255,255,.08);
}

.update-row strong{
    color:#fff;
}

@media (max-width: 576px){
    .hero-actions{width:100%;}
    .hero-quick-actions{justify-content:stretch;width:100%;}
    .hero-quick-actions .btn{flex:1 1 auto;}
    .navbar .container-fluid{gap:.5rem;}
}

.codec-row{
    margin-top:.55rem;
    display:flex;
    align-items:center;
    gap:.4rem;
    flex-wrap:wrap;
}

.codec-badge{
    display:inline-flex;
    align-items:center;
    gap:.3rem;
    width:max-content;
    max-width:100%;
    border-radius:999px;
    padding:.22rem .5rem;
    font-size:.68rem;
    font-weight:900;
    letter-spacing:.02em;
    line-height:1.1;
    border:1px solid rgba(255,255,255,.12);
    white-space:nowrap;
}

.codec-ok{
    color:#9fffd2;
    background:rgba(34,197,94,.13);
    border-color:rgba(34,197,94,.35);
}

.codec-mid{
    color:#cfe7ff;
    background:rgba(59,130,246,.13);
    border-color:rgba(96,165,250,.32);
}

.codec-risk{
    color:#ffe08a;
    background:rgba(245,158,11,.16);
    border-color:rgba(245,158,11,.42);
}

@media (max-width:576px){
    .codec-badge{font-size:.62rem;}
}