:root{--bg:#0b0b0f;--panel:#121218;--panel2:#16161f;--text:#ffffff;--muted:#b4b4c0;--accent:#e50914;--accent-hover:#c11119;--accent-soft:rgba(229,9,20,.22);--ring:rgba(229,9,20,.55);--border:rgba(255,255,255,.10);--shadow:0 18px 45px rgba(0,0,0,.55);}

/* ===== RESET / BASE ===== */
*{box-sizing:border-box;}
html,body{height:100%;overflow-x:hidden;}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--text);background:radial-gradient(1100px 650px at 18% 0%,rgba(229,9,20,.18),transparent 55%),radial-gradient(1100px 650px at 78% 20%,rgba(255,255,255,.05),transparent 55%),var(--bg);overflow-y:hidden;}
.hidden{display:none!important;}

/* ===== SCROLL WRAPPER ===== */
.app-scroll{height:100vh; padding-bottom: 60px;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.22) transparent;}
.app-scroll::-webkit-scrollbar{width:8px;}
.app-scroll::-webkit-scrollbar-track{background:transparent;}
.app-scroll::-webkit-scrollbar-thumb{background:rgba(255,255,255,.22);border-radius:999px;border:0;}
.app-scroll::-webkit-scrollbar-button{display:none;width:0;height:0;}
.app-scroll::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.32);}

/* ============================================================
   INDEX PAGE (HOME + SEARCH)
============================================================ */

/* ===== TOPBAR ===== */
.topbar{position:sticky;top:0;z-index:20;padding:14px 16px;border-bottom:1px solid var(--border);background:rgba(11,11,15,.78);backdrop-filter:blur(12px);}
.topbar-inner{max-width:1600px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:16px;}
.brand{font-weight:900;letter-spacing:.14em;font-size:20px;user-select:none;}
.brand::first-letter{color:var(--accent);}

/* ===== SEARCHBOX ===== */
.searchbox{display:flex;gap:10px;width:min(720px,100%);align-items:center; margin-right: 10px;}
.searchbox input{flex:1;padding:12px 12px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.06);color:var(--text);outline:none; height: 38px;}
.searchbox input:focus{border-color:rgba(229,9,20,.55);box-shadow:0 0 0 4px rgba(229,9,20,.15);}
.searchbox input::-webkit-search-cancel-button,.searchbox input::-webkit-search-decoration,.searchbox input::-webkit-search-results-button,.searchbox input::-webkit-search-results-decoration{-webkit-appearance:none;appearance:none;display:none;}
.searchbox input[type="search"]{-webkit-appearance:none;appearance:none;}

