.re-header{
    position:fixed;
    z-index:9999;
    top:0;
    left:0;
    right:0;
    height:64px;
    border-bottom:1px solid transparent;
    transition:.3s;
}

.re-header.scrolled{
    background:rgba(0,0,0,.8);
    border-color:var(--border);
    backdrop-filter:blur(24px);
}

.re-header-inner{
    height:100%;
    padding:0 22px;
    display:flex;
    align-items:center;
    gap:14px;
}

.re-logo{
    font-size:25px;
    font-weight:900;
    letter-spacing:-1.5px;
}

.re-menu-btn{
    width:40px;
    height:40px;
    padding:10px;
    background:none;
    border:0;
}

.re-menu-btn span{
    display:block;
    width:20px;
    height:2px;
    margin:4px 0;
    background:white;
}

.re-search-trigger{
    width:320px;
    margin-left:10px;
    padding:10px 14px;
    display:flex;
    gap:10px;
    align-items:center;

    color:#aaa;
    background:rgba(0,0,0,.4);

    border:1px solid rgba(255,255,255,.2);
    border-radius:12px;
}

.re-search-trigger kbd{
    margin-left:auto;
}

.re-signin{
    margin-left:auto;
    padding:9px 18px;
    border-radius:8px;
    background:var(--primary);
    color:#000;
    font-weight:800;
}

.re-dock{
    position:fixed;
    z-index:1000;
    top:50%;
    left:16px;

    transform:translateY(-50%);

    padding:12px;

    display:flex;
    flex-direction:column;
    gap:10px;

    background:rgba(10,10,10,.9);
    backdrop-filter:blur(30px);

    border:1px solid var(--border);
    border-radius:999px;
}

.re-dock a,
.re-dock button{
    position:relative;
    width:42px;
    height:42px;

    display:flex;
    align-items:center;
    justify-content:center;

    border:0;
    border-radius:50%;
    background:none;

    color:#777;
    cursor:pointer;
}

.re-dock a:hover{
    color:white;
    background:rgba(255,255,255,.06);
}

.re-dock em{
    display:none;
    position:absolute;
    left:55px;

    padding:7px 11px;

    background:#0a0a0a;
    border:1px solid var(--border);
    border-radius:7px;

    color:white;
    font-size:11px;
    font-style:normal;
}

.re-dock a:hover em{
    display:block;
}

.re-search-modal{
    position:fixed;
    z-index:20000;
    inset:0;
    background:rgba(0,0,0,.85);
    backdrop-filter:blur(15px);
}

.re-search-box{
    width:min(700px,90%);
    margin:100px auto;
}

.re-search-box input{
    width:100%;
    padding:20px;
    color:white;
    background:#111;
    border:1px solid #333;
    border-radius:14px;
    outline:none;
}

@media(max-width:1023px){
    .re-dock{display:none}
}

@media(max-width:640px){

    .re-search-trigger{
        width:42px;
        margin-left:auto;
    }

    .re-search-trigger span:nth-child(2),
    .re-search-trigger kbd{
        display:none;
    }

    .re-signin{
        margin-left:0;
    }
}
/* =========================
   INDEX / FALLBACK
========================= */

.re-index{
    min-height:100vh;
    padding:110px 0 80px;
    background:#000;
}

.re-index-header{
    margin-bottom:28px;
}

.re-index-header h1{
    margin:6px 0 0;
    color:#fff;
    font-size:32px;
    line-height:1.1;
    letter-spacing:-.04em;
}

.re-index-header h1 span{
    color:var(--primary);
}

.re-index-post{
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:10px;
    background:#0d0d0f;
}

.re-index-post-image{
    display:block;
    aspect-ratio:16/9;
    overflow:hidden;
}

.re-index-post-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform .35s ease;
}

.re-index-post:hover
.re-index-post-image img{
    transform:scale(1.04);
}

.re-index-post-content{
    padding:16px;
}

.re-index-post-content h2{
    margin:0 0 8px;
    font-size:15px;
}

.re-index-post-content h2 a:hover{
    color:var(--primary);
}

.re-index-post-excerpt{
    color:#888;
    font-size:11px;
    line-height:1.6;
}

