﻿
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        body {
            background-color: #141414;
            color: #e5e5e5;
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            line-height: 1.4;
        }

        a {
            color: #e5e5e5;
            text-decoration: none;
            transition: color 0.2s ease;
        }

        a:hover {
            color: #b3b3b3;
        }

        img {
            max-width: 100%;
            display: block;
        }

        /* Container */
        .container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 20px;
        }

        /* Header */
        header {
            background-color: #101010;
            padding: 15px 0;
            border-bottom: 1px solid #333;
        }

        .header-content {
            display: flex;
            justify-content: space-between;
            align-items: center;
        }

        .logo {
            font-size: 2em;
            font-weight: bold;
            color: #e50914;
        }

        .menu-icon,
        .search-icon {
            font-size: 1.5em;
            cursor: pointer;
        }

        /* Main Content & Sections */
        main {
            padding: 30px 0;
        }

        .featured-section {
            margin-bottom: 40px;
        }

        .section-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 20px;
            padding-left: 10px;
            border-left: 4px solid #e50914;
        }

        .section-header h2 {
            font-size: 1.4em;
            font-weight: 600;
        }

        .see-all {
            font-size: 0.9em;
            color: #aaa;
            text-transform: uppercase;
        }

        .see-all:hover {
            color: #fff;
        }

        .video-container {
            position: relative;
            width: 100%;
            aspect-ratio: 16 / 9; /* Jaga rasio agar selalu fit 16:9 */
            background-color: #000;
            margin-bottom: 30px;
            margin-top: 30px;
            border-radius: 4px;
            overflow: hidden;
        }

        .video-container iframe {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            border: 20;
        }

        .video-placeholder {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            display: flex;
            justify-content: center;
            align-items: center;
        }

        .play-button {
            font-size: 4em;
            color: rgba(255, 255, 255, 0.8);
            cursor: pointer;
            transition: color 0.2s ease;
        }

        .play-button:hover {
            color: rgba(255, 255, 255, 1);
        }

        /* Movie Details Section */
        .movie-details {
            display: flex;
            margin-bottom: 30px;
            gap: 30px;
        }

        .movie-poster {
            flex: 0 0 250px;
        }

        .movie-poster img {
            width: 100%;
            border-radius: 4px;
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
        }

        .movie-info {
            flex: 1;
        }

        .movie-title {
            font-size: 2em;
            margin-bottom: 10px;
        }

        .movie-meta {
            display: flex;
            gap: 15px;
            margin-bottom: 15px;
            color: #aaa;
            font-size: 0.9em;
        }

        .movie-rating {
            display: flex;
            align-items: center;
            color: #ffb400;
        }

        .movie-rating i {
            margin-right: 5px;
        }

        .movie-description {
            margin-bottom: 20px;
            color: #b3b3b3;
            line-height: 1.6;
        }

        .movie-cast, .movie-genres {
            margin-bottom: 15px;
        }

        .movie-cast span, .movie-genres span {
            color: #aaa;
            font-weight: bold;
            margin-right: 5px;
        }

        .action-buttons {
            display: flex;
            gap: 15px;
            margin-top: 20px;
        }

        .action-button {
            padding: 10px 20px;
            border-radius: 4px;
            font-weight: bold;
            cursor: pointer;
            display: flex;
            align-items: center;
            gap: 8px;
            transition: background-color 0.2s ease;
        }

        .watch-button {
            background-color: #e50914;
            color: #fff;
        }

        .watch-button:hover {
            background-color: #f40612;
        }

        .add-button {
            background-color: #333;
            color: #fff;
        }

        .add-button:hover {
            background-color: #444;
        }

        /* Items Grid - Reused from original CSS */
        .items-grid {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
            gap: 20px;
        }

        .item {
            background-color: #181818;
            border-radius: 4px;
            overflow: hidden;
            transition: transform 0.2s ease;
            position: relative;
        }

        .item:hover {
           transform: scale(1.03);
        }

        .poster-container {
            position: relative;
        }

        .poster-container img {
            aspect-ratio: 2 / 3;
            object-fit: cover;
            background-color: #333;
            width: 100%;
        }

        .rating {
            position: absolute;
            top: 8px;
            right: 8px;
            background-color: rgba(255, 180, 0, 0.9);
            color: #000;
            padding: 3px 7px;
            border-radius: 3px;
            font-size: 0.8em;
            font-weight: bold;
            display: flex;
            align-items: center;
        }

        .rating i {
            margin-right: 4px;
            font-size: 0.8em;
        }

        .item h3 {
            font-size: 0.95em;
            margin: 10px 10px 5px 10px;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        .item p.date {
            font-size: 0.8em;
            color: #aaa;
            margin: 0 10px 10px 10px;
        }

        /* Episode List */
        .episode-list {
            margin-bottom: 40px;
        }

        .episode {
            display: flex;
            margin-bottom: 15px;
            padding-bottom: 15px;
            border-bottom: 1px solid #333;
        }

        .episode-number {
            flex: 0 0 50px;
            font-size: 1.5em;
            font-weight: bold;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .episode-thumbnail {
            flex: 0 0 180px;
            margin-right: 20px;
            position: relative;
        }

        .episode-thumbnail img {
            width: 100%;
            aspect-ratio: 16 / 9;
            object-fit: cover;
            border-radius: 4px;
        }

        .episode-info {
            flex: 1;
        }

        .episode-title {
            font-size: 1.1em;
            margin-bottom: 5px;
        }

        .episode-meta {
            font-size: 0.8em;
            color: #aaa;
            margin-bottom: 10px;
        }

        .episode-description {
            font-size: 0.9em;
            color: #b3b3b3;
        }

        /* Comments Section */
        .comments-section {
            margin-bottom: 40px;
        }

        .comment {
            padding: 15px;
            background-color: #1a1a1a;
            border-radius: 4px;
            margin-bottom: 15px;
        }

        .comment-header {
            display: flex;
            justify-content: space-between;
            margin-bottom: 10px;
        }

        .comment-user {
            font-weight: bold;
        }

        .comment-date {
            font-size: 0.8em;
            color: #aaa;
        }

        .comment-text {
            font-size: 0.95em;
            color: #b3b3b3;
        }

        .comment-form textarea {
            width: 100%;
            padding: 15px;
            background-color: #1a1a1a;
            border: 1px solid #333;
            border-radius: 4px;
            color: #e5e5e5;
            font-family: inherit;
            margin-bottom: 15px;
            resize: vertical;
            min-height: 100px;
        }

        .comment-form button {
            padding: 10px 20px;
            background-color: #e50914;
            color: #fff;
            border: none;
            border-radius: 4px;
            cursor: pointer;
            font-weight: bold;
        }

        .comment-form button:hover {
            background-color: #f40612;
        }

        /* Footer */
        footer {
            background-color: #101010;
            padding: 30px 0;
            margin-top: 40px;
            text-align: center;
            border-top: 1px solid #333;
        }

        footer .description {
            max-width: 800px;
            margin: 0 auto 25px auto;
            font-size: 0.85em;
            color: #aaa;
            line-height: 1.6;
        }

        .footer-nav a {
            margin: 0 12px;
            font-size: 0.9em;
            color: #aaa;
        }

        .footer-nav a:hover {
            color: #fff;
        }

        footer .copyright {
            margin-top: 20px;
            font-size: 0.8em;
            color: #777;
        }

        /* Footer Description Blocks */
        .detailed-description {
            max-width: 1100px;
            margin: 0 auto 28px auto;
            text-align: left;
        }

        .detailed-description h4 {
            font-size: 1.25em;
            margin: 0 0 18px 0;
            color: #e5e5e5;
            line-height: 1.4;
        }

        .detailed-description p,
        .detailed-description li {
            font-size: 0.85em;
            color: #9a9a9a;
            line-height: 1.75;
        }

        .detailed-description p {
            margin: 0 0 12px 0;
        }

        .detailed-description h5 {
            font-size: 0.98em;
            margin: 0 0 8px 0;
            color: #e50914;
            text-transform: uppercase;
            letter-spacing: 0.04em;
        }

        .detailed-description ul {
            list-style: none;
            padding: 0;
            margin: 0;
        }

        .detailed-description ul li {
            padding-left: 16px;
            position: relative;
        }

        .detailed-description ul li::before {
            content: '\2022';
            position: absolute;
            left: 4px;
            color: #e50914;
        }

        .detailed-description a {
            color: #e5e5e5;
            text-decoration: underline;
        }

        .detailed-description a:hover {
            color: #e50914;
        }

        .footer-intro p {
            font-size: 0.9em;
            color: #b3b3b3;
            margin-bottom: 22px;
        }

        .footer-blocks {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
            gap: 22px 28px;
        }

        .footer-block {
            background-color: #181818;
            border: 1px solid #262626;
            border-radius: 6px;
            padding: 16px 18px;
        }

        .footer-cta {
            margin-top: 24px;
            padding-top: 18px;
            border-top: 1px solid #262626;
        }

        .footer-cta p {
            color: #b3b3b3;
            margin: 0;
        }

        .footer-nav {
            border-top: 1px solid #262626;
            padding-top: 18px;
        }

        /* Static Pages (About, Contact, DMCA, dst) */
        .static-page {
            max-width: 900px;
            margin: 0 auto 40px auto;
            text-align: left;
        }

        .breadcrumb-nav {
            display: flex;
            align-items: center;
            gap: 8px;
            font-size: 0.8em;
            color: #777;
            margin: 18px 0 10px 0;
            flex-wrap: wrap;
        }

        .breadcrumb-nav a {
            color: #aaa;
            text-decoration: none;
        }

        .breadcrumb-nav a:hover {
            color: #e50914;
        }

        .breadcrumb-nav .current {
            color: #e5e5e5;
        }

        .static-page-title {
            font-size: 1.7em;
            color: #fff;
            margin: 0 0 20px 0;
            line-height: 1.3;
        }

        .static-page-content {
            background-color: #141414;
            border: 1px solid #262626;
            border-radius: 8px;
            padding: 24px 26px;
        }

        .static-page-content h2 {
            font-size: 1.2em;
            color: #e5e5e5;
            margin: 26px 0 10px 0;
        }

        .static-page-content h3 {
            font-size: 1.05em;
            color: #e50914;
            margin: 20px 0 8px 0;
        }

        .static-page-content h2:first-child,
        .static-page-content h3:first-child {
            margin-top: 0;
        }

        .static-page-content p,
        .static-page-content li {
            font-size: 0.92em;
            color: #b3b3b3;
            line-height: 1.8;
        }

        .static-page-content p {
            margin: 0 0 14px 0;
        }

        .static-page-content ul,
        .static-page-content ol {
            padding-left: 22px;
            margin: 0 0 16px 0;
        }

        .static-page-content li {
            margin-bottom: 8px;
        }

        .static-page-content a {
            color: #e50914;
        }

        .static-page-content code {
            background-color: #232323;
            color: #e5e5e5;
            padding: 2px 6px;
            border-radius: 3px;
            font-size: 0.9em;
            word-break: break-word;
        }

        .static-page-empty {
            color: #aaa;
            font-style: italic;
        }

        /* Favourites & Watch Later */
        .poster-actions {
            position: absolute;
            top: 6px;
            left: 6px;
            display: flex;
            flex-direction: column;
            gap: 6px;
            z-index: 3;
        }

        .library-button {
            width: 30px;
            height: 30px;
            border: none;
            border-radius: 50%;
            background-color: rgba(20, 20, 20, 0.75);
            color: #e5e5e5;
            font-size: 0.8em;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            transition: background-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
        }

        .library-button:hover {
            background-color: #e50914;
            color: #fff;
            transform: scale(1.08);
        }

        .library-button.is-active {
            background-color: #e50914;
            color: #fff;
        }

        .library-button-large {
            width: auto;
            height: auto;
            border-radius: 4px;
            padding: 10px 20px;
            font-size: 1em;
            font-weight: bold;
            gap: 8px;
            background-color: #333;
        }

        .library-button-large:hover {
            background-color: #444;
        }

        .library-button-large.is-active {
            background-color: #e50914;
            color: #fff;
        }

        .library-page {
            margin-bottom: 40px;
        }

        .library-toolbar {
            display: flex;
            align-items: center;
            gap: 12px;
        }

        .library-total {
            background-color: #232323;
            color: #e5e5e5;
            border-radius: 12px;
            padding: 3px 12px;
            font-size: 0.8em;
            font-weight: 600;
        }

        .library-clear {
            background-color: transparent;
            border: 1px solid #333;
            color: #aaa;
            border-radius: 4px;
            padding: 5px 12px;
            font-size: 0.8em;
            cursor: pointer;
            transition: color 0.2s ease, border-color 0.2s ease;
        }

        .library-clear:hover {
            color: #e50914;
            border-color: #e50914;
        }

        .library-note {
            color: #aaa;
            font-size: 0.85em;
            line-height: 1.7;
            margin-bottom: 20px;
            background-color: #141414;
            border-left: 3px solid #e50914;
            padding: 12px 16px;
            border-radius: 4px;
        }

        .library-empty {
            text-align: center;
            padding: 40px 20px;
            background-color: #141414;
            border: 1px dashed #333;
            border-radius: 8px;
            color: #aaa;
        }

        .library-empty i {
            font-size: 2em;
            color: #3a3a3a;
            margin-bottom: 12px;
            display: block;
        }

        .library-empty-links {
            display: flex;
            gap: 10px;
            justify-content: center;
            flex-wrap: wrap;
            margin-top: 18px;
        }

        .library-empty-links .action-button {
            margin: 0;
        }

        .library-toast {
            position: fixed;
            left: 50%;
            bottom: 26px;
            transform: translate(-50%, 20px);
            background-color: rgba(20, 20, 20, 0.95);
            border: 1px solid #e50914;
            color: #e5e5e5;
            padding: 10px 20px;
            border-radius: 4px;
            font-size: 0.85em;
            opacity: 0;
            pointer-events: none;
            transition: opacity 0.25s ease, transform 0.25s ease;
            z-index: 2000;
        }

        .library-toast.is-visible {
            opacity: 1;
            transform: translate(-50%, 0);
        }

        .menu-count {
            margin-left: auto;
            background-color: #e50914;
            color: #fff;
            border-radius: 10px;
            padding: 1px 8px;
            font-size: 0.7em;
            font-weight: 700;
        }

        .type-tabs {
            display: flex;
            gap: 8px;
            flex-wrap: wrap;
        }

        .type-tab {
            background-color: #181818;
            border: 1px solid #2a2a2a;
            color: #aaa;
            text-decoration: none;
            padding: 7px 16px;
            border-radius: 4px;
            font-size: 0.85em;
            transition: color 0.2s ease, border-color 0.2s ease, background-color 0.2s ease;
        }

        .type-tab:hover {
            color: #e5e5e5;
            border-color: #e50914;
        }

        .type-tab.active {
            background-color: #e50914;
            border-color: #e50914;
            color: #fff;
            font-weight: 600;
        }

        .listing-intro {
            color: #aaa;
            font-size: 0.85em;
            line-height: 1.7;
            margin: -6px 0 22px 0;
            max-width: 760px;
        }

        @media (max-width: 768px) {
            .detailed-description h4 {
                font-size: 1.1em;
            }

            .static-page-content {
                padding: 18px;
            }

            .static-page-title {
                font-size: 1.35em;
            }

            .poster-actions {
                top: 4px;
                left: 4px;
                gap: 4px;
            }

            .library-button {
                width: 26px;
                height: 26px;
                font-size: 0.72em;
            }
        }

        /* Responsiveness */
        @media (max-width: 768px) {
            .container {
                padding: 0 15px;
            }
            
            .movie-details {
                flex-direction: column;
            }
            
            .movie-poster {
                flex: 0 0 auto;
                margin-bottom: 20px;
                max-width: 200px;
            }
            
            .items-grid {
                grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
                gap: 15px;
            }
            
            .section-header h2 {
                font-size: 1.2em;
            }
            
            .item h3 {
                font-size: 0.9em;
            }
            
            .episode {
                flex-direction: column;
            }
            
            .episode-thumbnail {
                margin-bottom: 10px;
                flex: 0 0 auto;
            }
            
            .episode-number {
                display: none;
            }
        }

        @media (max-width: 480px) {
            .logo {
                font-size: 1.5em;
            }
            
            .menu-icon, .search-icon {
                font-size: 1.3em;
            }
            
            .items-grid {
                grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
                gap: 10px;
            }
            
            .footer-nav a {
                margin: 0 8px;
                font-size: 0.8em;
            }
            
            footer .description {
               font-size: 0.8em;
            }
            
            .movie-title {
                font-size: 1.5em;
            }
            
            .action-buttons {
                flex-direction: column;
            }
        }

/* Server Selection Buttons */
.server-selection {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin-bottom: 30px;
    flex-wrap: wrap; 
}

.server-button {
    padding: 8px 20px;
    background-color: #333;
    color: #fff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 600;
    transition: background-color 0.2s ease;
    margin-bottom: 10px;
}

.server-button:hover {
    background-color: #444;
}

.server-button.active {
    background-color: #e50914;
}

.server-button.active:hover {
    background-color: #f40612;
}

/* Media query untuk layar kecil */
@media (max-width: 480px) {
    .server-selection {
        gap: 10px;
    }
    
    .server-button {
        flex: 0 0 calc(33.33% - 10px); /* 3 tombol per baris pada mobile */
        padding: 8px 10px;
        font-size: 0.9em;
    }
}

/* Search Overlay Styles */
.search-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.95);
    z-index: 1000;
    display: none;
    overflow-y: auto;
}