/* ===== BUTTONS ===== */
.btn{border:0;border-radius:12px;padding:12px 14px;cursor:pointer;font-weight:800;transition:transform .12s ease,filter .12s ease;white-space:nowrap;}
.btn:active{transform:scale(.98);}
.btn-primary{background:var(--accent);color:#fff;}
.btn:hover{filter:brightness(1.08);}

/* ===== LAYOUT ===== */
.container{padding:16px;max-width:1600px;margin:0 auto;}
.status{color:var(--muted);margin:8px 0 14px;font-size:14px;}

/* ===== HOME ROWS ===== */
.home{display:flex;flex-direction:column;gap:18px;padding-bottom:28px;}
.row{display:flex;flex-direction:column;gap:10px;overflow:visible;}
.row-title{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 2px;}
.row-title h3{margin:0;font-size:15px;letter-spacing:.02em;}
.row-title .hint{margin:0;color:var(--muted);font-size:12px;}
.row-scroller{display:flex;gap:12px;overflow-x:auto;overflow-y:hidden;padding:12px 6px 18px;-webkit-overflow-scrolling:touch;scroll-behavior:smooth;user-select:none;touch-action:pan-y;cursor:default;user-select:auto;}
.row-scroller.is-dragging{cursor:grabbing;}
.row-scroller::-webkit-scrollbar{display:none;}
.row-scroller{scrollbar-width:none;}
.row-nav{display:flex;align-items:center;gap:8px;}
.row-arrow{width:40px;height:40px;border-radius:14px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.06);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:filter .15s ease,transform .12s ease,background .15s ease;}
.row-arrow:hover{filter:brightness(1.10);background:rgba(255,255,255,.08);}
.row-arrow:active{transform:scale(.96);}
.row-arrow:disabled{opacity:.35;cursor:default;transform:none;filter:none;}
.row-arrow-ico{width:20px;height:20px;display:block;background:#fff;;opacity:.92;-webkit-mask:var(--row-arrow-svg) center/contain no-repeat;mask:var(--row-arrow-svg) center/contain no-repeat;}
.row-arrow--left .row-arrow-ico{--row-arrow-svg:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath fill='black' d='M34.52 239.03L228.87 44.69c9.37-9.37 24.57-9.37 33.94 0l22.67 22.67c9.36 9.36 9.37 24.52.04 33.9L131.49 256l154.03 154.74c9.33 9.38 9.32 24.54-.04 33.9l-22.67 22.67c-9.37 9.37-24.57 9.37-33.94 0L34.52 272.97c-9.37-9.37-9.37-24.57 0-33.94z'/%3E%3C/svg%3E");}
.row-arrow--right .row-arrow-ico{--row-arrow-svg:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath fill='black' d='M285.48 272.97L91.13 467.31c-9.37 9.37-24.57 9.37-33.94 0l-22.67-22.67c-9.36-9.36-9.37-24.52-.04-33.9L188.51 256 34.48 101.26c-9.33-9.38-9.32-24.54.04-33.9l22.67-22.67c9.37-9.37 24.57-9.37 33.94 0L285.48 239.03c9.37 9.37 9.37 24.57 0 33.94z'/%3E%3C/svg%3E");}

/* poster card home */
.poster-card{flex:0 0 auto;width:160px;border-radius:20px;overflow:visible;cursor:pointer;background:var(--panel);border:1px solid rgba(255,255,255,.10);box-shadow:0 10px 25px rgba(0,0,0,.35);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;scroll-snap-align:start;position:relative;z-index:1;}
.poster-card:hover{transform:scale(1.05);border-color:rgba(255,255,255,.18);box-shadow:0 18px 45px rgba(0,0,0,.55);z-index:5;}
.poster-card img{border-radius:16px;margin:3px;width:calc(100% - 6px);aspect-ratio:2/3;object-fit:cover;display:block;background:rgba(255,255,255,.05);}
.poster-card .meta{padding:10px 10px 12px;}
.poster-card .title{margin:0;font-size:13px;font-weight:900;line-height:1.25;}
.poster-card .sub{margin:5px 0 0;font-size:12px;color:var(--muted);}

/* ===== SEARCH GRID ===== */
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;padding-bottom:28px;}
@media (min-width:720px){.grid{grid-template-columns:repeat(4,minmax(0,1fr));}}
@media (min-width:1100px){.grid{grid-template-columns:repeat(6,minmax(0,1fr));}}
.card{position:relative;border-radius:16px;overflow:visible;cursor:pointer;border:1px solid rgba(255,255,255,.10);background:var(--panel);box-shadow:0 10px 25px rgba(0,0,0,.35);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;}
.card:hover{transform:scale(1.05);border-color:rgba(255,255,255,.18);box-shadow:0 18px 45px rgba(0,0,0,.55);}
.card img{width:100%;aspect-ratio:2/3;object-fit:cover;display:block;background:rgba(255,255,255,.05);border-radius:16px;}
.card .meta{position:absolute;inset:auto 0 0 0;padding:12px 12px;background:linear-gradient(180deg,transparent,rgba(0,0,0,.88));border-bottom-left-radius:16px;border-bottom-right-radius:16px;}
.card .title{margin:0;font-size:13px;font-weight:900;line-height:1.25;}
.card .sub{margin:5px 0 0;font-size:12px;color:var(--muted);}

/* disabled states */
.card.unavailable,.poster-card.unavailable{opacity:.35;pointer-events:none;}
.badge-unav{position:absolute;top:10px;left:10px;background:rgba(0,0,0,.75);border:1px solid rgba(255,255,255,.2);padding:4px 8px;font-size:12px;border-radius:999px;color:#fff;z-index:5;}

/* ============================================================
   UIMODAL — PANEL CON BANNER
============================================================ */
.uimodal-overlay{--ov:0;position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,calc(.60 * var(--ov)));backdrop-filter:blur(calc(12px * var(--ov)));-webkit-backdrop-filter:blur(calc(12px * var(--ov)));opacity:var(--ov);transition:opacity .22s ease,background-color .22s ease,backdrop-filter .22s ease;will-change:opacity;}
.uimodal-overlay.is-open{--ov:1;}
.uimodal-overlay.is-closing{--ov:0;}
.uimodal-panel{position:relative;width:min(720px,calc(100vw - 24px));max-height:min(90vh,900px);overflow:hidden;display:flex;flex-direction:column;border-radius:18px;background:rgba(18,18,24,.98);border:1px solid rgba(255,255,255,.12);box-shadow:var(--shadow);}
.uimodal-panel.uimodal-full{width:calc(100vw - 24px);height:calc(100vh - 24px);max-width:80vw;border-radius:22px;}
.uimodal-panel::before{content:"";position:absolute;inset:0;z-index:0;background-image:var(--uimodal-banner,none);background-size:cover;background-position:center 20%;background-repeat:no-repeat;transform:scale(1.15);filter:blur(18px) saturate(1.2) contrast(1.05);opacity:.55;}
.uimodal-panel::after{content:"";position:absolute;inset:0;z-index:1;background:radial-gradient(1200px 600px at 22% 0%,rgba(229,9,20,.12),transparent 55%),linear-gradient(180deg,rgba(0,0,0,.25) 0%,rgba(0,0,0,.55) 40%,rgba(18,18,24,.92) 75%,rgba(18,18,24,1) 100%);}
.uimodal-header,.uimodal-body{position:relative;z-index:2;}
.uimodal-body{overflow:auto;-webkit-overflow-scrolling:touch;flex:1;padding:0;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.22) transparent;}
.uimodal-body::-webkit-scrollbar{width:8px;}
.uimodal-body::-webkit-scrollbar-track{background:transparent;}
.uimodal-body::-webkit-scrollbar-thumb{background:rgba(255,255,255,.22);border-radius:999px;border:0;}
.uimodal-body::-webkit-scrollbar-button{display:none;width:0;height:0;}
.uimodal-body::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.32);}
.uimodal-header{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 12px;min-height:44px;border-bottom:1px solid rgba(255,255,255,.10);background:rgba(0,0,0,.18);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);}
.uimodal-title{margin:0;font-size:14px;font-weight:900;letter-spacing:.02em;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.uimodal-close{width:34px;height:34px;min-width:34px;border-radius:999px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.35);color:#fff;font-size:22px;line-height:1;cursor:pointer;transition:transform .12s ease,background .12s ease,border-color .12s ease,filter .12s ease;outline:none!important;box-shadow:none!important;-webkit-tap-highlight-color:transparent;}
.uimodal-close:hover{background:rgba(0,0,0,.60);border-color:rgba(255,255,255,.30);filter:brightness(1.08);}
.uimodal-close:active{transform:scale(.94);}
.uimodal-close:focus,.uimodal-close:focus-visible{outline:none!important;box-shadow:none!important;border-color:rgba(255,255,255,.18)!important;}

/* ===== MODAL CONTENT ===== */
.modal-detail{position:relative;overflow:hidden;min-height:100%;display:flex;flex-direction:column;}
.modal-backdrop{position:absolute;inset:0;z-index:0;pointer-events:none;}
.modal-backdrop img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 20%;transform:scale(1.08);opacity:.80;filter:blur(18px) saturate(1.15) contrast(1.10) brightness(.78);}
.modal-backdrop::after{content:"";position:absolute;inset:0;background:radial-gradient(1200px 600px at 22% 0%,rgba(229,9,20,.10),transparent 55%),linear-gradient(180deg,rgba(10,10,14,.25),rgba(10,10,14,.92));}
.modal-detail>*{position:relative;z-index:2;}
.modal-body{
  padding:22px 22px 18px;
  display:grid;
  grid-template-columns:200px 1fr;
  gap:22px;
  margin:16px;
  border-radius:22px;
  background:rgba(18,18,24,.52);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 18px 45px rgba(0,0,0,.35);
}