.re-pagination{
    margin-top:40px;
}

.re-pagination .nav-links{
    display:flex;
    justify-content:center;
    gap:6px;
}

.re-pagination .page-numbers{
    min-width:38px;
    height:38px;

    padding:0 10px;

    display:flex;
    align-items:center;
    justify-content:center;

    border:1px solid var(--border);
    border-radius:6px;

    background:#0d0d0f;
    color:#888;

    font-size:11px;
    font-weight:800;
}

.re-pagination .page-numbers:hover,
.re-pagination .page-numbers.current{
    border-color:var(--primary);
    background:var(--primary);
    color:#000;
}

.re-empty-state{
    min-height:55vh;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    text-align:center;
}

.re-empty-icon{
    margin-bottom:14px;
    color:var(--primary);
    font-size:55px;
}

.re-empty-state h1{
    margin:0;
    font-size:30px;
}

.re-empty-state p{
    margin:10px 0 22px;
    color:#777;
}

@media(max-width:600px){

    .re-index{
        padding-top:85px;
    }

    .re-index-header h1{
        font-size:25px;
    }
}
/* FOOTER */

.re-footer{
    position:relative;
    border-top:1px solid var(--border);
    background:#070708;
}

.re-footer-top{
    padding:50px 0 38px;

    display:flex;
    justify-content:space-between;
    gap:60px;
}

.re-footer-brand{
    max-width:380px;
}

.re-footer-logo{
    font-size:24px;
    font-weight:900;
    letter-spacing:-1.5px;
}

.re-footer-brand p{
    margin:12px 0 0;

    color:#71717a;
    font-size:11px;
    line-height:1.7;
}

.re-footer-links{
    display:flex;
    gap:70px;
}

.re-footer-links > div{
    min-width:120px;

    display:flex;
    flex-direction:column;
    gap:9px;
}

.re-footer-links strong{
    margin-bottom:4px;

    color:#fff;
    font-size:10px;

    text-transform:uppercase;
    letter-spacing:.1em;
}

.re-footer-links a{
    color:#71717a;
    font-size:11px;
}

.re-footer-links a:hover{
    color:var(--primary);
}

.re-footer-bottom{
    padding:18px 0;

    display:flex;
    justify-content:space-between;

    border-top:1px solid var(--border);

    color:#52525b;
    font-size:9px;
}

@media(max-width:600px){

    .re-footer-top{
        padding:35px 0;
        flex-direction:column;
        gap:30px;
    }

    .re-footer-links{
        gap:35px;
    }

    .re-footer-bottom{
        gap:10px;
        flex-direction:column;
    }
}
/* 404 */

.re-404{
    position:relative;

    min-height:100vh;

    display:flex;
    align-items:center;

    overflow:hidden;

    background:#000;
}

.re-404-glow{
    position:absolute;

    top:50%;
    left:50%;

    width:500px;
    height:500px;

    transform:translate(-50%,-50%);

    border-radius:50%;

    background:rgba(232,255,71,.07);

    filter:blur(100px);
}

.re-404-inner{
    position:relative;
    z-index:2;

    text-align:center;
}

.re-404-code{
    display:block;

    color:var(--primary);

    font-size:clamp(90px,18vw,220px);
    line-height:.8;

    font-weight:950;

    letter-spacing:-.09em;

    opacity:.12;
}

.re-404 h1{
    margin:10px 0;

    font-size:clamp(35px,5vw,60px);
    letter-spacing:-.05em;
}

.re-404 p{
    max-width:450px;

    margin:0 auto;

    color:#71717a;

    font-size:12px;
    line-height:1.7;
}

.re-404-actions{
    margin-top:25px;

    display:flex;
    justify-content:center;
    gap:8px;
}
/* BROWSE */

.re-browse{
    min-height:100vh;
    padding:110px 0 80px;
}

.re-browse-header{
    margin-bottom:25px;
}

.re-browse-header h1{
    margin:5px 0;

    font-size:38px;
    letter-spacing:-.05em;
}

.re-browse-header p{
    margin:0;
    color:#71717a;
    font-size:11px;
}