.search-container {
    max-width: 800px;
    margin: 60px auto 0;
    padding: 20px;
}

.search-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.search-header h2 {
    color: #e5e5e5;
    font-size: 1.5em;
}

#search-close {
    font-size: 1.5em;
    color: #aaa;
    cursor: pointer;
    transition: color 0.2s ease;
}

#search-close:hover {
    color: #e5e5e5;
}

.search-input-container {
    position: relative;
    margin-bottom: 30px;
}

.search-input-container i {
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translateY(-50%);
    color: #aaa;
    font-size: 1.2em;
}

#search-input {
    width: 100%;
    padding: 15px 15px 15px 45px;
    background-color: #333;
    border: none;
    border-radius: 4px;
    color: #e5e5e5;
    font-size: 1.1em;
}

#search-input:focus {
    outline: none;
    box-shadow: 0 0 0 2px rgba(229, 9, 20, 0.5);
}

#search-results {
    padding: 10px 0;
}

.loading, .error, .no-results {
    padding: 20px;
    text-align: center;
    color: #aaa;
    font-size: 1.1em;
}

.search-section {
    margin-bottom: 30px;
}

.search-section h3 {
    font-size: 1.2em;
    margin-bottom: 15px;
    padding-left: 10px;
    border-left: 3px solid #e50914;
}