@media (max-width:720px){
  .modal-body{
    grid-template-columns:1fr; /* ✅ UNA COLONNA */
    gap:14px;
    padding:16px;
    margin:12px;
  }

  /* opzionale: poster centrato e ridimensionato */
  .modal-poster{
    max-width: 220px;
    margin: 0 auto;
  }
}

.modal-poster{border-radius:18px;overflow:hidden;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);align-self: start;box-shadow:0 18px 50px rgba(0,0,0,.60);}
.modal-poster img{width:100%;aspect-ratio:2/3;object-fit:cover;display:block;}
.modal-info h2{margin:0 0 8px;font-size:36px;line-height:1.05;font-weight:900;}
.modal-meta{display:flex;flex-wrap:wrap;gap:10px;align-items:center;color:var(--muted);font-size:13px;margin-bottom:12px;}
.modal-desc{color:rgba(255,255,255,.78);font-size:14px;line-height:1.55;margin:0 0 14px;max-width:85ch;}
.modal-actions-inline{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:12px;}
.btn-play{background:var(--accent);color:#fff;border:none;padding:12px 18px;border-radius:14px;cursor:pointer;font-weight:900;}
.btn-play:active{transform:scale(.98);}

/* ===== TV BLOCK ===== */
.tv-block{margin:0 16px 16px;padding:16px;border-radius:22px;background:rgba(18,18,24,.52);border:1px solid rgba(255,255,255,.08);box-shadow:0 18px 45px rgba(0,0,0,.35);}
.season-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px;}
.season-row label{color:var(--muted);font-size:13px;}