.re-filter{
    margin-bottom:20px;
    padding:10px;

    display:grid;

    grid-template-columns:
        minmax(220px,1fr)
        150px
        150px
        130px
        auto;

    gap:7px;

    border:1px solid var(--border);
    border-radius:9px;

    background:#0b0b0d;
}

.re-filter-search{
    display:flex;
    align-items:center;
    gap:8px;

    padding:0 11px;

    border:1px solid var(--border);
    border-radius:6px;

    background:#111113;
}

.re-filter input,
.re-filter select{
    width:100%;

    min-height:39px;

    outline:0;

    border:1px solid var(--border);
    border-radius:6px;

    background:#111113;
    color:#ccc;

    padding:0 10px;

    font-size:10px;
}

.re-filter-search input{
    min-height:37px;

    padding:0;

    border:0;

    background:transparent;
}

.re-filter button{
    padding:0 16px;

    border:0;
    border-radius:6px;

    background:var(--primary);
    color:#000;

    font-size:10px;
    font-weight:900;

    cursor:pointer;
}

.re-browse-toolbar{
    margin-bottom:17px;

    display:flex;
    justify-content:space-between;

    color:#71717a;
    font-size:10px;
}

.re-browse-toolbar strong{
    color:#aaa;
}

.re-browse-toolbar a{
    color:var(--primary);
}

.re-browse-empty{
    min-height:350px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    color:#71717a;
}

.re-browse-empty h2{
    margin:0 0 7px;
    color:#fff;
}

@media(max-width:900px){

    .re-filter{
        grid-template-columns:
            1fr 1fr;
    }

    .re-filter-search{
        grid-column:1 / -1;
    }
}

@media(max-width:600px){

    .re-browse{
        padding-top:85px;
    }

    .re-browse-header h1{
        font-size:30px;
    }

    .re-filter{
        grid-template-columns:1fr 1fr;
    }

    .re-filter button{
        min-height:39px;
        grid-column:1 / -1;
    }
}
/* =========================================
   COMMON PAGE HEADER
========================================= */

.re-page-head{
    margin-bottom:28px;
}

.re-page-head h1{
    margin:5px 0 6px;

    font-size:38px;
    line-height:1;

    letter-spacing:-.045em;
}

.re-page-head p{
    margin:0;
    color:#71717a;
    font-size:11px;
}


/* SEARCH */

.re-search-page{
    min-height:100vh;
    padding:110px 0 80px;
}

.re-big-search{
    margin-bottom:30px;
    padding:7px 7px 7px 14px;

    display:flex;
    align-items:center;
    gap:10px;

    border:1px solid var(--border);
    border-radius:9px;

    background:#0c0c0e;
}

.re-big-search input{
    min-width:0;
    min-height:42px;

    flex:1;

    border:0;
    outline:0;

    background:transparent;
    color:#fff;
}

.re-big-search button{
    min-height:38px;
    padding:0 20px;

    border:0;
    border-radius:6px;

    background:var(--primary);
    color:#000;

    font-size:10px;
    font-weight:900;
}


/* LIBRARY */

.re-library-page{
    min-height:100vh;
    padding:110px 0 80px;
}

.re-library-head{
    display:flex;
    align-items:end;
    justify-content:space-between;
}

.re-clear-library{
    padding:8px 12px;

    border:1px solid var(--border);
    border-radius:6px;

    background:#0d0d0f;
    color:#777;

    font-size:9px;

    cursor:pointer;
}

.re-clear-library:hover{
    border-color:#555;
    color:#fff;
}

.re-library-grid,
.re-continue-page-grid{
    display:grid;
    grid-template-columns:repeat(6,1fr);
    gap:22px 12px;
}

.re-library-poster{
    position:relative;

    display:block;
    aspect-ratio:2/3;

    overflow:hidden;

    border-radius:8px;

    background:#111;
}

.re-library-poster img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.re-library-play,
.re-history-play{
    position:absolute;
    top:50%;
    left:50%;

    width:42px;
    height:42px;

    display:flex;
    align-items:center;
    justify-content:center;

    transform:translate(-50%,-50%);

    border-radius:50%;

    background:var(--primary);
    color:#000;

    opacity:0;

    transition:.2s;
}

