:root { --primary: #e50914; --primary-hover: #ff222d; --bg: #08090d; --bg-card: rgba(22,24,34,0.72); --text: #fff; --success: #4caf50; --star: #ffd700; --info: #2196f3; --glass-border: rgba(255,255,255,0.14); --glass-highlight: rgba(255,255,255,0.08); }
* { box-sizing: border-box; margin:0; padding:0; }
body { font-family:'Poppins', sans-serif; background:radial-gradient(circle at 10% 0%, rgba(229,9,20,0.15), transparent 32rem), radial-gradient(circle at 90% 20%, rgba(55,91,255,0.13), transparent 34rem), var(--bg); color:var(--text); overflow-x:hidden; }
a { text-decoration:none; color:inherit; }
button { font-family:'Poppins', sans-serif; cursor: pointer; outline: none; border:none; }
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: var(--primary); border-radius: 4px; }

.navbar { position:fixed; top:0; left:0; width:100%; height:70px; background:rgba(9,10,16,0.62); border-bottom:1px solid var(--glass-border); backdrop-filter:blur(22px) saturate(150%); display:flex; justify-content:space-between; align-items:center; padding:0 40px; z-index:1000; transition: background 0.4s, box-shadow 0.4s; }
.navbar:hover { box-shadow: 0 12px 40px rgba(0,0,0,0.22); }
/* MOVIEX Sinematik Logo (A + B Harmanı: Neon & Işık Süzülmesi + Sinematik Projektör & Kromatik 3D 'X') */
.logo {
    position: relative;
    isolation: isolate;
    display: inline-flex;
    align-items: center;
    font-family: 'Bebas Neue', sans-serif;
    font-size: 36px;
    letter-spacing: 4px;
    cursor: pointer;
    user-select: none;
    text-decoration: none;
    transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1), filter 0.35s ease;
}
.logo-text {
    position: relative;
    z-index: 2;
    background: linear-gradient(115deg, #ffffff 0%, #f1f5f9 45%, #e2e8f0 75%, #94a3b8 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-shadow: 0 0 24px rgba(229, 9, 20, 0.45);
    display: inline-flex;
    align-items: center;
}
.logo-accent {
    color: var(--primary);
    -webkit-text-fill-color: var(--primary);
    text-shadow: 0 0 16px rgba(229, 9, 20, 0.95), 0 0 35px rgba(255, 34, 45, 0.7), 2px 0 1px rgba(0, 240, 255, 0.65);
    display: inline-block;
    transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1), text-shadow 0.35s ease;
}
/* Seçenek A: Metalik Işık Süzülmesi (Shimmer / Light Sweep - GPU Optimized) */
.logo-shimmer {
    position: absolute;
    inset: -3px -6px;
    background: linear-gradient(110deg, transparent 20%, rgba(255, 255, 255, 0.45) 48%, rgba(255, 60, 75, 0.5) 52%, transparent 65%);
    background-size: 250% 100%;
    pointer-events: none;
    z-index: 3;
    animation: logoShimmerSweep 5s ease-in-out infinite;
    border-radius: 6px;
    will-change: background-position;
}
@keyframes logoShimmerSweep {
    0%, 20% { background-position: -200% 0; opacity: 0; }
    30% { opacity: 0.85; }
    50% { background-position: 200% 0; opacity: 0; }
    100% { background-position: 200% 0; opacity: 0; }
}
/* Seçenek B: Sinema Projektörü Işık Demeti (Projector Beam - GPU Radial Gradient) */
.logo-beam {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 150%;
    height: 150%;
    transform: translate(-50%, -50%);
    background: radial-gradient(ellipse at center, rgba(229, 9, 20, 0.35) 0%, rgba(147, 51, 234, 0.18) 35%, transparent 70%);
    opacity: 0.55;
    z-index: 1;
    pointer-events: none;
    transition: opacity 0.4s ease, transform 0.4s ease;
    animation: logoProjectorPulse 4s ease-in-out infinite alternate;
    will-change: transform, opacity;
}
@keyframes logoProjectorPulse {
    0% { transform: translate(-50%, -50%) scale(0.9); opacity: 0.35; }
    100% { transform: translate(-50%, -50%) scale(1.15); opacity: 0.7; }
}
.logo:hover {
    transform: translateY(-2px) scale(1.04);
}
.logo:hover .logo-accent {
    transform: scale(1.12) rotate(4deg);
    text-shadow: 0 0 25px rgba(229, 9, 20, 1), 0 0 50px rgba(255, 80, 80, 0.95), 3px 0 2px rgba(0, 240, 255, 0.9);
}
.logo:hover .logo-beam {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1.25);
}
.nav-links { display:flex; gap:20px; list-style:none; }
.nav-links a { padding:8px 12px; border-radius:5px; font-weight:400; font-size: 15px; transition:0.3s; opacity: 0.8; cursor: pointer;}
.nav-links a:hover, .nav-links a.active { opacity: 1; color: var(--primary); }
.nav-links a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, .close-modal:focus-visible { outline:2px solid #7dd3fc; outline-offset:3px; }
.nav-actions { display:flex; align-items:center; gap:12px; }
.random-btn { color:#fff; background:linear-gradient(135deg, rgba(229,9,20,.95), rgba(149,24,255,.9)); border:1px solid rgba(255,255,255,.2); padding:8px 13px; border-radius:18px; box-shadow:0 8px 20px rgba(229,9,20,.2); transition:transform .25s ease, box-shadow .25s ease; }
.random-btn:hover { transform:translateY(-2px); box-shadow:0 12px 26px rgba(229,9,20,.35); }
.search-bar input { padding:8px 15px; border-radius:20px; border:1px solid var(--glass-border); background:rgba(255,255,255,0.07); color:#fff; transition:0.4s; width: 180px; outline:none; backdrop-filter:blur(12px); }
.search-bar input:focus { width:260px; border-color:var(--primary); }

.page-section { display: none; }
.page-section.active { display: block; animation: fadeIn 0.5s cubic-bezier(0.4, 0, 0.2, 1); }
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

/* Hero */
.hero { height: 85vh; display:flex; align-items:center; padding:0 50px; background-size:cover; background-position:center top; position:relative; transition: background 0.8s ease; }
.hero-vignette { position:absolute; top:0; left:0; width:100%; height:100%; background: linear-gradient(90deg, rgba(10,10,10,1) 0%, rgba(10,10,10,0.4) 50%, rgba(10,10,10,0) 100%), linear-gradient(0deg, rgba(10,10,10,1) 0%, rgba(10,10,10,0) 30%); z-index:1; }
.hero-content { position:relative; z-index:2; max-width:600px; animation: slideRight 1s ease; }
@keyframes slideRight { from { opacity:0; transform:translateX(-30px); } to { opacity:1; transform:translateX(0); } }
.hero h1 { font-size:4.5em; text-shadow:2px 2px 15px rgba(0,0,0,0.8); margin-bottom:15px; font-weight:800; line-height: 1.1; }
.hero p { font-size:1.2em; text-shadow:1px 1px 8px #000; display: -webkit-box; -webkit-line-clamp: 4; line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; margin-bottom: 25px; color: #ddd; }
.hero-buttons { display: flex; gap: 15px; }
.btn-play { background: #fff; color: #000; font-size: 1.1em; padding: 12px 30px; border-radius: 4px; font-weight:bold; }
.btn-play:hover { background: rgba(255,255,255,0.7); }
.btn-info { background: rgba(109, 109, 110, 0.7); color: #fff; font-size: 1.1em; padding: 12px 30px; border-radius: 4px; font-weight:bold; }
.btn-info:hover { background: rgba(109, 109, 110, 0.4); }

.content-wrapper { padding: 40px 50px; margin-top: -100px; position: relative; z-index: 10; }
.section-title { font-size:1.6em; font-weight:600; margin-bottom: 20px; text-shadow: 1px 1px 5px #000; }
.filter-bar { display:flex; align-items:center; gap:10px; flex-wrap:wrap; padding:12px; margin:-4px 0 15px; border:1px solid var(--glass-border); border-radius:14px; background:rgba(255,255,255,.055); backdrop-filter:blur(16px); }
.filter-bar select, .filter-bar input { background:rgba(7,8,13,.62); color:#eee; border:1px solid rgba(255,255,255,.13); border-radius:8px; padding:8px 10px; font:inherit; font-size:.85em; outline:none; }
.filter-bar input { width:130px; }
.filter-reset { margin-left:auto; color:#bbb; background:transparent; padding:8px; }
.filter-reset:hover { color:#fff; }
.load-status { min-height: 1.5em; margin: -8px 0 15px; color: #aaa; font-size: 0.9em; }
.load-status.error { color: #ff6973; }

/* NETFLIX HOVER GRID & KRİSTAL NETLİKTE HOVER KARTLARI */
.movie-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(180px, 1fr)); gap:24px; padding-bottom: 50px; }
@media (max-width: 900px) { .movie-grid { grid-template-columns: repeat(auto-fill, minmax(155px, 1fr)); gap: 18px; } }
@media (max-width: 600px) { .movie-grid { grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 14px; } }

.movie-card { 
    position: relative; 
    border-radius: 10px; 
    aspect-ratio: 2/3; 
    background: #141724; 
    cursor: pointer; 
    z-index: 1; 
    overflow: visible; 
    border: 1px solid rgba(255,255,255,0.08); 
    box-shadow: 0 8px 20px rgba(0,0,0,0.4);
    transition: transform 0.22s cubic-bezier(0.2, 0, 0.2, 1), border-color 0.22s ease, box-shadow 0.22s ease;
    content-visibility: auto;
    contain-intrinsic-size: 200px 300px;
}
.movie-card:hover { 
    z-index: 100; 
    border-color: rgba(229, 9, 20, 0.45);
    transform: translateY(-4px);
    box-shadow: 0 16px 36px rgba(0,0,0,0.7), 0 0 18px rgba(229, 9, 20, 0.2);
}
.movie-card > img { 
    width: 100%; 
    height: 100%; 
    object-fit: cover; 
    border-radius: 9px; 
    display: block; 
    aspect-ratio: 2/3; 
    background: #181b28; 
}

/* Kristal Netlikte Pop-out Hover Kartı (Sıfır Scale / Sıfır GPU Blur / Sıfır Reflow) */
.hover-card {
    position: absolute;
    top: -14px;
    left: -12px;
    width: calc(100% + 24px);
    min-height: calc(100% + 28px);
    background: #0f121e;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 12px;
    box-shadow: 0 24px 50px rgba(0, 0, 0, 0.95);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    z-index: -1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: opacity 0.18s ease, visibility 0.18s ease;
    will-change: opacity, visibility;
}
.movie-card:hover .hover-card {
    opacity: 1;
    visibility: visible;
    z-index: 100;
    pointer-events: auto;
    box-shadow: 0 24px 50px rgba(0, 0, 0, 0.95), 0 0 20px rgba(229, 9, 20, 0.2);
}
.hover-backdrop-wrap {
    position: relative;
    width: 100%;
    height: 135px;
    background: #141724;
    overflow: hidden;
    flex-shrink: 0;
}
.hover-backdrop-wrap::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(8, 10, 18, 0.75) 0%, rgba(8, 10, 18, 0.1) 45%, rgba(15, 18, 30, 0.95) 100%);
    pointer-events: none;
    z-index: 2;
}
.hover-backdrop-wrap img, .hover-card > img { 
    width: 100%; 
    height: 100%; 
    object-fit: cover; 
    background: #141724; 
    display: block; 
}
.hover-badges {
    position: absolute;
    top: 8px;
    left: 8px;
    right: 8px;
    z-index: 10;
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    pointer-events: none;
}
.poster-badges {
    position: absolute;
    top: 8px;
    left: 8px;
    right: 8px;
    z-index: 4;
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    pointer-events: none;
    opacity: 1 !important;
    transition: opacity 0.2s ease;
}
.movie-card:hover .poster-badges {
    opacity: 0 !important;
}

/* Rozet Stilleri (Film/Dizi, Yüksek Puan, Yeni - GPU Optimized) */
.content-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}
.content-badge {
    display: inline-flex !important;
    align-items: center !important;
    padding: 3px 8px !important;
    border-radius: 999px !important;
    background: rgba(10, 13, 22, 0.94) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    border: 1px solid rgba(255, 255, 255, 0.24) !important;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.5) !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.8) !important;
    color: #f1f5f9 !important;
    -webkit-font-smoothing: antialiased;
}
.badge-type {
    border-color: rgba(240, 68, 90, 0.7) !important;
    background: rgba(240, 68, 90, 0.28) !important;
    color: #ffd9df !important;
}
.badge-rating {
    border-color: rgba(245, 158, 11, 0.75) !important;
    background: rgba(245, 158, 11, 0.28) !important;
    color: #ffd166 !important;
}
.badge-new {
    border-color: rgba(34, 197, 94, 0.7) !important;
    background: rgba(34, 197, 94, 0.28) !important;
    color: #86efac !important;
}
.badge-short {
    border-color: rgba(56, 189, 248, 0.7) !important;
    background: rgba(56, 189, 248, 0.28) !important;
    color: #bae6fd !important;
}
.hover-content {
    padding: 10px 14px 12px;
    background: #0f121e;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 0;
}
.hover-btns { 
    display: flex; 
    gap: 8px; 
    margin-bottom: 6px; 
    align-items: center; 
}
.hover-btns button { 
    width: 32px; 
    height: 32px; 
    border-radius: 50%; 
    background: rgba(255,255,255,0.12); 
    border: 1px solid rgba(255,255,255,0.4); 
    color: #fff; 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    transition: 0.2s; 
    cursor: pointer; 
    flex-shrink: 0; 
}
.hover-btns button:hover { 
    background: #fff; 
    color: #000; 
    border-color: #fff; 
}
.hover-btns .play-mini { 
    background: #fff; 
    color: #000; 
    border: none; 
    font-size: 0.85rem; 
}
.hover-btns .play-mini:hover { 
    background: var(--primary); 
    color: #fff; 
}
.hover-info-row {
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    color: #ffffff !important;
    margin-bottom: 4px;
    display: flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}
.hover-info-row span {
    display: inline-flex;
    align-items: center;
}
.match-text { 
    color: #46d369 !important; 
    font-weight: 700 !important; 
    display: inline-flex; 
    align-items: center; 
    gap: 3px; 
}
.hover-year {
    color: #f1f5f9 !important;
    font-weight: 600 !important;
}
.hover-media-type {
    display: inline-block !important;
    padding: 1px 6px !important;
    border-radius: 4px !important;
    background: rgba(255, 255, 255, 0.12) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    color: #e2e8f0 !important;
    letter-spacing: 0.4px;
}
.hover-genres {
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
    color: #cbd5e1 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    display: block !important;
    min-height: auto !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* Modallar */
.modal { display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.9); backdrop-filter:blur(10px); align-items:center; justify-content:center; z-index:2000; opacity: 0; transition: 0.3s; }
.modal.show { display:flex; opacity: 1; }
.modal-content { background:rgba(17,19,28,0.86); border:1px solid var(--glass-border); backdrop-filter:blur(24px) saturate(130%); border-radius:16px; max-width:1100px; width:95%; max-height: 90vh; overflow-y: auto; overflow-x: hidden; box-shadow: 0 20px 50px rgba(0,0,0,0.9); animation: scaleUp .48s cubic-bezier(0.34,1.56,0.64,1); }
@keyframes scaleUp { from { transform: scale(0.95); opacity:0; } to { transform: scale(1); opacity:1; } }
.close-modal { position: absolute; top: 15px; right: 20px; font-size: 28px; cursor: pointer; color: #fff; background: rgba(0,0,0,0.6); width:40px; height:40px; border-radius:50%; display:flex; align-items:center; justify-content:center; z-index: 50; transition: 0.2s; }
.close-modal:hover { background: var(--primary); }

/* TMDB Tasarımı */
.tmdb-header { position: relative; background-size: cover; background-position: center; border-radius: 12px 12px 0 0; }
.tmdb-overlay { background: linear-gradient(90deg, rgba(20,20,20, 1) 250px, rgba(20,20,20, 0.8) 100%); padding: 50px 40px; display: flex; gap: 40px; align-items: flex-start; flex-wrap: wrap; }
.tmdb-poster { width: 280px; border-radius: 10px; box-shadow: 0 10px 30px rgba(0,0,0,0.9); aspect-ratio: 2/3; object-fit: cover; }
.tmdb-info { flex: 1; min-width: 300px; }
.tmdb-title { font-size: 2.8em; font-weight: 700; margin-bottom: 5px; }
.tmdb-year { color: #bbb; font-size: 0.8em; }
.tmdb-facts { font-size: 0.9em; color: #ddd; margin-bottom: 20px; }
.media-detailed-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; background: rgba(0,0,0,0.4); padding: 15px; border-radius: 8px; margin-bottom: 20px; border-left: 3px solid var(--primary); }
.stat-item { font-size: 0.9em; }
.stat-item .lbl { color: #aaa; }
.tmdb-score { background: rgba(0,0,0,0.6); border: 1px solid var(--star); padding: 5px 10px; border-radius: 6px; font-weight: bold; color: var(--star); display: inline-flex; align-items: center; }

/* 10 Yıldız Puanlama */
.user-10-rating { display: flex; align-items: center; gap: 10px; background: rgba(0,0,0,0.5); padding: 5px 15px; border-radius: 6px; }
.user-10-rating span { font-size: 0.9em; color: #aaa; }
.star-rate-10 { display: flex; flex-direction: row-reverse; }
.star-rate-10 input { display: none; }
.star-rate-10 label { font-size: 20px; color: #444; cursor: pointer; transition: 0.2s; padding: 0 2px; }
.star-rate-10 input:checked ~ label, .star-rate-10 label:hover, .star-rate-10 label:hover ~ label { color: var(--star); text-shadow: 0 0 5px var(--star); }

.tmdb-overview-title { font-size: 1.2em; font-weight: 600; margin-bottom: 10px; color: #fff; }
.tmdb-overview { font-size: 1em; line-height: 1.6; color: #ddd; margin-bottom: 25px; }
.tmdb-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.tmdb-actions .btn { border:1px solid rgba(255,255,255,.14); border-radius:12px; background:linear-gradient(135deg,rgba(255,255,255,.14),rgba(255,255,255,.055)); box-shadow:0 8px 18px rgba(0,0,0,.18); transition:transform .22s ease, border-color .22s ease, box-shadow .22s ease; }
.tmdb-actions .btn:hover { transform:translateY(-2px); border-color:rgba(255,255,255,.38); box-shadow:0 11px 25px rgba(0,0,0,.3); }
.tmdb-actions .btn.primary,.tmdb-actions .btn.watched { background:linear-gradient(135deg,var(--primary),#8d1cff); }
.tmdb-actions .btn.later { background:linear-gradient(135deg,#1769aa,#1fb6b0); }
.btn { padding:10px 20px; border-radius:4px; font-weight:600; transition:0.3s; cursor: pointer; border:none; display: inline-flex; align-items: center; }
.btn.primary { background:var(--primary); color:#fff; }
.btn.primary:hover { background:var(--primary-hover); }
.btn.secondary { background:rgba(255,255,255,0.15); color:#fff; }
.btn.secondary:hover { background:rgba(255,255,255,0.3); }
.btn.watched { background: var(--success); color: #fff; }
.btn.later { background: var(--info); color: #fff; }

.modal-body { padding: 30px 40px; }
.section-divider { font-size:1.3em; margin-bottom:15px; text-transform: uppercase; letter-spacing: 1px; color: #aaa; }
.horizontal-scroll { display: flex; gap: 15px; overflow-x: auto; padding-bottom: 15px; cursor: grab; }
.horizontal-scroll, .profile-media-list, .episodes-list { touch-action: pan-y; user-select:none; }
.is-dragging, .is-dragging * { cursor:grabbing !important; user-select:none !important; }
.horizontal-scroll::-webkit-scrollbar { display: none; }
.providers-section { margin:-4px 0 20px; }
.providers-section h3 { font-size:.9em; letter-spacing:.08em; text-transform:uppercase; color:#aaa; margin-bottom:10px; }
.providers-list { display:flex; flex-wrap:wrap; gap:8px; }
.provider-chip { display:flex; align-items:center; gap:7px; padding:5px 9px 5px 5px; border:1px solid var(--glass-border); border-radius:9px; background:rgba(0,0,0,.26); color:#ddd; font-size:.8em; }
.provider-chip img { width:28px; height:28px; border-radius:6px; object-fit:cover; }
.provider-empty { color:#888; font-size:.9em; padding:8px 0; }
.recommendations-title { margin-top:32px; }
.recommendation-card { flex:0 0 125px; display:grid; gap:6px; cursor:pointer; color:#eee; transition:transform .25s ease; }
.recommendation-card:hover { transform:translateY(-5px); }
.recommendation-card img { width:125px; aspect-ratio:2/3; object-fit:cover; border-radius:9px; border:1px solid var(--glass-border); }
.recommendation-card strong { font-size:.78em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.recommendation-card small { color:#aaa; }
.cast-card { flex: 0 0 130px; background: #111; border-radius: 8px; overflow: hidden; cursor: pointer; transition: 0.3s; }
.cast-card img { width: 100%; height: 170px; object-fit: cover; pointer-events: none; }
.cast-card p { font-size: 0.85em; color: #ddd; padding: 10px; text-align: center; font-weight: 600; pointer-events: none; }

.season-container { margin-top: 20px; border-radius: 8px; overflow: hidden; border: 1px solid #333; }
.season-header { padding: 15px 20px; background: #111; cursor: pointer; display: flex; justify-content: space-between; align-items: center; font-weight: bold; border-bottom: 1px solid #222; }
.season-toggle { margin-left:auto; margin-right:12px; padding:6px 9px; color:#bbb; background:rgba(255,255,255,.08); border:1px solid var(--glass-border); border-radius:7px; font-size:.72em; }.season-toggle:hover { color:#fff; background:var(--primary); }
.episodes-list { display: none; background: #0a0a0a; max-height: 400px; overflow-y: auto; cursor: grab; }
.episodes-list::-webkit-scrollbar { display: none; }
.episodes-list.open { display: block; animation: slideDown 0.3s ease; }
@keyframes slideDown { from { opacity:0; transform:translateY(-10px); } to { opacity:1; transform:translateY(0); } }
.episode-item { display: grid; grid-template-columns: 150px 1fr auto; gap: 16px; align-items: center; padding: 14px 20px; border-bottom: 1px solid rgba(255,255,255,0.08); transition:background .25s ease; }
.episode-item:hover { background:rgba(255,255,255,0.06); }
.episode-thumb { width:150px; aspect-ratio:16/9; object-fit:cover; border-radius:8px; }
.ep-info { min-width:0; }
.ep-info p { color:#aaa; font-size:.85em; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; margin:4px 0; }
.ep-info small { color:#777; }
.episode-controls { display:grid; gap:8px; justify-items:end; color:#bbb; font-size:.8em; }
.episode-controls select { color:#fff; background:rgba(255,255,255,.08); border:1px solid var(--glass-border); border-radius:6px; padding:5px; }

/* Profil */
.profile-wrapper { position:relative; background: var(--profile-bg, #0a0a0a); min-height: 100vh; padding-bottom: 50px; transition: background 0.3s; overflow-x: hidden; }
.profile-wrapper::before, .profile-wrapper::after { content:''; position:absolute; width:420px; height:420px; border-radius:50%; filter:blur(80px); opacity:.18; pointer-events:none; animation:floatGlow 12s ease-in-out infinite alternate; }
.profile-wrapper::before { background:var(--primary); top:120px; left:-180px; }
.profile-wrapper::after { background:#4267ff; top:520px; right:-180px; animation-delay:-4s; }
@keyframes floatGlow { from { transform:translate3d(0,0,0) scale(1); } to { transform:translate3d(40px,30px,0) scale(1.12); } }
.profile-banner { height: 350px; background-size: cover; background-position: center; position: relative; box-shadow: inset 0 -100px 100px -20px var(--profile-bg, #0a0a0a); }
.profile-content { max-width: 1200px; margin: 0 auto; padding: 0 40px; position: relative; top: -100px; z-index: 2; }
.profile-header { display: flex; gap: 30px; align-items: flex-end; margin-bottom: 40px; flex-wrap: wrap; }
/* Standart 1:1 Avatar ve Zengin Çerçeve Kütüphanesi (Steam & Discord Tarzı) */
.avatar-shell {
    width: 150px;
    height: 150px;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    padding: 6px;
    position: relative;
    display: grid;
    place-items: center;
    flex-shrink: 0;
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.avatar-shell:hover {
    transform: scale(1.05);
}
.avatar-shell .profile-avatar,
.preview-avatar img {
    width: 100%;
    height: 100%;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    object-fit: cover;
    display: block;
    border: 4px solid var(--profile-bg, #0d0f17);
    background: #111420;
    position: relative;
    z-index: 1;
}

/* 1. Sade Sinematik Halka */
.avatar-frame-standard {
    background: linear-gradient(135deg, rgba(255,255,255,0.4), rgba(255,255,255,0.08) 50%, rgba(229,9,20,0.5));
    box-shadow: 0 0 0 1px rgba(255,255,255,0.15), 0 8px 25px rgba(0,0,0,0.6);
}

/* 2. Neon RGB Pulse */
.avatar-frame-neon {
    background: conic-gradient(#ff0055, #7928ca, #0070f3, #00dfd8, #7928ca, #ff0055);
    box-shadow: 0 0 25px rgba(255, 0, 85, 0.55), 0 0 45px rgba(0, 112, 243, 0.35);
    animation: avatarSpin 4s linear infinite;
}

/* 3. Altın Sinema Çelengi (Oscar Laurel) */
.avatar-frame-gold {
    background: conic-gradient(from 45deg, #fff3b0, #d4af37, #aa771c, #ffd700, #d4af37, #fff3b0);
    box-shadow: 0 0 30px rgba(212, 175, 55, 0.6), inset 0 0 10px rgba(255, 235, 59, 0.4);
    animation: goldShimmer 3s ease-in-out infinite alternate;
}
@keyframes goldShimmer {
    0% { filter: brightness(1) drop-shadow(0 0 10px rgba(212,175,55,0.5)); }
    100% { filter: brightness(1.25) drop-shadow(0 0 22px rgba(255,215,0,0.85)); }
}

/* 4. Retro Film Makarası (Vintage 35mm Reel) */
.avatar-frame-reel {
    background: repeating-conic-gradient(from 0deg, #e50914 0deg 18deg, #181924 18deg 36deg, #fff 36deg 40deg, #181924 40deg 45deg);
    box-shadow: 0 0 22px rgba(229, 9, 20, 0.6);
    animation: reelRotate 12s linear infinite;
}
@keyframes reelRotate { to { transform: rotate(360deg); } }

/* 5. Kozmik Nebula Aurora */
.avatar-frame-nebula {
    background: conic-gradient(from 0deg, #8b5cf6, #ec4899, #3b82f6, #06b6d4, #a855f7, #8b5cf6);
    box-shadow: 0 0 32px rgba(139, 92, 246, 0.7);
    animation: avatarSpin 6s linear infinite;
}

/* 6. Cyberpunk Glitch & Hologram */
.avatar-frame-cyber {
    background: linear-gradient(135deg, #00f2fe 0%, #4facfe 35%, #101018 35%, #101018 65%, #ff0844 65%, #ffb199 100%);
    box-shadow: 0 0 24px rgba(0, 242, 254, 0.6), 0 0 30px rgba(255, 8, 68, 0.4);
    animation: cyberGlitch 2.5s steps(2) infinite;
}
@keyframes cyberGlitch {
    0%, 100% { transform: scale(1); filter: hue-rotate(0deg); }
    50% { transform: scale(1.02) skewX(1deg); filter: hue-rotate(18deg); }
}

/* 7. Noir Minimalist Kırmızı */
.avatar-frame-noir {
    background: conic-gradient(from 180deg, #e50914, #27272a, #09090b, #e50914);
    box-shadow: 0 0 28px rgba(229, 9, 20, 0.75);
}

@keyframes avatarSpin { to { filter: hue-rotate(360deg); } }

/* Profil Genel Bakış Grid Mimarisi */
.overview-grid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 20px;
    align-items: start;
}
@media (max-width: 900px) {
    .overview-grid { grid-template-columns: 1fr; }
}

.preset-group { margin: 14px 0 18px; }
.preset-group label { display: block; color: #cbd5e1; font-size: 0.85rem; font-weight: 600; margin-bottom: 8px; }
.preset-avatar-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; }
.preset-avatar-opt { aspect-ratio: 1/1; border-radius: 50%; overflow: hidden; cursor: pointer; border: 2px solid rgba(255,255,255,0.14); transition: transform 0.2s, border-color 0.2s, box-shadow 0.2s; background: #111422; }
.preset-avatar-opt:hover, .preset-avatar-opt.active { transform: scale(1.15); border-color: var(--primary); box-shadow: 0 0 16px rgba(229,9,20,0.6); }
.preset-avatar-opt img { width: 100%; height: 100%; object-fit: cover; display: block; }
.banner-gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 6px; }
.banner-opt { height: 60px; border-radius: 8px; overflow: hidden; cursor: pointer; border: 2px solid rgba(255,255,255,0.14); background-size: cover; background-position: center; transition: transform 0.2s, border-color 0.2s; position: relative; }
.banner-opt:hover, .banner-opt.active { transform: scale(1.05); border-color: var(--primary); box-shadow: 0 0 18px rgba(229,9,20,0.5); }
.banner-opt span { position: absolute; bottom: 3px; left: 6px; font-size: 0.65rem; color: #fff; text-shadow: 0 1px 4px #000; font-weight: 600; }
.profile-name { font-size: 3.5em; font-weight: 700; text-shadow: 2px 2px 10px #000; line-height: 1; margin-bottom: 5px; display:flex; align-items:center; gap:10px; }
.title-badge { font-size:.24em; letter-spacing:.03em; padding:6px 10px; border-radius:999px; color:#fff; background:rgba(255,255,255,.12); border:1px solid var(--glass-border); vertical-align:middle; white-space:nowrap; }
.mood-emoji { font-size: 0.7em; background: rgba(0,0,0,0.5); border-radius: 50%; padding: 5px; box-shadow: 0 0 10px rgba(0,0,0,0.5); }
.settings-btn { background: rgba(0,0,0,0.6); border: 1px solid #555; padding: 10px 20px; border-radius: 4px; color: #fff; cursor: pointer; transition: 0.3s; }
.settings-btn:hover { background: #fff; color: #000; }

.profile-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin: -10px 0 25px; }
.profile-stat { background: rgba(20,20,20,0.72); border: 1px solid rgba(255,255,255,0.08); border-radius: 10px; padding: 16px; display: grid; grid-template-columns: auto 1fr; column-gap: 10px; align-items: center; }
.profile-stat span { grid-row: span 2; font-size: 1.5em; }
.profile-stat strong { font-size: 1.35em; }
.profile-stat small, .diary-entry small, .review-meta small, .custom-list small { color: #999; }
.profile-tabs { display: flex; gap: 8px; border-bottom: 1px solid rgba(255,255,255,0.1); margin-bottom: 25px; overflow-x: auto; }
.profile-tab { background: transparent; color: #999; padding: 12px 16px; border-bottom: 2px solid transparent; white-space: nowrap; }
.profile-tab:hover, .profile-tab.active { color: #fff; border-color: var(--primary); }
.profile-panel { display: none; }
.profile-panel.active { display: block; animation: fadeIn 0.25s ease; }
.profile-grid.profile-panel.active { display: grid; }
.diary-list, .reviews-list, .custom-lists { display: grid; gap: 12px; }
.diary-entry { display: flex; align-items: center; gap: 14px; background: rgba(255,255,255,0.04); padding: 10px; border-radius: 8px; }
.diary-entry img { width: 48px; height: 70px; object-fit: cover; border-radius: 5px; }
.diary-entry div { display: grid; gap: 5px; }
.review-entry { background: rgba(255,255,255,0.04); border-left: 3px solid var(--primary); padding: 15px; border-radius: 6px; }
.review-meta { display: flex; justify-content: space-between; gap: 15px; margin-bottom: 8px; }
.review-entry p { color: #ddd; line-height: 1.6; white-space: pre-wrap; }
.empty-state { color: #888; padding: 20px 0; }
.list-heading { display: flex; justify-content: space-between; align-items: center; gap: 15px; }
.custom-list { display: flex; justify-content: space-between; align-items: center; gap: 15px; background: rgba(255,255,255,0.04); padding: 15px; border-radius: 8px; }
.custom-list h4 { margin-bottom: 4px; }
.list-posters { display: flex; }
.list-posters img { width: 42px; height: 62px; object-fit: cover; border: 2px solid var(--bg-card); border-radius: 4px; margin-left: -8px; }
.list-actions { display:flex; gap:6px; }
.list-actions button { width:30px; height:30px; border-radius:50%; color:#bbb; background:rgba(255,255,255,.08); transition:.25s; }
.list-actions button:hover { background:var(--primary); color:#fff; transform:translateY(-2px); }
.review-editor { border-top: 1px solid rgba(255,255,255,0.1); margin-top: 25px; padding-top: 18px; display: grid; gap: 8px; }
.review-editor label { color: #aaa; font-size: 0.9em; }
.review-editor .btn { justify-content: center; width: fit-content; }
.watch-time-panel { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:-10px 0 18px; }
.watch-time-card { display:flex; align-items:center; gap:14px; padding:18px; border-radius:16px; border:1px solid var(--glass-border); background:linear-gradient(135deg,rgba(255,255,255,.1),rgba(255,255,255,.035)); backdrop-filter:blur(18px); box-shadow:inset 0 1px 0 var(--glass-highlight); }
.watch-time-card > span { font-size:1.7em; }
.watch-time-card div { display:grid; gap:3px; }
.watch-time-card small { color:#aaa; }
.watch-time-card strong { font-size:1.2em; }
.profile-style-noir { --primary:#b9c5d6; --primary-hover:#d7e1ef; }
.profile-wrapper.profile-style-noir::before { background:#64748b; }
.profile-style-sunset { --primary:#ff7b54; --primary-hover:#ff9d68; }
.profile-wrapper.profile-style-sunset::before { background:#ff7b54; }
.profile-wrapper.dynamic-light::before, .profile-wrapper.dynamic-light::after { animation:floatGlow 12s ease-in-out infinite alternate, hueShift 14s linear infinite; }
@keyframes hueShift { to { filter:blur(80px) hue-rotate(360deg); } }
.profile-layout-compact .profile-content { max-width:1000px; }
.profile-layout-compact .profile-box { padding:18px; border-radius:14px; }
.profile-layout-cinema .profile-content { max-width:1400px; }
.profile-layout-cinema .profile-banner { height:430px; }
.diary-switcher { display:flex; gap:6px; margin-bottom:15px; }.diary-filter { color:#aaa; background:rgba(255,255,255,.06); border:1px solid transparent; padding:8px 12px; border-radius:999px; }.diary-filter.active,.diary-filter:hover { color:#fff; border-color:var(--primary); }
.diary-list { gap:10px; }.diary-drawer { border:1px solid var(--glass-border); border-radius:12px; overflow:hidden; background:rgba(255,255,255,.035); }.diary-drawer summary { display:flex; justify-content:space-between; cursor:pointer; padding:13px 15px; color:#eee; list-style:none; }.diary-drawer summary::-webkit-details-marker { display:none; }.diary-drawer summary small { color:#999; }.diary-drawer-content { padding:0 10px 10px; }
.diary-day-preview { width:100%; display:flex; align-items:center; gap:14px; padding:12px; color:#fff; text-align:left; border:1px solid var(--glass-border); border-radius:14px; background:linear-gradient(135deg,rgba(255,255,255,.08),rgba(255,255,255,.025)); cursor:pointer; transition:.25s ease; }.diary-day-preview:hover { transform:translateY(-2px); border-color:var(--primary); background:linear-gradient(135deg,rgba(229,9,20,.16),rgba(255,255,255,.05)); }.diary-day-copy { display:grid; gap:5px; min-width:145px; }.diary-day-copy small { color:#999; }.diary-day-posters { display:flex; margin-left:auto; }.diary-day-posters img { width:34px; height:50px; object-fit:cover; border:2px solid #151722; border-radius:5px; margin-left:-9px; }.diary-day-arrow { color:#aaa; font-size:1.8rem; margin-left:4px; }.diary-day-modal { max-width:1000px; padding:30px; }.diary-modal-card { display:grid; grid-template-columns:90px 1fr; gap:13px; padding:10px; border:1px solid var(--glass-border); border-radius:12px; background:rgba(255,255,255,.04); cursor:pointer; transition:.22s ease; }.diary-modal-card:hover { transform:translateY(-3px); border-color:var(--primary); }.diary-modal-card img { width:90px; aspect-ratio:2/3; object-fit:cover; border-radius:7px; }.diary-modal-card div { display:grid; align-content:center; gap:7px; }.diary-modal-card small { color:#999; }
.achievement { display:flex; align-items:center; gap:13px; padding:15px; border-radius:13px; border:1px solid var(--glass-border); background:rgba(255,255,255,.05); }.achievements-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }.achievement > span { font-size:1.8em; }.achievement div { display:grid; gap:4px; }.achievement small { color:#aaa; }.achievement.locked { filter:grayscale(1); opacity:.52; }.achievement.unlocked { box-shadow:0 0 22px rgba(229,9,20,.14); }
.discovery-toggle { width:100%; display:flex; justify-content:space-between; color:#fff; background:transparent; font-size:1.15em; font-weight:700; padding:0 0 8px; }.discovery-box > p { color:#999; margin-bottom:12px; }.discovery-box:not(.open) #personalDiscoveries { display:none; }
.list-detail-modal { max-width:1000px; padding:30px; }.list-detail-heading { margin-bottom:20px; }.list-detail-heading h2 { font-size:2.3em; }.list-detail-heading p:not(.eyebrow) { color:#999; }.list-detail-card { display:grid; grid-template-columns:100px 1fr; gap:12px; padding:10px; border:1px solid var(--glass-border); border-radius:10px; background:rgba(255,255,255,.04); cursor:pointer; }.list-detail-card img { width:100px; aspect-ratio:2/3; object-fit:cover; border-radius:7px; }.list-detail-card div { display:grid; align-content:center; gap:8px; }.list-detail-card small { color:#999; }.list-detail-card .btn { width:max-content; font-size:.75em; padding:7px 10px; }
.list-picker-modal { max-width:520px; padding:30px; }.list-picker-modal h2 { margin:4px 0; }.list-picker-help { color:#999; margin:0 0 18px; }.list-picker-options { display:grid; gap:9px; }.list-picker-option { display:grid; grid-template-columns:auto 1fr auto auto; align-items:center; gap:10px; padding:14px; color:#fff; text-align:left; border:1px solid var(--glass-border); border-radius:13px; background:rgba(255,255,255,.06); cursor:pointer; transition:.22s ease; }.list-picker-option:hover { transform:translateX(4px); border-color:var(--primary); background:rgba(229,9,20,.13); }.list-picker-option span { font-size:1.3rem; }.list-picker-option strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.list-picker-option small { color:#999; }.list-picker-option i { color:#aaa; font-size:1.5rem; font-style:normal; }
.list-create-modal { max-width:460px; padding:30px; }.list-create-modal h2 { margin:4px 0 20px; }.list-create-modal label { display:block; color:#aaa; font-size:.85rem; margin-bottom:7px; }.list-create-modal .studio-actions { margin-top:18px; }
.btn.danger { color:#fff; background:linear-gradient(135deg,#b4232e,#6d1029); border:1px solid rgba(255,120,130,.3); }.btn.danger:hover { background:linear-gradient(135deg,#d73542,#86183a); transform:translateY(-2px); }
.slot-machine { display:none; margin:22px auto; width:90px; height:130px; overflow:hidden; border-radius:10px; border:2px solid var(--primary); box-shadow:0 0 24px rgba(229,9,20,.45); }.slot-machine.show { display:block; }.slot-machine #slotReel { display:grid; animation:slotSpin 1.5s cubic-bezier(.12,.8,.18,1); }.slot-machine img { width:90px; height:130px; object-fit:cover; }.random-options.hide { display:none; } @keyframes slotSpin { from { transform:translateY(0); } to { transform:translateY(-calc(130px * 9)); } }
.skeleton-card { position:relative; aspect-ratio:2/3; width:100%; min-height:0; border-radius:10px; background:#141724; overflow:hidden; border:1px solid rgba(255,255,255,0.06); box-shadow:0 4px 14px rgba(0,0,0,0.3); }
.skeleton-card::before { content:''; position:absolute; inset:0; background:linear-gradient(105deg, rgba(255,255,255,0.02) 20%, rgba(255,255,255,0.09) 50%, rgba(255,255,255,0.02) 80%); background-size:200% 100%; animation:shimmer 1.5s cubic-bezier(0.4, 0, 0.2, 1) infinite; }
.skeleton-card::after { content:''; position:absolute; bottom:12px; left:12px; right:12px; height:12px; background:rgba(255,255,255,0.06); border-radius:4px; }
.calendar-grid .skeleton-card { aspect-ratio:2/3; min-height:0; }
.horizontal-scroll .skeleton-card { flex:0 0 125px; height:190px; min-height:0; }
@keyframes shimmer { 0% { background-position:200% 0; } 100% { background-position:-200% 0; } }
.genre-stats { display:grid; gap:13px; }
.genre-stat-row { display:grid; gap:6px; }
.genre-stat-row > div { display:flex; justify-content:space-between; gap:10px; font-size:.86em; }
.genre-stat-row small { color:#999; }
.genre-stat-row i { display:block; height:8px; overflow:hidden; border-radius:999px; background:rgba(255,255,255,.09); }
.genre-stat-row i::after { content:''; display:block; width:var(--genre-width); height:100%; border-radius:inherit; background:linear-gradient(90deg, var(--primary), hsl(calc(260 + var(--genre-index) * 30), 86%, 66%)); box-shadow:0 0 14px rgba(229,9,20,.5); }
.backup-actions { display:flex; gap:10px; flex-wrap:wrap; margin-top:4px; }
.upload-backup { cursor:pointer; }
.settings-studio-modal { width:min(1120px, calc(100vw - 32px)); max-width:1120px!important; padding:26px!important; background:linear-gradient(145deg, rgba(20,23,35,.97), rgba(9,11,20,.97)); border:1px solid rgba(255,255,255,.14); }
.studio-title { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:20px; }
.studio-title h2 { margin:4px 0 0; font-size:clamp(1.5rem, 3vw, 2.2rem); }
.studio-status { color:#78f7c2; font-size:.78rem; letter-spacing:.08em; white-space:nowrap; margin-top:8px; }
.settings-studio { display:grid; grid-template-columns:150px minmax(0,1fr) 290px; gap:20px; align-items:stretch; }
.studio-nav { display:flex; flex-direction:column; gap:7px; padding:8px; border:1px solid var(--glass-border); border-radius:16px; background:rgba(255,255,255,.035); height:max-content; }
.studio-tab { border:1px solid transparent; border-radius:11px; color:#aaa; background:transparent; text-align:left; padding:12px 10px; cursor:pointer; transition:.22s ease; }
.studio-tab:hover { color:#fff; background:rgba(255,255,255,.07); }
.studio-tab.active { color:#fff; border-color:rgba(229,9,20,.45); background:linear-gradient(120deg,rgba(229,9,20,.22),rgba(255,255,255,.06)); box-shadow:0 0 18px rgba(229,9,20,.12); }
.studio-editor { min-width:0; display:flex; flex-direction:column; min-height:420px; }
.studio-panel { display:none; animation:studioReveal .3s ease both; }
.studio-panel.active { display:block; }
@keyframes studioReveal { from { opacity:0; transform:translateY(5px); } to { opacity:1; transform:none; } }
.studio-help { color:#aaa; line-height:1.6; margin-top:0; }
.studio-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:auto; padding-top:18px; }
.live-preview { --preview-accent:#e50914; position:relative; overflow:hidden; min-height:420px; padding:16px; border:1px solid var(--glass-border); border-radius:18px; background:linear-gradient(145deg,rgba(255,255,255,.11),rgba(255,255,255,.035)); box-shadow:inset 0 1px 0 var(--glass-highlight), 0 18px 40px rgba(0,0,0,.25); }
.preview-label { position:relative; z-index:2; display:inline-block; color:#a7ffe0; font-size:.68rem; letter-spacing:.15em; font-weight:700; }
.preview-banner { height:130px; margin:-16px -16px 0; background-position:center; background-size:cover; border-bottom:1px solid rgba(255,255,255,.1); }
.preview-avatar { position:relative; z-index:2; width:90px; height:90px; margin:-45px 0 10px 10px; border-radius:50%; padding:4px; background:linear-gradient(135deg,var(--preview-accent),#6d5dfc); box-shadow:0 0 20px color-mix(in srgb, var(--preview-accent), transparent 45%); }
.preview-avatar img { width:100%; height:100%; object-fit:cover; border-radius:50%; display:block; border:3px solid #11131d; }
.live-preview h3 { margin:0 0 6px 10px; font-size:1.25rem; }
.live-preview > .title-badge { margin-left:10px; }
.live-preview > p { color:#aaa; font-size:.85rem; line-height:1.5; margin:12px 10px 18px; }
.preview-glass-card { display:flex; align-items:center; gap:10px; padding:12px; border:1px solid rgba(255,255,255,.1); border-radius:12px; background:rgba(255,255,255,.06); }
.preview-glass-card span { color:var(--preview-accent); font-size:1.5rem; }.preview-glass-card small { display:block; color:#999; }.preview-glass-card strong { font-size:.9rem; }
.banner-gallery { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:8px; margin-top:10px; }
.banner-choice { position:relative; min-width:0; padding:0; overflow:hidden; border:1px solid transparent; border-radius:9px; background:#111; cursor:pointer; }
.banner-choice img { display:block; width:100%; aspect-ratio:1.65; object-fit:cover; opacity:.75; transition:.2s ease; }.banner-choice span { position:absolute; left:6px; bottom:5px; right:4px; font-size:.67rem; text-align:left; text-shadow:0 1px 5px #000; }.banner-choice:hover img,.banner-choice.selected img { opacity:1; transform:scale(1.05); }.banner-choice.selected { border-color:var(--primary); box-shadow:0 0 0 2px rgba(229,9,20,.2); }
.random-modal-content { max-width:650px; padding:38px; text-align:center; }
.random-modal-content h2 { font-size:2.2em; margin:6px 0 10px; }
.random-modal-content > p:not(.eyebrow) { color:#aaa; max-width:480px; margin:0 auto; }
.eyebrow { color:var(--primary); font-size:.78em; letter-spacing:.16em; font-weight:700; }
.random-options { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:28px; text-align:left; }
.random-option { display:grid; gap:7px; padding:20px; color:#fff; text-align:left; border:1px solid var(--glass-border); border-radius:16px; background:linear-gradient(145deg,rgba(255,255,255,.1),rgba(255,255,255,.035)); transition:transform .25s ease, border-color .25s ease; }
.random-option:hover { transform:translateY(-4px); border-color:var(--primary); }
.random-option span { font-size:1.7em; }.random-option small { color:#aaa; line-height:1.45; }
.calendar-page { min-height:100vh; padding-top:125px; margin-top:0; }
.calendar-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:25px; margin-bottom:30px; }
.calendar-heading h1 { font-size:clamp(2em,4vw,3.5em); margin:5px 0 8px; }.calendar-heading p:not(.eyebrow) { color:#aaa; max-width:580px; }
.calendar-section { margin-bottom:42px; }.calendar-section-title { display:flex; align-items:baseline; gap:12px; margin-bottom:15px; }.calendar-section-title h2 { margin:0; }.calendar-section-title span { color:#888; font-size:.85rem; }.calendar-last-air { color:#777!important; font-size:.7rem!important; }
.calendar-grid { padding-top:0; }
.calendar-card { position:relative; overflow:hidden; border-radius:12px; cursor:pointer; background:var(--bg-card); border:1px solid var(--glass-border); transition:transform .25s ease, border-color .25s ease; }
.calendar-card:hover { transform:translateY(-6px); border-color:rgba(255,255,255,.35); }
.calendar-card img { width:100%; aspect-ratio:2/3; object-fit:cover; display:block; }.calendar-card > div { padding:10px; display:grid; gap:3px; }.calendar-card strong { font-size:.85em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.calendar-card small { color:#aaa; font-size:.75em; }
.release-badge { position:absolute; top:9px; left:9px; padding:5px 7px; border-radius:999px; font-size:.7em; font-weight:700; background:rgba(9,10,16,.8); border:1px solid var(--glass-border); backdrop-filter:blur(9px); }
.calendar-loading { grid-column:1/-1; color:#aaa; }

.profile-grid { display: grid; grid-template-columns: 2fr 1fr; gap: 30px; }
@media(max-width: 900px) { .profile-grid { grid-template-columns: 1fr; } }
.profile-box { background: linear-gradient(135deg, rgba(255,255,255,0.09), rgba(255,255,255,0.035)); border: 1px solid var(--glass-border); padding: 25px; border-radius: 18px; backdrop-filter: blur(18px) saturate(140%); margin-bottom: 25px; width: 100%; box-shadow: 0 10px 30px rgba(0,0,0,0.32), inset 0 1px 0 var(--glass-highlight); }
.profile-box h3 { border-bottom: 1px solid rgba(255,255,255,0.1); padding-bottom: 10px; margin-bottom: 15px; font-size: 1.2em; display:flex; justify-content:space-between; align-items:center; }
.avg-badge { font-size: 0.8em; background: rgba(0,0,0,0.5); padding: 4px 10px; border-radius: 20px; color: var(--star); border: 1px solid var(--star); }

.profile-media-list { display: flex; gap: 15px; overflow-x: auto; padding-bottom: 10px; cursor: grab; width: 100%; }
.profile-media-list::-webkit-scrollbar { display: none; }
.mini-card { flex: 0 0 110px; border-radius: 6px; overflow: hidden; box-shadow: 0 4px 10px rgba(0,0,0,0.4); transition:0.3s; }
.mini-card:hover { transform: translateY(-5px); }
.mini-card img { width: 100%; aspect-ratio: 2/3; object-fit: cover; pointer-events: none; }

.custom-input { width: 100%; padding: 12px; background: rgba(0,0,0,0.5); border: 1px solid #333; color: #fff; border-radius: 6px; outline: none; transition: 0.3s; }
.custom-input:focus { border-color: var(--primary); box-shadow:0 0 0 3px rgba(229,9,20,.12); }
.custom-input[type="file"] { padding:9px; }
.input-group { display: flex; flex-direction: column; gap: 5px; margin-bottom: 15px; }
.toggle-row { display:flex; align-items:center; gap:10px; margin:10px 0; color:#ddd; }.toggle-row input { accent-color:var(--primary); width:18px; height:18px; }

.mood-selector { display: flex; gap: 10px; flex-wrap: wrap; background: rgba(0,0,0,0.3); padding: 10px; border-radius: 8px; }
.mood-icon { font-size: 24px; cursor: pointer; transition: 0.2s; opacity: 0.5; }
.mood-icon:hover, .mood-icon.selected { opacity: 1; transform: scale(1.2); }

.genre-container { position: relative; }
#genreDropdown { position:absolute; top:40px; left:0; background:var(--bg-card); display:none; grid-template-columns: 1fr 1fr; gap: 5px; border-radius:8px; padding: 15px; z-index:1000; width:300px; box-shadow: 0 10px 30px rgba(0,0,0,0.8); }
#genreDropdown button { background:transparent; border:none; color:#aaa; padding:8px; cursor:pointer; text-align:left; border-radius: 4px; }
#genreDropdown button:hover { background:rgba(255,255,255,0.1); color: #fff; }

@media (max-width: 900px) {
    .navbar { height: auto; min-height: 70px; padding: 12px 20px; gap: 12px; flex-wrap: wrap; }
    .logo { font-size: 26px; }
    .nav-links { order: 3; width: 100%; justify-content: space-between; gap: 4px; overflow-x: auto; }
    .nav-links a { padding: 6px 8px; font-size: 13px; white-space: nowrap; }
    .search-bar { flex: 1; min-width: 120px; }
    .nav-actions { flex:1; justify-content:flex-end; }
    .random-btn { font-size:.8em; white-space:nowrap; }
    .search-bar input, .search-bar input:focus { width: 100%; }
    .hero { height: 72vh; min-height: 500px; padding: 0 25px; }
    .hero h1 { font-size: 3em; }
    .hero p { font-size: 1em; }
    .content-wrapper { padding: 30px 25px; margin-top: -70px; }
    .movie-grid { grid-template-columns: repeat(auto-fill, minmax(135px, 1fr)); gap: 15px; }
    .hover-card { display: none; }
    .tmdb-overlay { padding: 35px 25px; gap: 20px; }
    .tmdb-poster { width: 170px; }
    .tmdb-info { min-width: 220px; }
    .tmdb-title { font-size: 2em; }
    .modal-body { padding: 25px; }
    .profile-content { padding: 0 20px; }
    .profile-name { font-size: 2.4em; }
    .profile-stats { grid-template-columns: repeat(3, 1fr); }
    .watch-time-panel { grid-template-columns:1fr; }
    .episode-item { grid-template-columns:100px 1fr; }
    .episode-thumb { width:100px; }
    .episode-controls { grid-column:2; justify-items:start; display:flex; align-items:center; }
    .calendar-page { padding-top:145px; }
}

@media (max-width: 560px) {
    .navbar { padding: 10px 14px; }
    .nav-actions { width:100%; order:2; justify-content:space-between; }
    .random-btn { padding:7px 10px; }
    .nav-links { justify-content: flex-start; }
    .nav-links a { font-size:12px; padding:6px 7px; }
    .navbar .logo { letter-spacing:2px; }
    .hero { min-height: 460px; padding: 0 18px; }
    .hero h1 { font-size: 2.4em; }
    .hero-buttons { flex-wrap: wrap; }
    .content-wrapper { padding: 25px 18px; }
    .movie-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
    .tmdb-overlay { display: block; padding: 35px 18px; }
    .tmdb-poster { display: block; width: 150px; margin-bottom: 20px; }
    .tmdb-info { min-width: 0; }
    .media-detailed-stats { grid-template-columns: 1fr; }
    .profile-banner { height: 250px; }
    .profile-content { top: -60px; padding: 0 14px; }
    .profile-header { gap: 15px; }
    .profile-avatar { width: 120px; height: 120px; }
    .avatar-shell { width:136px; height:136px; }
    .profile-name { font-size: 1.9em; }
    .profile-stats { grid-template-columns: repeat(2, 1fr); }
    .profile-stat { padding: 12px; }
    .review-meta { display: grid; gap: 4px; }
    .custom-list { align-items: flex-start; flex-direction: column; }
    .episode-item { grid-template-columns:1fr; }
    .episode-thumb { width:100%; }
    .episode-controls { grid-column:auto; }
    .filter-bar { gap:7px; }.filter-bar select, .filter-bar input { flex:1 1 130px; min-width:0; }.filter-reset { margin-left:0; }
    .random-options { grid-template-columns:1fr; }.random-modal-content { padding:28px 20px; }
    .calendar-heading { display:grid; }.calendar-page { padding-top:180px; }
    .achievements-grid { grid-template-columns:1fr; }.list-detail-card { grid-template-columns:80px 1fr; }.list-detail-card img { width:80px; }
}

@media (max-width: 900px) {
    .settings-studio { grid-template-columns:1fr; }
    .studio-nav { flex-direction:row; overflow-x:auto; }
    .studio-tab { white-space:nowrap; flex:1; text-align:center; }
    .live-preview { order:-1; min-height:330px; }
    .studio-editor { min-height:0; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration:0.01ms !important; animation-iteration-count:1 !important; scroll-behavior:auto !important; transition-duration:0.01ms !important; }
}

/* MOVIEX — son dokunuşlar */
.logo::before,
.logo::after { pointer-events:none; }
.logo::before { border:1px solid rgba(125,211,252,0); }
.logo:hover::before { filter:blur(3px); }

.tmdb-actions .btn,
.review-editor .btn,
.list-picker-option,
.season-toggle { transition:transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease; }
.tmdb-actions .btn:hover,
.review-editor .btn:hover,
.season-toggle:hover { transform:translateY(-2px); box-shadow:0 8px 22px rgba(0,0,0,.25); }

.tmdb-actions .btn { min-height:42px; border-radius:12px; border:1px solid rgba(255,255,255,.12); }
.tmdb-actions .btn.secondary { background:linear-gradient(135deg,rgba(255,255,255,.11),rgba(255,255,255,.045)); }
.tmdb-actions .btn.secondary:hover { border-color:rgba(255,255,255,.28); }

.season-header { gap:10px; }
.season-toggle { flex:0 0 auto; border-radius:10px; font-weight:700; }
.episode-controls { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.episode-controls select { min-width:78px; padding:7px 9px; border-radius:9px; border:1px solid rgba(255,255,255,.14); background:#14151b; color:#fff; }
.episode-controls label { display:inline-flex; align-items:center; gap:7px; white-space:nowrap; color:#ddd; }
.ep-checkbox { width:18px; height:18px; accent-color:var(--primary); }

.list-detail-card { transition:transform .2s ease, border-color .2s ease, background .2s ease; }
.list-detail-card:hover { transform:translateY(-3px); border-color:var(--primary); background:rgba(255,255,255,.065); }
.list-picker-option { border:1px solid var(--glass-border); }
.list-picker-option:hover { transform:translateY(-2px); box-shadow:0 10px 25px rgba(0,0,0,.25); }

.calendar-card { box-shadow:0 10px 28px rgba(0,0,0,.18); }
.calendar-card > div { min-height:105px; }

@media (max-width:700px) {
  .episode-item { grid-template-columns:90px 1fr; }
  .episode-controls { grid-column:1 / -1; }
  .season-toggle { font-size:.68em; }
}

/* MOVIEX vNext: koleksiyon modalları, kart sürükleme ve ülke destesi */
.profile-box > h3[role="button"]{cursor:pointer;display:flex;align-items:center;justify-content:space-between;transition:transform .2s,opacity .2s}.profile-box > h3[role="button"]:hover{transform:translateX(3px);opacity:.9}.profile-box > h3[role="button"]::after{content:'›';font-size:1.2em;opacity:.45}
.horizontal-scroll{cursor:grab;touch-action:pan-y;user-select:none}.horizontal-scroll.is-dragging{cursor:grabbing;scroll-behavior:auto}.horizontal-scroll .recommendation-card,.horizontal-scroll .mini-card,.horizontal-scroll .cast-card{user-select:none;-webkit-user-drag:none}
.collection-card{cursor:pointer}.collection-card img{aspect-ratio:2/3;object-fit:cover}.collection-card:hover{transform:translateY(-3px)}
.calendar-tools{display:flex;align-items:center;gap:12px}.country-deck{position:relative;z-index:20}.country-deck-main{position:relative;min-width:180px;padding:12px 16px;border:1px solid rgba(255,255,255,.14);border-radius:16px;background:linear-gradient(145deg,rgba(255,255,255,.1),rgba(255,255,255,.035));color:#fff;text-align:left;cursor:pointer;box-shadow:0 10px 30px rgba(0,0,0,.25);transition:transform .25s}.country-deck-main:hover{transform:translateY(-2px)}.country-deck-main span{font-size:1.4rem;margin-right:8px}.country-deck-main strong{display:inline-block}.country-deck-main small{display:block;margin-left:34px;color:#aaa}.country-cards{position:absolute;top:calc(100% + 8px);left:0;width:280px;height:260px;pointer-events:none}.country-cards button{position:absolute;width:120px;height:150px;border-radius:14px;border:1px solid rgba(255,255,255,.18);background:linear-gradient(145deg,#242424,#111);color:#fff;box-shadow:0 12px 25px rgba(0,0,0,.4);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:8px;font-size:1.8rem;opacity:0;transform:translate(55px,-10px) rotate(0deg) scale(.85);transition:transform .38s cubic-bezier(.2,.8,.2,1),opacity .25s;cursor:pointer}.country-cards button span{font-size:.8rem}.country-deck.open .country-cards{pointer-events:auto}.country-deck.open .country-cards button{opacity:1}.country-deck.open .country-cards button:nth-child(1){transform:translate(0,0) rotate(-7deg)}.country-deck.open .country-cards button:nth-child(2){transform:translate(85px,12px) rotate(2deg)}.country-deck.open .country-cards button:nth-child(3){transform:translate(160px,0) rotate(7deg)}.country-deck.open .country-cards button:nth-child(4){transform:translate(10px,105px) rotate(-4deg)}.country-deck.open .country-cards button:nth-child(5){transform:translate(95px,115px) rotate(3deg)}.country-deck.open .country-cards button:nth-child(6){transform:translate(180px,105px) rotate(6deg)}.country-deck.open .country-cards button:nth-child(7){transform:translate(45px,175px) rotate(-2deg)}.country-deck.open .country-cards button:nth-child(8){transform:translate(140px,175px) rotate(4deg)}
@media(max-width:700px){.calendar-tools{align-items:flex-start}.country-cards{left:auto;right:0}.country-deck-main{min-width:155px}.calendar-tools .btn{padding:10px}.country-cards button{width:100px;height:125px}}
.taste-wheel-wrap{position:relative;width:min(360px,82vw);height:min(360px,82vw);margin:18px auto}.taste-wheel{width:100%;height:100%;border-radius:50%;border:10px solid rgba(255,255,255,.14);background:conic-gradient(from -15deg,#181818 0deg 30deg,#292929 30deg 60deg,#151515 60deg 90deg,#303030 90deg 120deg,#181818 120deg 150deg,#292929 150deg 180deg,#151515 180deg 210deg,#303030 210deg 240deg,#181818 240deg 270deg,#292929 270deg 300deg,#151515 300deg 330deg,#303030 330deg 360deg);box-shadow:0 18px 55px rgba(0,0,0,.45);position:relative;transition:transform 1.8s cubic-bezier(.12,.72,.12,1)}.taste-wheel-labels{position:absolute;inset:0}.taste-wheel-labels span{position:absolute;left:50%;top:50%;width:44%;transform-origin:0 0;transform:rotate(calc(var(--i)*30deg)) translateX(8px) rotate(calc(var(--i)*-30deg));font-size:10px;color:#eee;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.taste-wheel-pointer{position:absolute;top:-13px;left:50%;transform:translateX(-50%);font-size:26px;z-index:2}.wheel-result{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:8px}.wheel-result img{width:62px;height:92px;object-fit:cover;border-radius:8px}.wheel-result div{display:flex;flex-direction:column;gap:8px}.slot-machine{min-height:30px}

/* MOVIEX final pass */
.modal.media-loading .modal-content > *:not(.close-modal),
.modal.modal-loading .modal-content > *:not(.close-modal){visibility:hidden}
.modal.media-loading .modal-content::after,
.modal.modal-loading .modal-content::after{content:'Yükleniyor…';position:absolute;inset:0;display:grid;place-items:center;color:#aaa;font-size:.95rem;letter-spacing:.06em;background:rgba(10,10,14,.35);backdrop-filter:blur(3px);z-index:4}
.modal .modal-content{position:relative}
/* Modal açılışında önce boş/bulanık ara kare gösterme: içerik doğrudan hazır katmanda görünür. */
.modal{transition:none!important}
.modal .modal-content{animation:none!important}
.tmdb-actions{gap:10px 12px;align-items:center;margin-bottom:18px}
.tmdb-actions .btn{min-height:42px}
.providers-section{margin:0 0 24px;padding:16px 0 18px;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08)}
.providers-section h3{margin-bottom:12px}
.collection-remove,.remove-list-item{margin-top:8px;font-size:.72rem;padding:7px 10px}
.collection-card > div{padding:10px}
.continue-rail{display:flex;gap:14px;overflow-x:auto;padding-bottom:8px;cursor:grab;touch-action:pan-y;user-select:none}
.continue-card,.followed-card{flex:0 0 250px;display:flex;gap:12px;padding:10px;border-radius:12px;background:rgba(0,0,0,.2);border:1px solid rgba(255,255,255,.08);cursor:pointer}
.continue-card img,.followed-card img{width:72px;height:108px;object-fit:cover;border-radius:8px;pointer-events:none}
.continue-card div,.followed-card div{display:flex;flex-direction:column;gap:7px;min-width:0;justify-content:center}
.continue-card strong,.followed-card strong{font-size:.86rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.continue-card small,.followed-card small{color:#999;line-height:1.4}
.continue-card span{color:#fff;font-size:.75rem;margin-top:4px}
.followed-card{flex:0 0 210px}
.followed-card img{width:64px;height:96px}
.horizontal-scroll,.profile-media-list,.episodes-list,.continue-rail{touch-action:pan-y}
/* Ülke destesi: aşağı doğru yumuşak, kademeli açılım */
.country-cards{height:0;overflow:visible;top:calc(100% + 8px);left:0;width:230px;transition:height .45s ease;}
.country-cards button{left:0;top:0;width:190px;height:72px;justify-content:flex-start;flex-direction:row;padding:0 18px;gap:12px;font-size:1.3rem;opacity:0;transform:translateY(-10px) scale(.96);transition:transform .52s cubic-bezier(.16,1,.3,1),opacity .25s ease,box-shadow .25s ease;}
.country-cards button span{font-size:.82rem;font-weight:600}
.country-deck.open .country-cards{height:620px}
.country-deck.open .country-cards button:nth-child(1){transform:translateY(0) rotate(0)}
.country-deck.open .country-cards button:nth-child(2){transform:translateY(78px) rotate(-1deg)}
.country-deck.open .country-cards button:nth-child(3){transform:translateY(156px) rotate(1deg)}
.country-deck.open .country-cards button:nth-child(4){transform:translateY(234px) rotate(-1deg)}
.country-deck.open .country-cards button:nth-child(5){transform:translateY(312px) rotate(1deg)}
.country-deck.open .country-cards button:nth-child(6){transform:translateY(390px) rotate(-1deg)}
.country-deck.open .country-cards button:nth-child(7){transform:translateY(468px) rotate(1deg)}
.country-deck.open .country-cards button:nth-child(8){transform:translateY(546px) rotate(-1deg)}
.country-cards button:hover{box-shadow:0 16px 35px rgba(0,0,0,.55);border-color:rgba(255,255,255,.35)}
@media(max-width:700px){.country-deck.open .country-cards{height:540px}.country-cards button{width:175px;height:62px}.country-deck.open .country-cards button:nth-child(2){transform:translateY(68px)}.country-deck.open .country-cards button:nth-child(3){transform:translateY(136px)}.country-deck.open .country-cards button:nth-child(4){transform:translateY(204px)}.country-deck.open .country-cards button:nth-child(5){transform:translateY(272px)}.country-deck.open .country-cards button:nth-child(6){transform:translateY(340px)}.country-deck.open .country-cards button:nth-child(7){transform:translateY(408px)}.country-deck.open .country-cards button:nth-child(8){transform:translateY(476px)}}

/* MOVIEX interaction pass: every horizontal rail behaves consistently */
.horizontal-scroll, .profile-media-list, .continue-rail {
  overflow-x:auto;
  overflow-y:hidden;
  cursor:grab;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
}
.horizontal-scroll.is-dragging, .profile-media-list.is-dragging, .continue-rail.is-dragging { cursor:grabbing; scroll-behavior:auto; }
.horizontal-scroll > *, .profile-media-list > *, .continue-rail > * { flex-shrink:0; }
.section-open-btn{white-space:nowrap;font-size:.78rem;padding:8px 12px}
.recommendations-modal-grid{grid-template-columns:repeat(auto-fill,minmax(155px,1fr));gap:18px}
.recommendation-modal-card{min-width:0;cursor:pointer;display:grid;gap:7px;transition:transform .2s ease}
.recommendation-modal-card:hover{transform:translateY(-4px)}
.recommendation-modal-card img{width:100%;aspect-ratio:2/3;object-fit:cover;border-radius:10px;border:1px solid var(--glass-border);background:#15151a}
.recommendation-modal-card strong{font-size:.86rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.recommendation-modal-card small{color:#999}
.recommendations-modal .modal-content{overflow-x:hidden}
.collectionModal .movie-grid, #collectionGrid, #listDetailGrid{min-width:0}
#collectionGrid.movie-grid,#listDetailGrid.movie-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr));gap:16px;}
#collectionGrid .list-detail-card,#listDetailGrid .list-detail-card{min-width:0;grid-template-columns:100px minmax(0,1fr);overflow:hidden;}
#collectionGrid .list-detail-card > div,#listDetailGrid .list-detail-card > div{min-width:0;overflow:hidden;}
#collectionGrid .list-detail-card strong,#listDetailGrid .list-detail-card strong{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
#collectionGrid .list-detail-card small,#listDetailGrid .list-detail-card small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

/* Real wheel: dynamic segment count + visible center */
/* PROFESYONEL SİNEMATİK ÇARK & RULET SAHNESİ */
.cinema-wheel-stage {
    display: none;
    position: relative;
    width: 100%;
    margin: 15px auto 5px;
    align-items: center;
    flex-direction: column;
}
.cinema-wheel-stage.show {
    display: flex;
}
.wheel-stage-wrapper {
    position: relative;
    width: min(390px, 86vw);
    height: min(390px, 86vw);
    display: grid;
    place-items: center;
    margin: 0 auto;
}
/* Üst Ticker İbre */
.wheel-ticker-pointer {
    position: absolute;
    top: -14px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
    font-size: 32px;
    line-height: 1;
    color: #ffd700;
    text-shadow: 0 0 14px rgba(255, 215, 0, 0.9), 0 4px 10px rgba(0, 0, 0, 0.8);
    transform-origin: 50% 10%;
    pointer-events: none;
    transition: transform 0.08s ease;
}
/* Dış Çerçeve & Tiyatro Ampulleri */
.wheel-outer-ring {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    padding: 12px;
    background: radial-gradient(circle, #25161d 0%, #150d14 60%, #0c080e 100%);
    border: 6px solid #d4af37;
    box-shadow: 0 0 0 3px #583c07, 0 15px 45px rgba(0, 0, 0, 0.85), 0 0 35px rgba(229, 9, 20, 0.35);
    display: grid;
    place-items: center;
    overflow: hidden;
}
.wheel-bulbs-ring {
    position: absolute;
    inset: 4px;
    border-radius: 50%;
    pointer-events: none;
    border: 2px dashed rgba(255, 225, 120, 0.7);
    box-shadow: inset 0 0 15px rgba(255, 215, 0, 0.3);
    animation: bulbsFlicker 1.8s infinite alternate ease-in-out;
}
@keyframes bulbsFlicker {
    0% { opacity: 0.6; filter: drop-shadow(0 0 2px #ffd700); }
    100% { opacity: 1; filter: drop-shadow(0 0 8px #ffb300); }
}
/* Dönen Çark Gövdesi */
.cinema-wheel {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: #0f1017;
    overflow: hidden;
    transform: rotate(0deg);
    will-change: transform;
    box-shadow: inset 0 0 25px rgba(0, 0, 0, 0.9);
}
.wheel-sectors {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border-radius: 50%;
}
.wheel-sector {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 50%;
    height: 48px;
    margin-top: -24px;
    transform-origin: 0% 50%;
    transform: rotate(var(--angle));
    display: flex;
    align-items: center;
    padding-left: 28px;
    color: #fff;
    pointer-events: none;
}
.wheel-sector-thumb {
    width: 32px;
    height: 46px;
    border-radius: 4px;
    object-fit: cover;
    border: 1px solid rgba(255, 255, 255, 0.35);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.6);
    margin-right: 8px;
    flex-shrink: 0;
}
.wheel-sector-title {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    color: #fff;
    text-shadow: 0 1px 4px #000, 0 0 8px rgba(0,0,0,0.9);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100px;
}
/* Merkez Altın Göbek */
.wheel-center-hub {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 90px;
    height: 90px;
    border-radius: 50%;
    background: radial-gradient(circle at 35% 30%, #fff3b0 0%, #d4af37 40%, #8a6508 85%);
    border: 3px solid #fff;
    box-shadow: 0 0 0 4px #422904, 0 8px 24px rgba(0, 0, 0, 0.8), 0 0 20px rgba(255, 215, 0, 0.5);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 5;
    pointer-events: none;
}
.hub-logo {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.25rem;
    letter-spacing: 2px;
    color: #0b0709;
    font-weight: 800;
    line-height: 1;
}
.hub-sub {
    font-size: 0.48rem;
    font-weight: 800;
    letter-spacing: 1.5px;
    color: #3d2301;
}
.roulette-status {
    margin-top: 14px;
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: #ffd700;
    text-transform: uppercase;
}

/* KAZANAN KARTI (REVEAL POPUP VİTRİNİ) */
.winner-reveal-box {
    width: 100%;
    max-width: 520px;
    margin: 16px auto 0;
    padding: 20px;
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(28, 20, 32, 0.98), rgba(12, 14, 22, 0.98));
    border: 2px solid rgba(255, 215, 0, 0.6);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.8), 0 0 35px rgba(229, 9, 20, 0.35);
    animation: winnerPop 0.45s cubic-bezier(0.34, 1.56, 0.64, 1);
}
@keyframes winnerPop {
    0% { transform: scale(0.85); opacity: 0; }
    100% { transform: scale(1); opacity: 1; }
}
.winner-card-body {
    display: flex;
    gap: 18px;
    align-items: center;
}
.winner-poster {
    width: 100px;
    aspect-ratio: 2/3;
    object-fit: cover;
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.6);
    flex-shrink: 0;
}
.winner-info {
    flex: 1;
    min-width: 0;
    text-align: left;
}
.winner-badge {
    display: inline-block;
    padding: 3px 8px;
    border-radius: 999px;
    background: linear-gradient(135deg, #e50914, #ff5722);
    color: #fff;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    margin-bottom: 6px;
}
.winner-title {
    font-size: 1.25rem;
    font-weight: 700;
    color: #fff;
    line-height: 1.2;
    margin-bottom: 4px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.winner-meta {
    font-size: 0.8rem;
    color: #cbd5e1;
    margin-bottom: 6px;
}
.winner-overview {
    font-size: 0.76rem;
    color: #94a3b8;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 12px;
}
.winner-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.btn-winner {
    padding: 8px 14px;
    border-radius: 8px;
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
    transition: transform 0.2s, background 0.2s, box-shadow 0.2s;
}
.btn-winner.primary {
    background: var(--primary);
    color: #fff;
}
.btn-winner.primary:hover {
    background: var(--primary-hover);
    transform: translateY(-2px);
    box-shadow: 0 6px 18px rgba(229, 9, 20, 0.4);
}
.btn-winner.secondary {
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.2);
}
.btn-winner.secondary:hover {
    background: rgba(255, 255, 255, 0.25);
    transform: translateY(-2px);
}

/* MOVIEX design system — Midnight Cinema */
:root{--primary:#f0445a;--primary-hover:#ff6878;--accent-violet:#8d63ff;--bg:#080a10;--bg-elevated:#10131c;--bg-card:rgba(18,22,32,.84);--glass-border:rgba(255,255,255,.11);--glass-highlight:rgba(255,255,255,.07);--text-muted:#9da3b2;--star:#f6c453}
body{background:radial-gradient(circle at 12% -8%,rgba(240,68,90,.12),transparent 28rem),radial-gradient(circle at 94% 10%,rgba(110,76,220,.12),transparent 32rem),var(--bg);color:#f7f8fb}
.navbar{height:76px;padding:0 clamp(18px,4vw,56px);background:rgba(8,10,16,.78);border-bottom-color:rgba(255,255,255,.09);box-shadow:0 12px 35px rgba(0,0,0,.14)}
.logo{font-family:'Bebas Neue',sans-serif;font-size:38px;letter-spacing:4px;text-shadow:0 0 20px rgba(240,68,90,.5)}
.nav-links{gap:8px}.nav-links a{padding:9px 12px;border-radius:9px;font-size:.86rem;color:#c2c6d1}.nav-links a:hover,.nav-links a.active{color:#fff;background:rgba(255,255,255,.07)}.nav-links a.active{box-shadow:inset 0 -2px 0 var(--primary)}
.random-btn{background:linear-gradient(135deg,var(--primary),#9146df);border-radius:11px;padding:10px 15px;font-size:.8rem;box-shadow:0 8px 24px rgba(240,68,90,.2)}.search-bar input{border-radius:11px;background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.1);width:170px}
.hero{height:82vh;min-height:590px;padding:0 clamp(24px,6vw,88px);background-position:center 20%;}.hero-vignette{background:linear-gradient(90deg,rgba(8,10,16,.98) 0%,rgba(8,10,16,.72) 40%,rgba(8,10,16,.08) 82%),linear-gradient(0deg,var(--bg) 0%,transparent 36%)}.hero-content{max-width:650px;padding-top:42px}.hero-eyebrow{margin-bottom:14px;color:#fda4af;font-size:.72rem;font-weight:700;letter-spacing:.19em}.hero h1{font-family:'Bebas Neue',sans-serif;font-size:clamp(3.3rem,7vw,6.6rem);letter-spacing:.02em;line-height:.95;text-shadow:0 5px 28px rgba(0,0,0,.6)}.hero p:not(.hero-eyebrow){max-width:570px;color:#d0d3dc;font-size:1rem;line-height:1.7}.hero-buttons{gap:10px}.btn-play,.btn-info{border-radius:10px;padding:12px 20px;font-size:.9rem}.btn-play{background:#fff}.btn-info{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.14)}
.content-wrapper{padding:32px clamp(18px,4vw,56px);margin-top:-72px}.section-title{font-size:1.8rem;letter-spacing:-.03em;margin-bottom:18px}.filter-bar{padding:10px;border-radius:12px;background:rgba(14,17,25,.78);border-color:rgba(255,255,255,.1)}
.movie-grid{grid-template-columns:repeat(auto-fill,minmax(165px,1fr));gap:18px}.movie-card{border-radius:11px;box-shadow:0 12px 26px rgba(0,0,0,.22);border:1px solid rgba(255,255,255,.06);overflow:visible}.movie-card>img{border-radius:10px}
.modal{background:rgba(3,5,10,.86)}.modal-content{background:rgba(14,17,25,.97);border-color:rgba(255,255,255,.12);border-radius:18px}.tmdb-header{border-radius:18px 18px 0 0}.tmdb-overlay{background:linear-gradient(90deg,rgba(12,15,23,.99) 220px,rgba(12,15,23,.84) 100%);padding:42px 38px}.tmdb-poster{width:250px;border-radius:12px}.tmdb-title{font-family:'Bebas Neue',sans-serif;font-size:clamp(2.4rem,4vw,4rem);letter-spacing:.02em}.tmdb-overview{color:#c5c9d4}.section-divider{font-size:1.05rem;letter-spacing:-.01em;color:#f7f8fb}.profile-box{background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.025));border-color:rgba(255,255,255,.1);box-shadow:0 16px 35px rgba(0,0,0,.24)}
.mobile-bottom-nav{display:none}

@media(max-width:900px){.hero{min-height:540px}.nav-links{gap:2px}.nav-actions{gap:8px}.content-wrapper{margin-top:-52px}.movie-grid{grid-template-columns:repeat(auto-fill,minmax(145px,1fr));gap:14px}}
@media(max-width:700px){body{padding-bottom:72px}.navbar{height:auto;min-height:66px;padding:10px 16px}.navbar .nav-links{display:none}.navbar .nav-actions{flex:1}.navbar .search-bar{min-width:0}.navbar .search-bar input{width:100%}.navbar .random-btn{display:none}.hero{height:70vh;min-height:500px;padding:0 20px}.hero-content{padding-top:54px}.hero h1{font-size:clamp(3rem,15vw,4.5rem)}.hero p:not(.hero-eyebrow){font-size:.9rem;line-height:1.55}.content-wrapper{padding:28px 16px;margin-top:-42px}.section-title{font-size:1.5rem}.movie-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.movie-card{border-radius:8px}.movie-card>img{border-radius:7px}.hover-card{display:none}.filter-bar{border-radius:12px}.tmdb-overlay{padding:30px 18px;gap:20px}.tmdb-poster{width:150px}.tmdb-info{min-width:0}.modal-content{width:100%;max-height:100vh;border-radius:0}.tmdb-header{border-radius:0}.mobile-bottom-nav{position:fixed;display:grid;grid-template-columns:repeat(5,1fr);left:10px;right:10px;bottom:10px;height:62px;padding:6px;border:1px solid rgba(255,255,255,.14);border-radius:18px;background:rgba(12,15,23,.9);backdrop-filter:blur(18px);box-shadow:0 14px 32px rgba(0,0,0,.45);z-index:1200}.mobile-bottom-nav button{display:grid;place-items:center;gap:1px;background:transparent;color:#89909e;border-radius:12px;font-size:1rem}.mobile-bottom-nav button small{font-size:.59rem;font-weight:600}.mobile-bottom-nav button.active{color:#fff;background:rgba(255,255,255,.08)}.mobile-bottom-nav .mobile-wheel-action{color:#fff;background:linear-gradient(145deg,var(--primary),#8d46df);box-shadow:0 6px 18px rgba(240,68,90,.28);transform:translateY(-11px);height:66px;border:4px solid var(--bg)}.mobile-bottom-nav .mobile-wheel-action small{color:#fff}}
@media(max-width:420px){.movie-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.hero-buttons{display:grid;grid-template-columns:1fr}.hero-buttons .btn{justify-content:center}.tmdb-poster{width:125px}.tmdb-info{width:100%}}
.cast-card{position:relative;min-width:0}
.cast-card img{display:block;background:#17171d}

/* Evrensel çark: içerikler dışarıda asılı durmaz, seçim kütüphaneden yapılır. */
.random-modal-content .random-moods + .random-moods{margin-top:10px}
.media-mode-chip{padding:8px 13px;border:1px solid rgba(255,255,255,.16);border-radius:999px;background:rgba(255,255,255,.055);color:#c9cad4;font-size:.73rem;font-weight:700;transition:transform .2s,background .2s,border-color .2s,color .2s}.media-mode-chip:hover{transform:translateY(-2px);color:#fff;border-color:rgba(255,255,255,.36)}.media-mode-chip.active{background:linear-gradient(135deg,#ff6b35,#f0445a);border-color:transparent;color:#fff;box-shadow:0 7px 18px rgba(240,68,90,.22)}
.universal-roulette-stage{height:min(430px,88vw);perspective:900px}.universal-roulette{background:conic-gradient(from -10deg,#e54862 0deg 45deg,#642fd0 45deg 90deg,#187d93 90deg 135deg,#e08b3f 135deg 180deg,#b93675 180deg 225deg,#354ab4 225deg 270deg,#258b69 270deg 315deg,#a643ce 315deg 360deg);border:8px solid rgba(255,255,255,.2);box-shadow:0 24px 70px rgba(0,0,0,.6),0 0 0 9px rgba(255,255,255,.035),inset 0 0 0 2px rgba(255,255,255,.22);overflow:hidden;transform-style:preserve-3d}.universal-roulette::before{inset:7%;border:1px solid rgba(255,255,255,.42);box-shadow:inset 0 0 30px rgba(0,0,0,.24)}.universal-roulette::after{content:'';position:absolute;inset:0;background:repeating-conic-gradient(from -10deg,transparent 0deg 43deg,rgba(255,255,255,.5) 44deg 45deg);opacity:.6;pointer-events:none}.roulette-sector-labels{position:absolute;inset:0;z-index:1}.roulette-sector-labels span{position:absolute;left:50%;top:50%;width:42%;transform-origin:0 50%;transform:rotate(var(--angle)) translateX(13px);font-size:.6rem;font-weight:800;letter-spacing:.12em;color:rgba(255,255,255,.88);text-align:right;text-shadow:0 2px 5px rgba(0,0,0,.65);white-space:nowrap}.universal-roulette .roulette-core{width:116px;height:116px;background:radial-gradient(circle at 35% 25%,#5d1d32,#11131c 68%);border:3px solid rgba(255,255,255,.48);box-shadow:0 0 0 8px rgba(9,10,16,.24),0 12px 30px rgba(0,0,0,.6)}.universal-roulette .roulette-core strong{font-size:1rem}.universal-roulette .roulette-card{display:none}.universal-roulette-stage .roulette-pointer{top:28px;background:linear-gradient(145deg,#ff6b35,#e50914);border-color:rgba(255,255,255,.7)}
@media(max-width:560px){.universal-roulette-stage{height:min(350px,92vw)}.universal-roulette .roulette-core{width:94px;height:94px}.roulette-sector-labels span{font-size:.49rem;width:40%}}
.roulette-sector-labels span{transform:rotate(var(--angle)) translateX(13px) rotate(calc(var(--angle) * -1));text-align:left}

/* Verimlilik ve odak modu */
.match-pill{display:inline-flex;align-items:center;margin-left:6px;padding:3px 7px;border-radius:999px;background:rgba(70,211,105,.14);color:#65e887;font-size:.68rem;font-weight:700;vertical-align:middle}.provider-chip{position:relative}.provider-chip b{margin-left:auto;color:#fda4af;font-size:.85rem}.filter-bar select{min-width:138px}.trailer-fallback{display:flex;justify-content:center;align-items:center;gap:8px;padding:10px 14px;background:#0b0c11;color:#9da3b2;font-size:.78rem}.trailer-fallback a{color:#fff;font-weight:700;text-decoration:none}.trailer-fallback a:hover{text-decoration:underline;color:#ff8792}
body.film-night-mode{overflow:hidden}body.film-night-mode .navbar,body.film-night-mode .hero,body.film-night-mode .content-wrapper,body.film-night-mode .mobile-bottom-nav{display:none!important}body.film-night-mode #mediaModal{display:flex!important;opacity:1;background:rgba(2,3,7,.96);z-index:4000}.film-night-mode #mediaModal .modal-content{width:min(1180px,96vw);max-height:94vh;border-color:rgba(240,68,90,.35);box-shadow:0 0 0 1px rgba(255,255,255,.05),0 28px 100px rgba(0,0,0,.75)}
@media(max-width:700px){.filter-bar select{min-width:0;flex:1}.trailer-fallback{font-size:.7rem}}

/* Editoryal keşif yüzeyi */
:root{--media-accent-rgb:240 68 90;--transition-poster:none}
.hero{isolation:isolate;box-shadow:inset 0 -100px 130px rgb(var(--media-accent-rgb)/.16)}.hero::after{content:'';position:absolute;inset:0;background:radial-gradient(circle at 74% 34%,rgb(var(--media-accent-rgb)/.28),transparent 40%);mix-blend-mode:screen;opacity:.7;pointer-events:none;z-index:0;transition:background 1s ease}.hero-vignette{background:linear-gradient(90deg,rgba(8,10,16,.98) 0%,rgba(8,10,16,.72) 40%,rgba(8,10,16,.08) 82%),linear-gradient(0deg,var(--bg) 0%,transparent 36%),radial-gradient(circle at 76% 38%,rgb(var(--media-accent-rgb)/.3),transparent 45%)}
.bento-showcase{position:relative;z-index:12;width:min(1240px,calc(100% - 2*clamp(18px,4vw,56px)));margin:-92px auto 34px;padding:22px;border:1px solid rgb(var(--media-accent-rgb)/.22);border-radius:22px;background:linear-gradient(145deg,rgba(20,23,34,.9),rgba(12,14,22,.76));backdrop-filter:blur(20px);box-shadow:0 24px 70px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.08);transition:border-color 1s ease}.bento-heading{display:flex;align-items:end;justify-content:space-between;gap:16px;margin:0 2px 16px}.bento-heading h2{font-size:1.5rem;letter-spacing:-.04em}.bento-heading-note{color:#9da3b2;font-size:.75rem}.bento-grid{display:grid;grid-template-columns:2fr repeat(3,1fr);grid-template-rows:132px 132px;gap:12px}.bento-lead,.bento-tile{position:relative;min-width:0;overflow:hidden;border:1px solid rgba(255,255,255,.11);border-radius:15px;background:#131621;cursor:pointer;transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease}.bento-lead{grid-row:1 / span 2;background-image:linear-gradient(90deg,rgba(6,8,13,.96) 0%,rgba(6,8,13,.68) 47%,rgba(6,8,13,.05) 100%),var(--bento-image);background-size:cover;background-position:center}.bento-lead:hover,.bento-tile:hover{transform:translateY(-4px);border-color:rgb(var(--media-accent-rgb)/.72);box-shadow:0 15px 30px rgba(0,0,0,.32),0 0 0 1px rgb(var(--media-accent-rgb)/.2)}.bento-copy{position:absolute;left:22px;bottom:20px;max-width:62%}.bento-copy h3{margin:8px 0 5px;font-size:1.45rem;line-height:1.05}.bento-copy p{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:#c4c8d2;font-size:.74rem;line-height:1.45}.bento-open{margin-top:12px!important;padding:8px 12px!important;font-size:.72rem!important}.bento-tile img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .45s ease;filter:saturate(.9)}.bento-tile:hover img{transform:scale(1.08)}.bento-tile::after{content:'';position:absolute;inset:35% 0 0;background:linear-gradient(transparent,rgba(5,7,12,.95))}.bento-tile-copy{position:absolute;left:12px;right:10px;bottom:10px;z-index:1;display:grid;gap:3px}.bento-tile-copy strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.76rem}.bento-tile-copy small{color:#c2c6d1;font-size:.65rem}
body::after{content:'';position:fixed;inset:0;z-index:3600;pointer-events:none;background:linear-gradient(90deg,rgba(5,6,10,.96),rgba(5,6,10,.12)),var(--transition-poster) center/cover no-repeat;opacity:0;transform:scale(1.08);transition:opacity .2s ease,transform .28s ease}.cinematic-transition::after{opacity:1;transform:scale(1)}.cinematic-transition .movie-card.cinema-opening{transform:scale(1.04);filter:brightness(1.3)}
@media(max-width:800px){.bento-showcase{width:calc(100% - 32px);margin:-58px 16px 24px;padding:16px}.bento-grid{grid-template-columns:repeat(2,1fr);grid-template-rows:170px 112px 112px}.bento-lead{grid-column:1 / -1;grid-row:auto}.bento-tile:last-child{display:none}.bento-copy{left:16px;bottom:16px;max-width:76%}.bento-copy h3{font-size:1.2rem}.bento-copy p{font-size:.68rem}}
@media(max-width:520px){.bento-heading{align-items:start;flex-direction:column;gap:4px}.bento-heading h2{font-size:1.25rem}.bento-grid{grid-template-rows:160px 100px 100px}.bento-tile-copy{left:8px;bottom:8px}.bento-tile-copy strong{font-size:.68rem}.content-badge{font-size:.52rem;padding:3px 5px}}
.bento-showcase{margin:24px auto 34px}.bento-showcase + .content-wrapper{margin-top:0}
@media(max-width:800px){.bento-showcase{margin:18px 16px 24px}}
.skeleton-cast-card{min-width:88px;width:88px;height:142px;border-radius:9px;flex:0 0 88px}

/* ==========================================================================
   FAZ 2 & 3: FRAGMAN MODALI, WATCHLIST, VE MİKRO ETKİLEŞİM STİLLERİ
   ========================================================================== */

/* Fragman Modalı (Backdrop-filter blur 12px & Organik Modal) */
#trailerModal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    background: rgba(3, 4, 8, 0.92) !important;
    z-index: 9999 !important;
    align-items: center;
    justify-content: center;
}
#trailerModal.show {
    display: flex !important;
}
.trailer-modal-content {
    max-width: 960px !important;
    width: 92% !important;
    background: #0a0c14 !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-radius: 18px !important;
    padding: 0 !important;
    overflow: hidden !important;
    box-shadow: 0 25px 80px rgba(0, 0, 0, 0.95), 0 0 45px rgba(229, 9, 20, 0.25) !important;
    position: relative;
    transform-origin: center center;
}
.trailer-wrapper {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    background: #000;
}
.trailer-wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
}
.trailer-close-btn {
    position: absolute;
    top: 14px;
    right: 14px;
    z-index: 70;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: rgba(10, 12, 18, 0.8);
    border: 1px solid rgba(255, 255, 255, 0.25);
    color: #fff;
    font-size: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1), background 0.2s;
}
.trailer-close-btn:hover {
    background: var(--primary);
    transform: scale(1.12);
}
.trailer-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 20px;
    background: #0e111a;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}
.trailer-media-title {
    font-size: 0.95rem;
    font-weight: 600;
    color: #fff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 60%;
}
.trailer-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}
.trailer-detail-btn {
    padding: 7px 15px !important;
    font-size: 0.82rem !important;
    border-radius: 8px !important;
}
.trailer-selector-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 6px;
}
.trailer-chip {
    padding: 3px 10px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.16);
    color: #cbd5e1;
    font-size: 0.72rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
}
.trailer-chip:hover {
    background: rgba(255, 255, 255, 0.18);
    color: #fff;
    border-color: rgba(255, 255, 255, 0.35);
}
.trailer-chip.active {
    background: var(--primary);
    border-color: var(--primary);
    color: #fff;
    box-shadow: 0 0 10px rgba(240, 68, 90, 0.4);
}
.trailer-yt-link {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 7px 14px;
    border-radius: 8px;
    background: rgba(255, 0, 0, 0.15);
    border: 1px solid rgba(255, 0, 0, 0.35);
    color: #ff4d4d;
    text-decoration: none;
    font-size: 0.82rem;
    font-weight: 700;
    transition: all 0.2s ease;
    white-space: nowrap;
}
.trailer-yt-link:hover {
    background: #ff0000;
    color: #ffffff;
    border-color: #ff0000;
    box-shadow: 0 4px 15px rgba(255, 0, 0, 0.4);
}

/* İzleme Listesi (Watchlist) & Rozetler */
.card-watchlist-btn {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 10;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: rgba(10, 12, 18, 0.72);
    backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.18);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 15px;
    line-height: 1;
    opacity: 0;
    transform: scale(0.9);
    transition: all 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.movie-card:hover .card-watchlist-btn,
.card-watchlist-btn.is-active {
    opacity: 1;
    transform: scale(1);
}
.card-watchlist-btn:hover {
    transform: scale(1.15);
    background: rgba(229, 9, 20, 0.85);
    border-color: var(--primary);
}
.card-watchlist-btn.is-active {
    color: #e50914;
    background: rgba(255, 255, 255, 0.95);
    border-color: #fff;
    box-shadow: 0 0 14px rgba(229, 9, 20, 0.5);
}
.filter-tab-btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.18);
    color: #f1f2f6;
    padding: 7px 14px;
    border-radius: 8px;
    font-size: 0.84rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.22s ease;
    white-space: nowrap;
}
.filter-tab-btn:hover {
    background: rgba(229, 9, 20, 0.18);
    border-color: var(--primary);
    color: #fff;
}
.filter-tab-btn.active {
    background: var(--primary);
    border-color: var(--primary);
    box-shadow: 0 0 16px rgba(229, 9, 20, 0.45);
    color: #fff;
}
.nav-badge {
    background: var(--primary);
    color: #fff;
    font-size: 0.7rem;
    padding: 2px 7px;
    border-radius: 999px;
    font-weight: 700;
    margin-left: 5px;
    vertical-align: middle;
}
.hover-media-type {
    margin-left: auto;
    font-size: 0.72rem;
    text-transform: uppercase;
    color: #8c93a8;
    background: rgba(255, 255, 255, 0.08);
    padding: 2px 6px;
    border-radius: 4px;
}
.hover-btns .hover-watchlist-btn.active {
    background: var(--primary);
    border-color: var(--primary);
    color: #fff;
}
.empty-watchlist-box {
    grid-column: 1 / -1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 70px 24px;
    text-align: center;
    background: rgba(18, 21, 32, 0.6);
    border: 1px dashed rgba(255, 255, 255, 0.16);
    border-radius: 18px;
    color: #aaa;
    margin: 20px 0;
}
.empty-watchlist-box .empty-icon {
    font-size: 3.5rem;
    margin-bottom: 14px;
}
.empty-watchlist-box h3 {
    color: #fff;
    font-size: 1.45rem;
    margin-bottom: 10px;
    font-weight: 700;
}
.empty-watchlist-box p {
    max-width: 460px;
    margin-bottom: 22px;
    font-size: 0.92rem;
    line-height: 1.6;
    color: #9da3b4;
}

/* Bildirim Kutusu (Toast) */
.toast-notification {
    position: fixed;
    bottom: 28px;
    right: 28px;
    z-index: 5000;
    background: rgba(15, 18, 28, 0.94);
    border: 1px solid rgba(255, 255, 255, 0.16);
    backdrop-filter: blur(14px);
    color: #fff;
    padding: 12px 20px;
    border-radius: 12px;
    font-size: 0.9rem;
    font-weight: 500;
    box-shadow: 0 12px 35px rgba(0, 0, 0, 0.7), 0 0 20px rgba(229, 9, 20, 0.25);
    display: flex;
    align-items: center;
    gap: 10px;
    transform: translateY(20px);
    opacity: 0;
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.3s ease;
    pointer-events: none;
}
.toast-notification.show {
    transform: translateY(0);
    opacity: 1;
}

/* Touch devices use native scrolling for every horizontal rail. */
.horizontal-scroll,
.profile-media-list,
.continue-rail {
    min-width: 0;
    overflow-x: auto !important;
    overflow-y: hidden;
    touch-action: pan-x pan-y;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    scroll-snap-type: x proximity;
    scroll-padding-inline: 16px;
}
.episodes-list { touch-action: pan-y; }
.horizontal-scroll > *,
.profile-media-list > *,
.continue-rail > * { scroll-snap-align: start; }

.section-heading-row { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.section-heading-row .section-divider { margin:0 0 15px; }
.section-heading-row.recommendations-title { margin-top:32px; }
.section-heading-row.recommendations-title .section-divider { margin-top:0; }
.section-open-btn { flex:0 0 auto; margin:0 0 15px; padding:8px 12px; border:1px solid rgba(255,255,255,.16); border-radius:9px; background:rgba(255,255,255,.07); color:#f4f5f8; font-size:.76rem; font-weight:600; white-space:nowrap; }
.section-open-btn:hover { background:rgba(255,255,255,.13); border-color:rgba(255,255,255,.3); }
.section-open-btn[hidden] { display:none !important; }
.all-rail-items-content { padding:30px; }
.all-rail-items-heading { padding:4px 54px 22px 0; }
.all-rail-items-heading .eyebrow { color:#9ca3b3; font-size:.72rem; letter-spacing:.12em; }
.all-rail-items-heading h2 { margin:5px 0; font-size:clamp(1.4rem,3vw,2rem); }
.all-rail-items-count { color:#9da3b4; font-size:.85rem; }
.all-rail-items-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(145px,1fr)); gap:18px 14px; }
.all-rail-item-card { min-width:0; display:grid; align-content:start; gap:7px; padding:0; border:0; background:transparent; color:#f4f5f8; text-align:left; }
.all-rail-item-card img { display:block; width:100%; aspect-ratio:2/3; object-fit:cover; border:1px solid var(--glass-border); border-radius:10px; background:#15151a; }
.all-rail-item-card strong { overflow:hidden; font-size:.84rem; text-overflow:ellipsis; white-space:nowrap; }
.all-rail-item-card small { overflow:hidden; color:#9da3b4; text-overflow:ellipsis; white-space:nowrap; }
.all-rail-item-card.person-card img { aspect-ratio:3/4; }
.all-rail-item-card:hover img { border-color:rgba(255,255,255,.42); }

.close-modal {
    appearance: none;
    -webkit-appearance: none;
    border: 1px solid rgba(255,255,255,.18);
    padding: 0;
    line-height: 1;
    font-family: inherit;
    -webkit-tap-highlight-color: transparent;
}

@media (max-width: 700px) {
    .modal {
        height: 100vh;
        height: 100dvh;
        overflow: hidden;
        padding: 0;
    }
    .modal-content {
        width: 100%;
        max-height: 100vh;
        max-height: 100dvh;
        overflow-x: hidden;
        overflow-y: auto;
        overscroll-behavior: contain;
        padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px));
    }
    #mediaModal .modal-content,
    #actorModal .modal-content,
    #allRailItemsModal .modal-content {
        width: 100vw;
        height: 100vh;
        height: 100dvh;
        max-height: 100vh;
        max-height: 100dvh;
        margin: 0;
        border: 0;
        border-radius: 0;
    }
    .modal-content > .close-modal {
        position: fixed;
        top: calc(env(safe-area-inset-top, 0px) + 12px);
        right: 12px;
        left: auto;
        float: none;
        display: flex;
        width: 44px;
        height: 44px;
        margin: 0;
        z-index: 4001;
        background: rgba(8, 9, 13, .94);
        color: #fff;
        border: 1px solid rgba(255,255,255,.32);
        border-radius: 50%;
        font-size: 30px;
        box-shadow: 0 4px 18px rgba(0,0,0,.42);
        flex: 0 0 44px;
    }
    #mediaModal .tmdb-overlay,
    #actorModal .tmdb-overlay {
        padding: calc(env(safe-area-inset-top, 0px) + 18px) 16px 24px;
    }
    #mediaModal .tmdb-poster,
    #actorModal .tmdb-poster {
        width: clamp(112px, 36vw, 145px);
        max-width: 100%;
        margin-bottom: 16px;
    }
    #mediaModal .tmdb-info,
    #actorModal .tmdb-info { width: 100%; }
    #mediaModal .tmdb-title,
    #actorModal .tmdb-title {
        font-size: clamp(1.9rem, 8vw, 2.5rem);
        line-height: 1.12;
        overflow-wrap: anywhere;
    }
    .modal-body { padding: 24px 16px; }
    .section-divider { font-size: 1.1rem; }
    .section-heading-row { align-items: flex-start; }
    .recommendation-card { flex-basis: 112px; }
    .recommendation-card img { width: 112px; }
    .cast-card { flex-basis: 112px; }
    .cast-card img { height: 150px; }
    .all-rail-items-content { padding: 0 16px calc(22px + env(safe-area-inset-bottom, 0px)); }
    .all-rail-items-heading { padding: calc(env(safe-area-inset-top, 0px) + 24px) 48px 18px 0; }
    .all-rail-items-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 10px; }
    .all-rail-item-card img { aspect-ratio: 2 / 3; }
    .mobile-bottom-nav { bottom: calc(env(safe-area-inset-bottom, 0px) + 10px); }
    .toast-notification {
        right: 12px;
        bottom: calc(env(safe-area-inset-bottom, 0px) + 82px);
        left: 12px;
        justify-content: center;
    }
}

/* Trim continuous GPU effects on touch devices while keeping their static look. */
@media (hover: none) and (pointer: coarse) {
    .modal,
    .modal-content,
    .navbar,
    .mobile-bottom-nav {
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
    }
    .modal-content { background: rgba(17,19,28,.98); }
    .navbar { background: rgba(9,10,16,.96); }
    .mobile-bottom-nav { background: rgba(12,15,23,.97); }
    .logo-shimmer,
    .logo-beam,
    .profile-wrapper::before,
    .profile-wrapper::after,
    .avatar-frame-neon,
    .avatar-frame-gold,
    .avatar-frame-reel,
    .avatar-frame-nebula,
    .avatar-frame-cyber {
        animation: none !important;
    }
    .movie-card:hover,
    .cast-card:hover,
    .recommendation-card:hover,
    .bento-lead:hover,
    .bento-tile:hover {
        transform: none;
    }
}

/* Hero carousel, poster-first daily picks, and the interactive cinema wheel. */
.logo-shimmer,.logo-beam { display:none!important; }
.logo-text {
    background:none!important;
    color:#f8fafc;
    -webkit-text-fill-color:#f8fafc!important;
    -webkit-background-clip:border-box;
    text-shadow:none!important;
}
.logo-accent,
.logo:hover .logo-accent { text-shadow:none!important; }
.logo-accent { color:var(--primary); -webkit-text-fill-color:var(--primary)!important; }
.logo:hover { transform:none; }
.logo:hover .logo-accent { transform:none; }

.hero { background-image:linear-gradient(115deg,#08090d,#11131c); }
.hero-backdrop-stack { position:absolute; inset:0; z-index:0; overflow:hidden; }
.hero-backdrop-layer { position:absolute; inset:0; background-size:cover; background-position:center 22%; opacity:0; transform:scale(1.025); transition:opacity .85s ease; will-change:opacity; }
.hero-backdrop-layer.is-active { opacity:1; }
.hero-content { max-width:min(680px,72vw); }
.hero-content.is-changing { animation:heroTextIn .48s ease both; }
@keyframes heroTextIn { from { opacity:.35; transform:translateY(9px); } to { opacity:1; transform:translateY(0); } }
.hero-eyebrow { display:inline-flex; align-items:center; gap:8px; padding:7px 11px; border:1px solid rgba(255,255,255,.17); border-radius:999px; background:rgba(12,14,22,.58); color:#ffe3a2!important; font-size:.68rem!important; font-weight:700; letter-spacing:.13em; }
.hero-carousel-controls { display:flex; align-items:center; gap:14px; max-width:340px; margin-top:24px; }
.hero-progress-track { flex:1; height:3px; overflow:hidden; border-radius:999px; background:rgba(255,255,255,.2); }
.hero-progress-fill { display:block; width:100%; height:100%; transform:scaleX(0); transform-origin:left; background:linear-gradient(90deg,#fff,#fda4af); animation:heroProgressFill 10s linear forwards; }
.hero.is-paused .hero-progress-fill { animation-play-state:paused; }
@keyframes heroProgressFill { to { transform:scaleX(1); } }
.hero-carousel-actions { display:flex; align-items:center; gap:7px; }
.hero-slide-counter { min-width:53px; margin-right:2px; color:#f4f5f8; font-size:.72rem; font-variant-numeric:tabular-nums; font-weight:700; }
.hero-carousel-actions button { display:grid; place-items:center; width:32px; height:32px; border:1px solid rgba(255,255,255,.22); border-radius:50%; background:rgba(10,12,18,.52); color:#fff; font-size:1.2rem; line-height:1; transition:background .2s,border-color .2s; }
.hero-carousel-actions button:hover { border-color:#fff; background:rgba(255,255,255,.16); }

.bento-showcase { backdrop-filter:blur(14px); }
.bento-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); grid-template-rows:none; gap:14px; }
.bento-poster-card { position:relative; display:grid; align-content:start; min-width:0; padding:0; overflow:visible; border:0; border-radius:14px; background:transparent; color:#f6f7fb; text-align:left; }
.bento-rank { position:absolute; top:-8px; left:-7px; z-index:3; display:grid; place-items:center; width:32px; height:32px; border:1px solid rgba(255,255,255,.24); border-radius:50%; background:#141722; color:#fff; font-family:'Bebas Neue',sans-serif; font-size:1rem; box-shadow:0 5px 14px rgba(0,0,0,.42); }
.bento-poster-frame { position:relative; display:block; width:100%; aspect-ratio:2/3; overflow:hidden; border:1px solid rgba(255,255,255,.1); border-radius:14px; background:linear-gradient(145deg,#191d2a,#0c0e14); box-shadow:0 12px 26px rgba(0,0,0,.26); transition:border-color .25s,transform .25s,box-shadow .25s; }
.bento-poster-frame > img { display:block; width:100%; height:100%; object-fit:contain; background:linear-gradient(145deg,#1a1e2c,#0c0e14); }
.bento-poster-card:hover .bento-poster-frame,.bento-poster-card:focus-visible .bento-poster-frame { transform:translateY(-4px); border-color:rgb(var(--media-accent-rgb)/.8); box-shadow:0 18px 35px rgba(0,0,0,.42),0 0 0 1px rgb(var(--media-accent-rgb)/.2); }
.bento-poster-badges { position:absolute; top:10px; left:10px; z-index:2; display:grid; justify-items:start; gap:5px; max-width:calc(100% - 20px); }
.bento-poster-badges .content-badge { max-width:100%; padding:4px 7px!important; font-size:.62rem!important; }
.bento-rating { position:absolute; right:9px; bottom:9px; z-index:2; padding:5px 8px; border:1px solid rgba(255,215,0,.38); border-radius:999px; background:rgba(8,10,16,.86); color:#ffe18a; font-size:.7rem; font-weight:700; }
.bento-poster-copy { display:grid; gap:4px; min-width:0; padding:10px 3px 0; }
.bento-poster-copy strong { overflow:hidden; font-size:.82rem; text-overflow:ellipsis; white-space:nowrap; }
.bento-poster-copy small { color:#969cac; font-size:.7rem; }

.movie-card .poster-badges,.movie-card .hover-badges { max-width:calc(100% - 16px); align-content:start; }
.movie-card .hover-badges { display:grid; grid-template-columns:max-content; justify-items:start; gap:5px; max-height:none; }
.movie-card .content-badge { max-width:100%; min-height:20px; overflow:hidden; padding:3px 7px!important; font-size:10px!important; text-overflow:ellipsis; }
.movie-card .hover-backdrop-wrap { height:155px; }

.random-modal-content { width:min(1040px,calc(100vw - 36px)); max-width:1040px; max-height:92dvh; overflow-y:auto; padding:34px; border:1px solid rgba(255,255,255,.13); border-radius:24px; background:radial-gradient(circle at 90% 0%,rgba(141,99,255,.13),transparent 32%),linear-gradient(145deg,#171a25,#0b0d13 70%); text-align:left; }
.roulette-heading { padding:2px 54px 24px 0; }
.roulette-heading h2 { margin:5px 0 6px; font-family:'Bebas Neue',sans-serif; font-size:clamp(2rem,4vw,3.2rem); letter-spacing:.02em; }
.roulette-heading .roulette-subtitle { max-width:560px; margin:0; color:#aeb3c1; font-size:.88rem; line-height:1.55; }
.roulette-layout { display:grid; grid-template-columns:minmax(285px,.85fr) minmax(350px,1.15fr); align-items:center; gap:24px; }
.roulette-controls { display:grid; gap:18px; min-width:0; }
.roulette-control-group h3 { margin-bottom:9px; color:#cbd0dc; font-size:.78rem; font-weight:700; letter-spacing:.04em; }
.random-moods { display:grid; gap:7px; }
.media-mode-options { grid-template-columns:repeat(3,minmax(0,1fr)); }
.mood-options { grid-template-columns:repeat(2,minmax(0,1fr)); }
.media-mode-chip,.mood-chip { min-width:0; min-height:40px; padding:8px 9px; border:1px solid rgba(255,255,255,.1); border-radius:11px; background:rgba(255,255,255,.045); color:#aeb3c1; font-size:.7rem; font-weight:600; line-height:1.25; transition:background .18s,border-color .18s,color .18s,transform .18s; }
.media-mode-chip:hover,.mood-chip:hover { border-color:rgba(255,255,255,.28); color:#fff; transform:translateY(-1px); }
.media-mode-chip.active,.mood-chip.active { border-color:rgba(255,122,142,.72); background:linear-gradient(135deg,rgba(229,9,20,.24),rgba(141,99,255,.15)); color:#fff; box-shadow:inset 0 0 0 1px rgba(255,255,255,.035),0 6px 18px rgba(229,9,20,.1); }
.wheel-selection-summary { margin-top:-8px; color:#ffcdd2; font-size:.7rem; font-weight:600; }
.random-options { display:grid; grid-template-columns:1fr; gap:9px; margin-top:0; text-align:left; }
.random-option { position:relative; display:grid; grid-template-columns:38px minmax(0,1fr) 18px; align-items:center; gap:2px 11px; min-height:72px; padding:13px; border-color:rgba(255,255,255,.12); border-radius:14px; background:linear-gradient(110deg,rgba(255,255,255,.075),rgba(255,255,255,.025)); }
.random-option:hover { transform:translateY(-2px); border-color:rgba(255,255,255,.38); }
.random-option .wheel-icon { grid-row:span 2; display:grid; place-items:center; width:36px; height:36px; border-radius:11px; background:rgba(255,255,255,.09); font-size:1.25rem; }
.random-option strong { font-size:.78rem; }
.random-option small { font-size:.64rem; }
.random-option .option-arrow { grid-column:3; grid-row:1 / span 2; color:#fda4af; font-size:1.1rem; }
.random-option.taste-option .wheel-icon { color:#ffbf69; }
.random-option.surprise-option .wheel-icon { color:#c1a9ff; }
.random-option:disabled { cursor:wait; opacity:.55; transform:none; }
.roulette-display { min-width:0; display:grid; place-items:center; min-height:420px; padding:18px 10px; border:1px solid rgba(255,255,255,.07); border-radius:22px; background:radial-gradient(circle at 50% 45%,rgba(141,99,255,.09),transparent 50%),rgba(0,0,0,.16); }
.roulette-display .cinema-wheel-stage { width:100%; margin:0; }
.roulette-display .wheel-stage-wrapper { width:min(390px,100%); height:auto; aspect-ratio:1; }
.wheel-bulbs-ring { animation:bulbsFlicker 2.5s ease-in-out infinite alternate; }
@keyframes bulbsFlicker { from { opacity:.55; } to { opacity:.9; } }
.roulette-display .roulette-status { margin-top:13px; color:#d9c58b; font-size:.72rem; text-align:center; }
.roulette-display .winner-reveal-box { max-width:100%; padding:14px; }
.roulette-display .winner-poster { width:84px; }
.all-rail-items-footer { display:flex; justify-content:center; padding:24px 0 8px; }
.all-rail-items-footer button[hidden] { display:none!important; }

@media (max-width:900px) {
    .bento-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
    .roulette-layout { grid-template-columns:minmax(245px,.9fr) minmax(300px,1.1fr); gap:16px; }
    .roulette-display { min-height:350px; }
}
@media (max-width:640px) {
    .hero { overflow:hidden; }
    .hero-backdrop-layer { background-position:center center; }
    .hero-content { max-width:100%; width:100%; }
    .hero-carousel-controls { width:min(100%,360px); gap:9px; margin-top:18px; }
    .hero-carousel-actions { gap:5px; }
    .hero-carousel-actions button { width:30px; height:30px; }
    .bento-showcase { overflow:hidden; }
    .bento-grid { display:flex; overflow-x:auto; overflow-y:visible; gap:12px; margin:0 -7px; padding:9px 9px 15px; touch-action:pan-x pan-y; -webkit-overflow-scrolling:touch; scroll-snap-type:x mandatory; }
    .bento-poster-card { flex:0 0 clamp(148px,43vw,190px); scroll-snap-align:start; }
    .bento-poster-copy strong { font-size:.78rem; }
    .random-modal-content { width:100vw; max-width:none; max-height:100dvh; min-height:100dvh; padding:calc(env(safe-area-inset-top,0px) + 26px) 16px calc(22px + env(safe-area-inset-bottom,0px)); border:0; border-radius:0; }
    .roulette-heading { padding-right:50px; padding-bottom:18px; }
    .roulette-heading h2 { font-size:2.15rem; }
    .roulette-heading .roulette-subtitle { font-size:.79rem; }
    .roulette-layout { grid-template-columns:1fr; gap:16px; }
    .roulette-controls { gap:14px; }
    .media-mode-chip,.mood-chip { min-height:38px; padding:7px 6px; font-size:.64rem; }
    .roulette-display { min-height:0; padding:12px 8px; }
    .roulette-display .wheel-stage-wrapper { width:min(350px,84vw); }
    .roulette-display .winner-card-body { align-items:flex-start; gap:12px; }
    .roulette-display .winner-poster { width:74px; }
    .roulette-display .winner-actions { gap:7px; }
    .roulette-display .btn-winner { padding:8px 9px; font-size:.68rem; }
}
@media (prefers-reduced-motion:reduce) {
    .hero-backdrop-layer { transition:none; }
    .hero-content.is-changing { animation:none; }
    .bento-poster-frame,.media-mode-chip,.mood-chip,.random-option { transition:none; }
    .wheel-bulbs-ring { animation:none; }
}

/* Country picker: present every region in a real, scrollable selection panel. */
.country-deck .country-cards {
    position:absolute;
    top:calc(100% + 9px);
    left:0;
    right:auto;
    z-index:40;
    display:none;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    width:min(340px,calc(100vw - 32px));
    height:auto;
    max-height:min(62vh,420px);
    overflow-y:auto;
    padding:10px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:16px;
    background:rgba(15,17,25,.98);
    box-shadow:0 20px 55px rgba(0,0,0,.58);
    pointer-events:none;
    backdrop-filter:blur(18px);
}
.country-deck.open .country-cards { display:grid; height:auto; pointer-events:auto; }
.country-deck .country-cards button {
    position:static!important;
    inset:auto;
    display:flex;
    align-items:center;
    gap:8px;
    width:auto;
    height:auto;
    min-width:0;
    min-height:52px;
    padding:9px;
    border:1px solid rgba(255,255,255,.1);
    border-radius:11px;
    background:rgba(255,255,255,.045);
    color:#f3f4f6;
    font-size:1.1rem;
    text-align:left;
    opacity:1;
    transform:none!important;
    box-shadow:none;
}
.country-deck.open .country-cards button:nth-child(n) { transform:none!important; }
.country-deck .country-cards button span {
    min-width:0;
    color:#d7d9e1;
    font-size:.68rem;
    line-height:1.3;
}
.country-deck .country-cards button:hover,
.country-deck .country-cards button.active {
    border-color:rgba(229,9,20,.68);
    background:linear-gradient(135deg,rgba(229,9,20,.2),rgba(141,99,255,.12));
    color:#fff;
}
.country-deck .country-cards button:focus-visible { outline:2px solid #7dd3fc; outline-offset:2px; }

/* Keep every poster and hover badge inside its own card, including long labels. */
.movie-card .poster-badges,
.movie-card .hover-badges {
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:5px;
    min-width:0;
    max-width:calc(100% - 16px);
    overflow:hidden;
}
.movie-card .content-badge {
    width:fit-content;
    min-width:0;
    max-width:100%;
    white-space:normal!important;
    overflow-wrap:anywhere;
    word-break:normal;
    text-overflow:clip;
}

@media(max-width:700px) {
    .country-deck .country-cards {
        left:0;
        right:auto;
        max-height:max(150px,min(62dvh,calc(100dvh - 430px)));
    }
    .mobile-bottom-nav {
        display:flex;
        justify-content:flex-start;
        gap:4px;
        overflow-x:auto;
        overflow-y:hidden;
        scrollbar-width:none;
        scroll-snap-type:x proximity;
        overscroll-behavior-x:contain;
        touch-action:pan-x;
    }
    .mobile-bottom-nav::-webkit-scrollbar { display:none; }
    .mobile-bottom-nav button {
        flex:0 0 50px;
        min-width:50px;
        padding:2px 0;
        scroll-snap-align:center;
    }
    .mobile-bottom-nav button small { font-size:.52rem; white-space:nowrap; }
    .mobile-bottom-nav .mobile-wheel-action { flex-basis:52px; min-width:52px; }
}

@media(min-width:701px) {
    .calendar-page.content-wrapper { margin-top:0; padding-top:120px; }
}