/* ===== EPISODES LIST ===== */
.episodes{display:flex;flex-direction:column;gap:10px;}
.episode-loading{color:var(--muted);padding:10px 2px;font-size:13px;}
.episode{display:grid;grid-template-columns:120px 1fr auto;gap:12px;padding:12px;border-radius:14px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.04);cursor:pointer;transition:transform .12s ease,filter .12s ease,border-color .12s ease;align-items:center;}
.episode:hover{transform:translateY(-1px);filter:brightness(1.06);border-color:rgba(255,255,255,.16);}
.ep-thumb{width:120px;aspect-ratio:16/9;height:auto;object-fit:cover;border-radius:12px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.06);}
.e-title{margin:0;font-weight:900;font-size:13px;}
.e-sub{margin:6px 0 0;font-size:12px;color:var(--muted);line-height:1.35;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.ep-right{display:flex;align-items:center;justify-content:flex-end;gap:10px;min-width:92px;}
.ep-runtime{font-size:12px;color:var(--muted);white-space:nowrap;}
.ep-play{width:36px;height:36px;border-radius:12px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:#fff;cursor:pointer;font-weight:900;line-height:1;display:flex;align-items:center;justify-content:center;transition:filter .15s ease,transform .12s ease,background .15s ease;}
.ep-play:hover{filter:brightness(1.10);background:rgba(255,255,255,.10);}
.ep-play:active{transform:scale(.96);}
.episode--disabled{opacity:.4;pointer-events:none;}
.episode--disabled .ep-play{opacity:.5;cursor:not-allowed;}

/* ============================================================
   CUSTOM SELECT (.dd)
============================================================ */
.dd{position:relative;width:100%;min-width:200px;}
.dd-btn{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.06);color:var(--text);cursor:pointer;transition:box-shadow .18s ease,filter .18s ease;}
.dd-btn:hover{filter:brightness(1.06);}
.dd-btn:focus{outline:none;box-shadow:inset 0 0 0 1.5px var(--ring);}
.dd-icon{width:16px;height:16px;flex:0 0 16px;opacity:.85;transition:transform .18s ease;}
.dd-icon::before{content:"";width:16px;height:16px;display:block;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath fill='black' d='M143 352.3L7 216.3c-9.4-9.4-9.4-24.6 0-33.9l22.6-22.6c9.4-9.4 24.6-9.4 33.9 0L160 256.3l96.5-96.5c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9l-136 136c-9.4 9.4-24.6 9.4-34 .0z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath fill='black' d='M143 352.3L7 216.3c-9.4-9.4-9.4-24.6 0-33.9l22.6-22.6c9.4-9.4 24.6-9.4 33.9 0L160 256.3l96.5-96.5c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9l-136 136c-9.4-9.4-24.6 0-34 0z'/%3E%3C/svg%3E") center/contain no-repeat;}
.dd[aria-open="true"] .dd-icon{transform:rotate(180deg);}
.dd-menu{position:absolute;left:0;right:0;top:calc(100% + 10px);padding:6px;border-radius:14px;border:1px solid rgba(255,255,255,.08);background:rgba(20,20,28,.98);box-shadow:0 10px 18px rgba(0,0,0,.35);z-index:10000;opacity:0;transform:translateY(-6px) scale(.98);pointer-events:none;transition:opacity .18s ease,transform .18s ease;display:grid;gap:4px;max-height:min(320px,45vh);overflow:auto;}
.dd[aria-open="true"] .dd-menu{opacity:1;transform:translateY(0) scale(1);pointer-events:auto;}
.dd-opt{width:100%;text-align:left;padding:10px 10px;border-radius:12px;border:0;background:transparent;color:var(--text);font-weight:800;cursor:pointer;transition:background .14s ease;}
.dd-opt:hover{background:rgba(255,255,255,.06);}
.dd-opt[aria-selected="true"]{background:var(--accent-soft);box-shadow:inset 0 0 0 1px var(--ring);}
.dd-menu::-webkit-scrollbar{width:8px;}
.dd-menu::-webkit-scrollbar-thumb{background:rgba(255,255,255,.12);border-radius:10px;}

/* ============================================================
   PLAYER PAGE (yt-*)
============================================================ */
body.player-page{margin:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;overflow-y:hidden;}
.yt-topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:12px;padding:14px 16px;background:rgba(11,11,15,.85);backdrop-filter:blur(14px);border-bottom:1px solid var(--border);}
.yt-back{border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:#fff;border-radius:12px;padding:10px;cursor:pointer;font-weight:900;-webkit-tap-highlight-color:transparent;}
.yt-back:active{transform:scale(.98);}
.yt-titlebar{min-width:0;display:flex;flex-direction:column;gap:2px;}
.yt-titlebar h1{margin:0;font-size:14px;font-weight:900;letter-spacing:.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:70vw;}
.yt-titlebar p{margin:0;font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:70vw;}
.yt-wrap{padding:10px 10px 0 10px;max-width:1600px;margin:0 auto; margin-bottom: 50px;}
.yt-grid{display:grid;grid-template-columns:1fr 460px;gap:16px;align-items:start;}
@media (max-width:980px){.yt-grid{grid-template-columns:1fr;}.yt-side{order:2;}}
.yt-player-card{background:rgba(18,18,24,.55);border:1px solid rgba(255,255,255,.10);border-radius:18px;overflow:hidden;box-shadow:var(--shadow);padding:5px;}
.player-wrapper{position:relative;padding-bottom:56.25%;height:0;background:#000;border-radius:14px;}
#p{border-radius: 14px;}
.player-wrapper iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;}
.yt-info{padding:14px 14px 12px;}
.yt-main-title{margin:0 0 6px;font-size:20px;font-weight:950;line-height:1.2;}
.yt-meta{display:flex;flex-wrap:wrap;gap:10px;align-items:center;color:var(--muted);font-size:12px;margin-bottom:12px;}
.yt-desc{padding:12px 14px 14px;border-top:1px solid rgba(255,255,255,.08);color:rgba(255,255,255,.78);font-size:13px;line-height:1.5;}
.yt-side{position:sticky;align-self:start;background:rgba(18,18,24,.55);border:1px solid rgba(255,255,255,.10);border-radius:18px;box-shadow:var(--shadow);overflow:visible;z-index:5;}
@media (max-width:980px){.yt-side{position:static;top:auto;}}
.yt-side-head{padding:10px;border-bottom:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:space-between;gap:10px;overflow:visible;position:relative;z-index:50;}
.yt-side-head h3{margin:0;font-size:13px;font-weight:950;letter-spacing:.04em;}
.yt-list{max-height:calc(100vh - 165px);overflow:auto;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.22) transparent;}
.yt-list::-webkit-scrollbar{width:8px;}
.yt-list::-webkit-scrollbar-thumb{background:rgba(255,255,255,.22);border-radius:999px;}
.yt-item{display:grid;grid-template-columns:150px 1fr;gap:10px;padding:10px;border:1px solid rgba(255,255,255,.06);cursor:pointer;transition:background .14s ease,filter .14s ease;border-radius:16px;margin:5px;}
.yt-item:hover{background:rgba(255,255,255,.04);filter:brightness(1.05);}
.yt-item.is-active{background:rgba(229,9,20,.12);box-shadow:inset 0 0 0 1px rgba(229,9,20,.35);}
.yt-thumb{width:150px;aspect-ratio:16/9;border-radius:12px;object-fit:cover;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.10);}
.yt-it-title{margin:0;font-size:13px;font-weight:950;line-height:1.25;}
.yt-it-sub{margin:6px 0 0;color:var(--muted);font-size:12px;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.brand{color:var(--text);text-decoration:none;}
.nav-links a i {
  margin-right: 8px;
  font-size: 13px;
  opacity: .85;
}
.nav-links a.is-active i {
  opacity: 1;
}
/* ============================================================
   TOP NAV TABS (Home / Film / Serie)
============================================================ */

.nav-links {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px;
  border-radius: 16px;

  /* pill container */
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.09);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.nav-links a {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;

  height: 38px;
  padding: 0 14px;

  border-radius: 10px;
  text-decoration: none;
  font-weight: 600;
  font-size: 14px;
  letter-spacing: .2px;

  color: rgba(255,255,255,0.75);
  transition: 
    background .2s ease,
    color .2s ease,
    transform .2s ease;
}

/* hover */
.nav-links a:hover {
  background: rgba(255,255,255,0.08);
  color: rgba(255,255,255,0.92);
}

/* active tab */
.nav-links a.is-active {
  background: rgba(255,255,255,0.14);
  color: #fff;
}




/* focus accessibilità */
.nav-links a:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(255,255,255,0.18);
}