.re-library-poster:hover
.re-library-play,
.re-history-poster:hover
.re-history-play{
    opacity:1;
}

.re-library-info{
    padding-top:8px;
}

.re-library-info strong{
    display:block;

    overflow:hidden;

    font-size:11px;

    white-space:nowrap;
    text-overflow:ellipsis;
}

.re-library-info button,
.re-history-info button{
    margin-top:5px;
    padding:0;

    border:0;

    background:none;
    color:#666;

    font-size:8px;

    cursor:pointer;
}

.re-library-info button:hover,
.re-history-info button:hover{
    color:#fff;
}


/* CONTINUE WATCHING */

.re-history-poster{
    position:relative;

    display:block;

    aspect-ratio:16/9;

    overflow:hidden;

    border-radius:8px;

    background:#111;
}

.re-history-poster img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.re-history-progress{
    position:absolute;
    right:0;
    bottom:0;
    left:0;

    height:3px;

    background:#292929;
}

.re-history-progress i{
    display:block;
    height:100%;

    background:var(--primary);
}

.re-history-info{
    padding-top:8px;
}

.re-history-info strong{
    display:block;

    overflow:hidden;

    font-size:11px;

    white-space:nowrap;
    text-overflow:ellipsis;
}

.re-history-info span{
    display:block;

    margin-top:4px;

    color:#71717a;
    font-size:9px;
}


/* SCHEDULE */

.re-schedule{
    min-height:100vh;
    padding:110px 0 80px;
}

.re-day-tabs{
    margin-bottom:24px;

    display:grid;
    grid-template-columns:repeat(7,1fr);
    gap:6px;
}

.re-day-tabs button{
    min-height:60px;

    border:1px solid var(--border);
    border-radius:7px;

    background:#0c0c0e;
    color:#71717a;

    cursor:pointer;
}

.re-day-tabs small{
    display:none;
}

.re-day-tabs strong{
    font-size:9px;
}

.re-day-tabs button.active{
    border-color:var(--primary);
    background:var(--primary);
    color:#000;
}

.re-schedule-title{
    margin-bottom:12px;

    display:flex;
    align-items:center;
    gap:9px;
}

.re-schedule-title h2{
    margin:0;
    font-size:20px;
}

.re-schedule-title span{
    padding:3px 6px;

    border-radius:4px;

    background:var(--primary);
    color:#000;

    font-size:7px;
    font-weight:900;
}

.re-schedule-list{
    border:1px solid var(--border);
    border-radius:9px;

    overflow:hidden;

    background:#0b0b0d;
}

.re-schedule-item{
    min-height:74px;
    padding:9px 14px;

    display:flex;
    align-items:center;
    gap:13px;

    border-bottom:1px solid var(--border);

    transition:.2s;
}

.re-schedule-item:last-child{
    border-bottom:0;
}

.re-schedule-item:hover{
    background:#121214;
}

.re-schedule-time{
    width:65px;

    color:var(--primary);

    font-size:11px;
    font-weight:900;
}

.re-schedule-item img{
    width:37px;
    height:52px;

    border-radius:4px;

    object-fit:cover;
}

.re-schedule-info{
    min-width:0;
    flex:1;
}

.re-schedule-info strong{
    display:block;

    overflow:hidden;

    font-size:11px;

    white-space:nowrap;
    text-overflow:ellipsis;
}

.re-schedule-info small{
    display:block;

    margin-top:5px;

    color:#666;
    font-size:8px;
}

.re-schedule-arrow{
    color:#555;
    font-size:20px;
}

.re-schedule-empty{
    padding:60px;

    border:1px solid var(--border);
    border-radius:9px;

    color:#666;

    text-align:center;
}


/* RESPONSIVE */

@media(max-width:1100px){

    .re-library-grid{
        grid-template-columns:repeat(5,1fr);
    }

    .re-continue-page-grid{
        grid-template-columns:repeat(4,1fr);
    }
}