.search-items {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.search-item {
    display: flex;
    background-color: #181818;
    border-radius: 4px;
    overflow: hidden;
    transition: transform 0.2s ease;
}

.search-item:hover {
    transform: scale(1.01);
    background-color: #222;
}

.search-poster {
    flex: 0 0 80px;
}

.search-poster img {
    width: 100%;
    height: 120px;
    object-fit: cover;
}

.search-info {
    flex: 1;
    padding: 10px 15px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.search-info h4 {
    margin-bottom: 5px;
    font-size: 1em;
}

.search-info p {
    color: #aaa;
    font-size: 0.9em;
}

.search-info .rating {
    color: #ffb400;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .search-container {
        margin: 30px auto 0;
        padding: 15px;
    }
}

@media (max-width: 480px) {
    .search-item {
        flex-direction: column;
    }
    
    .search-poster {
        flex: 0 0 auto;
    }
    
    .search-poster img {
        width: 100%;
        height: auto;
        aspect-ratio: 16/9;
    }
}

/* PAGINATION */
.pagination{display:flex;justify-content:center;margin-top:30px;margin-bottom:30px;flex-wrap:wrap;font-family:Roboto,sans-serif}.pagination .page-ellipsis,.pagination a.page-link{margin:0 5px;padding:8px 15px;text-decoration:none;color:#ff3b30;border:1px solid #ffcdd2;border-radius:4px;transition:.3s;box-shadow:0 2px 5px rgba(255,0,0,.1);font-weight:600}.pagination a.page-link:hover{background-color:#ffebee;transform:translateY(-2px);box-shadow:0 4px 8px rgba(255,0,0,.15)}.pagination a.page-link.active{background-color:#e50914;color:#fff;border-color:#e50914;box-shadow:0 4px 8px rgba(229,9,20,.3)}.pagination .page-ellipsis{border:none;padding:8px 5px;color:#e50914;box-shadow:none}.pagination a.page-link.next,.pagination a.page-link.prev{background-color:#ffebee;font-weight:700;padding:8px 20px}.pagination a.page-link.next:hover,.pagination a.page-link.prev:hover{background-color:#ffcdd2}@media (max-width:768px){.pagination{gap:8px}.pagination .page-ellipsis,.pagination a.page-link{margin:0 2px;padding:6px 12px}}

/* MEMILIH SEASON DI HALAMAN ARTICLE */
.season-selector{display:flex;align-items:center;gap:10px;position:relative}.season-selector span{color:#aaa;font-size:.9em;font-weight:600}#season-selector{background-color:#232323;color:#e5e5e5;border:1px solid #333;border-radius:4px;padding:6px 30px 6px 12px;font-size:.9em;cursor:pointer;appearance:none;-webkit-appearance:none;-moz-appearance:none;position:relative;transition:border-color .2s;outline:0}#season-selector:hover{border-color:#e50914}#season-selector:focus{border-color:#e50914;box-shadow:0 0 0 2px rgba(229,9,20,.3)}.season-selector::after{content:'â¼';font-size:.7em;color:#e50914;position:absolute;right:12px;top:50%;transform:translateY(-50%);pointer-events:none}@media (max-width:768px){.section-header{flex-direction:column;align-items:flex-start;gap:12px}#season-selector,.season-selector{width:100%}}

/* MENU MEMILIH DETAIL EPISODE DAN SEASON */
.episode-detail{margin-bottom:30px;background-color:#181818;border-radius:6px;padding:20px;box-shadow:0 5px 15px rgba(0,0,0,.3)}.show-info{margin-bottom:25px}.show-title{font-size:1.8em;margin-bottom:10px}.show-title a{color:#e5e5e5;transition:color .2s}.show-title a:hover{color:#e50914}.episode-header h2{font-size:1.3em;color:#b3b3b3;margin-bottom:10px;font-weight:500}.episode-meta{font-size:.9em;color:#aaa;margin-bottom:15px}.episode-description{color:#b3b3b3;line-height:1.6;margin-bottom:20px}#episode-select,#season-select,.nav-button{background-color:#232323;color:#e5e5e5;font-size:.9em;cursor:pointer}.episode-navigation{display:flex;justify-content:flex-start;align-items:center;gap:20px;margin-bottom:25px;flex-wrap:wrap}.episode-selector,.season-selector{display:flex;align-items:center;gap:10px;position:relative}.episode-selector label,.season-selector label{color:#aaa;font-size:.9em;font-weight:600}#episode-select,#season-select{border:1px solid #333;border-radius:4px;padding:8px 35px 8px 12px;appearance:none;-webkit-appearance:none;-moz-appearance:none;position:relative;transition:border-color .2s,box-shadow .2s;outline:0;min-width:200px}#episode-select{min-width:300px}#episode-select:hover,#season-select:hover{border-color:#e50914}#episode-select:focus,#season-select:focus{border-color:#e50914;box-shadow:0 0 0 2px rgba(229,9,20,.3)}.episode-selector::after,.season-selector::after{content:'â¼';font-size:.7em;color:#e50914;position:absolute;right:12px;top:50%;transform:translateY(-50%);pointer-events:none}.episode-pagination{display:flex;justify-content:space-between;align-items:center;margin-top:20px;gap:10px}.nav-button{padding:10px 16px;border-radius:4px;font-weight:600;transition:background-color .2s,color .2s;display:flex;align-items:center;gap:8px;text-decoration:none}.nav-button:hover{background-color:#e50914;color:#fff}.nav-button.disabled,.nav-button.disabled:hover{background-color:#1a1a1a;color:#777}.nav-button.disabled{opacity:.5;cursor:not-allowed}.nav-button.all-episodes{background-color:#333}.nav-button.all-episodes:hover,.nav-button.next-episode{background-color:#e50914}.nav-button i{font-size:.8em}@media (max-width:768px){.episode-navigation{flex-direction:column;align-items:flex-start;gap:15px}.episode-selector,.season-selector{width:100%}#episode-select,#season-select{width:100%;min-width:unset}.episode-pagination{flex-direction:column;width:100%}.nav-button{width:100%;justify-content:center}}@media (max-width:480px){.episode-header h2{font-size:1.1em}.show-title{font-size:1.4em}}

/* SIDE MENU SAMPING */
.side-menu-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,0.7);z-index:1000;display:none}.side-menu{position:fixed;top:0;left:-300px;width:280px;height:100%;background-color:#141414;overflow-y:auto;transition:left .3s ease;z-index:1001;box-shadow:0 0 15px rgba(0,0,0,.5)}.side-menu-header{display:flex;justify-content:space-between;align-items:center;padding:20px;background-color:#101010;border-bottom:1px solid #333}.side-menu-header h2{color:#e50914;font-size:1.3em;margin:0}#side-menu-close{font-size:1.3em;color:#aaa;cursor:pointer;transition:color .2s ease}#side-menu-close:hover{color:#e5e5e5}.side-menu-nav ul{list-style:none;padding:0;margin:0}.side-menu-nav li{border-bottom:1px solid #222}.side-menu-nav li.menu-divider{height:20px;background-color:#101010;border-bottom:none}.side-menu-nav a{display:flex;align-items:center;padding:15px 20px;color:#e5e5e5;text-decoration:none;transition:background-color .2s ease}.side-menu-nav a:hover{background-color:#232323;color:#e50914}.side-menu-nav i{margin-right:12px;width:20px;text-align:center}.side-menu-active{left:0!important}body.side-menu-open{overflow:hidden}

/* SCROLLBAR STYLE */
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:#1a1a1a;border-radius:5px}::-webkit-scrollbar-thumb{background:rgba(255,255,255,.3);border-radius:5px;transition:background .3s ease}::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.5)}::-webkit-scrollbar-corner{background:#1a1a1a}*{scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.3) #1a1a1a}.side-menu::-webkit-scrollbar{width:6px;height:6px}.side-menu::-webkit-scrollbar-track{background:#1a1a1a;border-radius:3px}.side-menu::-webkit-scrollbar-thumb{background:rgba(255,255,255,.3);border-radius:3px;transition:background .3s ease}.side-menu::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.5)}