/* micro feedback al click */
.nav-links a:active {
  transform: scale(.98);
}

/* ============================================================
   FADE TRANSITIONS (Home / Results)
============================================================ */

.fade-panel {
  opacity: 1;
  transform: translateY(0);
  transition: opacity .22s ease, transform .22s ease;
  will-change: opacity, transform;
}

.fade-panel.is-fading-out {
  opacity: 0;
  transform: translateY(6px);
  pointer-events: none;
}

.hidden {
  display: none !important;
}
/* ============================================================
   PLAYER BACK BUTTON (Back + Logo)
============================================================ */

.brand-wrap{
  display:flex;
  align-items:center;
  gap:12px;/* evita salti */
}

.btn-back{
  display:inline-flex;
  align-items:center;
  gap:8px;

  height:38px;
  padding:0 12px;

  border-radius:14px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
  color: rgba(255,255,255,.92);

  cursor:pointer;
  transition: background .2s ease, transform .2s ease, border-color .2s ease;
}

.btn-back:hover{
  background:rgba(255,255,255,.10);
  border-color: rgba(255,255,255,.18);
}

.btn-back:active{
  transform: scale(.98);
}

.btn-back i{
  font-size:14px;
  opacity:.95;
}

.btn-back span{
  font-size:14px;
  font-weight:600;
  letter-spacing:.2px;
}