@media(max-width:750px){

    .re-library-grid{
        grid-template-columns:repeat(4,1fr);
    }

    .re-continue-page-grid{
        grid-template-columns:repeat(3,1fr);
    }

    .re-day-tabs strong{
        display:none;
    }

    .re-day-tabs small{
        display:block;
        font-size:8px;
    }
}

@media(max-width:600px){

    .re-search-page,
    .re-library-page,
    .re-schedule{
        padding-top:85px;
    }

    .re-page-head h1{
        font-size:29px;
    }

    .re-library-grid{
        grid-template-columns:repeat(3,1fr);
        gap:17px 8px;
    }

    .re-continue-page-grid{
        grid-template-columns:repeat(2,1fr);
        gap:17px 8px;
    }

    .re-day-tabs{
        gap:4px;
    }

    .re-day-tabs button{
        min-height:45px;
    }

    .re-schedule-time{
        width:48px;
        font-size:9px;
    }

    .re-schedule-item{
        padding:8px;
    }
}
/* ==================================================
   HEADER / MOBILE DRAWER SAFETY
================================================== */

.re-mobile-menu,
.re-mobile-overlay{
    display:none;
}

@media(min-width:1024px){

    .re-mobile-menu,
    .re-mobile-overlay{
        display:none !important;
    }

}

.re-header{
    position:fixed;
    z-index:10000;

    top:0;
    right:0;
    left:0;

    width:100%;
    height:64px;

    background:linear-gradient(
        to bottom,
        rgba(0,0,0,.82),
        rgba(0,0,0,.15)
    );
}

.re-header.scrolled{
    background:rgba(5,5,6,.88);

    border-bottom:
        1px solid rgba(255,255,255,.08);

    backdrop-filter:blur(22px);
}

.re-header-inner{
    width:min(1536px,calc(100% - 40px));
    height:64px;

    margin:auto;
    padding:0;

    display:flex;
    align-items:center;
}

.re-menu-btn{
    flex:0 0 40px;
}

.re-logo{
    flex:0 0 auto;

    color:#fff !important;

    font-size:22px;
    font-weight:950;
}

.re-search-trigger{
    margin-left:30px;
}

.re-signin{
    margin-left:auto;
}
/* ==================================================
   FOOTER FIX
================================================== */

.re-footer{
    position:relative;

    width:100%;

    margin-top:80px;

    border-top:
        1px solid rgba(255,255,255,.07);

    background:#080809;
}

.re-footer .re-container{
    width:min(1400px,calc(100% - 40px));
}

.re-footer-top{
    min-height:190px;
    padding:48px 0 38px;

    display:grid;
    grid-template-columns:minmax(260px,1fr) auto;
    gap:80px;
}

.re-footer-brand{
    max-width:420px;
}

.re-footer-logo{
    display:inline-block;

    color:#fff !important;

    font-size:22px;
    font-weight:950;

    letter-spacing:-.04em;
}

.re-footer-brand p{
    max-width:360px;

    margin:13px 0 0;

    color:#73737d;

    font-size:11px;
    line-height:1.7;
}

.re-footer-links{
    display:grid;
    grid-template-columns:repeat(2,150px);
    gap:40px;
}

.re-footer-links > div{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:10px;
}

.re-footer-links strong{
    margin-bottom:4px;

    color:#fff;

    font-size:9px;
    font-weight:900;

    letter-spacing:.12em;
    text-transform:uppercase;
}

.re-footer-links a{
    display:block;

    color:#777780 !important;

    font-size:10px;
}

.re-footer-links a:hover{
    color:var(--primary) !important;
}

.re-footer-bottom{
    min-height:55px;
    padding:17px 0;

    display:flex;
    align-items:center;
    justify-content:space-between;

    border-top:
        1px solid rgba(255,255,255,.06);

    color:#52525b;

    font-size:9px;
}

@media(max-width:700px){

    .re-footer{
        margin-top:50px;
    }

    .re-footer-top{
        grid-template-columns:1fr;
        gap:30px;
    }

    .re-footer-links{
        grid-template-columns:1fr 1fr;
    }

    .re-footer-bottom{
        align-items:flex-start;
        flex-direction:column;
        gap:5px;
    }
}