/* su mobile puoi mostrare solo l’icona */
@media (max-width: 520px){
  .btn-back span{ display:none; }
  .btn-back{ padding:0 10px; }
}
/* ============================================================
   PLAYER GENRE SELECT (solo player)
============================================================ */

.player-genre{
  display:flex;
  align-items:center;
  margin-left: 14px;
  margin-right: 14px;
}

.player-genre select{
  height: 38px;
  padding: 0 14px;
  border-radius: 999px;

  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.92);

  outline: none;
  cursor: pointer;

  font-weight: 600;
  font-size: 14px;
  letter-spacing: .2px;

  transition: background .2s ease, border-color .2s ease;
}

.player-genre select:hover{
  background: rgba(255,255,255,.10);
  border-color: rgba(255,255,255,.18);
}

.player-genre select:focus{
  border-color: rgba(229,9,20,.55);
  box-shadow: 0 0 0 4px rgba(229,9,20,.15);
}

@media (max-width: 720px){
  .player-genre{
    display:none; /* opzionale: nascondilo su mobile */
  }
}
/* wrapper che centra lo spinner nel contenitore */
.inline-loader {
  width: 100%;
  min-height: 220px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* spinner */
.inline-loader .spinner {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  border: 7px solid rgba(255,255,255,.18);
  border-top-color: rgba(255,255,255,1);
  animation: spin 0.85s linear infinite;
}

@keyframes spin {
  to { transform: rotate(360deg); }
}
.movie-extra { margin-top: 12px; display: grid; gap: 12px; }

.meta-block { }
.meta-title { font-size: 14px; margin: 0 0 8px; opacity: .85; }

.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip {
  font-size: 12px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
}

.cast-block { padding: 16px 18px 18px; }
.cast-title { margin: 0 0 12px; font-size: 18px; }

.cast-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
  gap: 14px;
}

.cast-card { display: flex; flex-direction: column; gap: 8px; }
.cast-photo {
  width: 100%;
  aspect-ratio: 2/3;
  border-radius: 12px;
  overflow: hidden;
  background: rgba(255,255,255,.06);
}
.cast-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }

.cast-photo--ph {
  width: 100%;
  height: 100%;
  background: rgba(255,255,255,.08);
}

.cast-name { margin: 0; font-size: 13px; font-weight: 600; }
.cast-role { margin: 0; font-size: 12px; opacity: .75; }
.modal-extra-meta {
  margin-top: 14px;
  padding: 12px;
  border-radius: 12px;
  background: rgba(255,255,255,0.06);
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.meta-row {
  display: flex;
  gap: 10px;
  align-items: center;
  align-items: flex-start;
}

.meta-label {
  min-width: 70px;
  font-weight: 600;
  opacity: 0.85;
}

.meta-val {
  opacity: 0.9;
  line-height: 1.3;
}
/* ============================================================
   EXTRA META (Generi / Lingue) — premium block
============================================================ */

.modal-extra-meta {
  margin: 0 16px 16px;
  padding: 14px 14px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(18,18,24,.42);
  box-shadow: 0 16px 35px rgba(0,0,0,.35);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  display: grid;
  gap: 10px;
}

.meta-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.06);
}

.meta-label {
  min-width: 82px;
  font-weight: 900;
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
  opacity: .82;
  color: rgba(255,255,255,.92);
}

.meta-val {
  flex: 1;
  font-size: 13px;
  line-height: 1.35;
  opacity: .88;
  color: rgba(255,255,255,.92);
}

/* opzionale: se vuoi trasformare generi/lingue in chips */
.meta-val.is-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.meta-chip {
  font-size: 12px;
  font-weight: 700;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  color: rgba(255,255,255,.92);
  white-space: nowrap;
  transition: transform .15s ease, filter .15s ease, background .15s ease;
}

.meta-chip:hover {
  transform: translateY(-1px);
  filter: brightness(1.06);
  background: rgba(255,255,255,.10);
}

/* mobile */
@media (max-width: 720px) {
  .modal-extra-meta {
    margin: 0 12px 12px;
    padding: 12px;
    border-radius: 16px;
  }
  .topbar {justify-content: center; display: flex;}
  .topbar-inner{max-width:1600px;margin:0 auto;display:flex;align-items:center;justify-content:center;gap:0px;}
  .meta-row {
    padding: 10px;
    border-radius: 14px;
  }
  .meta-label {
    min-width: 72px;
    font-size: 11px;
  }
}



/* ============================================================
   CAST — Netflix-like cards
============================================================ */

.cast-block {
  margin: 0 16px 16px;
  padding: 16px 16px 18px;
  border-radius: 22px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(18,18,24,.42);
  box-shadow: 0 18px 45px rgba(0,0,0,.40);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.cast-title {
  margin: 0 0 14px;
  font-size: 16px;
  font-weight: 950;
  letter-spacing: .02em;
  color: rgba(255,255,255,.95);
}

.cast-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  gap: 14px;
}

.cast-card {
  position: relative;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  transition: transform .18s ease, filter .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.cast-card:hover {
  transform: translateY(-2px);
  filter: brightness(1.08);
  border-color: rgba(255,255,255,.18);
  box-shadow: 0 18px 40px rgba(0,0,0,.55);
}

.cast-photo {
  width: 100%;
  aspect-ratio: 2/3;
  overflow: hidden;
  background: rgba(255,255,255,.05);
}

.cast-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transform: scale(1.02);
  transition: transform .25s ease;
}

.cast-card:hover .cast-photo img {
  transform: scale(1.08);
}

.cast-photo--ph {
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  position: relative;
}

.cast-photo--ph::after {
  content: "N/A";
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-size: 28px;
  opacity: .25;
}

.cast-meta {
  padding: 10px 10px 11px;
  display: grid;
  gap: 4px;
}

.cast-name {
  margin: 0;
  font-size: 13px;
  font-weight: 900;
  line-height: 1.2;
  color: rgba(255,255,255,.96);
}

.cast-role {
  margin: 0;
  font-size: 12px;
  line-height: 1.25;
  color: rgba(255,255,255,.70);
}
.sb-gnr {display: flex; width: calc(100% - 20px); justify-content: center; margin: 20px 10px 0px 10px;}
#player-genres-dd {min-width:220px; max-width:260px;}
/* mobile */
@media (max-width: 720px) {
  .searchbox {margin: 0px 0px 10px 0px;}
  #player-genres-dd, .season-dd {min-width:220px; max-width:860px;}
  .cast-block {
    margin: 0 12px 12px;
    padding: 14px 14px 16px;
    border-radius: 18px;
  }
  .topbar {padding: 10px 5px;}
  .topbar-inner {margin: 0px 5px;}
  .btn-back {margin-right: 5px;}
  .dd-btn, .row-arrow, .poster-card, .episode, .ep-play, .dd-opt, .btn-play, .yt-item  {cursor: none !important;}
  .nav-links a {cursor: none;}
  .brand {display: none;}
  .modal-extra-meta {display: none;}
  .modal-poster {display: none}
  .cast-grid {
    grid-template-columns: repeat(auto-fill, minmax(105px, 1fr));
    gap: 12px;
  }
.sb-gnr {display: block; width: calc(100% - 20px); justify-content: center; margin: 10px 10px 0px 10px; gap: 10px;}
  .uimodal-panel.uimodal-full{width:calc(100vw - 24px);height:calc(100vh - 24px);max-width:95vw;border-radius:22px;}
  .episode{display:grid;grid-template-columns:1fr auto;gap:12px;padding:12px;border-radius:14px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.04);cursor:pointer;transition:transform .12s ease,filter .12s ease,border-color .12s ease;align-items:center;}
 .ep-thumb {display: none;}
}
/* ============================================================
   CUSTOM SELECT: deve stare sopra cast / altri blocchi
============================================================ */

/* 1) il wrapper TV deve permettere overlay */
.tv-block {
  position: relative;
  z-index: 1;
  overflow: visible; /* ✅ evita che il menu venga tagliato */
}

/* 2) cast sotto */
.cast-block {
  position: relative;
  z-index: 0;
}

/* 3) il select sopra gli altri */
.dd {
  position: relative;
  z-index: 5; /* base */
}

/* 4) quando è aperto, sale sopra tutto */
.dd[aria-open="true"] {
  z-index: 9999; /* ✅ top assoluto dentro modal */
}

/* 5) menu dropdown ancora più alto */
.dd-menu {
  z-index: 10000; /* ✅ sopra cast e sopra tutto */
}