:root{
    --bg:#0a0a0a;
    --panel:#181818;
    --panel2:#232323;
    --card:#262424;
    --text:#f5f5f5;
    --muted:#9a9a9a;
    --line:rgba(255,255,255,.09);
    --red:#e50914;
    --red-dim:#8a060d;
    --neon:#A8FF00;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    background:var(--bg); color:var(--text); font-family:'Inter',sans-serif;
    -webkit-font-smoothing:antialiased; overflow-x:hidden;
  }
  h1,h2,h3,h4{font-family:'Anton',sans-serif; font-weight:400; letter-spacing:.01em;}
  .mono{font-family:'JetBrains Mono',monospace;}
  a{color:inherit; text-decoration:none;}
  .wrap{max-width:1640px; margin:0 auto; padding:0 30px;}

  /* ---- nav ---- */
  header{
    position:sticky; top:0; z-index:60;
    background:linear-gradient(180deg, rgba(0,0,0,.92), rgba(0,0,0,.75) 70%, transparent);
  }
  nav{display:flex; align-items:center; justify-content:space-between; padding:18px 30px; max-width:1640px; margin:0 auto;}
  .logo{font-family:'Anton'; font-size:30px; letter-spacing:.03em; color:var(--red);}
  .nav-links{display:flex; gap:26px; font-size:14px; font-weight:600; color:var(--text);}
  .nav-links a{opacity:.85; transition:opacity .15s;}
  .nav-links a:hover{opacity:1; color:var(--red);}
  .nav-right{display:flex; align-items:center; gap:14px;}
  .btn{
    border:none; cursor:pointer; font-family:'Inter'; font-weight:700; font-size:14px;
    padding:10px 20px; border-radius:4px; transition:transform .15s ease, opacity .15s ease;
  }
  .btn:active{transform:scale(.96);}
  .btn-vip{background:var(--red); color:#fff;}
  .btn-vip:hover{background:#f6121c;}
  /* Admins already have full access: hide purchase/upgrade CTAs in desktop and mobile views. */
  body.admin-full-access .nav-right > .btn-vip,
  body.admin-full-access .mobile-menu .btn-vip,
  body.admin-full-access .slide-btns .btn-vip,
  body.admin-full-access .detail-actions .btn-vip{display:none!important;}
  .vip-pill{
    display:none; align-items:center; gap:6px; background:var(--panel2);
    border:1px solid var(--neon); color:var(--neon); padding:8px 14px; border-radius:20px;
    font-size:13px; font-weight:800;
  }
  body.vip .btn-vip{display:none;}
  body.vip .vip-pill{display:flex;}
  .vip-pill{cursor:pointer;white-space:nowrap;}
  .vip-pill .vip-expiry{color:#aaa;font-weight:600;font-size:11px;}

  /* ---- hero slider ---- */
  .hero{position:relative; height:78vh; min-height:520px; overflow:hidden;}
  .slide{
    position:absolute; inset:0; opacity:0; transition:opacity .7s ease;
    display:flex; align-items:flex-end;
    background-size:cover;
  }
  .slide.active{opacity:1;}
  .slide::before{
    content:""; position:absolute; inset:0;
    background:linear-gradient(90deg, rgba(0,0,0,.92) 15%, rgba(0,0,0,.35) 55%, transparent 85%),
               linear-gradient(0deg, var(--bg) 0%, transparent 45%);
  }
  .slide-content{position:relative; z-index:2; padding:0 30px 70px; max-width:1640px; margin:0 auto; width:100%;}
  .slide-tag{
    font-family:'JetBrains Mono'; font-size:12px; color:var(--neon); letter-spacing:.15em;
    text-transform:uppercase; margin-bottom:14px; display:inline-block;
    border-left:3px solid var(--red); padding-left:10px;
  }
  .slide h1{font-size:clamp(38px,6.2vw,74px); line-height:.98; max-width:680px; margin-bottom:16px;}
  .slide p{color:var(--muted); font-size:16px; max-width:480px; line-height:1.55; margin-bottom:26px;}
  .slide-btns{display:flex; gap:12px; flex-wrap:wrap;}
  .btn-play{background:#fff; color:#000; font-size:15px; padding:13px 26px;}
  .btn-play:hover{opacity:.85;}
  .btn-info{background:rgba(120,120,120,.35); color:#fff; font-size:15px; padding:13px 26px; border:1px solid rgba(255,255,255,.25);}
  .btn-info:hover{background:rgba(120,120,120,.5);}

  .slide-nav{position:absolute; bottom:22px; right:30px; z-index:3; display:flex; gap:8px; align-items:center;}
  .slide-dots{display:flex; gap:6px;}
  .dot{
    width:38px; height:3px; background:rgba(255,255,255,.25); border-radius:2px;
    cursor:pointer; overflow:hidden; position:relative;
  }
  .dot .fill{position:absolute; inset:0; background:var(--red); width:0%;}
  .dot.active .fill{transition:width linear;}
  .arrow{
    width:36px; height:36px; border-radius:50%; border:1px solid rgba(255,255,255,.3);
    background:rgba(0,0,0,.4); color:#fff; cursor:pointer; font-size:16px;
    display:flex; align-items:center; justify-content:center;
  }
  .arrow:hover{background:rgba(255,255,255,.15);}
  .hero-arrows{position:absolute; top:50%; left:0; right:0; transform:translateY(-50%); display:flex; justify-content:space-between; padding:0 20px; z-index:3;}

  /* ---- category rows ---- */
  section.rowsec{padding:38px 0;}
  .section-head{display:flex; align-items:baseline; justify-content:space-between; margin-bottom:16px;}
  .section-head h2{font-size:26px; letter-spacing:.02em;}
  .section-head span{color:var(--muted); font-size:12px; font-family:'JetBrains Mono';}

  .row-container{position:relative;}
  .row-container:hover .row-arrow{opacity:1;}
  .row{
    display:flex; gap:14px; overflow-x:auto; padding:6px 2px 18px;
    scrollbar-width:none; -ms-overflow-style:none; scroll-behavior:smooth;
    cursor:grab; overscroll-behavior-inline:contain;
    -webkit-overflow-scrolling:touch;
  }
  .row.dragging{cursor:grabbing; scroll-behavior:auto; user-select:none;}
  .row.smooth-scrolling{scroll-behavior:auto;}
  .row.auto-gliding{scroll-behavior:auto;}
  .row.dragging .card,
  .row.dragging .rank-card{pointer-events:none;}
  .row::-webkit-scrollbar{display:none;}
  .row-arrow{
    position:absolute; top:calc(50% - 9px); transform:translateY(-50%);
    width:42px; height:42px; border-radius:50%; border:1px solid rgba(255,255,255,.18);
    background:rgba(10,10,10,.75); backdrop-filter:blur(2px); color:#fff; font-size:20px;
    display:flex; align-items:center; justify-content:center; cursor:pointer; z-index:5;
    opacity:0; transition:opacity .2s ease, background .15s ease;
  }
  .row-arrow:hover{background:var(--red); border-color:var(--red);}
  .row-arrow.left{left:-4px;}
  .row-arrow.right{right:-4px;}
  @media (max-width:720px){
    .row-arrow{opacity:1; width:34px; height:34px; font-size:16px;}
  }

  .card{flex:0 0 190px; cursor:pointer;}
  .poster{
    position:relative; height:265px; border-radius:6px; overflow:hidden;
    background:linear-gradient(155deg, var(--c1), var(--c2));
    border:1px solid var(--line);
    transition:transform .22s ease, filter .22s ease;
    display:flex; align-items:flex-end; padding:10px;
  }
  @media (min-width:900px){
    .card{flex:0 0 250px;}
    .poster{height:350px;}
    .card-info h4{font-size:16.5px;}
    .card-info p{font-size:13px;}
  }
  @media (min-width:1400px){
    .card{flex:0 0 280px;}
    .poster{height:392px;}
  }
.card:hover .poster{transform:translateY(-6px) scale(1.02);}
  .poster::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, transparent 42%, rgba(0,0,0,.18) 100%);}
  .poster-glyph{position:absolute; top:-14px; right:-8px; font-family:'Anton'; font-size:100px; color:rgba(255,255,255,.07); line-height:1;}
  .meta-badge{position:relative; z-index:2; font-family:'JetBrains Mono'; font-size:10.5px; background:rgba(0,0,0,.55); padding:3px 7px; border-radius:3px;}
  .hd-badge{position:absolute; top:9px; left:9px; z-index:2; font-family:'JetBrains Mono'; font-size:9.5px; background:var(--neon); color:#000; padding:2px 6px; border-radius:3px; font-weight:800;}
  .card-info{padding:9px 2px 0;}
  .card-info h4{font-family:'Inter'; font-weight:700; font-size:14.5px;}
  .card-info p{color:var(--muted); font-size:12px; margin-top:2px;}

  .card[data-tier="vip"] .poster{filter:blur(5px) brightness(.55);}
  body.vip .card[data-tier="vip"] .poster{filter:none;}
  .vip-lock{position:absolute; inset:0; z-index:3; display:none; align-items:center; justify-content:center;}
  .card[data-tier="vip"] .vip-lock{display:flex;}
  body.vip .vip-lock{display:none;}
  .lockbadge{
    width:60px; height:60px; border:3px solid var(--red); border-radius:50%;
    display:flex; align-items:center; justify-content:center; flex-direction:column;
    background:rgba(0,0,0,.55); color:#fff; font-family:'Anton'; font-size:12px; letter-spacing:.03em;
  }
  .lockbadge small{font-family:'JetBrains Mono'; font-size:8px; color:var(--neon); margin-top:2px; letter-spacing:.08em;}

  /* ---- pricing ---- */
  .pricing{background:var(--panel); border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:60px 0 70px;}
  .pricing-head{text-align:center; max-width:640px; margin:0 auto 40px;}
  .pricing-head .kicker{color:var(--red); font-weight:800; font-size:14px; letter-spacing:.04em; margin-bottom:8px;}
  .pricing-head h2{font-size:38px; line-height:1.05;}
  .pricing-head p{color:var(--muted); margin-top:12px; font-size:15px;}

  .plans-grid{display:grid; grid-template-columns:1fr 1fr; gap:18px; max-width:760px; margin:0 auto;}
  .plan-card{
    background:var(--card); border:1px solid var(--line); border-radius:10px; padding:24px 22px;
    cursor:pointer; transition:transform .15s ease, border-color .15s ease;
  }
  .plan-card:hover{transform:translateY(-4px); border-color:var(--red);}
  .plan-card.best{border-color:var(--neon); position:relative;}
  .plan-tag{position:absolute; top:-11px; left:22px; background:var(--neon); color:#000; font-size:10.5px; font-weight:800; padding:3px 9px; border-radius:20px; letter-spacing:.04em;}
  .plan-name{font-family:'Anton'; color:var(--neon); font-size:26px; line-height:1.05;}
  .plan-bonus{font-family:'Anton'; color:var(--neon); font-size:14px; margin-top:2px; opacity:.9;}
  .plan-price{display:flex; align-items:baseline; gap:6px; margin-top:14px;}
  .peso{color:var(--red); font-family:'Anton'; font-size:30px;}
  .amount{color:#fff; font-family:'Anton'; font-size:30px;}
  .only{color:#fff; font-family:'Anton'; font-size:30px; opacity:.95;}

  /* ---- footer ---- */
  footer{padding:44px 30px 30px; text-align:center; color:var(--muted); font-size:13px;}
  footer .logo{margin-bottom:12px; display:inline-block;}
  footer .note{margin-top:8px; font-size:12px; opacity:.7;}

  /* ---- modal ---- */
  .modal-overlay{
    position:fixed; inset:0; background:rgba(0,0,0,.8); backdrop-filter:blur(4px);
    display:none; align-items:center; justify-content:center; z-index:100; padding:20px;
  }
  .modal-overlay.open{display:flex;}
  .modal-overlay{
    background:radial-gradient(circle at 50% 20%,rgba(198,39,61,.14),rgba(0,0,0,.88) 45%,rgba(0,0,0,.96) 100%);
    backdrop-filter:blur(10px);
    padding:18px;
  }
  .modal{
    background:linear-gradient(160deg,rgba(25,27,33,.98),rgba(12,13,17,.99));
    border:1px solid rgba(255,255,255,.12);
    border-radius:20px;
    max-width:700px;
    width:100%;
    padding:30px;
    position:relative;
    animation:premiumPop .24s cubic-bezier(.2,.8,.2,1);
    max-height:92vh;
    overflow-y:auto;
    box-shadow:0 28px 90px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.03) inset;
  }
  @keyframes premiumPop{from{transform:translateY(10px) scale(.97);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}
  .modal-close{position:absolute;top:14px;right:14px;width:38px;height:38px;border:1px solid rgba(255,255,255,.1);border-radius:50%;background:rgba(255,255,255,.04);color:#ddd;font-size:17px;cursor:pointer;z-index:2;}
  .modal-close:hover{background:rgba(255,255,255,.09);color:#fff;}
  .modal.vip-modal{overflow-x:hidden;}
  .vip-modal-head{text-align:center;max-width:610px;margin:0 auto 18px;padding:2px 36px 0;}
  .vip-modal-kicker{display:inline-flex;align-items:center;gap:7px;color:#A8FF00;background:rgba(168,255,0,.08);border:1px solid rgba(168,255,0,.22);padding:6px 11px;border-radius:999px;font:800 10px 'JetBrains Mono';letter-spacing:.12em;text-transform:uppercase;}
  .vip-modal-head h3{font-size:34px;line-height:1.08;margin:14px 0 9px;letter-spacing:-.02em;color:#fff;}
  .vip-modal-head p.sub{color:#b7bbc4;font-size:14px;line-height:1.65;margin:0 auto;max-width:560px;}
  .vip-benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:18px 0 20px;}
  .vip-benefit{padding:11px 12px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.035);border-radius:12px;color:#e8e9ed;font-size:12px;line-height:1.35;text-align:center;}
  .vip-benefit strong{display:block;color:#fff;font-size:12px;margin-bottom:3px;}
  .modal-plan-heading{display:flex;justify-content:space-between;align-items:end;gap:12px;margin:0 0 10px;}
  .modal-plan-heading h4{margin:0;font-size:14px;color:#fff;}
  .modal-plan-heading span{font-size:11px;color:#8f949e;}
  .modal-plans{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:16px;}
  .mplan{
    background:linear-gradient(160deg,#17191f,#111217);border:1px solid rgba(255,255,255,.09);border-radius:14px;padding:15px 14px;cursor:pointer;text-align:left;position:relative;min-height:86px;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease,background .16s ease;
  }
  .mplan:hover{transform:translateY(-2px);border-color:rgba(255,255,255,.2);}
  .mplan.selected{border-color:#A8FF00;background:linear-gradient(160deg,rgba(168,255,0,.14),rgba(20,24,19,.98));box-shadow:0 0 0 1px rgba(168,255,0,.08) inset,0 10px 28px rgba(0,0,0,.22);}
  .mplan.best-choice::after{content:'BEST VALUE';position:absolute;top:-8px;right:10px;background:#A8FF00;color:#091006;padding:4px 7px;border-radius:999px;font:900 9px 'JetBrains Mono';letter-spacing:.06em;}
  .mplan .mp-name{font-family:'Anton';color:#fff;font-size:17px;letter-spacing:.01em;}
  .mplan .mp-bonus{font-family:'Anton';color:#A8FF00;font-size:10.5px;opacity:.95;margin-top:2px;}
  .mplan .mp-price{font-family:'Anton';font-size:21px;margin-top:6px;color:#fff;}
  .mplan .mp-price .p{color:#ff5c73;}
  .mplan .mp-selected{display:none;margin-top:6px;color:#A8FF00;font:800 9px 'JetBrains Mono';letter-spacing:.08em;text-transform:uppercase;}
  .mplan.selected .mp-selected{display:block;}
  .vip-selected-summary{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:13px 14px;margin:4px 0 14px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03);border-radius:12px;}
  .vip-selected-summary .label{font-size:11px;color:#8e939c;text-transform:uppercase;letter-spacing:.08em;font-weight:800;}
  .vip-selected-summary .value{font-size:14px;font-weight:800;color:#fff;}
  .vip-selected-summary .price{font-family:'Anton';font-size:21px;color:#fff;white-space:nowrap;}
  .modal .btn-vip{width:100%;padding:15px;font-size:15px;border-radius:12px;box-shadow:0 12px 28px rgba(0,0,0,.25);}
  .vip-modal-note{text-align:center;margin:10px 0 0;color:#7f848e;font-size:10.5px;line-height:1.5;}
  @media(max-width:700px){
    .modal{padding:22px 16px 18px;border-radius:18px;max-height:94vh;}
    .vip-modal-head{padding:0 28px;}
    .vip-modal-head h3{font-size:27px;}
    .vip-modal-head p.sub{font-size:13px;line-height:1.55;}
    .vip-benefits{grid-template-columns:1fr;gap:7px;}
    .vip-benefit{text-align:left;padding:10px 12px;}
    .vip-benefit strong{display:inline;margin-right:5px;}
    .modal-plans{grid-template-columns:repeat(2,1fr);gap:9px;}
    .mplan{min-height:82px;padding:13px 12px;}
    .vip-selected-summary{align-items:flex-start;flex-direction:column;gap:5px;}
    .vip-selected-summary .price{font-size:20px;}
  }

  /* ---- toast ---- */
  .toast{
    position:fixed; bottom:24px; right:24px; background:var(--red); color:#fff;
    padding:14px 20px; border-radius:6px; font-weight:700; font-size:14px; max-width:300px;
    transform:translateY(140%); transition:transform .35s ease; z-index:200;
  }
  .toast.show{transform:translateY(0);}

  /* ---- video player modal ---- */
  .video-modal-overlay{
    position:fixed; inset:0; background:rgba(0,0,0,.92);
    display:none; align-items:center; justify-content:center; z-index:150; padding:20px;
  }
  .video-modal-overlay.open{display:flex;}
  .video-modal{width:100%; max-width:1100px; position:relative;}
  .video-modal-inner{
    position:relative; width:100%; aspect-ratio:16/9; background:#000;
    border-radius:8px; overflow:hidden; border:1px solid var(--line);
  }
  .video-modal-inner video, .video-modal-inner iframe{
    position:absolute; inset:0; width:100%; height:100%; border:none;
  }
  .video-title-bar{display:flex; align-items:center; justify-content:space-between; margin-bottom:10px;}
  .video-title-bar h3{font-size:22px;}
  .video-close{
    background:var(--panel2); border:1px solid var(--line); color:#fff; width:38px; height:38px;
    border-radius:50%; cursor:pointer; font-size:18px; display:flex; align-items:center; justify-content:center;
  }
  .video-close:hover{background:var(--red); border-color:var(--red);}

  /* ---- dub flag badge ---- */
  .dub-badge{
    position:absolute; top:9px; right:9px; z-index:2; display:flex; align-items:center; gap:4px;
    font-family:'JetBrains Mono'; font-size:9.5px; font-weight:700; letter-spacing:.03em;
    background:rgba(0,0,0,.65); border:1px solid var(--neon); color:var(--neon);
    padding:3px 7px; border-radius:3px;
  }

  /* ---- anime/title detail modal ---- */
  .detail-modal-overlay{
    position:fixed; inset:0; background:rgba(0,0,0,.85); backdrop-filter:blur(3px);
    display:none; align-items:flex-start; justify-content:center; z-index:120; padding:40px 20px;
    overflow-y:auto;
  }
  .detail-modal-overlay.open{display:flex;}
  .detail-modal{
    width:100%; max-width:820px; background:var(--panel); border:1px solid var(--line);
    border-radius:12px; overflow:hidden; position:relative; animation:pop .22s ease;
  }
  .detail-close{
    position:absolute; top:16px; right:16px; z-index:5; background:rgba(0,0,0,.6); border:1px solid rgba(255,255,255,.2);
    color:#fff; width:38px; height:38px; border-radius:50%; cursor:pointer; font-size:18px;
    display:flex; align-items:center; justify-content:center;
  }
  .detail-close:hover{background:var(--red); border-color:var(--red);}
  .detail-hero{
    padding:44px 32px 28px; background:linear-gradient(160deg, #2a1420, #12080e);
    position:relative;
  }
  .detail-hero-inner{position:relative; z-index:2; max-width:600px;}
  .detail-hero h2{font-size:36px; margin-bottom:8px;}
  .detail-meta{font-family:'JetBrains Mono'; font-size:12.5px; color:var(--neon); margin-bottom:14px; letter-spacing:.03em;}
  .detail-desc{color:var(--muted); font-size:14.5px; line-height:1.6; margin-bottom:20px;}
  .detail-lock-banner{
    display:flex; align-items:center; gap:14px; background:rgba(229,9,20,.12); border:1px solid var(--red);
    color:#fff; padding:12px 16px; border-radius:8px; font-size:13.5px; margin-bottom:16px;
  }
  .detail-episodes{padding:22px 32px 32px; display:flex; flex-direction:column; gap:8px;}
  .episode-row{
    display:flex; align-items:center; gap:16px; background:var(--panel2); border:1px solid var(--line);
    border-radius:8px; padding:12px 16px; cursor:pointer; transition:border-color .15s ease, background .15s ease;
  }
  .episode-row:hover{border-color:var(--red); background:#211313;}
  .ep-num{font-family:'Anton'; font-size:22px; color:var(--muted); width:28px; text-align:center; flex-shrink:0;}
  .ep-info{flex:1;}
  .ep-info h5{font-family:'Inter'; font-weight:700; font-size:14.5px;}
  .ep-info span{color:var(--muted); font-size:12px;}
  .ep-play{font-size:16px; color:var(--neon); flex-shrink:0;}

  @media (max-width:720px){
    .nav-links{display:none;}
    .plans-grid, .modal-plans{grid-template-columns:1fr;}

    /* Mobile hero: keep all slides layered exactly like desktop.
       The previous relative/auto-height setup could leave the hero
       looking like a large blank area on phones. */
    .hero{
      position:relative;
      height:clamp(430px, 72vh, 650px);
      min-height:430px;
      max-height:650px;
      padding-bottom:0;
      overflow:hidden;
    }
    .hero .slide{
      position:absolute;
      inset:0;
      width:100%;
      height:100%;
      min-height:0;
      display:flex;
      align-items:flex-end;
    }
    .hero .slide-content{
      padding:0 18px 58px;
      width:100%;
      max-width:none;
    }
    .hero .slide-tag{
      font-size:10px;
      margin-bottom:10px;
    }
    .hero .slide h1{
      font-size:clamp(34px, 9vw, 52px);
      line-height:.98;
      max-width:90%;
      margin-bottom:12px;
    }
    .hero .slide p{
      font-size:13px;
      line-height:1.45;
      max-width:88%;
      margin-bottom:18px;
    }
    .hero .slide-btns{gap:8px;}
    .hero .slide-btns .btn{padding:11px 18px;font-size:13px;}
    .hero .slide-nav{bottom:16px;right:18px;}
    .hero .hero-arrows{padding:0 12px;}
  }

  /* ---- Smart TV / remote-control navigation ---- */
  .tv-hint{
    display:flex; align-items:center; gap:8px; justify-content:center;
    font-family:'JetBrains Mono'; font-size:11.5px; color:var(--muted);
    background:var(--panel2); border:1px solid var(--line); border-radius:20px;
    padding:8px 16px; max-width:max-content; margin:0 auto 34px;
  }
  .tv-hint b{color:var(--neon);}
  .tv-focusable{outline:none; -webkit-tap-highlight-color:transparent;}
  .tv-focusable:focus{outline:none;}
  .tv-focusable:focus-visible,
  .tv-focusable.tv-focus{
    outline:3px solid var(--neon) !important;
    outline-offset:3px;
    border-radius:6px;
  }
  .card.tv-focusable:focus-visible,
  .card.tv-focusable.tv-focus{
    outline:none !important;
    z-index:8;
  }
  .card.tv-focusable:focus-visible .poster,
  .card.tv-focusable.tv-focus .poster{
    transform:translateY(-6px) scale(1.05);
    box-shadow:0 0 0 3px var(--neon), 0 18px 34px -12px rgba(0,0,0,.7);
  }
  .row-arrow.tv-focusable:focus-visible,
  .row-arrow.tv-focusable.tv-focus{opacity:1; background:var(--red); border-color:var(--red);}
  .rank-card.tv-focusable:focus-visible .poster,
  .rank-card.tv-focusable.tv-focus .poster{
    transform:translateY(-6px) scale(1.05);
    box-shadow:0 0 0 3px var(--neon), 0 18px 34px -12px rgba(0,0,0,.7);
  }

  /* ---- Top 10 rank cards ---- */
  .rank-card{flex:0 0 210px; display:flex; align-items:center; gap:2px;}
  .rank-num{
    font-family:'Anton'; font-size:60px; line-height:1; color:var(--bg);
    -webkit-text-stroke:2px var(--muted); flex-shrink:0; width:50px; text-align:center;
  }
  .rank-card:nth-child(-n+3) .rank-num{-webkit-text-stroke:2px var(--red); color:#1a0405;}
  .rank-card .card{flex:0 0 165px;}
  @media (min-width:900px){
    .rank-card{flex:0 0 270px; gap:6px;}
    .rank-num{font-size:78px; width:62px;}
    .rank-card .card{flex:0 0 215px;}
  }
  @media (min-width:1400px){
    .rank-card{flex:0 0 300px;}
    .rank-num{font-size:88px; width:70px;}
    .rank-card .card{flex:0 0 240px;}
  }

#detailPage{display:none;min-height:calc(100vh - 72px);background:var(--bg);overflow-anchor:none;}
html.tonflix-detail-route #homeContent{display:none!important;}
html.tonflix-detail-route #detailPage{display:block!important;}
body.detail-open #homeContent{display:none!important;}
body.detail-open #detailPage{display:block!important;}
.detail-banner{min-height:540px;position:relative;display:flex;align-items:stretch;overflow:hidden;background:#090909;}
.detail-cover{flex:0 0 320px;width:320px;position:relative;background:linear-gradient(155deg,var(--c1),var(--c2));background-size:cover;background-position:center;display:flex;align-items:flex-end;padding:20px;border-right:1px solid rgba(255,255,255,.10);}
.detail-cover:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,rgba(0,0,0,.55));}
.detail-cover-title{position:relative;z-index:2;font-family:'Anton';font-size:22px;line-height:1;text-transform:uppercase;text-shadow:0 3px 12px #000;}
.detail-banner-main{position:relative;flex:1 1 auto;min-width:0;display:flex;align-items:flex-end;overflow:hidden;}
.detail-art{position:absolute;inset:0;background-size:cover;background-position:center;opacity:1;}
.detail-banner-main:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.97),rgba(0,0,0,.78) 30%,rgba(0,0,0,.28) 75%,rgba(0,0,0,.72)),linear-gradient(0deg,var(--bg),transparent 38%);}
.detail-content{position:relative;z-index:2;width:100%;padding:70px 40px 58px;}
.detail-copy h1{font-size:clamp(38px,5.2vw,68px);line-height:.95;margin:8px 0 12px;}
.detail-desc{max-width:780px;color:#ddd;font-size:16px;line-height:1.7;margin:0 0 24px;}
.detail-actions{display:flex;gap:10px;flex-wrap:wrap;}
.back-btn{background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.2);}
.detail-body{max-width:1640px;margin:auto;padding:32px 30px 70px;}
.detail-section-title{font-size:28px;margin:0 0 16px;}
.episode-list{display:grid;gap:10px;max-width:1000px;}
.episode-row{display:flex;align-items:center;gap:16px;background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:14px 16px;cursor:pointer;transition:.15s;}
.episode-row:hover{border-color:var(--red);background:#211313;transform:translateX(3px);}
.detail-empty{color:var(--muted);padding:20px 0;}
@media(max-width:720px){.detail-banner{flex-direction:column;min-height:0}.detail-cover{flex:0 0 220px;width:100%;height:220px;border-right:none;border-bottom:1px solid rgba(255,255,255,.10)}.detail-content{padding:32px 20px 40px}.detail-copy h1{font-size:40px}.detail-body{padding:28px 20px 60px}}


  .aot-flag-icon{width:22px;height:15px;display:inline-block;vertical-align:-2px;border-radius:2px;object-fit:cover;box-shadow:0 0 0 1px rgba(255,255,255,.18);}
  .aot-cover-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1;}
  .detail-cover .aot-cover-image + .detail-cover-title{z-index:3;}
  .aot-banner-art{background-size:cover!important;background-position:center!important;}

/* ===== STYLE BLOCK ===== */

/* Code Geass season heroes fill the complete detail frame. */
#detailPage .detail-banner,
#detailPage .detail-banner-main,
#detailPage .detail-art{
  width:100%!important;
  max-width:none!important;
  margin-left:0!important;
  margin-right:0!important;
}

/* ADMIN MEMBERS: keep the page chrome fixed while only the member table
   scrolls. This prevents the heading/actions bar from disappearing. */
@media(min-width:721px){
  body.admin-members-page-open #adminMembers{
    position:fixed!important; inset:0!important; height:100vh!important;
    overflow:hidden!important; padding:0!important;
  }
  body.admin-members-page-open #adminMembers > .wrap{
    width:100%; max-width:1400px; height:100%; margin:0 auto;
    padding:0 30px; display:flex; flex-direction:column;
  }
  body.admin-members-page-open #adminMembers .admin-head{
    flex:0 0 auto; position:sticky; top:0; z-index:4;
    padding:28px 0 18px; margin:0; background:#080a0f;
  }
  body.admin-members-page-open #adminMembers .members-table-wrap{
    flex:1 1 auto; min-height:0; overflow:auto;
  }
}
@media(max-width:720px){
  body.admin-members-page-open #adminMembers{
    position:fixed!important; inset:0!important; height:100dvh!important;
    overflow:hidden!important; padding:0 14px 14px!important;
  }
  body.admin-members-page-open #adminMembers > .wrap{
    width:100%; height:100%; padding:0; display:flex; flex-direction:column;
  }
  body.admin-members-page-open #adminMembers .admin-head{
    flex:0 0 auto; position:sticky; top:0; z-index:4;
    padding:18px 0 14px; margin:0; background:#080a0f;
  }
  body.admin-members-page-open #adminMembers .members-table-wrap{
    flex:1 1 auto; min-height:0; overflow:auto;
  }
}

/* Detail heroes always run edge-to-edge across the desktop viewport. */
@media(min-width:721px){
  #detailPage{
    width:100vw!important;
    max-width:none!important;
    margin-left:calc(50% - 50vw)!important;
    margin-right:calc(50% - 50vw)!important;
  }
  #detailPage .detail-banner,
  #detailPage .detail-banner-main,
  #detailPage .detail-art{
    width:100%!important;
    max-width:none!important;
  }
}

@media(min-width:721px){
  #detailPage[data-code-geass-hero="1"] .detail-banner-main:after{
    background:
      linear-gradient(90deg,rgba(0,0,0,.62),rgba(0,0,0,.28) 38%,rgba(0,0,0,.08) 78%,rgba(0,0,0,.30)),
      linear-gradient(0deg,rgba(10,10,10,.92),transparent 44%);
  }
}

/* === TONFLIX FINAL CARD + AOT DETAIL FIXES === */
.media-card{position:relative;overflow:hidden}
.media-card .thumb,
.media-card .card-image,
.media-card .poster,
.media-card .cover{background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important}
.media-card .badge{z-index:5}
.media-card .ep,
.media-card .duration,
.media-card .episode,
.media-card .card-ep,
.media-card .card-duration{position:relative;z-index:6;display:block!important;visibility:visible!important;opacity:1!important}


.aot-cover-real{
  background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='900' height='1280' viewBox='0 0 900 1280'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop stop-color='%2389c7ef'/%3E%3Cstop offset='.55' stop-color='%23c9e8fa'/%3E%3Cstop offset='1' stop-color='%23736b57'/%3E%3C/linearGradient%3E%3ClinearGradient id='d' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop stop-color='transparent'/%3E%3Cstop offset='1' stop-color='%23070a0d'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect width='900' height='1280' fill='url(%23g)'/%3E%3Ccircle cx='735' cy='220' r='95' fill='%23fff' opacity='.8'/%3E%3Cpath d='M0 700 Q170 570 330 690 T650 670 T900 610 V1280 H0Z' fill='%235f665d' opacity='.9'/%3E%3Crect y='720' width='900' height='560' fill='url(%23d)'/%3E%3Cg fill='%23202b36' stroke='%23fff' stroke-width='5'%3E%3Ccircle cx='450' cy='480' r='105'/%3E%3Crect x='350' y='575' width='200' height='310' rx='38'/%3E%3Ccircle cx='250' cy='680' r='65'/%3E%3Ccircle cx='650' cy='680' r='65'/%3E%3Ccircle cx='330' cy='900' r='62'/%3E%3Ccircle cx='570' cy='900' r='62'/%3E%3C/g%3E%3Cg fill='%23f5d7b0'%3E%3Ccircle cx='450' cy='450' r='82'/%3E%3Ccircle cx='250' cy='660' r='48'/%3E%3Ccircle cx='650' cy='660' r='48'/%3E%3Ccircle cx='330' cy='880' r='45'/%3E%3Ccircle cx='570' cy='880' r='45'/%3E%3C/g%3E%3Cg font-family='Arial,sans-serif' text-anchor='middle' fill='%23fff'%3E%3Ctext x='450' y='1030' font-size='68' font-weight='900'%3EATTACK ON TITAN%3C/text%3E%3Ctext x='450' y='1105' font-size='58' font-weight='900'%3EJUNIOR HIGH%3C/text%3E%3C/g%3E%3C/svg%3E");
  background-size:cover!important;background-position:center!important;
}

/* FINAL HOME HERO SWIPE: arrow-free pointer and touch navigation. */
#heroSlider .hero-arrows{
  display:none!important;
}
#heroSlider{
  touch-action:pan-y pinch-zoom;
  cursor:grab;
  user-select:none;
  -webkit-user-select:none;
  background:#050505;
}
#heroSlider.is-swiping{
  cursor:grabbing;
}
#heroSlider button,
#heroSlider a,
#heroSlider .dot{
  cursor:pointer;
}
@media(max-width:720px){
  #heroSlider .slide-nav{
    left:12px!important;
    right:12px!important;
    width:auto!important;
    max-width:none!important;
    overflow:hidden;
  }
  #heroSlider .slide-dots{
    width:100%;
    max-width:100%;
    gap:4px;
    overflow-x:auto;
    overscroll-behavior-x:contain;
    scrollbar-width:none;
    -ms-overflow-style:none;
  }
  #heroSlider .slide-dots::-webkit-scrollbar{display:none;}
  #heroSlider .dot{flex:0 0 16px;width:16px;}
}

/* Final card genre treatment: readable pill labels on every viewport. */
.card .card-genres{
  display:flex!important;
  flex-wrap:wrap!important;
  align-items:flex-start!important;
  gap:5px!important;
  width:100%!important;
  max-width:100%!important;
  margin-top:7px!important;
  min-height:20px!important;
  overflow:hidden!important;
}
.card .card-genres span{
  display:inline-flex!important;
  align-items:center!important;
  width:auto!important;
  max-width:100%!important;
  box-sizing:border-box!important;
  padding:3px 7px!important;
  border:1px solid rgba(168,255,0,.55)!important;
  border-radius:999px!important;
  background:rgba(100,150,0,.16)!important;
  color:#bfff45!important;
  font:800 10px/1 Inter,sans-serif!important;
  white-space:nowrap!important;
}
@media(max-width:720px){
  .card .card-genres{gap:5px!important;margin-top:6px!important;max-height:40px!important;}
  .card .card-genres span{padding:3px 6px!important;font-size:9px!important;}
}
.aot-banner-real{
  background-image:
    linear-gradient(90deg,rgba(5,8,12,.97) 0%,rgba(5,8,12,.78) 38%,rgba(5,8,12,.12) 76%,rgba(5,8,12,.62) 100%),
    url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1800' height='650' viewBox='0 0 1800 650'%3E%3Cdefs%3E%3ClinearGradient id='sky' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop stop-color='%236fb7e7'/%3E%3Cstop offset='.68' stop-color='%23dceefa'/%3E%3Cstop offset='1' stop-color='%238b7a64'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect width='1800' height='650' fill='url(%23sky)'/%3E%3Crect y='450' width='1800' height='200' fill='%236e695e'/%3E%3Cpath d='M0 460L160 390L300 455L450 375L610 450L760 395L910 455L1050 370L1200 450L1360 390L1520 455L1660 375L1800 440V650H0Z' fill='%234b4f4a'/%3E%3Cg fill='%23212a31' stroke='%23e8f4ff' stroke-width='4'%3E%3Ccircle cx='1120' cy='265' r='110'/%3E%3Crect x='1015' y='365' width='210' height='285' rx='45'/%3E%3Ccircle cx='860' cy='420' r='58'/%3E%3Ccircle cx='1380' cy='420' r='58'/%3E%3C/g%3E%3Cg fill='%23f5d7b0'%3E%3Ccircle cx='1120' cy='245' r='86'/%3E%3Ccircle cx='860' cy='405' r='43'/%3E%3Ccircle cx='1380' cy='405' r='43'/%3E%3C/g%3E%3Cpath d='M170 100Q230 35 290 100T410 100T530 100' fill='none' stroke='%23fff' stroke-width='28' opacity='.7'/%3E%3C/svg%3E");
  background-size:cover!important;background-position:center!important;
}
.ph-flag-icon{width:24px!important;height:16px!important;display:inline-block!important;vertical-align:middle!important;object-fit:cover!important;border-radius:2px!important;box-shadow:0 0 0 1px rgba(255,255,255,.25)!important}
.aot-hero-cover{width:240px!important;height:350px!important;border-radius:8px;overflow:hidden;background-size:cover!important;background-position:center!important;box-shadow:0 20px 50px rgba(0,0,0,.55)}
.aot-hero-banner{position:absolute;inset:0;background-size:cover!important;background-position:center!important}
.episode-row .ep-num{min-width:32px}

/* ===== STYLE BLOCK ===== */

.card-info p{display:flex!important;align-items:center;gap:4px;flex-wrap:wrap}
.card-info .card-meta-line{color:var(--muted);font-size:13px}
.card-genres{display:flex;gap:5px;flex-wrap:wrap;margin-top:7px;min-height:20px;overflow:hidden}
.card-genres span{display:inline-flex;align-items:center;padding:3px 7px;border:1px solid rgba(168,255,0,.32);border-radius:999px;background:rgba(168,255,0,.08);color:#c9ff70;font-size:10px;font-weight:800;line-height:1;white-space:nowrap}
.card-info{min-width:0}
.card-genres{max-width:100%;align-items:flex-start}

/* VIP plan cards: preserve normal grid flow so the ₱499 card never covers checkout. */
#modalOverlay .vip-modal{box-sizing:border-box;overflow-x:hidden;overflow-y:auto;}
#modalOverlay .modal-plans{display:grid!important;position:relative!important;grid-auto-flow:row!important;align-items:stretch!important;}
#modalOverlay .mplan{box-sizing:border-box!important;height:auto!important;min-height:96px!important;transform:none!important;}
#modalOverlay .vip-selected-summary,
#modalOverlay .vip-modal > .btn-vip,
#modalOverlay .vip-modal > .vip-modal-note{position:relative!important;clear:both!important;}

@media(max-width:720px){
  /* Full-width mobile carousels: remove the desktop container gutters. */
  nav{padding-left:16px;padding-right:16px;}
  .wrap{max-width:none;padding-left:0;padding-right:0;}
  section.rowsec{width:100%;overflow:hidden;}
  section.rowsec .section-head{padding-left:16px;padding-right:16px;}
  section.rowsec .row{padding-left:0;padding-right:0;}
  .card-genres{gap:5px;margin-top:6px;min-height:20px;max-height:40px;}
  .card-genres span{padding:3px 7px;font-size:9px;}
}

/* Mobile home media is edge-to-edge, including when a carousel is nested in
   a centered wrapper. Keep section headings padded, but let the visual rows
   and hero touch both viewport edges. */
@media(max-width:720px){
  #heroSlider,
  section.rowsec .row-container,
  section.rowsec .row{
    width:100vw!important;
    max-width:none!important;
    margin-left:calc(50% - 50vw)!important;
    margin-right:0!important;
  }
  section.rowsec .row{padding-left:0!important;padding-right:0!important;}
}

@media(max-width:480px){
  #modalOverlay .vip-modal{max-height:calc(100dvh - 20px)!important;padding:18px 14px 16px!important;}
  #modalOverlay .modal-plans{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;margin-bottom:16px!important;}
  #modalOverlay .mplan{min-height:92px!important;padding:11px 10px!important;}
  #modalOverlay .mplan .mp-name{font-size:15px!important;}
  #modalOverlay .mplan .mp-price{font-size:20px!important;}
}

/* ===== STYLE BLOCK ===== */

#pageDetailEpisodes{width:100%;max-width:1650px;margin:0 auto;overflow-anchor:none}
/* Episode artwork can load after the rows are visible. Prevent the browser
   from moving the reader's scroll position to compensate for those updates. */
#pageDetailEpisodes .episode-row{width:100%!important;min-height:126px!important;display:grid!important;grid-template-columns:210px 225px minmax(0,1fr) 52px!important;align-items:center!important;gap:24px!important;padding:14px 22px!important;margin:0 0 14px!important;box-sizing:border-box!important}
#pageDetailEpisodes .episode-thumb-wrap{width:210px!important;height:118px!important;position:relative!important;overflow:hidden!important;border-radius:8px!important;border:1px solid rgba(255,255,255,.14)!important;background:#111!important;box-shadow:0 5px 18px rgba(0,0,0,.3)!important}
#pageDetailEpisodes .episode-thumb-wrap img,#pageDetailEpisodes .episode-thumb-wrap iframe{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;display:block!important;border:0!important}
#pageDetailEpisodes .episode-thumb-wrap img{object-fit:cover!important;object-position:center!important;z-index:0!important}
#pageDetailEpisodes .episode-thumb-wrap iframe{z-index:1!important;pointer-events:none!important;background:#000!important}
#pageDetailEpisodes .ep-num{display:flex!important;align-items:center!important;gap:12px!important;font-size:32px!important;font-weight:800!important;text-align:left!important;color:var(--muted)!important;line-height:1!important;white-space:nowrap!important}
#pageDetailEpisodes .ep-num .episode-label{display:inline!important;margin:0!important;font-size:32px!important;line-height:1!important;font-weight:800!important;color:#aaa!important;letter-spacing:0!important;text-transform:uppercase!important;vertical-align:baseline!important}
#pageDetailEpisodes .ep-info{min-width:0!important}
#pageDetailEpisodes .ep-info h5{margin:0 0 7px!important;font-size:21px!important;line-height:1.25!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important}
#pageDetailEpisodes .ep-info span{font-size:15px!important;color:#aaa!important}
#pageDetailEpisodes .ep-play{font-size:22px!important;color:var(--neon)!important;text-align:center!important}
@media(max-width:1100px){#pageDetailEpisodes .episode-row{grid-template-columns:150px 190px minmax(0,1fr) 44px!important;min-height:102px!important;gap:16px!important}#pageDetailEpisodes .episode-thumb-wrap{width:150px!important;height:84px!important}#pageDetailEpisodes .ep-num{font-size:27px!important;gap:9px!important}#pageDetailEpisodes .ep-num .episode-label{font-size:27px!important}}
@media(max-width:700px){#pageDetailEpisodes .episode-row{grid-template-columns:112px 150px minmax(0,1fr) 32px!important;min-height:76px!important;gap:9px!important;padding:9px!important}#pageDetailEpisodes .episode-thumb-wrap{width:112px!important;height:63px!important}#pageDetailEpisodes .ep-num{font-size:20px!important;gap:5px!important}#pageDetailEpisodes .ep-num .episode-label{font-size:20px!important}#pageDetailEpisodes .ep-info h5{font-size:14px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}}

/* ===== STYLE BLOCK ===== */

#pageDetailEpisodes .episode-thumb{
  display:block!important;
  object-fit:cover!important;
  object-position:center!important;
  background:#111!important;
}

/* ===== STYLE BLOCK ===== */

/* Episode list intentionally has no separate "Episodes" heading. */
#pageDetailEpisodes + .episodes-heading,#pageDetailEpisodes ~ .episodes-heading{display:none!important}

/* ===== STYLE BLOCK ===== */

#pageDetailEpisodes .episode-thumb[data-bunny-thumbnail="true"]{
  object-fit:cover!important;
  object-position:center!important;
}

/* ===== STYLE BLOCK ===== */

#pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview{
  position:relative!important;
  width:100%!important;
  height:100%!important;
  overflow:hidden!important;
  border-radius:8px!important;
  background:#080808!important;
  isolation:isolate!important;
}
#pageDetailEpisodes .episode-thumb-wrap .bunny-live-frame,
.episode-thumb-wrap .bunny-video-preview iframe,
.episode-thumb-wrap .bunny-video-preview video,
.episode-thumb-wrap .bunny-video-preview img{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  border:0!important;
  display:block!important;
  pointer-events:none!important;
  background:#000!important;
}
#pageDetailEpisodes .episode-thumb-wrap .bunny-live-shade{
  position:absolute!important;
  inset:0!important;
  z-index:2!important;
  pointer-events:none!important;
  background:linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.28))!important;
}
#pageDetailEpisodes .episode-thumb-wrap .bunny-live-label{display:none!important}
@media (min-width:1000px){
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview{width:180px!important;height:101px!important}
}
@media (min-width:1500px){
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview{width:210px!important;height:118px!important}
}

/* ===== STYLE BLOCK ===== */

/* Desktop: thumbnail -> EPISODE 01 -> title -> play */
#pageDetailEpisodes .episode-thumb-wrap{
  aspect-ratio:16/9!important;
}
#pageDetailEpisodes .episode-thumb-wrap iframe{
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  transform:none!important;
}

/* Mobile: keep the entire 16:9 preview visible instead of squeezing/cropping it. */
@media(max-width:700px){
  #pageDetailEpisodes .episode-row{
    grid-template-columns:110px 132px minmax(0,1fr) 28px!important;
    min-height:80px!important;
    gap:8px!important;
    padding:9px!important;
  }
  #pageDetailEpisodes .episode-thumb-wrap{
    width:110px!important;
    height:62px!important;
    aspect-ratio:16/9!important;
    align-self:center!important;
  }
  #pageDetailEpisodes .episode-thumb-wrap iframe,
  #pageDetailEpisodes .episode-thumb-wrap img{
    width:100%!important;
    height:100%!important;
  }
  #pageDetailEpisodes .ep-num{
    font-size:20px!important;
    gap:5px!important;
  }
  #pageDetailEpisodes .ep-num .episode-label{
    font-size:20px!important;
  }
  #pageDetailEpisodes .ep-info h5{
    font-size:14px!important;
    line-height:1.2!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  #pageDetailEpisodes .ep-info span{font-size:12px!important}
}
@media(max-width:480px){
  #pageDetailEpisodes .episode-row{
    grid-template-columns:100px 116px minmax(0,1fr) 24px!important;
    gap:7px!important;
  }
  #pageDetailEpisodes .episode-thumb-wrap{
    width:100px!important;
    height:56px!important;
  }
  #pageDetailEpisodes .ep-num{font-size:18px!important;gap:4px!important}
  #pageDetailEpisodes .ep-num .episode-label{font-size:18px!important}
}

/* ===== STYLE BLOCK ===== */

/* TEST VERSION: static thumbnails only. No Bunny iframe/video is loaded inside the card. */
  #pageDetailEpisodes .static-episode-thumb{
    position:relative!important;
    width:210px!important;
    aspect-ratio:16/9!important;
    height:auto!important;
    overflow:hidden!important;
    border-radius:8px!important;
    background:#111!important;
  }
  #pageDetailEpisodes .static-episode-thumb img{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center!important;
    display:block!important;
  }
  @media(max-width:1100px){
    #pageDetailEpisodes .static-episode-thumb{width:150px!important}
  }
  @media(max-width:700px){
    #pageDetailPlay{font-size:13px!important;padding:12px 14px!important;white-space:nowrap!important;}
    #pageDetailEpisodes .static-episode-thumb{width:112px!important;aspect-ratio:16/9!important}
  }

/* ===== STYLE BLOCK ===== */

/* Restore animated Bunny previews while keeping episode-row clicks intact. */
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview{
    position:relative!important;
    width:210px!important;
    height:118px!important;
    aspect-ratio:16/9!important;
    overflow:hidden!important;
    background:#111!important;
  }
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview .bunny-preview-fallback{
    position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
    object-fit:cover!important;object-position:center!important;z-index:0!important;
  }
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview .bunny-live-frame{
    position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
    border:0!important;display:block!important;z-index:1!important;pointer-events:none!important;
    background:#000!important;
  }
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview .bunny-live-shade{
    position:absolute!important;inset:0!important;z-index:2!important;pointer-events:none!important;
    background:linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.12))!important;
  }
  @media(max-width:1100px){
    #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview{width:150px!important;height:84px!important}
  }
  @media(max-width:700px){
    #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview{width:112px!important;height:63px!important}
  }
  @media(max-width:480px){
    #pageDetailPlay{font-size:12px!important;padding:11px 10px!important;}
    #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview{width:100px!important;height:56px!important}
  }

/* ===== STYLE BLOCK ===== */

#pageDetailEpisodes .episode-row{cursor:pointer!important;position:relative!important;}
  #pageDetailEpisodes .episode-row .ep-play{pointer-events:none!important;}
  #pageDetailEpisodes .episode-thumb-wrap{flex-shrink:0!important;}
  #pageDetailEpisodes .episode-thumb-wrap img{object-fit:cover!important;width:100%!important;height:100%!important;}

  /* Mobile: keep the entire thumbnail visible and give the title real room to wrap. */
  @media(max-width:700px){
    #pageDetailEpisodes .episode-row{
      display:grid!important;
      grid-template-columns:minmax(128px,40%) minmax(0,1fr) 30px!important;
      grid-template-rows:auto auto!important;
      column-gap:12px!important;
      row-gap:5px!important;
      align-items:center!important;
      min-height:0!important;
      padding:10px!important;
    }
    #pageDetailEpisodes .episode-thumb-wrap{
      grid-column:1!important;
      grid-row:1 / span 2!important;
      width:100%!important;
      height:auto!important;
      aspect-ratio:16/9!important;
      align-self:center!important;
    }
    #pageDetailEpisodes .ep-num{
      grid-column:2!important;
      grid-row:1!important;
      min-width:0!important;
      gap:5px!important;
      font-size:20px!important;
      line-height:1!important;
      white-space:nowrap!important;
      overflow:visible!important;
    }
    #pageDetailEpisodes .ep-num .episode-label{font-size:20px!important;}
    #pageDetailEpisodes .ep-info{
      grid-column:2!important;
      grid-row:2!important;
      min-width:0!important;
      width:100%!important;
      overflow:visible!important;
    }
    #pageDetailEpisodes .ep-info h5{
      margin:0 0 4px!important;
      font-size:15px!important;
      line-height:1.22!important;
      white-space:normal!important;
      overflow:visible!important;
      text-overflow:clip!important;
      display:block!important;
      word-break:normal!important;
      overflow-wrap:anywhere!important;
    }
    #pageDetailEpisodes .ep-info span{font-size:12px!important;}
    #pageDetailEpisodes .ep-play{
      grid-column:3!important;
      grid-row:1 / span 2!important;
      font-size:22px!important;
      align-self:center!important;
    }
  }
  @media(max-width:480px){
    #pageDetailEpisodes .episode-row{
      grid-template-columns:minmax(126px,41%) minmax(0,1fr) 28px!important;
      column-gap:10px!important;
      padding:9px!important;
    }
    #pageDetailEpisodes .ep-num{font-size:18px!important;gap:4px!important;}
    #pageDetailEpisodes .ep-num .episode-label{font-size:18px!important;}
    #pageDetailEpisodes .ep-info h5{font-size:14px!important;line-height:1.2!important;}
    #pageDetailEpisodes .ep-info span{font-size:12px!important;}
    #pageDetailEpisodes .ep-play{font-size:20px!important;}
  }

/* ===== STYLE BLOCK ===== */

/* Final episode-label typography: clean, modern, highly readable. */
  #pageDetailEpisodes .ep-num{
    font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif!important;
    font-weight:800!important;
    color:#f5f5f5!important;
    letter-spacing:-.4px!important;
    text-transform:uppercase!important;
  }
  #pageDetailEpisodes .ep-num .episode-label{
    font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif!important;
    font-size:clamp(18px,2.2vw,28px)!important;
    font-weight:800!important;
    color:#f2f2f2!important;
    letter-spacing:-.5px!important;
    text-shadow:0 1px 2px rgba(0,0,0,.45)!important;
  }
  #pageDetailEpisodes .ep-num > span:last-child{
    color:#e50914!important;
    font-weight:900!important;
  }
  /* Show the complete thumbnail instead of cropping it. The live Bunny iframe
     remains animated; the fallback image uses contain so the full frame is visible. */
  #pageDetailEpisodes .episode-thumb-wrap{
    aspect-ratio:16/9!important;
    background:#050505!important;
  }
  #pageDetailEpisodes .episode-thumb-wrap .bunny-preview-fallback{
    object-fit:contain!important;
    object-position:center!important;
    background:#050505!important;
  }
  @media(max-width:700px){
    #pageDetailEpisodes .episode-row{
      grid-template-columns:minmax(138px,42%) minmax(0,1fr) 30px!important;
      column-gap:10px!important;
      padding:10px!important;
    }
    #pageDetailEpisodes .episode-thumb-wrap{
      width:100%!important;
      height:auto!important;
      aspect-ratio:4/3!important;
    }
    #pageDetailEpisodes .ep-num .episode-label{font-size:19px!important;}
    #pageDetailEpisodes .ep-num{font-size:19px!important;}
    #pageDetailEpisodes .ep-info h5{
      font-size:15px!important;
      line-height:1.2!important;
      white-space:normal!important;
      overflow:visible!important;
      text-overflow:clip!important;
      display:block!important;
      word-break:normal!important;
      overflow-wrap:break-word!important;
    }
  }
  @media(max-width:480px){
    #pageDetailEpisodes .episode-row{
      grid-template-columns:minmax(142px,44%) minmax(0,1fr) 28px!important;
      column-gap:9px!important;
    }
    #pageDetailEpisodes .ep-num .episode-label{font-size:18px!important;}
    #pageDetailEpisodes .ep-num{font-size:18px!important;}
    #pageDetailEpisodes .ep-info h5{font-size:14px!important;line-height:1.18!important;}
  }

/* ===== STYLE BLOCK ===== */

/* Keep the Bunny preview and its card at the same 16:9 ratio on phones.
     The previous 4:3 box forced the 16:9 Bunny player into a mismatched frame,
     which is what produced the large black area visible on mobile. */
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview,
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview .bunny-live-frame,
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview .bunny-preview-fallback{
    aspect-ratio:16/9!important;
  }
  @media(max-width:700px){
    #pageDetailEpisodes .episode-row{
      grid-template-columns:minmax(138px,42%) minmax(0,1fr) 30px!important;
      column-gap:10px!important;
      min-height:88px!important;
    }
    #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview{
      width:100%!important;
      height:auto!important;
      aspect-ratio:16/9!important;
      align-self:center!important;
    }
    #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview .bunny-live-frame,
    #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview .bunny-preview-fallback{
      width:100%!important;
      height:100%!important;
      transform:none!important;
    }
    #pageDetailEpisodes .episode-thumb-wrap .bunny-preview-fallback{
      object-fit:cover!important;
      object-position:center!important;
    }
    #pageDetailEpisodes .ep-info h5{
      white-space:normal!important;
      overflow:visible!important;
      text-overflow:clip!important;
    }
  }
  @media(max-width:480px){
    #pageDetailEpisodes .episode-row{
      grid-template-columns:minmax(132px,43%) minmax(0,1fr) 28px!important;
      column-gap:9px!important;
      min-height:84px!important;
    }
  }

/* ===== STYLE BLOCK ===== */

/* Bunny's embedded preview can render with an internal letterbox on narrow cards.
     The iframe is scaled slightly past the card edges so the black gutter is hidden,
     while the fallback image remains a true full-frame 16:9 image. */
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview{
    overflow:hidden!important;
    background:#000!important;
  }
  @media(max-width:700px){
    #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview .bunny-live-frame{
      width:125%!important;
      height:125%!important;
      left:-12.5%!important;
      top:-12.5%!important;
      right:auto!important;
      bottom:auto!important;
      transform:none!important;
      transform-origin:center!important;
    }
  }
  @media(max-width:480px){
    #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview .bunny-live-frame{
      width:132%!important;
      height:132%!important;
      left:-16%!important;
      top:-16%!important;
    }
  }

/* ===== STYLE BLOCK ===== */

.video-modal{position:relative}
.video-title-bar{position:relative;min-height:44px;padding-right:54px}
.video-title-bar h3{line-height:1.15;padding-top:7px;padding-right:8px}
.video-close{
  position:relative;flex:0 0 auto;
  width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;
  border-radius:50%!important;display:flex!important;align-items:center!important;justify-content:center!important;
  background:rgba(35,35,35,.88)!important;border:1px solid rgba(255,255,255,.18)!important;
  color:#fff!important;box-shadow:0 8px 24px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  transition:transform .16s ease,background .16s ease,border-color .16s ease,box-shadow .16s ease;
  z-index:20;-webkit-tap-highlight-color:transparent;touch-action:manipulation;
}
.video-close span{display:block;font-family:Arial,sans-serif;font-size:25px;font-weight:300;line-height:1;transform:translateY(-1px)}
.video-close:hover,.video-close:focus-visible{
  background:rgba(229,9,20,.95)!important;border-color:rgba(255,255,255,.38)!important;
  transform:scale(1.06);box-shadow:0 10px 28px rgba(0,0,0,.55),0 0 0 3px rgba(229,9,20,.18);outline:none;
}
.video-close:active{transform:scale(.92)}
@media(min-width:721px){
  .video-close{width:42px!important;height:42px!important;min-width:42px!important;min-height:42px!important}
}
@media(max-width:720px){
  .video-modal-overlay{align-items:flex-start;padding:0!important}
  .video-modal{width:100%;max-width:none;margin-top:env(safe-area-inset-top,0px)}
  .video-title-bar{
    position:absolute;top:0;left:0;right:0;z-index:30;min-height:0;margin:0;
    padding:10px 10px 0 12px;pointer-events:none
  }
  .video-title-bar h3{
    display:block!important;
    max-width:calc(100% - 58px);
    margin:0;
    padding:8px 10px!important;
    font-size:16px!important;
    line-height:1.15!important;
    color:#fff;
    text-shadow:0 2px 8px #000;
    background:rgba(0,0,0,.55);
    border-radius:6px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .video-close{
    margin-left:auto;pointer-events:auto;
    width:48px!important;height:48px!important;min-width:48px!important;min-height:48px!important;
    background:rgba(12,12,12,.68)!important;border-color:rgba(255,255,255,.24)!important;
    box-shadow:0 8px 26px rgba(0,0,0,.65),inset 0 1px 0 rgba(255,255,255,.12)
  }
  .video-close span{font-size:27px}
  .video-modal-inner{width:100%;aspect-ratio:16/9;border-radius:0!important;border-left:0!important;border-right:0!important}
  .video-modal-inner iframe,.video-modal-inner video{border-radius:0!important}
}

@media(max-width:380px){
  .video-title-bar{padding-top:max(8px,env(safe-area-inset-top));padding-right:8px}
  .video-close{width:46px!important;height:46px!important;min-width:46px!important;min-height:46px!important}
}
@media(min-width:721px){
  .video-close.tv-focusable:focus-visible{outline:3px solid var(--neon)!important;outline-offset:3px}
}

/* ===== STYLE BLOCK ===== */

.mobile-hero-fallback{display:none;}

@media(max-width:720px){
  .mobile-hero-fallback{
    position:absolute;
    inset:0;
    z-index:1;
    display:flex;
    align-items:flex-end;
    padding:0 18px 58px;
    background:
      linear-gradient(90deg,rgba(0,0,0,.92) 10%,rgba(0,0,0,.45) 62%,rgba(0,0,0,.08)),
      linear-gradient(0deg,rgba(0,0,0,.92),transparent 65%),
      url("/images/mobile-hero-fallback.png") center/cover no-repeat;
  }
  body.hero-js-ready .mobile-hero-fallback{display:none;}
  .mobile-hero-fallback-content{position:relative;z-index:2;max-width:92%;}
  .mobile-hero-fallback .slide-tag{
    font-family:'JetBrains Mono';font-size:10px;color:var(--neon);
    letter-spacing:.12em;text-transform:uppercase;margin-bottom:10px;
    display:inline-block;border-left:3px solid var(--red);padding-left:9px;
  }
  .mobile-hero-fallback h1{
    font-size:clamp(34px,9vw,52px);line-height:.98;margin:0 0 12px;
  }
  .mobile-hero-fallback p{
    color:var(--muted);font-size:13px;line-height:1.45;
    max-width:88%;margin:0 0 18px;
  }
}

/* Keep combined episode numbers such as 104 - 105 inside their grid column. */
#pageDetailEpisodes .ep-num{
  min-width:0!important;
  white-space:nowrap!important;
}
@media(min-width:1101px){
  #pageDetailEpisodes .episode-row{grid-template-columns:210px 280px minmax(0,1fr) 52px!important;}
}
@media(min-width:701px) and (max-width:1100px){
  #pageDetailEpisodes .episode-row{grid-template-columns:150px 230px minmax(0,1fr) 44px!important;}
}
@media(max-width:700px){
  #pageDetailEpisodes .ep-num,
  #pageDetailEpisodes .ep-num .episode-label{font-size:17px!important;line-height:1!important;}
  #pageDetailEpisodes .ep-num{gap:4px!important;}
}

/* FINAL HOME SLIDER BADGE POSITION: top-right on every slide. */
#heroSlider .slide > .hero-tagalog-badge{
  top:24px!important;
  right:30px!important;
  left:auto!important;
  bottom:auto!important;
}

#pageDetailFavoriteBtn.vip-favorite-locked{
  border-color:rgba(168,255,0,.55)!important;
  color:#A8FF00!important;
  background:rgba(168,255,0,.08)!important;
}
@media(max-width:720px){
  #heroSlider .slide > .hero-tagalog-badge{
    top:18px!important;
    right:18px!important;
    left:auto!important;
  }
}

/* ===== STYLE BLOCK ===== */

.season-picker{width:100%;max-width:1650px;margin:0 auto 18px;display:flex;gap:10px;overflow-x:auto;padding:2px 0 8px;scrollbar-width:thin}
.season-tab{flex:0 0 auto;min-width:155px;padding:12px 15px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:#171717;color:#ddd;text-align:left;cursor:pointer;transition:.18s ease}
.season-tab span{display:block;font-weight:800;font-size:14px}
.season-tab small{display:block;margin-top:4px;color:#888;font-size:11px;line-height:1.25}
.season-tab:hover,.season-tab:focus-visible,.season-tab.active{border-color:rgba(229,9,20,.75);background:linear-gradient(135deg,rgba(229,9,20,.20),#171717);color:#fff;outline:none}
.episode-locked{cursor:pointer}
.episode-vip-shade{position:absolute;inset:0;z-index:3;display:flex;align-items:center;justify-content:center;background:linear-gradient(90deg,rgba(0,0,0,.25),rgba(0,0,0,.62));pointer-events:none}
.episode-vip-shade span{padding:7px 11px;border-radius:999px;background:rgba(229,9,20,.94);color:#fff;font-size:11px;font-weight:900;letter-spacing:.08em;box-shadow:0 8px 24px rgba(0,0,0,.45)}
.episode-locked .ep-play{color:#aaa!important}
@media(max-width:700px){.season-picker{padding-left:2px;padding-right:2px}.season-tab{min-width:132px;padding:10px 12px}.season-tab span{font-size:12px}.season-tab small{font-size:10px}}

/* ===== STYLE BLOCK ===== */

/* DBZ official series artwork */
#detailArt{
  background-position:center 20%!important;
  background-size:cover!important;
}
#detailCover{
  background-size:cover!important;
  background-position:center!important;
}

/* Locked Bunny previews still show the actual Bunny poster frame,
   but cannot be clicked or autoplayed for non-VIP users. */
#pageDetailEpisodes .bunny-locked-preview{
  opacity:.92!important;
  filter:saturate(.9) brightness(.72)!important;
}
#pageDetailEpisodes .episode-locked .episode-vip-shade{
  z-index:4!important;
  background:linear-gradient(90deg,rgba(0,0,0,.12),rgba(0,0,0,.58))!important;
}
#pageDetailEpisodes .episode-locked .bunny-live-shade{
  z-index:3!important;
}

/* Season navigation is clearly interactive. */
.season-tab{
  user-select:none;
  -webkit-user-select:none;
  touch-action:manipulation;
}
.season-tab:active{transform:scale(.985)}

/* ===== STYLE BLOCK ===== */

/* Clean artwork: never print the anime title over the poster itself. */
.detail-cover .detail-cover-title{display:none!important}
/* If a poster already has real cover art, do not add a decorative glyph on top of it. */
.poster:has(img), .poster.has-real-cover{background-blend-mode:normal}
/* Season artwork always has a visible fallback color even if a browser blocks an image URL. */
.season-hero-art{min-height:220px;background-color:#101318!important}
.season-cover{background-color:#101318}
@media(max-width:700px){.season-hero-art{min-height:190px}.season-cover{width:128px;height:164px}}

/* ===== STYLE BLOCK ===== */

/* AOT HQ artwork */
#detailCover{background-size:cover!important;background-position:center!important}
#detailArt{background-size:cover!important;background-position:center!important}

/* Never render Bunny's controls/title overlay inside episode thumbnails. */
#pageDetailEpisodes .episode-thumb-wrap{overflow:hidden!important}
#pageDetailEpisodes .clean-episode-thumb,
#pageDetailEpisodes .bunny-preview-fallback{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block!important}
#pageDetailEpisodes .episode-vip-shade{z-index:5!important;background:linear-gradient(90deg,rgba(0,0,0,.10),rgba(0,0,0,.46))!important}
#pageDetailEpisodes .episode-vip-shade span{
  padding:8px 13px!important;border-radius:999px!important;background:#e50914!important;
  color:#fff!important;font-size:12px!important;font-weight:900!important;
  letter-spacing:.04em!important;box-shadow:0 8px 22px rgba(0,0,0,.5)!important;
}

/* ===== STYLE BLOCK ===== */

/* Every episode card uses its Bunny video preview when a Bunny link exists.
     The series cover is intentionally never used as an episode thumbnail. */
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview{
    position:relative!important;
    overflow:hidden!important;
    aspect-ratio:16/9!important;
    background:#080808!important;
    isolation:isolate!important;
  }
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview .bunny-live-frame,
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview .bunny-preview-fallback,
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview .bunny-preview-empty{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    border:0!important;
    display:block!important;
  }
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview .bunny-live-frame{
    z-index:1!important;
    pointer-events:none!important;
    background:#000!important;
    object-fit:cover!important;
  }
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview .bunny-preview-fallback{
    z-index:0!important;
    object-fit:cover!important;
    object-position:center!important;
    background:#111!important;
  }
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview .bunny-preview-empty{
    z-index:0!important;
    background:linear-gradient(135deg,#171717,#090909)!important;
  }
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview .bunny-live-shade{
    z-index:2!important;
    pointer-events:none!important;
  }
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview .episode-vip-shade{
    z-index:4!important;
  }

/* ===== STYLE BLOCK ===== */

.nav-right{gap:10px!important}
.nav-search-btn,.mobile-menu-btn{border:0;background:transparent;color:#fff;cursor:pointer;font:700 14px Inter,sans-serif;display:flex;align-items:center;gap:5px;padding:8px 10px;border-radius:6px}
.nav-search-btn{font-size:22px}.nav-search-btn span{font-size:13px}.nav-search-btn:hover,.mobile-menu-btn:hover{background:rgba(255,255,255,.08);color:var(--red)}
.mobile-menu-btn{display:none;font-size:25px;line-height:1}
.mobile-menu-overlay,.anime-search-overlay{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.72);backdrop-filter:blur(6px);display:none}
.mobile-menu-overlay.open,.anime-search-overlay.open{display:block}
.mobile-menu{position:absolute;right:0;top:0;height:100%;width:min(320px,88vw);background:#0c0c0c;border-left:1px solid rgba(255,255,255,.12);padding:22px;box-sizing:border-box;box-shadow:-20px 0 60px rgba(0,0,0,.55);display:flex;flex-direction:column;gap:8px}
.mobile-menu-close{align-self:flex-end;border:0;background:none;color:#fff;font-size:22px;cursor:pointer}.mobile-menu-logo{font:400 32px Anton,sans-serif;color:var(--red);margin:4px 0 20px}
.mobile-menu>button:not(.mobile-menu-close){border:0;background:#151515;color:#fff;text-align:left;padding:14px 15px;border-radius:7px;font:700 15px Inter,sans-serif;cursor:pointer}.mobile-menu>button:not(.mobile-menu-close):hover{background:#222;color:var(--red)}
.mobile-menu-search{margin-top:12px!important;border:1px solid rgba(255,255,255,.16)!important}

.mobile-account-card{display:flex;align-items:center;gap:12px;padding:13px;border:1px solid rgba(255,255,255,.12);background:linear-gradient(145deg,#171717,#0f0f0f);border-radius:10px;margin:0 0 8px;}
.mobile-account-avatar{width:42px;height:42px;flex:0 0 42px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#b7000f,#5e0008);color:#fff;font-weight:800;font-size:17px;}
.mobile-account-info{min-width:0;flex:1;}
.mobile-account-name{font-weight:800;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fff;}
.mobile-account-email{font-size:11px;color:#999;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px;}
.mobile-account-vip{display:inline-block;margin-top:6px;font-size:10px;font-weight:800;letter-spacing:.04em;color:#f6b44d;}
.mobile-account-action{border:1px solid rgba(255,255,255,.14);background:#202020;color:#fff;border-radius:6px;padding:8px 10px;font-size:11px;font-weight:800;cursor:pointer;flex-shrink:0;}
.mobile-account-action:hover{background:#2a2a2a;color:var(--red);}
@media(max-width:720px){.mobile-account-card{margin-bottom:10px}.mobile-account-action{display:block}}
.anime-search-overlay{display:none;align-items:flex-start;justify-content:center;padding:9vh 16px 20px;box-sizing:border-box}.anime-search-overlay.open{display:flex}
.anime-search-panel{width:min(680px,100%);max-height:78vh;overflow:auto;background:#111;border:1px solid rgba(255,255,255,.14);border-radius:14px;box-shadow:0 25px 90px rgba(0,0,0,.65);padding:18px}
.anime-search-head{display:flex;justify-content:space-between;align-items:center;color:#fff;font-size:18px;margin-bottom:12px}.anime-search-head button{border:0;background:none;color:#aaa;font-size:20px;cursor:pointer}
#animeSearchInput{width:100%;box-sizing:border-box;background:#080808;border:1px solid rgba(255,255,255,.16);color:#fff;border-radius:8px;padding:13px 14px;font:600 14px Inter,sans-serif;outline:none}.anime-search-results{display:grid;gap:8px;margin-top:12px}.anime-search-result{display:flex;align-items:center;gap:12px;padding:9px;background:#191919;border:1px solid rgba(255,255,255,.08);border-radius:8px;cursor:pointer}.anime-search-result:hover{border-color:var(--red);background:#211313}.anime-search-result img{width:58px;height:72px;object-fit:cover;border-radius:5px;background:#222}.anime-search-result strong{display:block;color:#fff;font-size:14px}.anime-search-result span{display:block;color:#999;font-size:11px;margin-top:3px}
.anime-search-empty{color:#999;text-align:center;padding:22px}
@media(max-width:720px){.nav-search-btn span{display:none}.mobile-menu-btn{display:flex}.nav-links{display:none!important}.nav-right{gap:2px!important}.nav-search-btn{font-size:23px;padding:6px}.mobile-menu-btn{padding:6px}.anime-search-overlay{padding:76px 10px 10px}.anime-search-panel{max-height:80vh;border-radius:12px}}

/* ===== STYLE BLOCK ===== */

/* V10: detail pages use BANNER only. Cover art remains only on home/cards. */
#detailPage .detail-cover{display:none!important;}
#detailPage .detail-banner{display:block!important;min-height:540px!important;position:relative!important;overflow:hidden!important;background:#090909!important;}
#detailPage .detail-banner-main{position:relative!important;width:100%!important;min-height:540px!important;display:flex!important;align-items:flex-end!important;overflow:hidden!important;}
#detailPage .detail-art{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important;opacity:1!important;}
#detailPage .detail-banner-main:after{display:block!important;}
#detailPage .detail-content{position:relative!important;z-index:2!important;width:100%!important;box-sizing:border-box!important;}
@media(max-width:720px){
  #detailPage .detail-banner{display:block!important;min-height:0!important;background:#090909!important;}
  #detailPage .detail-banner-main{display:flex!important;flex-direction:column!important;align-items:stretch!important;min-height:0!important;background:#090909!important;overflow:visible!important;}
  #detailPage .detail-art{position:relative!important;inset:auto!important;flex:0 0 auto!important;width:100%!important;height:auto!important;aspect-ratio:16/9!important;background-size:cover!important;background-position:center!important;opacity:1!important;}
  /* No banner image behind the description/content on mobile. */
  #detailPage .detail-banner-main:after{display:none!important;}
  #detailPage .detail-content{background:#090909!important;padding:22px 16px 28px!important;}
  #detailPage .detail-copy h1{font-size:38px!important;line-height:.98!important;margin:8px 0 12px!important;}
  #detailPage .detail-desc{font-size:15px!important;line-height:1.55!important;max-width:none!important;margin-bottom:18px!important;}
  #detailPage .detail-actions{display:flex!important;flex-direction:column!important;gap:9px!important;}
  #detailPage .detail-actions button{width:100%!important;justify-content:center!important;}
}

/* ===== STYLE BLOCK ===== */

/* V12: real image element preserves the complete banner height on mobile. */
#detailPage .detail-cover{position:relative!important;overflow:hidden!important;background:#000!important;border-radius:0!important;}
#detailPage .detail-banner-img{display:block!important;width:100%!important;height:auto!important;max-width:none!important;object-fit:contain!important;object-position:center top!important;margin:0!important;padding:0!important;}
@media(max-width:720px){
  #detailPage .detail-banner{display:block!important;width:100%!important;height:auto!important;min-height:0!important;overflow:visible!important;background:#000!important;}
  #detailPage .detail-cover{display:block!important;width:100%!important;height:auto!important;min-height:0!important;aspect-ratio:auto!important;overflow:hidden!important;background:#000!important;}
  #detailPage .detail-banner-img{width:100%!important;height:auto!important;object-fit:contain!important;}
}

/* ===== STYLE BLOCK ===== */

/* V13: full, uncropped mobile banner + trailer block */
#detailPage .detail-cover{padding:0!important;overflow:hidden!important;background:#000!important;}
#detailPage .detail-banner-img{display:block!important;width:100%!important;height:auto!important;max-width:100%!important;object-fit:contain!important;object-position:center center!important;}
.detail-trailer{margin:28px 0 30px;max-width:1000px;}
.detail-trailer-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;}
.detail-trailer-head h2{margin:0;font-size:24px;}
.trailer-external,.official-trailer-link{display:inline-flex;align-items:center;justify-content:center;padding:10px 14px;border:1px solid rgba(255,255,255,.16);border-radius:8px;background:#171717;color:#fff;text-decoration:none;font-weight:700;}
.detail-trailer-frame{position:relative;width:100%;aspect-ratio:16/9;background:#000;border-radius:10px;overflow:hidden;border:1px solid rgba(255,255,255,.12);}
.detail-trailer-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
@media(max-width:720px){
  #detailPage .detail-cover{height:auto!important;min-height:0!important;aspect-ratio:auto!important;overflow:hidden!important;}
  #detailPage .detail-banner-img{width:100%!important;height:auto!important;max-height:none!important;object-fit:contain!important;object-position:center top!important;}
  .detail-trailer{margin:22px 0 26px;}
  .detail-trailer-head{align-items:flex-start;flex-direction:column;}
  .detail-trailer-head h2{font-size:20px;}
  .trailer-external,.official-trailer-link{width:100%;box-sizing:border-box;}
}

/* ===== STYLE BLOCK ===== */

/* DBZ Seasons 2-4 use true widescreen artwork so desktop can fill the hero without cropping. */
@media (min-width:721px){
  #detailPage .detail-banner-main{aspect-ratio:16/9!important;overflow:hidden!important;}
  #detailPage .detail-art{background-size:100% 100%!important;background-position:center!important;background-repeat:no-repeat!important;}
}

/* ===== STYLE BLOCK ===== */

.nav-account-btn{border:1px solid rgba(255,255,255,.16);background:#141414;color:#fff;border-radius:10px;padding:10px 13px;font-weight:800;cursor:pointer;}
.auth-modal{max-width:460px;}
.auth-fields{display:grid;gap:10px;margin:16px 0;}
.auth-fields input{width:100%;box-sizing:border-box;padding:13px 14px;border-radius:10px;border:1px solid rgba(255,255,255,.14);background:#101010;color:#fff;outline:none;}
.auth-message{min-height:18px;margin:8px 0 12px;color:#ffb4b4;font-size:12px;}
.auth-subscription-status{display:none;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0 12px;padding:10px;border:1px solid rgba(255,255,255,.12);border-radius:14px;background:linear-gradient(135deg,rgba(229,9,20,.12),rgba(255,255,255,.035));font-size:14px;}
.auth-subscription-item{min-width:0;padding:12px 13px;border:1px solid rgba(255,255,255,.09);border-radius:10px;background:rgba(8,10,14,.45);}
.auth-subscription-label{display:block;margin-bottom:6px;color:#aab1bf;font-size:10px;text-transform:uppercase;letter-spacing:.1em;font-weight:800;}
.auth-subscription-status strong{display:block;overflow:hidden;color:#fff;font-weight:800;text-overflow:ellipsis;white-space:nowrap;}
@media(max-width:520px){.auth-subscription-status{grid-template-columns:1fr;}}
.auth-toggle,.auth-signout{display:block;width:100%;margin-top:10px;background:transparent;color:#fff;border:1px solid rgba(255,255,255,.14);border-radius:10px;padding:10px 12px;cursor:pointer;font-weight:700;}
body.auth-signed-in .nav-account-btn{border-color:rgba(0,255,170,.3);}
@media(max-width:720px){.nav-account-btn{display:none}.auth-modal{margin:16px;max-width:none}}

/* ===== STYLE BLOCK ===== */

.auth-password-field{position:relative;width:100%;}
  .auth-password-field input{width:100%;padding-right:76px!important;}
  .auth-password-toggle{position:absolute;right:8px;top:50%;transform:translateY(-50%);z-index:3;min-width:58px;height:34px;border:1px solid rgba(255,255,255,.24);background:#242424;color:#fff;font:800 12px Inter,sans-serif;padding:6px 10px;border-radius:8px;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.25);}
  .auth-password-toggle:hover{color:#fff;background:#333;border-color:rgba(255,255,255,.4);}

/* ===== STYLE BLOCK ===== */

.auth-remember{display:flex;align-items:center;gap:8px;margin-top:-2px;font-size:13px;color:#c9ced8;cursor:pointer;user-select:none;}
.auth-remember input{width:16px;height:16px;accent-color:#f5a623;cursor:pointer;}
.auth-forgot{display:block;width:100%;margin-top:6px;background:none;border:0;color:#f6b44d;font-size:13px;cursor:pointer;text-align:center;padding:8px;}
.auth-forgot:hover{text-decoration:underline;}
.auth-forgot:disabled{opacity:.5;cursor:wait;}

/* ===== STYLE BLOCK ===== */

/* Admin accounts bypass every VIP/content lock without changing non-admin behavior. */
body.admin-full-access .card[data-tier="vip"] .poster{filter:none!important;}
body.admin-full-access .card[data-tier="vip"] .vip-lock{display:none!important;}
body.admin-full-access .episode-locked .episode-vip-shade{display:none!important;}
body.admin-full-access .episode-locked .ep-play{opacity:1!important;}

/* ===== STYLE BLOCK ===== */

.admin-members{padding:46px 0 70px;background:#0e0e0e;border-top:1px solid var(--line)}.admin-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-end;margin-bottom:18px}.admin-head .kicker{font:700 11px 'JetBrains Mono';letter-spacing:.14em;color:var(--neon);margin-bottom:6px}.admin-head h2{font-size:34px;margin-bottom:6px}.admin-head p{color:#999;font-size:13px}.admin-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.admin-actions input{min-width:260px;background:#171717;border:1px solid #333;color:#fff;border-radius:5px;padding:10px 12px;outline:none}.members-status{min-height:24px;color:#aaa;font-size:13px;margin-bottom:10px}.members-table-wrap{overflow:auto;border:1px solid #2a2a2a;border-radius:8px;background:#111}.members-table{width:100%;border-collapse:collapse;min-width:760px}.members-table th,.members-table td{padding:13px 14px;border-bottom:1px solid #242424;text-align:left;font-size:13px;white-space:nowrap}.members-table th{font:700 11px 'JetBrains Mono';text-transform:uppercase;letter-spacing:.08em;color:#8e8e8e;background:#151515}.member-vip{color:var(--neon);font-weight:800}.member-free{color:#999;font-weight:700}.member-status-active{color:var(--neon);font-weight:700}@media(max-width:780px){.admin-head{align-items:stretch;flex-direction:column}.admin-actions input{min-width:0;flex:1;width:100%}}

/* ===== STYLE BLOCK ===== */

.admin-members{
    position:fixed !important;
    inset:0 !important;
    z-index:99999 !important;
    width:100vw !important;
    min-height:100vh !important;
    height:100vh !important;
    overflow-y:auto !important;
    padding:96px 0 40px !important;
    background:#080a0f !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    transform:translateZ(0);
    contain:layout paint style;
  }
  .admin-members .wrap{max-width:1400px;}
  .admin-members .admin-head{position:sticky;top:0;z-index:2;padding:18px 0;margin-bottom:18px;background:#080a0f;backdrop-filter:none !important;-webkit-backdrop-filter:none !important;}
  body.admin-members-page-open{overflow:hidden !important;}
  @media (max-width:700px){.admin-members{padding:78px 14px 28px !important}.admin-members .admin-actions{flex-wrap:wrap}.admin-members .admin-actions input{width:100%;}}

/* Five revenue periods fit across the desktop admin summary. */
.members-revenue{grid-template-columns:repeat(5,minmax(0,1fr));}
@media(max-width:700px){.members-revenue{grid-template-columns:repeat(2,minmax(0,1fr));}}

.members-revenue{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0 0 16px}.revenue-card{padding:13px 15px;border:1px solid rgba(255,255,255,.10);border-radius:10px;background:linear-gradient(145deg,#17191d,#101113)}.revenue-card span{display:block;color:#9aa1aa;font:700 10px 'JetBrains Mono';letter-spacing:.08em;text-transform:uppercase}.revenue-card strong{display:block;margin-top:7px;color:var(--neon);font-size:22px;line-height:1}.member-amount{color:#f6c15b;font-weight:800}@media(max-width:700px){.members-revenue{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.revenue-card{padding:11px 12px}.revenue-card strong{font-size:19px}}

/* ===== STYLE BLOCK ===== */

#pageDetailEpisodes .bunny-hover-preview{position:relative!important;overflow:hidden!important;background:#111!important}
#pageDetailEpisodes .bunny-hover-preview .static-episode-thumb{position:absolute!important;inset:0!important;z-index:1!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important;transition:opacity .18s ease!important}
#pageDetailEpisodes .bunny-hover-frame{position:absolute!important;inset:0!important;z-index:2!important;pointer-events:none!important;overflow:hidden!important}
#pageDetailEpisodes .bunny-hover-iframe{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;border:0!important;display:block!important;pointer-events:none!important;background:#000!important}
#pageDetailEpisodes .bunny-hover-preview.is-previewing .static-episode-thumb{opacity:0!important}
#pageDetailEpisodes .bunny-hover-preview .bunny-live-shade{z-index:3!important;pointer-events:none!important}
@media (hover:none),(max-width:700px){#pageDetailEpisodes .bunny-hover-frame{display:none!important}#pageDetailEpisodes .bunny-hover-preview.is-previewing .static-episode-thumb{opacity:1!important}}

/* ===== STYLE BLOCK ===== */

/* Episode list uses static Bunny thumbnails only; no preview iframe/video is loaded. */
  #pageDetailEpisodes .episode-thumb-wrap{position:relative!important;overflow:hidden!important}
  #pageDetailEpisodes .episode-thumb-wrap iframe.bunny-live-frame{display:none!important}
  #pageDetailEpisodes .static-episode-thumb{display:block!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important}
  #pageDetailEpisodes .episode-thumb-wrap .bunny-live-shade{display:none!important}

/* ===== STYLE BLOCK ===== */

@media(max-width:700px){#pageDetailEpisodes .episode-row{grid-template-columns:112px 150px minmax(0,1fr) 32px!important;align-items:center!important;}#pageDetailEpisodes .episode-thumb-wrap{width:112px!important;height:63px!important;min-width:112px!important;min-height:63px!important;max-width:112px!important;max-height:63px!important;flex:0 0 112px!important;aspect-ratio:16/9!important;overflow:hidden!important;}#pageDetailEpisodes .episode-thumb-wrap img{width:100%!important;height:100%!important;min-width:0!important;min-height:0!important;max-width:none!important;max-height:none!important;object-fit:cover!important;aspect-ratio:16/9!important;display:block!important;}}
@media(max-width:480px){#pageDetailEpisodes .episode-row{grid-template-columns:100px 126px minmax(0,1fr) 28px!important;gap:8px!important;}#pageDetailEpisodes .episode-thumb-wrap{width:100px!important;height:56px!important;min-width:100px!important;min-height:56px!important;max-width:100px!important;max-height:56px!important;flex-basis:100px!important;}}

/* ===== STYLE BLOCK ===== */

@media (hover:none) and (pointer:coarse){
  #pageDetailEpisodes .bunny-hover-frame{
    display:block!important;
  }
  #pageDetailEpisodes .bunny-hover-preview .bunny-hover-iframe{
    display:block!important;
    pointer-events:none!important;
  }
}

/* ===== STYLE BLOCK ===== */

.season-collection-card .poster{position:relative;}
  .season-collection-number{
    position:absolute;left:10px;bottom:10px;z-index:3;
    padding:5px 9px;border-radius:5px;
    background:rgba(0,0,0,.78);border:1px solid rgba(255,255,255,.16);
    color:#fff;font-family:'Anton',sans-serif;font-size:16px;letter-spacing:.03em;
  }
  .season-collection-badge{z-index:4!important;}
  .season-collection-card .card-info h4{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  @media(max-width:720px){
    .season-collection-number{font-size:13px;padding:4px 7px;left:8px;bottom:8px;}
  }

/* Standard season-card geometry: same portrait footprint as regular anime cards. */
#row-anime-seasons .season-collection-card{
  flex:0 0 190px!important;
  width:190px!important;
  min-width:190px!important;
  max-width:190px!important;
  box-sizing:border-box!important;
}
#row-anime-seasons .season-collection-card .poster{
  width:190px!important;
  height:265px!important;
  min-height:265px!important;
  max-height:265px!important;
  aspect-ratio:190/265!important;
  box-sizing:border-box!important;
}
@media(min-width:900px){
  #row-anime-seasons .season-collection-card{
    flex-basis:250px!important;width:250px!important;min-width:250px!important;max-width:250px!important;
  }
  #row-anime-seasons .season-collection-card .poster{
    width:250px!important;height:350px!important;min-height:350px!important;max-height:350px!important;
    aspect-ratio:250/350!important;
  }
}
@media(min-width:1400px){
  #row-anime-seasons .season-collection-card{
    flex-basis:280px!important;width:280px!important;min-width:280px!important;max-width:280px!important;
  }
  #row-anime-seasons .season-collection-card .poster{
    width:280px!important;height:392px!important;min-height:392px!important;max-height:392px!important;
    aspect-ratio:280/392!important;
  }
}

/* ===== STYLE BLOCK ===== */

#pageDetailEpisodes .bunny-hover-preview{
  position:relative!important;
}
#pageDetailEpisodes .bunny-hover-frame{
  position:absolute!important;
  inset:0!important;
  z-index:2!important;
  pointer-events:none!important;
  overflow:hidden!important;
  display:none!important;
}
#pageDetailEpisodes .bunny-hover-iframe{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  border:0!important;
  display:block!important;
  pointer-events:none!important;
  background:#000!important;
}
#pageDetailEpisodes .bunny-hover-preview.is-previewing .bunny-hover-frame{
  display:block!important;
}
#pageDetailEpisodes .bunny-hover-preview.is-previewing .static-episode-thumb{
  opacity:0!important;
}
@media (hover:hover) and (pointer:fine){
  #pageDetailEpisodes .bunny-hover-preview:hover .bunny-hover-frame{
    display:block!important;
  }
  #pageDetailEpisodes .bunny-hover-preview:hover .static-episode-thumb{
    opacity:0!important;
  }
}
@media (max-width:700px){
  #pageDetailEpisodes .episode-thumb-wrap,
  #pageDetailEpisodes .bunny-hover-preview{
    aspect-ratio:16/9!important;
  }
}

/* ===== STYLE BLOCK ===== */

/* Fill the thumbnail completely. Prevent Bunny iframe letterboxing/black side space. */
#pageDetailEpisodes .bunny-hover-frame{
  overflow:hidden!important;
  inset:0!important;
  display:none!important;
}
#pageDetailEpisodes .bunny-hover-preview.is-previewing .bunny-hover-frame{
  display:block!important;
}
#pageDetailEpisodes .bunny-hover-iframe{
  position:absolute!important;
  top:0!important;
  left:-2%!important;
  width:104%!important;
  height:100%!important;
  min-width:104%!important;
  max-width:none!important;
  border:0!important;
  transform:scale(1.04)!important;
  transform-origin:center center!important;
  background:#000!important;
}
@media(max-width:700px){
  #pageDetailEpisodes .bunny-hover-iframe{
    left:-3%!important;
    width:106%!important;
    min-width:106%!important;
    transform:scale(1.06)!important;
  }
}

/* ===== STYLE BLOCK ===== */

@media(max-width:700px){
  #pageDetailEpisodes .episode-row{
    grid-template-columns:140px minmax(0,1fr) 34px!important;
    min-height:90px!important;
    gap:10px!important;
    padding:10px!important;
  }
  #pageDetailEpisodes .episode-thumb-wrap{
    width:140px!important;
    height:79px!important;
    aspect-ratio:16/9!important;
    border-radius:9px!important;
    overflow:hidden!important;
  }
  #pageDetailEpisodes .bunny-hover-preview{
    width:140px!important;
    height:79px!important;
    aspect-ratio:16/9!important;
  }
  #pageDetailEpisodes .bunny-hover-frame,
  #pageDetailEpisodes .bunny-hover-iframe{
    width:100%!important;
    height:100%!important;
    left:0!important;
    top:0!important;
    min-width:0!important;
    max-width:none!important;
    transform:none!important;
    transform-origin:center center!important;
  }
  #pageDetailEpisodes .bunny-hover-iframe{
    object-fit:contain!important;
    background:#000!important;
  }
  #pageDetailEpisodes .ep-num{
    display:none!important;
  }
  #pageDetailEpisodes .ep-info h5{
    font-size:14px!important;
    line-height:1.25!important;
    margin-bottom:5px!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }
  #pageDetailEpisodes .ep-info span{
    font-size:12px!important;
    line-height:1.4!important;
    color:#aaa!important;
    display:block!important;
  }
}
@media(max-width:390px){
  #pageDetailEpisodes .episode-row{
    grid-template-columns:128px minmax(0,1fr) 30px!important;
  }
  #pageDetailEpisodes .episode-thumb-wrap,
  #pageDetailEpisodes .bunny-hover-preview{
    width:128px!important;
    height:72px!important;
  }
}

/* ===== STYLE BLOCK ===== */

#pageDetailEpisodes .bunny-hover-frame,
#pageDetailEpisodes .bunny-hover-iframe{
  display:none!important;
}
#pageDetailEpisodes .bunny-hover-preview .static-episode-thumb{
  opacity:1!important;
}
#pageDetailEpisodes .bunny-hover-preview{
  cursor:pointer!important;
}

/* ===== STYLE BLOCK ===== */

#pageDetailEpisodes .bunny-hover-frame,
#pageDetailEpisodes .bunny-hover-iframe,
#pageDetailEpisodes .bunny-live-frame,
#pageDetailEpisodes .bunny-live-shade{
  display:none!important;
}
#pageDetailEpisodes .bunny-hover-preview:hover .bunny-hover-frame,
#pageDetailEpisodes .bunny-hover-preview.is-previewing .bunny-hover-frame{
  display:none!important;
}
#pageDetailEpisodes .bunny-hover-preview .static-episode-thumb{
  opacity:1!important;
}

/* ===== STYLE BLOCK ===== */

/* FINAL: identical thumbnail image in normal, hover, focus, active, and touch states. */
#pageDetailEpisodes .bunny-hover-preview,
#pageDetailEpisodes .episode-thumb-wrap{
  position:relative!important;
  overflow:hidden!important;
}

/* Keep the real/static thumbnail as the only visible image. */
#pageDetailEpisodes .bunny-hover-preview .static-episode-thumb,
#pageDetailEpisodes .episode-thumb-wrap > img,
#pageDetailEpisodes .episode-thumb-wrap .episode-thumb{
  display:block!important;
  opacity:1!important;
  visibility:visible!important;
  filter:none!important;
  transform:none!important;
  object-fit:cover!important;
  object-position:center!important;
}

/* Never replace the thumbnail with Bunny/video on any interaction state. */
#pageDetailEpisodes .bunny-hover-frame,
#pageDetailEpisodes .bunny-hover-iframe,
#pageDetailEpisodes .bunny-live-frame,
#pageDetailEpisodes .bunny-live-shade{
  display:none!important;
  opacity:0!important;
  visibility:hidden!important;
}

/* Same image for hover/focus/active/touch. Only the card/container may animate. */
#pageDetailEpisodes .bunny-hover-preview:hover .static-episode-thumb,
#pageDetailEpisodes .bunny-hover-preview:focus .static-episode-thumb,
#pageDetailEpisodes .bunny-hover-preview:focus-visible .static-episode-thumb,
#pageDetailEpisodes .bunny-hover-preview:active .static-episode-thumb,
#pageDetailEpisodes .episode-row:hover .episode-thumb,
#pageDetailEpisodes .episode-row:focus .episode-thumb,
#pageDetailEpisodes .episode-row:active .episode-thumb{
  opacity:1!important;
  filter:none!important;
  transform:none!important;
  visibility:visible!important;
}

/* Prevent hover/touch styles from hiding or fading the static image. */
#pageDetailEpisodes .bunny-hover-preview.is-previewing .static-episode-thumb{
  opacity:1!important;
  visibility:visible!important;
}

/* ===== STYLE BLOCK ===== */

/* Mobile thumbnails: use the same 16:9 frame as desktop so the complete
   thumbnail fills the box without being vertically cropped or letterboxed. */
@media(max-width:700px){
  #pageDetailEpisodes .episode-thumb-wrap,
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview,
  #pageDetailEpisodes .static-episode-thumb{
    width:100%!important;
    height:auto!important;
    aspect-ratio:16/9!important;
    overflow:hidden!important;
    align-self:center!important;
    background:#111!important;
  }

  #pageDetailEpisodes .episode-thumb-wrap img,
  #pageDetailEpisodes .episode-thumb-wrap iframe,
  #pageDetailEpisodes .episode-thumb-wrap .bunny-preview-fallback,
  #pageDetailEpisodes .episode-thumb-wrap .bunny-live-frame,
  #pageDetailEpisodes .static-episode-thumb img{
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    object-fit:cover!important;
    object-position:center!important;
    display:block!important;
  }
}

@media(max-width:480px){
  #pageDetailEpisodes .episode-thumb-wrap,
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview,
  #pageDetailEpisodes .static-episode-thumb{
    width:100%!important;
    height:auto!important;
    aspect-ratio:16/9!important;
  }
}

/* ===== STYLE BLOCK ===== */

/* FINAL MOBILE THUMBNAIL FIX
   The red-marked area is the thumbnail column itself.  Make the thumbnail
   occupy that whole column instead of forcing a separate 16:9 mini-frame.
   "fill" is intentional here: it keeps the entire source image visible
   (no crop and no black bars) while matching the desktop-sized card area. */
@media (max-width:700px){
  #pageDetailEpisodes .episode-row{
    align-items:stretch!important;
  }

  #pageDetailEpisodes .episode-thumb-wrap,
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview,
  #pageDetailEpisodes .static-episode-thumb{
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    height:100%!important;
    min-height:0!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    align-self:stretch!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }

  #pageDetailEpisodes .episode-thumb-wrap > img,
  #pageDetailEpisodes .episode-thumb-wrap .static-episode-thumb,
  #pageDetailEpisodes .static-episode-thumb img,
  #pageDetailEpisodes .episode-thumb-wrap .bunny-preview-fallback,
  #pageDetailEpisodes .episode-thumb-wrap .bunny-live-frame,
  #pageDetailEpisodes .episode-thumb-wrap iframe{
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    max-width:none!important;
    max-height:none!important;
    object-fit:fill!important;
    object-position:center!important;
    transform:none!important;
    display:block!important;
  }
}

@media (max-width:480px){
  #pageDetailEpisodes .episode-thumb-wrap,
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview,
  #pageDetailEpisodes .static-episode-thumb{
    width:100%!important;
    height:100%!important;
    aspect-ratio:auto!important;
  }
}

/* ===== STYLE BLOCK ===== */

/* TV / console style spatial focus. Works with D-pad / Arrow keys and Enter. */
.tv-focusable.tv-spatial-focus,
.tv-focusable:focus-visible {
  outline:3px solid var(--neon)!important;
  outline-offset:4px!important;
  box-shadow:0 0 0 4px rgba(34,197,94,.16),0 10px 28px rgba(0,0,0,.35)!important;
  z-index:20;
}
body.tonflix-tv-mode .tv-focusable { scroll-margin:80px; }

/* Our outer player becomes the fullscreen surface, so the Bunny iframe remains
   inside a stable fullscreen container even when the ad/video inside changes. */
.video-modal.tonflix-player-fullscreen {
  width:100vw!important;
  height:100vh!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  border-radius:0!important;
  background:#000!important;
}
.video-modal.tonflix-player-fullscreen .video-modal-inner {
  width:100%!important;
  height:100%!important;
  aspect-ratio:auto!important;
  border-radius:0!important;
}
.video-modal.tonflix-player-fullscreen .video-title-bar {
  position:absolute!important;
  top:0;left:0;right:0;
  z-index:50;
}
.video-modal.tonflix-player-fullscreen .video-title-bar h3 {
  max-width:calc(100% - 64px);
}

@media(max-width:720px){
  .video-modal.tonflix-player-fullscreen .video-title-bar h3{font-size:15px!important;}
}

/* TV browsers generally have no useful hover state; make the focused card
   visually obvious without changing its thumbnail. */
@media (min-width:721px) and (pointer:coarse){
  body.tonflix-tv-mode .episode-row.tv-focusable.tv-spatial-focus,
  body.tonflix-tv-mode .season-tab.tv-focusable.tv-spatial-focus,
  body.tonflix-tv-mode .card.tv-focusable.tv-spatial-focus{
    transform:scale(1.025);
    transition:transform .12s ease,box-shadow .12s ease;
  }
}

/* ===== STYLE BLOCK ===== */

/* Unlocked episodes: large red circular play button centered over thumbnail.
   Locked episodes keep their lock treatment and do not get a play button. */
#pageDetailEpisodes .episode-thumb-wrap{position:relative!important;}
#pageDetailEpisodes .thumb-center-play{
  position:absolute!important;
  left:50%!important; top:50%!important;
  transform:translate(-50%,-50%)!important;
  width:64px!important; height:64px!important;
  border-radius:50%!important;
  background:#ff2d3d!important;
  box-shadow:0 6px 18px rgba(0,0,0,.45),0 0 0 2px rgba(255,255,255,.12)!important;
  display:flex!important; align-items:center!important; justify-content:center!important;
  z-index:4!important; pointer-events:none!important;
}
#pageDetailEpisodes .thumb-center-play::before{
  content:""!important;
  width:0!important; height:0!important;
  border-top:16px solid transparent!important;
  border-bottom:16px solid transparent!important;
  border-left:24px solid #fff!important;
  margin-left:5px!important;
}
#pageDetailEpisodes .episode-row:not(.episode-locked) .ep-play{
  visibility:hidden!important;
}
#pageDetailEpisodes .episode-row.episode-locked .thumb-center-play{display:none!important;}
@media(max-width:700px){
  #pageDetailEpisodes .thumb-center-play{width:54px!important;height:54px!important;}
  #pageDetailEpisodes .thumb-center-play::before{
    border-top-width:13px!important; border-bottom-width:13px!important; border-left-width:20px!important; margin-left:4px!important;
  }
}

/* ===== STYLE BLOCK ===== */

#tonflixVastPreroll{
  position:absolute;
  inset:0;
  z-index:50;
  display:none;
  background:#000;
}
#tonflixVastPreroll.is-open{display:block}

/* Soft anti-adblock notice shown only when a free-user ad request is blocked
   or returns no fill. It never appears for VIP/Admin accounts. */
#tonflixAdblockNotice{
  position:fixed;inset:0;z-index:400;display:none;align-items:center;justify-content:center;
  padding:20px;background:rgba(0,0,0,.78);font-family:inherit;pointer-events:auto;
}
#tonflixAdblockNotice.is-open{display:flex}
.tonflix-adblock-card{
  width:min(92vw,470px);padding:28px 26px;border:1px solid rgba(255,255,255,.14);
  border-radius:14px;background:#171717;color:#fff;text-align:center;
  box-shadow:0 20px 70px rgba(0,0,0,.6);pointer-events:auto;position:relative;
}
.tonflix-adblock-icon{
  width:42px;height:42px;margin:0 auto 12px;border-radius:50%;background:#ed1c24;
  display:grid;place-items:center;font-size:26px;font-weight:800;
}
.tonflix-adblock-card h3{margin:0 0 10px;font-size:22px}
.tonflix-adblock-card p{margin:0 auto 22px;color:#c9c9c9;line-height:1.5;font-size:15px}
.tonflix-adblock-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.tonflix-adblock-actions button{border:0;border-radius:7px;padding:11px 16px;font:inherit;font-weight:700;cursor:pointer;pointer-events:auto;position:relative;z-index:2}
.tonflix-adblock-retry{background:#ed1c24;color:#fff}
.tonflix-adblock-continue{background:#303030;color:#fff}
#tonflixVastPreroll .tonflix-vast-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:contain;
  background:#000;
}
#tonflixVastPreroll .tonflix-vast-ad-container{
  position:absolute;
  inset:0;
  pointer-events:auto;
}
#tonflixVastPreroll .tonflix-vast-status{
  position:absolute;
  left:16px;
  bottom:16px;
  z-index:3;
  display:none;
  padding:6px 10px;
  border-radius:8px;
  font-size:12px;
  background:rgba(0,0,0,.7);
  color:#fff;
}
@media(max-width:700px){
  #tonflixVastPreroll .tonflix-vast-status{
    left:10px;
    bottom:10px;
    font-size:11px;
  }
}

/* ===== STYLE BLOCK ===== */

#tonflixVastPreroll .tonflix-vast-countdown{
  position:absolute;
  left:14px;
  top:14px;
  z-index:1002;
  display:none;
  padding:7px 11px;
  border-radius:8px;
  background:rgba(0,0,0,.78);
  color:#fff;
  font:600 13px/1.2 Arial,sans-serif;
  box-shadow:0 2px 8px rgba(0,0,0,.35);
  pointer-events:none;
}
#videoModalCloseLegacyRemoved{
  position:absolute;
  top:12px;
  right:12px;
  z-index:1200;
  width:42px;
  height:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:0;
  border-radius:999px;
  background:rgba(0,0,0,.72);
  color:#fff;
  font-size:23px;
  line-height:1;
  cursor:pointer;
  box-shadow:0 2px 10px rgba(0,0,0,.35);
  transition:transform .15s ease, background .15s ease;
}
#videoModalCloseLegacyRemoved:hover{background:rgba(0,0,0,.88);transform:scale(1.04)}
#videoModalCloseLegacyRemoved:focus-visible{outline:3px solid #27ff66;outline-offset:2px}
@media(max-width:700px){
  #videoModalCloseLegacyRemoved{
    top:8px;
    right:8px;
    width:38px;
    height:38px;
    font-size:21px;
  }
  #tonflixVastPreroll .tonflix-vast-countdown{
    left:10px;
    top:10px;
    font-size:11px;
    padding:6px 9px;
  }
}

/* ===== STYLE BLOCK ===== */

#videoModalOverlay .video-modal{position:relative!important;}
#videoModalOverlay #tonflixVastPreroll{position:absolute!important;left:0!important;right:0!important;top:0!important;bottom:0!important;z-index:60!important;}
#videoModalOverlay #tonflixVastPreroll.is-open{display:block!important;}
#videoModalOverlay .video-modal-inner{position:absolute!important;left:0!important;right:0!important;top:48px!important;bottom:0!important;}

/* ===== STYLE BLOCK ===== */

#tonflixVastPreroll .tonflix-vast-status{
  position:absolute!important;
  top:12px!important;
  left:14px!important;
  bottom:auto!important;
  z-index:110!important;
  display:block!important;
  padding:6px 10px!important;
  border-radius:7px!important;
  font-size:12px!important;
  line-height:1.2!important;
  background:rgba(0,0,0,.68)!important;
  color:#fff!important;
  text-shadow:0 1px 4px rgba(0,0,0,.7)!important;
}
@media(max-width:720px){
  #tonflixVastPreroll .tonflix-vast-status{
    top:8px!important;
    left:8px!important;
    font-size:11px!important;
    padding:5px 8px!important;
  }
}

/* ===== STYLE BLOCK ===== */

/* The normal modal keeps its header above the player.
   In fullscreen the video must start at y=0 behind the transparent/hidden
   title overlay. The old top:48px created the thin black strip the user saw. */
.video-modal.tonflix-player-fullscreen .video-modal-inner{
  position:absolute!important;
  left:0!important;
  right:0!important;
  top:0!important;
  bottom:0!important;
  width:100%!important;
  height:100%!important;
  z-index:10!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  pointer-events:auto!important;
  border:0!important;
  border-radius:0!important;
}
.video-modal.tonflix-player-fullscreen .video-modal-inner iframe,
.video-modal.tonflix-player-fullscreen .video-modal-inner video{
  position:absolute!important;
  inset:0!important;
  z-index:11!important;
  width:100%!important;
  height:100%!important;
  border:0!important;
  pointer-events:auto!important;
}

/* Title overlay stays above the iframe only when visible.
   When hidden it must not intercept clicks/taps/remote focus. */
.video-modal.tonflix-player-fullscreen .video-title-bar{
  z-index:100!important;
  border-bottom:0!important;
}
.video-modal.tonflix-player-fullscreen:not(.player-controls-visible) .video-title-bar{
  pointer-events:none!important;
}
.video-modal.tonflix-player-fullscreen.player-controls-visible .video-title-bar{
  pointer-events:auto!important;
}

/* Keep the close button clickable while controls are visible. */
.video-modal.tonflix-player-fullscreen.player-controls-visible .video-close{
  pointer-events:auto!important;
  z-index:101!important;
}

/* The ad countdown sits above the ad/video, but never captures pointer input. */
#tonflixVastPreroll .tonflix-vast-countdown{
  pointer-events:none!important;
}

/* ===== STYLE BLOCK ===== */

#tonflixVastPreroll .tonflix-vast-status{
  position:absolute!important;
  top:12px!important;
  left:14px!important;
  bottom:auto!important;
  z-index:230!important;
  pointer-events:none!important;
}

/* ===== STYLE BLOCK ===== */

/* Native fullscreen root must itself occupy the full viewport. */
#videoModalOverlay .video-modal.tonflix-player-fullscreen{
  position:fixed!important;
  inset:0!important;
  width:100vw!important;
  height:100vh!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  background:#000!important;
  border:0!important;
  border-radius:0!important;
  overflow:hidden!important;
}
#videoModalOverlay .video-modal.tonflix-player-fullscreen .video-modal-inner{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  aspect-ratio:auto!important;
  margin:0!important;
  padding:0!important;
  background:#000!important;
  border:0!important;
  border-radius:0!important;
  overflow:hidden!important;
}
#videoModalOverlay .video-modal.tonflix-player-fullscreen .video-modal-inner iframe,
#videoModalOverlay .video-modal.tonflix-player-fullscreen .video-modal-inner video{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
}
#videoModalOverlay:fullscreen{
  padding:0!important;
  margin:0!important;
}

/* ===== STYLE BLOCK ===== */

#videoModalInner .tonflix-bunny-prewarm{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  border:0!important;
  background:#000!important;
  z-index:10!important;
}
#videoModalInner .tonflix-bunny-prewarm.is-under-ad{
  opacity:0!important;
  pointer-events:none!important;
}
#videoModalInner .tonflix-bunny-prewarm.is-live{
  opacity:1!important;
  pointer-events:auto!important;
}

/* ===== STYLE BLOCK ===== */

#tonflixVastPreroll .tonflix-vast-status{
  position:absolute!important;
  right:18px!important;
  left:auto!important;
  bottom:18px!important;
  top:auto!important;
  z-index:240!important;
  display:block!important;
  pointer-events:none!important;
  padding:9px 14px!important;
  border-radius:9px!important;
  font-size:16px!important;
  line-height:1.25!important;
  font-weight:700!important;
  letter-spacing:.1px!important;
  background:rgba(0,0,0,.74)!important;
  color:#fff!important;
  text-shadow:0 2px 7px rgba(0,0,0,.75)!important;
  box-shadow:0 3px 14px rgba(0,0,0,.28)!important;
}
@media(max-width:720px){
  #tonflixVastPreroll .tonflix-vast-status{
    right:10px!important;
    left:auto!important;
    bottom:10px!important;
    padding:8px 11px!important;
    font-size:14px!important;
  }
}

/* ===== STYLE BLOCK ===== */

/* Desktop profile avatar in the top-right account area. */
.tonflix-desktop-profile-wrap{
  display:none;
  position:relative;
  align-items:center;
  margin-left:2px;
}
body.auth-signed-in .tonflix-desktop-profile-wrap{display:inline-flex;}
.tonflix-profile-avatar-btn{
  position:relative;
  width:42px;
  height:42px;
  padding:0;
  border:1px solid rgba(255,255,255,.18);
  border-radius:50%;
  overflow:hidden;
  background:linear-gradient(145deg,#b7000f,#5e0008);
  color:#fff;
  display:grid;
  place-items:center;
  font-weight:900;
  cursor:pointer;
  box-shadow:0 4px 14px rgba(0,0,0,.28);
}
.tonflix-profile-avatar-btn img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:none;
}
.tonflix-profile-avatar-fallback{
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
}
.tonflix-profile-camera{
  position:absolute;
  right:-1px;
  bottom:-1px;
  width:17px;
  height:17px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:#111;
  border:1px solid rgba(255,255,255,.18);
  color:#fff;
  font-size:9px;
  pointer-events:none;
}
body.admin-full-access .tonflix-profile-avatar-btn{
  border-color:rgba(168,255,0,.65);
  box-shadow:0 0 0 2px rgba(168,255,0,.08),0 4px 14px rgba(0,0,0,.28);
}

/* Mobile profile image + change button. */
#mobileAccountCard{
  position:relative;
}
.mobile-account-avatar{
  position:relative;
  overflow:hidden;
  cursor:pointer;
}
.mobile-account-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:none;
}
.mobile-account-avatar .mobile-account-avatar-fallback{
  display:grid;
  width:100%;
  height:100%;
  place-items:center;
}
.mobile-profile-camera{
  position:absolute;
  right:-1px;
  bottom:-1px;
  width:18px;
  height:18px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:#111;
  border:1px solid rgba(255,255,255,.20);
  color:#fff;
  font-size:9px;
  pointer-events:none;
}
.mobile-profile-change{
  width:100%;
  margin-top:8px;
  padding:8px 10px;
  border-radius:7px;
  border:1px solid rgba(255,255,255,.14);
  background:#171717;
  color:#ddd;
  font-size:11px;
  font-weight:800;
  cursor:pointer;
}
.mobile-profile-change:hover{
  border-color:rgba(168,255,0,.55);
  color:#A8FF00;
}
#tonflixProfileImageInput{display:none!important;}

@media(max-width:720px){
  .tonflix-desktop-profile-wrap{display:none!important;}
  .mobile-account-card{
    flex-wrap:wrap;
  }
  .mobile-account-card .mobile-account-info{
    min-width:0;
  }
}
@media(min-width:721px){
  .mobile-profile-change,
  #mobileProfileImageInputLabel{display:none!important;}
}

/* ===== STYLE BLOCK ===== */

@media(min-width:721px){
  nav .nav-right{gap:10px!important;}
  nav .tonflix-desktop-profile-wrap{order:999!important;margin-left:2px!important;}
  nav .tonflix-desktop-profile-wrap + *{order:1000!important;}
}

/* ===== STYLE BLOCK ===== */

/* Tagalog language badge on every homepage hero slide. */
.hero .hero-tagalog-badge{
  position:absolute;
  top:24px;
  left:30px;
  z-index:5;
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:10px 16px;
  border-radius:999px;
  background:rgba(5,8,10,.78);
  border:1px solid rgba(168,255,0,.65);
  box-shadow:0 8px 24px rgba(0,0,0,.35), 0 0 0 1px rgba(255,255,255,.04) inset;
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  color:#fff;
  font:900 15px/1 'Inter',sans-serif;
  letter-spacing:.06em;
  text-transform:uppercase;
  white-space:nowrap;
}
.hero .hero-tagalog-badge .flag{
  font-size:24px;
  line-height:1;
  filter:drop-shadow(0 1px 3px rgba(0,0,0,.5));
}
.hero .hero-tagalog-badge .label{
  color:#A8FF00;
}
@media(max-width:720px){
  .hero .hero-tagalog-badge{
    top:18px;
    left:18px;
    padding:9px 13px;
    gap:8px;
    font-size:13px;
  }
  .hero .hero-tagalog-badge .flag{font-size:21px;}
}

/* ===== STYLE BLOCK ===== */

.hero .hero-tagalog-badge{
  display:inline-flex!important;align-items:center!important;gap:10px!important;
  padding:10px 15px!important;border-radius:8px!important;
  font-size:15px!important;font-weight:900!important;letter-spacing:.06em!important;
}
.hero .hero-tagalog-badge .flag-svg{
  width:36px!important;height:24px!important;display:block!important;
  object-fit:cover!important;border-radius:2px!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.4)!important;
}
@media(max-width:720px){
  .hero .hero-tagalog-badge{padding:8px 12px!important;font-size:13px!important;gap:8px!important;}
  .hero .hero-tagalog-badge .flag-svg{width:31px!important;height:21px!important;}
}

/* ===== STYLE BLOCK ===== */

#detailPage .detail-banner{position:relative!important;}
.detail-tagalog-badge{
  position:absolute;top:18px;left:18px;z-index:20;
  display:none;align-items:center;gap:10px;
  padding:10px 15px;border-radius:8px;
  background:rgba(0,0,0,.72);border:1px solid rgba(255,255,255,.22);
  color:#fff;font:900 15px Inter,sans-serif;letter-spacing:.06em;
  box-shadow:0 10px 30px rgba(0,0,0,.35);backdrop-filter:blur(5px);
}
.detail-tagalog-badge .detail-flag{width:38px;height:25px;object-fit:cover;border-radius:2px;display:block;box-shadow:0 0 0 1px rgba(255,255,255,.45);}
@media(max-width:720px){
  .detail-tagalog-badge{top:12px;left:12px;padding:8px 12px;font-size:13px;gap:8px;}
  .detail-tagalog-badge .detail-flag{width:32px;height:21px;}
}

/* ===== STYLE BLOCK ===== */

.tonflix-admin-media-btn{border-color:rgba(0,255,170,.35)!important;color:#A8FF00!important}
.tonflix-admin-media-overlay{position:fixed;inset:0;z-index:10050;display:none;align-items:center;justify-content:center;padding:24px;background:rgba(0,0,0,.78);backdrop-filter:blur(8px)}
.tonflix-admin-media-overlay.open{display:flex}
.tonflix-admin-media-modal{width:min(900px,100%);max-height:calc(100vh - 48px);overflow:auto;background:#0f1115;border:1px solid rgba(255,255,255,.12);border-radius:18px;box-shadow:0 28px 100px rgba(0,0,0,.7);padding:24px;color:#fff}
.tonflix-admin-media-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:20px}
.tonflix-admin-media-head h2{margin:3px 0 5px;font-size:28px}
.tonflix-admin-media-head p{margin:0;color:#9ea6b2;font-size:13px;line-height:1.45}
.tonflix-admin-media-kicker{font-size:10px;letter-spacing:.14em;color:#39f5a7;font-weight:900}
.tonflix-admin-media-close{width:40px;height:40px;border:1px solid rgba(255,255,255,.13);border-radius:50%;background:#181b21;color:#fff;font-size:18px;cursor:pointer}
.tonflix-admin-media-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}
.tonflix-admin-media-field{display:grid;gap:7px}
.tonflix-admin-media-field span{font-size:11px;color:#9ea6b2;font-weight:800;text-transform:uppercase;letter-spacing:.06em}
.tonflix-admin-media-field select{width:100%;padding:12px 13px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:#080a0d;color:#fff;outline:none}
.tonflix-admin-media-preview-wrap{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:15px 0}
.tonflix-admin-media-label{font-size:11px;color:#9ea6b2;font-weight:800;margin-bottom:7px}
.tonflix-admin-media-preview{height:190px;border:1px solid rgba(255,255,255,.12);border-radius:12px;background:#080a0d;overflow:hidden;display:flex;align-items:center;justify-content:center;color:#626b78;font-size:13px}
.tonflix-admin-media-preview img{display:block;width:100%;height:100%;object-fit:cover}
.tonflix-admin-media-upload{display:flex;align-items:center;gap:12px;border:1px dashed rgba(255,255,255,.22);border-radius:12px;padding:14px 16px;cursor:pointer;background:#11141a}
.tonflix-admin-media-upload:hover{border-color:#39f5a7;background:#131820}
.tonflix-admin-media-upload-icon{font-size:28px;line-height:1;color:#39f5a7}
.tonflix-admin-media-upload strong{font-size:13px}.tonflix-admin-media-upload small{color:#8b95a3;margin-left:auto;text-align:right}
.tonflix-admin-media-status{min-height:22px;margin:12px 0;color:#9ea6b2;font-size:12px;line-height:1.4}
.tonflix-admin-media-status.success{color:#A8FF00}.tonflix-admin-media-status.error{color:#ff9f9f}
.tonflix-admin-media-actions{display:flex;justify-content:flex-end;gap:10px}
.tonflix-admin-media-secondary,.tonflix-admin-media-primary{border-radius:10px;padding:11px 16px;font-weight:800;cursor:pointer}
.tonflix-admin-media-secondary{border:1px solid rgba(255,255,255,.12);background:#17191e;color:#fff}
.tonflix-admin-media-primary{border:0;background:#e50914;color:#fff}.tonflix-admin-media-primary:disabled{opacity:.45;cursor:not-allowed}
.tonflix-admin-media-help{margin-top:14px;color:#8f98a5;font-size:11px}.tonflix-admin-media-help code{display:block;margin-top:7px;padding:8px;border-radius:8px;background:#080a0d;color:#b7c0cc;overflow:auto}
@media(max-width:720px){.tonflix-admin-media-overlay{padding:10px}.tonflix-admin-media-modal{max-height:calc(100vh - 20px);padding:16px;border-radius:15px}.tonflix-admin-media-grid,.tonflix-admin-media-preview-wrap{grid-template-columns:1fr}.tonflix-admin-media-preview{height:150px}.tonflix-admin-media-upload{align-items:flex-start;flex-wrap:wrap}.tonflix-admin-media-upload small{width:100%;margin-left:40px;text-align:left}.tonflix-admin-media-actions{position:sticky;bottom:0;background:#0f1115;padding-top:10px}.tonflix-admin-media-primary,.tonflix-admin-media-secondary{flex:1}}

/* ===== STYLE BLOCK ===== */

.favorite-btn{
    border:1px solid rgba(255,255,255,.18)!important;
    background:rgba(255,255,255,.08)!important;
    color:#fff!important;
  }
  .favorite-btn.is-favorite{
    border-color:rgba(245,197,66,.65)!important;
    color:#f5c842!important;
    background:rgba(245,197,66,.10)!important;
  }
  .rank-card .card-info h4{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

/* ===== STYLE BLOCK ===== */

@media(max-width:720px){
  #detailPage[data-dbz-hero-restored="1"] #detailCover{
    display:none!important;
    width:0!important;
    height:0!important;
    min-height:0!important;
    padding:0!important;
    margin:0!important;
    overflow:hidden!important;
    background:none!important;
  }
  #detailPage[data-dbz-hero-restored="1"] .detail-banner-main{
    display:block!important;
    width:100%!important;
    min-height:0!important;
    height:auto!important;
    overflow:visible!important;
    background:#090909!important;
  }
  #detailPage[data-dbz-hero-restored="1"] #detailArt{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:16/9!important;
    display:block!important;
    opacity:1!important;
    visibility:visible!important;
    background-size:cover!important;
    background-position:center!important;
    background-repeat:no-repeat!important;
  }
  #detailPage[data-dbz-hero-restored="1"] .detail-banner-main:after{
    display:none!important;
  }
}

/* ===== STYLE BLOCK ===== */

#mobileAccountVipExpiry{
  display:none;
  margin-top:3px;
  color:#9ea3aa!important;
  font-size:10.5px!important;
  line-height:1.25!important;
  font-weight:700!important;
  letter-spacing:.01em!important;
}

/* ===== STYLE BLOCK ===== */

.english-badge{
    display:flex!important;align-items:center;gap:4px;
  }
  .english-badge img{width:22px!important;height:15px!important;object-fit:cover!important;border-radius:2px!important;}
  .single-movie-player-card{
    width:100%;max-width:1100px;margin:18px auto 0;
    background:linear-gradient(160deg,#15181d,#0b0d10);
    border:1px solid rgba(255,255,255,.10);border-radius:14px;padding:14px;
    box-shadow:0 18px 45px rgba(0,0,0,.28);
  }
  .single-movie-player-label{
    display:flex;align-items:center;gap:7px;color:var(--neon);
    font:800 11px 'JetBrains Mono',monospace;letter-spacing:.08em;
    text-transform:uppercase;margin:0 0 10px;
  }
  .single-movie-player-label img{width:24px;height:16px;object-fit:cover;border-radius:2px;}
  .single-movie-player{position:relative;width:100%;aspect-ratio:16/9;background:#000;border-radius:10px;overflow:hidden;}
  .single-movie-player iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;}
  @media(max-width:700px){
    .single-movie-player-card{margin-top:14px;padding:10px;border-radius:12px;}
    .single-movie-player-label{font-size:9.5px;}
  }

/* ===== STYLE BLOCK ===== */

/* MOBILE DETAIL V6 — compact split layout matching the supplied reference.
   Cover left, detail content right, with the action buttons kept on the right. */
@media (max-width:720px){
  .detail-banner{
    position:relative!important;
    display:grid!important;
    grid-template-columns:44% 56%!important;
    grid-template-rows:1fr!important;
    min-height:490px!important;
    height:490px!important;
    max-height:490px!important;
    overflow:hidden!important;
    background:#090909!important;
  }
  .detail-cover{
    grid-column:1!important; grid-row:1!important;
    width:100%!important; height:100%!important;
    min-height:100%!important; padding:0!important;
    border:0!important; border-radius:0!important;
    background-size:contain!important;
    background-position:center top!important;
    background-repeat:no-repeat!important;
    background-color:#050505!important;
  }
  .detail-cover:after,.detail-cover-title{display:none!important;}
  .detail-banner-main{
    grid-column:2!important; grid-row:1!important;
    height:100%!important; min-height:0!important; overflow:hidden!important;
  }
  .detail-content{
    position:static!important; width:100%!important; height:100%!important;
    padding:28px 10px 18px!important; box-sizing:border-box!important;
  }
  .detail-copy h1{font-size:31px!important;line-height:.94!important;margin-bottom:14px!important;}
  .detail-copy p{font-size:14px!important;line-height:1.5!important;margin-bottom:16px!important;}
  .detail-meta{font-size:10px!important;line-height:1.45!important;margin-bottom:8px!important;}
  .detail-actions{
    position:static!important; width:100%!important;
    padding:0!important; margin-top:8px!important;
    display:flex!important; flex-direction:column!important; gap:8px!important;
  }
  .detail-actions .btn,.detail-actions button,.detail-actions a{
    width:100%!important; min-width:0!important; box-sizing:border-box!important;
    white-space:nowrap!important; text-align:center!important;
    padding:11px 4px!important; font-size:11px!important;
  }
  #pageDetailEpisodes .episode-row{
    grid-template-columns:112px minmax(0,1fr) 28px!important;
    min-height:112px!important; gap:9px!important; padding:9px!important;
  }
  #pageDetailEpisodes .episode-thumb-wrap{
    width:112px!important; height:92px!important; aspect-ratio:auto!important;
  }
  #pageDetailEpisodes .ep-num{font-size:20px!important;gap:4px!important;}
  #pageDetailEpisodes .ep-num .episode-label{font-size:20px!important;}
  #pageDetailEpisodes .ep-info h5{font-size:16px!important;line-height:1.12!important;white-space:normal!important;overflow:hidden!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;}
  #pageDetailEpisodes .ep-duration{font-size:12px!important;}
}
@media(max-width:480px){
  .detail-banner{grid-template-columns:43% 57%!important;min-height:500px!important;height:500px!important;max-height:500px!important;}
  .detail-content{padding:26px 9px 14px!important;}
  .detail-copy h1{font-size:28px!important;}
  .detail-copy p{font-size:13px!important;line-height:1.45!important;}
  #pageDetailEpisodes .episode-row{grid-template-columns:110px minmax(0,1fr) 26px!important;}
  #pageDetailEpisodes .episode-thumb-wrap{width:110px!important;height:88px!important;}
}
#detailCover{border-radius:0!important;}

/* ===== STYLE BLOCK ===== */

/* V7 MOBILE PREVIEW — match the supplied phone reference:
   poster/hero image on TOP, then banner + text + actions underneath. */
@media (max-width:720px){
  .detail-banner{
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:visible!important;
    background:#000!important;
  }
  .detail-cover{
    display:block!important;
    width:100%!important;
    height:auto!important;
    aspect-ratio:16/9!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    background-size:cover!important;
    background-position:center center!important;
    background-repeat:no-repeat!important;
    background-color:#000!important;
  }
  .detail-cover:after,.detail-cover-title{display:none!important;}
  .detail-banner-main{
    display:block!important;
    position:relative!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    overflow:hidden!important;
    background:#000!important;
  }
  .detail-art{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    background-size:cover!important;
    background-position:center!important;
  }
  .detail-banner-main:after{
    background:linear-gradient(180deg,rgba(0,0,0,.88),rgba(0,0,0,.78) 48%,rgba(0,0,0,.94))!important;
  }
  .detail-content{
    position:relative!important;
    z-index:2!important;
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    box-sizing:border-box!important;
    padding:18px 16px 18px!important;
  }
  .detail-copy{width:100%!important;max-width:none!important;}
  .detail-meta{
    font-size:10px!important;
    line-height:1.45!important;
    margin-bottom:8px!important;
  }
  .detail-copy h1,#pageDetailTitle{
    font-size:clamp(27px,8vw,36px)!important;
    line-height:.98!important;
    margin:4px 0 12px!important;
  }
  .detail-desc{
    font-size:13px!important;
    line-height:1.45!important;
    margin:0 0 15px!important;
    -webkit-line-clamp:7!important;
  }
  .detail-actions{
    width:100%!important;
    display:flex!important;
    flex-direction:column!important;
    gap:8px!important;
    margin:0!important;
  }
  .detail-actions .btn{
    width:100%!important;
    min-height:38px!important;
    padding:9px 8px!important;
    font-size:12px!important;
    justify-content:center!important;
  }
  .detail-body{padding:12px 8px 40px!important;}

  /* Episode cards: Bunny Preview Animation WebP in a clean 16:9 window. */
  #pageDetailEpisodes .episode-row{
    grid-template-columns:minmax(128px,43%) minmax(0,1fr) 26px!important;
    column-gap:9px!important;
    padding:8px!important;
    min-height:0!important;
  }
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview{
    width:100%!important;
    height:auto!important;
    aspect-ratio:16/9!important;
    overflow:hidden!important;
    background:#000!important;
    border:0!important;
    border-radius:0!important;
  }
  /* Crop the Bunny player's own letterbox and bias the crop slightly LEFT,
     so the remaining black strip on the left edge disappears. */
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview .bunny-live-frame{
    width:150%!important;
    height:150%!important;
    left:-31%!important;
    top:-25%!important;
    right:auto!important;
    bottom:auto!important;
    transform:none!important;
    max-width:none!important;
    max-height:none!important;
    margin:0!important;
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
  }
}

/* FINAL IPPO TAGALOG BADGE PARITY
   Use the exact same geometry as the normalized AOT/DBZ card badges. */
#row-anime .card[data-title="Knock Out: IPPO"] .poster > .ippo-tagalog-badge-final,
#row-tagalog-anime .card[data-title="Knock Out: IPPO"] .poster > .ippo-tagalog-badge-final{
  display:flex!important;
  position:absolute!important;
  top:9px!important;
  right:9px!important;
  left:auto!important;
  bottom:auto!important;
  align-items:center!important;
  gap:4px!important;
  padding:3px 7px!important;
  border-radius:3px!important;
  font-size:9.5px!important;
  line-height:1!important;
}
#row-anime .card[data-title="Knock Out: IPPO"] .poster > .ippo-tagalog-badge-final img,
#row-tagalog-anime .card[data-title="Knock Out: IPPO"] .poster > .ippo-tagalog-badge-final img{
  display:block!important;
  width:22px!important;
  height:15px!important;
  object-fit:cover!important;
  flex:0 0 auto!important;
}
@media(max-width:720px){
  #row-anime .card[data-title="Knock Out: IPPO"] .poster > .ippo-tagalog-badge-final,
  #row-tagalog-anime .card[data-title="Knock Out: IPPO"] .poster > .ippo-tagalog-badge-final{
    top:7px!important;
    right:7px!important;
    padding:3px 6px!important;
    font-size:8.5px!important;
  }
  #row-anime .card[data-title="Knock Out: IPPO"] .poster > .ippo-tagalog-badge-final img,
  #row-tagalog-anime .card[data-title="Knock Out: IPPO"] .poster > .ippo-tagalog-badge-final img{
    width:22px!important;
    height:15px!important;
  }
}

/* Free-user player: keep the ad and Bunny player centered in a stable 16:9 frame.
   VIP/admin playback still uses .tonflix-player-fullscreen and is unaffected. */
#videoModalOverlay.open{
  align-items:center!important;
  justify-content:center!important;
  padding:clamp(10px,2vw,24px)!important;
  overflow:hidden!important;
}
#videoModalOverlay .video-modal:not(.tonflix-player-fullscreen){
  width:min(94vw,1280px,calc((100dvh - 32px) * 1.7778))!important;
  height:auto!important;
  max-width:1280px!important;
  max-height:calc(100dvh - 32px)!important;
  aspect-ratio:16 / 9!important;
  margin:auto!important;
  padding:0!important;
  overflow:hidden!important;
  background:#000!important;
  border-radius:10px!important;
  box-shadow:0 24px 80px rgba(0,0,0,.65)!important;
}
#videoModalOverlay .video-modal:not(.tonflix-player-fullscreen) .video-modal-inner{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  aspect-ratio:auto!important;
  border:0!important;
  border-radius:inherit!important;
}
#videoModalOverlay .video-modal:not(.tonflix-player-fullscreen) #tonflixVastPreroll{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
}
@media(max-width:720px){
  #videoModalOverlay.open{
    align-items:center!important;
    justify-content:center!important;
    padding:8px!important;
    overflow:hidden!important;
  }
  #videoModalOverlay .video-modal:not(.tonflix-player-fullscreen){
    width:min(calc(100vw - 16px),calc((100dvh - 16px) * 1.7778))!important;
    max-height:calc(100dvh - 16px)!important;
    margin:auto!important;
    border-radius:7px!important;
  }
}
@media (max-width:480px){
  .detail-cover{aspect-ratio:16/9!important;}
  .detail-content{padding:17px 15px 18px!important;}
  .detail-meta{font-size:9px!important;}
  .detail-copy h1,#pageDetailTitle{font-size:29px!important;}
  .detail-desc{font-size:12px!important;line-height:1.45!important;}
  .detail-actions .btn{min-height:37px!important;font-size:11.5px!important;}
  #pageDetailEpisodes .episode-row{
    grid-template-columns:minmax(124px,43%) minmax(0,1fr) 25px!important;
    column-gap:8px!important;
  }
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview .bunny-live-frame{
    width:154%!important;
    height:154%!important;
    left:-34%!important;
    top:-27%!important;
  }
}

/* ===== STYLE BLOCK ===== */

@media(max-width:720px){
  #detailCover{aspect-ratio:16/9!important;height:auto!important;width:100%!important;background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important;image-rendering:auto!important}
  #detailCover:after{display:none!important}
}

/* ===== STYLE BLOCK ===== */

/* V15: full banner, no crop + external YouTube trailer button + season click returns top */
#detailPage .detail-banner{width:100%!important;overflow:visible!important;background:#000!important;}
#detailPage .detail-banner-main{width:100%!important;min-height:0!important;aspect-ratio:16/9!important;overflow:hidden!important;background:#000!important;}
#detailPage .detail-art{inset:0!important;width:100%!important;height:100%!important;background-size:100% 100%!important;background-position:center!important;background-repeat:no-repeat!important;}
#detailPage .detail-content{width:100%!important;box-sizing:border-box!important;}
#detailPage .official-trailer-link{background:#171717!important;color:#fff!important;border:1px solid rgba(255,255,255,.22)!important;text-decoration:none!important;}
@media(max-width:720px){
  #detailPage .detail-banner-main{aspect-ratio:auto!important;min-height:0!important;height:auto!important;overflow:visible!important;}
  #detailPage .detail-art{display:none!important;}
  #detailPage .detail-cover{display:block!important;width:100%!important;height:auto!important;min-height:0!important;aspect-ratio:auto!important;overflow:hidden!important;padding:0!important;margin:0!important;background:#000!important;}
  #detailPage .detail-banner-img{display:block!important;width:100%!important;height:auto!important;max-width:100%!important;max-height:none!important;object-fit:contain!important;object-position:center top!important;}
  #detailPage .detail-content{background:#090909!important;padding:18px 16px 28px!important;}
  #pageDetailTrailerBtn{width:100%!important;box-sizing:border-box!important;justify-content:center!important;}
}

/* ===== STYLE BLOCK ===== */

/* FINAL: eliminate desktop black side gaps. Desktop crops the cover/banner to fill the entire 16:9 hero. Mobile keeps the complete image. */
@media (min-width:721px){
  #detailPage .detail-banner{
    width:100%!important;
    min-height:0!important;
    height:auto!important;
    overflow:hidden!important;
    background:#000!important;
  }
  #detailPage .detail-banner-main{
    width:100%!important;
    min-height:0!important;
    aspect-ratio:16/9!important;
    height:auto!important;
    overflow:hidden!important;
    background:#000!important;
  }
  #detailPage .detail-art{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    background-size:cover!important;
    background-position:center center!important;
    background-repeat:no-repeat!important;
  }
}
@media (max-width:720px){
  #detailPage .detail-banner{
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    overflow:visible!important;
    background:#000!important;
  }
  #detailPage .detail-cover{
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    padding:0!important;
    margin:0!important;
    overflow:hidden!important;
    background-size:100% auto!important;
    background-position:center top!important;
    background-repeat:no-repeat!important;
  }
  #detailPage .detail-banner-img{
    display:block!important;
    width:100%!important;
    height:auto!important;
    max-width:100%!important;
    max-height:none!important;
    object-fit:contain!important;
    object-position:center top!important;
  }
}

/* ===== STYLE BLOCK ===== */

/* DBZ Seasons 2, 4, 5, 6 and 7: widescreen artwork fills the desktop hero. */
@media (min-width:721px){
  #detailPage .detail-banner-main,
  #detailPage .detail-art,
  #detailPage #detailBannerImg{
    width:100%!important;
    min-width:100%!important;
    max-width:none!important;
  }
  #detailPage .detail-art{
    background-size:cover!important;
    background-position:center center!important;
    background-repeat:no-repeat!important;
  }
  #detailPage #detailBannerImg{
    height:100%!important;
    object-fit:cover!important;
    object-position:center center!important;
  }
}
@media (max-width:720px){
  #detailPage #detailBannerImg{
    width:100%!important;
    height:auto!important;
    object-fit:contain!important;
    object-position:center center!important;
  }
}

/* ===== STYLE BLOCK ===== */

/* Final DBZ banner reliability fix:
   desktop = full 16:9 hero crop, mobile = complete image.
   Home/card cover images are intentionally untouched. */
@media (min-width:721px){
  #detailPage .detail-banner-main{
    width:100%!important;
    aspect-ratio:16/9!important;
    min-height:0!important;
    height:auto!important;
    overflow:hidden!important;
    background:#050505!important;
  }
  #detailPage #detailBannerImg{
    display:block!important;
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    max-height:none!important;
    object-fit:cover!important;
    object-position:center center!important;
  }
}
@media (max-width:720px){
  #detailPage .detail-banner-main{
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    overflow:visible!important;
    background:#090909!important;
  }
  #detailPage #detailBannerImg{
    display:block!important;
    width:100%!important;
    height:auto!important;
    max-width:100%!important;
    max-height:none!important;
    object-fit:contain!important;
    object-position:center top!important;
  }
}

/* ===== STYLE BLOCK ===== */

/* FINAL OVERRIDE: Dragon Ball Z Season 2 banner only. */

/* ===== STYLE BLOCK ===== */

/* FINAL OVERRIDE: Dragon Ball Z Season 2 banner only */

/* ===== STYLE BLOCK ===== */

#detailPage .detail-banner-img{display:block!important;width:100%!important;max-width:100%!important;height:auto!important;object-position:center top!important;}
@media(min-width:721px){#detailPage .detail-banner-main{aspect-ratio:16/9!important;overflow:hidden!important;}#detailPage .detail-banner-img{height:100%!important;object-fit:cover!important;}}
@media(max-width:720px){#detailPage .detail-banner-img{height:auto!important;object-fit:contain!important;}}

/* ===== STYLE BLOCK ===== */

/* FINAL: every episode keeps its own thumbnail in normal, hover, focus, and touch states. */
#pageDetailEpisodes .bunny-hover-frame,
#pageDetailEpisodes .bunny-hover-iframe,
#pageDetailEpisodes .bunny-live-frame,
#pageDetailEpisodes .bunny-live-shade{display:none!important;}
#pageDetailEpisodes .bunny-hover-preview .static-episode-thumb{
  opacity:1!important; visibility:visible!important; display:block!important;
  width:100%!important; height:100%!important;
  object-fit:cover!important; object-position:center!important;
}

/* ===== STYLE BLOCK ===== */

#pageDetailEpisodes .ep-num{display:flex!important;visibility:visible!important;opacity:1!important;position:relative!important;z-index:5!important;align-items:center!important;gap:12px!important;min-width:150px!important;color:#aaa!important;}
#pageDetailEpisodes .ep-num .episode-label{display:inline!important;visibility:visible!important;opacity:1!important;color:#aaa!important;font-weight:800!important;}
#pageDetailEpisodes .ep-num > span:last-child{display:inline!important;visibility:visible!important;opacity:1!important;color:#fff!important;font-weight:900!important;}

/* ===== STYLE BLOCK ===== */

@media(max-width:720px){
  /* Keep the episode title completely outside the video frame on phones. */
  .video-modal-overlay{
    align-items:flex-start!important;
    justify-content:flex-start!important;
    padding:0!important;
    overflow:auto!important;
  }
  .video-modal{
    width:100%!important;
    max-width:none!important;
    margin-top:env(safe-area-inset-top,0px)!important;
    padding-top:0!important;
  }
  .video-title-bar{
    position:relative!important;
    top:auto!important;left:auto!important;right:auto!important;
    z-index:30!important;
    width:100%!important;
    min-height:58px!important;
    margin:0!important;
    padding:8px 10px 8px 12px!important;
    box-sizing:border-box!important;
    background:#050505!important;
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
    pointer-events:auto!important;
  }
  .video-title-bar h3{
    flex:1 1 auto!important;
    min-width:0!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    font-size:15px!important;
    line-height:1.2!important;
    color:#fff!important;
    text-shadow:none!important;
    background:transparent!important;
    border-radius:0!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }
  .video-close{
    flex:0 0 44px!important;
    width:44px!important;height:44px!important;
    min-width:44px!important;min-height:44px!important;
    margin:0!important;
  }
  .video-modal-inner{
    position:relative!important;
    width:100%!important;
    aspect-ratio:16/9!important;
    margin:0!important;
    border-radius:0!important;
    border-left:0!important;
    border-right:0!important;
    overflow:hidden!important;
  }
}
@media(max-width:380px){
  .video-title-bar{min-height:54px!important;padding:6px 8px 6px 10px!important}
  .video-title-bar h3{font-size:14px!important}
  .video-close{flex-basis:42px!important;width:42px!important;height:42px!important;min-width:42px!important;min-height:42px!important}
}

/* ===== STYLE BLOCK ===== */

/* Mobile thumbnails use the same 16:9 frame treatment as desktop.
     Do not zoom the Bunny iframe: the previous 125%-132% scale cropped the image. */
  #pageDetailEpisodes .episode-thumb-wrap,
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview{
    aspect-ratio:16/9!important;
    overflow:hidden!important;
    background:#111!important;
  }
  #pageDetailEpisodes .episode-thumb-wrap img,
  #pageDetailEpisodes .episode-thumb-wrap .bunny-preview-fallback,
  #pageDetailEpisodes .episode-thumb-wrap .bunny-live-frame{
    width:100%!important;
    height:100%!important;
    left:0!important;
    top:0!important;
    right:auto!important;
    bottom:auto!important;
    transform:none!important;
    object-position:center!important;
  }
  @media(max-width:700px){
    #pageDetailEpisodes .episode-row{
      grid-template-columns:minmax(138px,42%) minmax(0,1fr) 30px!important;
      column-gap:10px!important;
    }
    #pageDetailEpisodes .episode-thumb-wrap,
    #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview{
      width:100%!important;
      height:auto!important;
      aspect-ratio:16/9!important;
      align-self:center!important;
    }
    #pageDetailEpisodes .episode-thumb-wrap .bunny-live-frame,
    #pageDetailEpisodes .episode-thumb-wrap .bunny-preview-fallback,
    #pageDetailEpisodes .episode-thumb-wrap img{
      width:100%!important;
      height:100%!important;
      object-fit:cover!important;
      object-position:center!important;
    }
  }
  @media(max-width:480px){
    #pageDetailEpisodes .episode-row{
      grid-template-columns:minmax(132px,43%) minmax(0,1fr) 28px!important;
      column-gap:9px!important;
    }
    #pageDetailEpisodes .episode-thumb-wrap,
    #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview{
      width:100%!important;
      height:auto!important;
      aspect-ratio:16/9!important;
    }
  }

/* ===== STYLE BLOCK ===== */

/* Keep the title hidden; show only the standalone TONFLIX Close button. */
#videoModalOverlay .video-title-bar,
#videoModalOverlay .video-close,
#videoModalOverlay #tonflixFloatingClose{
  display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;
}

#tonflixStandaloneClose{
  position:absolute!important;
  top:14px!important;
  left:50%!important;
  right:auto!important;
  transform:translateX(-50%)!important;
  z-index:2147483647!important;
  width:48px!important;
  height:48px!important;
  min-width:48px!important;
  min-height:48px!important;
  display:none;
  align-items:center!important;
  justify-content:center!important;
  padding:0!important;
  margin:0!important;
  border:1px solid rgba(255,255,255,.30)!important;
  border-radius:50%!important;
  background:rgba(0,0,0,.64)!important;
  color:#fff!important;
  font:400 28px/1 Arial,sans-serif!important;
  cursor:pointer!important;
  box-shadow:0 4px 18px rgba(0,0,0,.48)!important;
  transition:opacity .18s ease,transform .15s ease,background .15s ease!important;
  -webkit-tap-highlight-color:transparent!important;
  pointer-events:auto!important;
}
#tonflixStandaloneClose.is-open{display:flex!important;}
#tonflixStandaloneClose:hover{
  background:rgba(0,0,0,.84)!important;
  transform:scale(1.05)!important;
}
#tonflixStandaloneClose:active{transform:scale(.94)!important;}
#tonflixStandaloneClose:focus-visible{
  outline:3px solid rgba(57,255,106,.95)!important;
  outline-offset:2px!important;
}

.video-modal.tonflix-player-fullscreen > #tonflixStandaloneClose{
  position:fixed!important;
  top:14px!important;
  left:50%!important;
  right:auto!important;
  transform:translateX(-50%)!important;
  z-index:2147483647!important;
}

@media(max-width:720px){
  #tonflixStandaloneClose{
    top:8px!important;
    left:50%!important;
    right:auto!important;
    transform:translateX(-50%)!important;
    width:44px!important;
    height:44px!important;
    min-width:44px!important;
    min-height:44px!important;
    font-size:25px!important;
  }
  .video-modal.tonflix-player-fullscreen > #tonflixStandaloneClose{
    top:8px!important;
    left:50%!important;
    right:auto!important;
    transform:translateX(-50%)!important;
  }
}

/* ===== STYLE BLOCK ===== */

/* Mobile season tabs: compact 2-column cards with equal width and clearer hierarchy. */
@media(max-width:700px){
  #pageDetailSeasons.season-picker{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
    width:100%!important;
    max-width:none!important;
    margin:0 0 20px!important;
    padding:4px 2px 6px!important;
    overflow:visible!important;
    scrollbar-width:none!important;
  }

  #pageDetailSeasons .season-tab{
    box-sizing:border-box!important;
    width:100%!important;
    min-width:0!important;
    min-height:72px!important;
    padding:12px 13px!important;
    border-radius:14px!important;
    border:1px solid rgba(255,255,255,.10)!important;
    background:
      linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018))!important;
    color:#f4f4f4!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    justify-content:center!important;
    text-align:left!important;
    box-shadow:0 5px 16px rgba(0,0,0,.22)!important;
    transition:transform .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease!important;
  }

  #pageDetailSeasons .season-tab span{
    display:block!important;
    width:100%!important;
    font-size:14px!important;
    line-height:1.15!important;
    font-weight:850!important;
    letter-spacing:.01em!important;
    color:#fff!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  #pageDetailSeasons .season-tab small{
    display:block!important;
    width:100%!important;
    margin-top:6px!important;
    font-size:10.5px!important;
    line-height:1.25!important;
    color:#9ea3aa!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  #pageDetailSeasons .season-tab.active{
    border-color:rgba(229,9,20,.88)!important;
    background:
      linear-gradient(145deg,rgba(229,9,20,.24),rgba(80,8,14,.18))!important;
    box-shadow:
      0 7px 18px rgba(229,9,20,.12)!important,
      inset 0 0 0 1px rgba(229,9,20,.12)!important;
  }

  #pageDetailSeasons .season-tab.active::before{
    content:"";
    width:32px;
    height:3px;
    border-radius:99px;
    background:#e50914;
    margin-bottom:8px;
  }

  #pageDetailSeasons .season-tab:active{
    transform:scale(.975)!important;
  }

  #pageDetailSeasons .season-tab:focus-visible{
    outline:2px solid rgba(229,9,20,.9)!important;
    outline-offset:2px!important;
  }
}

/* Very small phones: give each card a little more breathing room. */
@media(max-width:380px){
  #pageDetailSeasons.season-picker{
    gap:8px!important;
    padding-left:0!important;
    padding-right:0!important;
  }

  #pageDetailSeasons .season-tab{
    min-height:68px!important;
    padding:11px 11px!important;
    border-radius:13px!important;
  }

  #pageDetailSeasons .season-tab span{
    font-size:13px!important;
  }

  #pageDetailSeasons .season-tab small{
    font-size:9.5px!important;
    margin-top:5px!important;
  }
}

/* ===== STYLE BLOCK ===== */

/* Desktop season tabs: clean premium dashboard-style grid. */
@media(min-width:701px){
  #pageDetailSeasons.season-picker{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:12px!important;
    width:100%!important;
    max-width:1100px!important;
    margin:0 auto 24px!important;
    padding:6px 0!important;
    overflow:visible!important;
  }

  #pageDetailSeasons .season-tab{
    box-sizing:border-box!important;
    width:100%!important;
    min-width:0!important;
    min-height:88px!important;
    padding:16px 18px!important;
    border-radius:16px!important;
    border:1px solid rgba(255,255,255,.10)!important;
    background:
      linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018))!important;
    color:#fff!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    justify-content:center!important;
    text-align:left!important;
    box-shadow:0 8px 22px rgba(0,0,0,.20)!important;
    transition:
      transform .16s ease,
      border-color .16s ease,
      background .16s ease,
      box-shadow .16s ease!important;
    position:relative!important;
    overflow:hidden!important;
  }

  #pageDetailSeasons .season-tab::after{
    content:"";
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    height:2px;
    background:rgba(255,255,255,.07);
  }

  #pageDetailSeasons .season-tab span{
    display:block!important;
    width:100%!important;
    font-size:17px!important;
    line-height:1.15!important;
    font-weight:850!important;
    letter-spacing:.01em!important;
    color:#fff!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  #pageDetailSeasons .season-tab small{
    display:block!important;
    width:100%!important;
    margin-top:7px!important;
    font-size:12px!important;
    line-height:1.25!important;
    color:#9da3ab!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  #pageDetailSeasons .season-tab:hover{
    transform:translateY(-2px)!important;
    border-color:rgba(229,9,20,.55)!important;
    background:
      linear-gradient(145deg,rgba(229,9,20,.15),rgba(255,255,255,.025))!important;
    box-shadow:0 12px 28px rgba(0,0,0,.28)!important;
  }

  #pageDetailSeasons .season-tab.active{
    border-color:rgba(229,9,20,.95)!important;
    background:
      linear-gradient(145deg,rgba(229,9,20,.24),rgba(82,8,16,.16))!important;
    box-shadow:
      0 10px 26px rgba(229,9,20,.14)!important,
      inset 0 0 0 1px rgba(229,9,20,.10)!important;
  }

  #pageDetailSeasons .season-tab.active::before{
    content:"";
    position:absolute;
    left:16px;
    top:14px;
    width:34px;
    height:3px;
    border-radius:999px;
    background:#e50914;
  }

  #pageDetailSeasons .season-tab.active span{
    padding-top:8px!important;
  }

  #pageDetailSeasons .season-tab:focus-visible{
    outline:2px solid rgba(229,9,20,.9)!important;
    outline-offset:3px!important;
  }
}

/* Mid-size desktop/tablet landscape: 2 columns before switching to mobile. */
@media(min-width:701px) and (max-width:980px){
  #pageDetailSeasons.season-picker{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    max-width:760px!important;
  }
}

/* ===== STYLE BLOCK ===== */

/* Full-bleed season tabs: remove the side gaps and span the viewport edge-to-edge. */
#pageDetailSeasons.season-picker{
  width:100vw!important;
  max-width:none!important;
  margin-left:calc((100% - 100vw)/2)!important;
  margin-right:0!important;
  box-sizing:border-box!important;
  padding-left:0!important;
  padding-right:0!important;
}

/* Keep the cards themselves flush to the screen edges while preserving internal gaps. */
@media(min-width:701px){
  #pageDetailSeasons.season-picker{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:12px!important;
  }
}

@media(min-width:701px) and (max-width:980px){
  #pageDetailSeasons.season-picker{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

@media(max-width:700px){
  #pageDetailSeasons.season-picker{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    margin-left:calc((100% - 100vw)/2)!important;
    padding-left:0!important;
    padding-right:0!important;
  }
}

/* ===== STYLE BLOCK ===== */

/* Episode list: keep a small, balanced side margin while aligning all rows. */
#pageDetailEpisodes{
  width:calc(100% - 32px)!important;
  max-width:1450px!important;
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box!important;
}

/* Center the content inside the episode grid columns. */
#pageDetailEpisodes .episode-row{
  justify-items:center!important;
}
#pageDetailEpisodes .episode-thumb-wrap{
  justify-self:center!important;
}
#pageDetailEpisodes .ep-num{
  width:100%!important;
  justify-content:center!important;
  text-align:center!important;
}
#pageDetailEpisodes .ep-info{
  width:100%!important;
  text-align:center!important;
}
#pageDetailEpisodes .ep-info h5{
  text-align:center!important;
}
#pageDetailEpisodes .ep-info span{
  display:block!important;
  text-align:center!important;
}
#pageDetailEpisodes .ep-play{
  justify-self:center!important;
  text-align:center!important;
}

/* Mobile: preserve the compact episode layout with a smaller edge margin. */
@media(max-width:700px){
  #pageDetailEpisodes{
    width:calc(100% - 16px)!important;
    max-width:none!important;
  }
  #pageDetailEpisodes .episode-row{
    justify-items:center!important;
  }
  #pageDetailEpisodes .ep-num,
  #pageDetailEpisodes .ep-info,
  #pageDetailEpisodes .ep-info h5,
  #pageDetailEpisodes .ep-info span,
  #pageDetailEpisodes .ep-play{
    text-align:center!important;
  }
}

/* Season tabs: center their text for a cleaner table/card feel. */
#pageDetailSeasons .season-tab{
  align-items:center!important;
  text-align:center!important;
}
#pageDetailSeasons .season-tab span,
#pageDetailSeasons .season-tab small{
  text-align:center!important;
}

/* ===== STYLE BLOCK ===== */

/* Admin role presentation for the signed-in admin account. */
#adminMembersBtn.admin-role{
  color:#A8FF00!important;
  border-color:rgba(168,255,0,.55)!important;
  background:rgba(168,255,0,.08)!important;
  box-shadow:0 0 0 1px rgba(168,255,0,.05) inset!important;
}
#adminMembersBtn.admin-role:hover{
  color:#7dffb3!important;
  border-color:rgba(168,255,0,.9)!important;
  background:rgba(168,255,0,.14)!important;
}
.mobile-account-vip.admin-role{
  color:#A8FF00!important;
  font-weight:900!important;
  letter-spacing:.05em!important;
}

/* ===== STYLE BLOCK ===== */

/* Mobile menu role/subscription label: always green for Free Member, VIP, or Admin. */
#mobileAccountVip,
#mobileAccountVip.admin-role{
  color:#A8FF00!important;
  font-weight:900!important;
  letter-spacing:.04em!important;
}

/* ===== STYLE BLOCK ===== */

/* Restore the season-card spacing/layout shown in the reference screenshot. */
/* Desktop: centered 3-column grid with clear outer margins and gaps. */
@media(min-width:981px){
  #pageDetailSeasons.season-picker{
    width:calc(100% - 76px)!important;
    max-width:none!important;
    margin-left:auto!important;
    margin-right:auto!important;
    padding:6px 0!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    column-gap:16px!important;
    row-gap:14px!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }
}

/* Tablet landscape: 2 columns with the same breathing room. */
@media(min-width:701px) and (max-width:980px){
  #pageDetailSeasons.season-picker{
    width:calc(100% - 48px)!important;
    max-width:none!important;
    margin-left:auto!important;
    margin-right:auto!important;
    padding:6px 0!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    column-gap:14px!important;
    row-gap:14px!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }
}

/* Mobile: centered 2-column cards with visible spacing around each card. */
@media(max-width:700px){
  #pageDetailSeasons.season-picker{
    width:calc(100% - 24px)!important;
    max-width:none!important;
    margin-left:auto!important;
    margin-right:auto!important;
    padding:4px 0 6px!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    column-gap:10px!important;
    row-gap:10px!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }
}

@media(max-width:380px){
  #pageDetailSeasons.season-picker{
    width:calc(100% - 20px)!important;
    column-gap:8px!important;
    row-gap:8px!important;
  }
}

/* ===== STYLE BLOCK ===== */

/* User-supplied Google Drive artwork for Dragon Ball Z Season 1–3 cards. */
#row-anime-seasons .season-collection-card[data-title="Dragon Ball Z"][data-season-index="0"] .poster,
#row-anime-seasons .season-collection-card[data-title="Dragon Ball Z"][data-season-index="1"] .poster,
#row-anime-seasons .season-collection-card[data-title="Dragon Ball Z"][data-season-index="2"] .poster{
  background-size:cover!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
}

/* ===== STYLE BLOCK ===== */

#heroSlider .slide[data-detail-title="Knock Out: IPPO"]{
  background-position:center center!important;
  background-size:cover!important;
  background-repeat:no-repeat!important;
}

/* ===== STYLE BLOCK ===== */

/* Prevent refresh flicker while the legacy Top 10/Favorites renderers settle. */
html.tonflix-home-stats-settling #row-top10,
html.tonflix-home-stats-settling #row-favorites{visibility:hidden!important;}
html.tonflix-home-stats-ready #row-top10,
html.tonflix-home-stats-ready #row-favorites{visibility:visible!important;}

/* Keep the Favorites row visible even before the visitor saves a title. */
.favorites-empty{
  display:flex;align-items:center;min-height:96px;padding:20px 26px;
  color:var(--muted,#9aa4b2);font-size:15px;border:1px dashed rgba(255,255,255,.16);
  border-radius:12px;background:rgba(255,255,255,.025);
}
.favorites-empty strong{color:#A8FF00;margin:0 4px;}

/* ===== STYLE BLOCK ===== */

#pageDetailFavoriteBtn.favorite-btn{color:#e50914!important;border-color:rgba(229,9,20,.75)!important;background:rgba(229,9,20,.10)!important;box-shadow:0 0 0 1px rgba(229,9,20,.10),0 0 18px rgba(229,9,20,.10)!important;}
#pageDetailFavoriteBtn.favorite-btn.is-favorite{color:#A8FF00!important;border-color:rgba(168,255,0,.95)!important;background:rgba(168,255,0,.16)!important;box-shadow:0 0 0 1px rgba(168,255,0,.20),0 0 22px rgba(168,255,0,.20)!important;}

/* ===== STYLE BLOCK ===== */

#detailPage[data-ippo-hero="1"] #detailArt{
  background-size:cover!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
}

/* ===== STYLE BLOCK ===== */

/* IPPO season hero: never inherit DBZ artwork. */
#detailPage[data-ippo-hero="1"] #detailBannerImg{
  display:block!important;
  opacity:1!important;
  visibility:visible!important;
}
@media(max-width:720px){
  #detailPage[data-ippo-hero="1"] #detailBannerImg{
    width:100%!important;
    height:auto!important;
    object-fit:contain!important;
    object-position:center top!important;
  }
}

/* ===== STYLE BLOCK ===== */

/* ONLY DBZ Season 2 hero is removed. Season 3–9 hero artwork is untouched. */
#detailPage[data-dbz-season-hero="2"] #detailArt,
#detailPage[data-dbz-season-hero="2"] #detailBannerImg{
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  background-image:none!important;
}
#detailPage[data-dbz-season-hero="2"] .detail-banner-main{
  background:#090909!important;
}

/* ===== STYLE BLOCK ===== */

/* IPPO Season 1 only — no other anime/content is modified. */
#detailPage[data-tonflix-ippo-s1="1"] #detailArt{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  background-image:url("/images/local-artwork/drive-1CqCKYCkpxuBe20-FKZ5NPsT7Pxtdezx9.webp")!important;
  background-size:cover!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
}
#detailPage[data-tonflix-ippo-s1="1"] #detailBannerImg{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
}

/* ===== STYLE BLOCK ===== */

/* IPPO Season 1 only. No other anime/content is targeted. */
#detailPage[data-tonflix-ippo-s1="1"] #detailArt{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  background-image:url("/images/local-artwork/drive-1CqCKYCkpxuBe20-FKZ5NPsT7Pxtdezx9.webp")!important;
  background-size:cover!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
}
#detailPage[data-tonflix-ippo-s1="1"] #detailBannerImg{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
}

/* ===== STYLE BLOCK ===== */

/* DBZ ONLY — restore all Season 1–9 detail hero banners. */
#detailPage[data-dbz-hero-restored="1"] #detailArt{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  background-size:cover!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
}
#detailPage[data-dbz-hero-restored="1"] #detailBannerImg{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
}

/* ===== STYLE BLOCK ===== */

/*
  IPPO MOBILE ONLY:
  The actual hero image is #detailBannerImg inside #detailCover.
  #detailArt is the duplicate background layer, so hide it on phones.
  Desktop is untouched.
*/
@media(max-width:720px){
  #detailPage[data-ippo-hero="1"] #detailArt,
  #detailPage[data-tonflix-ippo-s1="1"] #detailArt{
    display:none!important;
    visibility:hidden!important;
    opacity:0!important;
    background-image:none!important;
    width:0!important;
    height:0!important;
    min-height:0!important;
    max-height:0!important;
    position:absolute!important;
    inset:auto!important;
    overflow:hidden!important;
    pointer-events:none!important;
  }

  #detailPage[data-ippo-hero="1"] .detail-banner-main,
  #detailPage[data-tonflix-ippo-s1="1"] .detail-banner-main{
    display:block!important;
    position:relative!important;
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    height:auto!important;
    overflow:visible!important;
    background:#000!important;
  }

  #detailPage[data-ippo-hero="1"] .detail-cover,
  #detailPage[data-tonflix-ippo-s1="1"] .detail-cover{
    display:block!important;
    position:relative!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    overflow:hidden!important;
    background:#000!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    flex:none!important;
  }

  #detailPage[data-ippo-hero="1"] #detailBannerImg,
  #detailPage[data-tonflix-ippo-s1="1"] #detailBannerImg{
    display:block!important;
    position:relative!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-width:100%!important;
    max-height:none!important;
    object-fit:contain!important;
    object-position:center top!important;
    visibility:visible!important;
    opacity:1!important;
  }
}

/* ===== STYLE BLOCK ===== */

.vip-pill .vip-expiry{display:none!important;}

/* ===== STYLE BLOCK ===== */

#pageDetailFavoriteBtn.favorite-btn,
  #pageDetail .back-btn{
    pointer-events:auto!important;
    cursor:pointer!important;
    user-select:none;
  }
  #pageDetailFavoriteBtn.favorite-btn{
    -webkit-tap-highlight-color:transparent;
  }

/* ===== STYLE BLOCK ===== */

#pageDetail.demon-city-active .detail-cover,
  #pageDetail.demon-city-active .detail-art{
    background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important;
  }
  #pageDetail.demon-city-active .detail-cover:after{background:linear-gradient(180deg,transparent 52%,rgba(0,0,0,.72) 100%)!important;}
  #pageDetail.demon-city-active .demon-watch-btn{
    background:#fff!important;color:#000!important;font-weight:800!important;
  }
  #pageDetail.demon-city-active .demon-watch-btn.vip-locked{
    background:#2a2a2a!important;color:#fff!important;border:1px solid rgba(255,255,255,.18)!important;
    box-shadow:none!important;opacity:.95!important;
  }
  #pageDetail.demon-city-active .demon-watch-btn.vip-locked:hover{background:#3a3a3a!important;}
  #demonCityWatchModal{position:fixed;inset:0;background:rgba(0,0,0,.92);display:none;align-items:center;justify-content:center;padding:18px;z-index:300;}
  #demonCityWatchModal.open{display:flex;}
  #demonCityWatchModal .demon-watch-shell{width:min(1120px,100%);position:relative;}
  #demonCityWatchModal .demon-watch-frame{position:relative;width:100%;aspect-ratio:16/9;background:#000;border-radius:10px;overflow:hidden;border:1px solid rgba(255,255,255,.14);box-shadow:0 25px 80px rgba(0,0,0,.6)}
  #demonCityWatchModal iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;}
  #demonCityWatchModal .demon-watch-close{position:absolute;right:0;top:-46px;width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.22);background:#171717;color:#fff;cursor:pointer;font-size:18px;z-index:2;}
  #demonCityWatchModal .demon-watch-close:hover{background:#e50914;border-color:#e50914;}
  @media(max-width:700px){#demonCityWatchModal{padding:10px}#demonCityWatchModal .demon-watch-close{top:-44px;right:0}}

/* ===== STYLE BLOCK ===== */

/* V14 FINAL: banner is never cropped; trailer is YouTube embed only. */
#detailPage .detail-banner-img{
  display:block!important;
  width:100%!important;
  height:auto!important;
  max-width:100%!important;
  object-fit:contain!important;
  object-position:center top!important;
}
@media(min-width:721px){
  #detailPage .detail-cover{display:none!important;}
  #detailPage .detail-art{
    background-size:contain!important;
    background-repeat:no-repeat!important;
    background-position:center top!important;
    background-color:#000!important;
  }
}
@media(max-width:720px){
  #detailPage .detail-banner{
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:visible!important;
    background:#000!important;
  }
  #detailPage .detail-cover{
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    overflow:hidden!important;
    background:#000!important;
  }
  #detailPage .detail-banner-img{
    display:block!important;
    width:100%!important;
    height:auto!important;
    max-width:100%!important;
    max-height:none!important;
    object-fit:contain!important;
    object-position:center top!important;
  }
  #detailPage .detail-banner-main{
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:visible!important;
    background:#090909!important;
  }
  #detailPage .detail-art{display:none!important;}
  #detailPage .detail-banner-main:after{display:none!important;}
  #detailPage .detail-content{
    position:relative!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    padding:18px 16px 28px!important;
    box-sizing:border-box!important;
    background:#090909!important;
  }
}
.detail-trailer-frame{position:relative!important;width:100%!important;aspect-ratio:16/9!important;background:#000!important;overflow:hidden!important;border-radius:10px!important;}
.detail-trailer-frame iframe{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;border:0!important;}

/* ===== STYLE BLOCK ===== */

/* Season 3 hero image: exact user-provided Google Drive image. */

/* ===== STYLE BLOCK ===== */

/* DBZ Home Page card cover only — does not affect season hero images. */
.card[data-title="Dragon Ball Z"] .poster{
  background-image:url("/images/local-artwork/drive-1Pg2aq2iZHIozzk5dji5nZDEnGZoh3CxE.webp") !important;
  background-size:cover !important;
  background-position:center !important;
  background-repeat:no-repeat !important;
}

/* ===== STYLE BLOCK ===== */

/* FINAL AUTHORITY: home cards + hero art are restored, and episode images never disappear. */
#pageDetailEpisodes .static-episode-thumb{display:block!important;visibility:visible!important;opacity:1!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important;}

/* ===== STYLE BLOCK ===== */

#row-favorites .card{position:relative!important;}
  #row-favorites .poster{background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important;}
  #row-favorites .tonflix-fav-star{position:absolute!important;top:8px!important;left:8px!important;z-index:12!important;color:#A8FF00!important;font-size:20px!important;line-height:1!important;text-shadow:0 0 8px rgba(168,255,0,.45)!important;pointer-events:none!important;}
  #row-favorites .card-info h4{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  #row-favorites .card{cursor:pointer!important;}

/* ===== STYLE BLOCK ===== */

@media(max-width:720px){
  /* Keep the same Favorites behavior on touch devices. */
  #row-favorites{touch-action:pan-x!important;-webkit-overflow-scrolling:touch!important;}
  #row-favorites .card[data-favorite-key]{
    cursor:pointer!important;
    touch-action:manipulation!important;
    -webkit-tap-highlight-color:transparent!important;
    user-select:none!important;
    -webkit-user-select:none!important;
  }
  #row-favorites .card[data-favorite-key] .poster{pointer-events:none!important;}

  /* The detail actions remain independently tappable on phones. */
  #detailPage .detail-actions{position:relative!important;z-index:20!important;}
  #pageDetailFavoriteBtn.favorite-btn,
  #detailPage .back-btn{
    position:relative!important;
    z-index:21!important;
    pointer-events:auto!important;
    touch-action:manipulation!important;
    -webkit-tap-highlight-color:transparent!important;
  }
  #pageDetailFavoriteBtn.favorite-btn{min-height:44px!important;}
  #detailPage .back-btn{min-height:44px!important;}
}

/* ===== STYLE BLOCK ===== */

#detailPage .tonflix-demon-watch-instant{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    pointer-events:auto!important;
    cursor:pointer!important;
    position:relative!important;
    z-index:50!important;
  }
  @media(max-width:720px){
    #detailPage .detail-actions .tonflix-demon-watch-instant{
      width:100%!important;
      min-height:44px!important;
    }
  }

/* ===== STYLE BLOCK ===== */

/* Mobile detail layout matched to the supplied reference:
   cover stays on the LEFT, banner/text stays on the RIGHT. */
@media (max-width:720px){
  #detailPage{min-height:calc(100vh - 60px);}
  .detail-banner{
    display:grid!important;
    grid-template-columns:42.5% 57.5%!important;
    flex-direction:row!important;
    min-height:505px!important;
    height:505px!important;
    max-height:505px!important;
    overflow:hidden!important;
    align-items:stretch!important;
    background:#090909!important;
  }
  .detail-cover{
    grid-column:1!important;
    grid-row:1!important;
    width:auto!important;
    height:100%!important;
    min-width:0!important;
    flex:none!important;
    padding:0!important;
    border-right:1px solid rgba(255,255,255,.10)!important;
    border-bottom:0!important;
    background-size:cover!important;
    background-position:center center!important;
  }
  .detail-cover:after{
    background:linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(0,0,0,.28) 100%)!important;
  }
  .detail-banner-main{
    grid-column:2!important;
    grid-row:1!important;
    width:auto!important;
    min-width:0!important;
    height:100%!important;
    align-items:flex-start!important;
    overflow:hidden!important;
    position:relative!important;
  }
  .detail-art{
    position:absolute!important;
    inset:0!important;
    background-size:cover!important;
    background-position:center!important;
    opacity:1!important;
  }
  .detail-banner-main:after{
    background:linear-gradient(90deg,rgba(0,0,0,.94) 0%,rgba(0,0,0,.76) 42%,rgba(0,0,0,.48) 100%),linear-gradient(0deg,rgba(0,0,0,.88),transparent 65%)!important;
  }
  .detail-content{
    display:flex!important;
    align-items:center!important;
    width:100%!important;
    height:100%!important;
    box-sizing:border-box!important;
    padding:28px 20px 30px!important;
  }
  .detail-copy{
    width:100%!important;
    max-width:none!important;
  }
  .detail-meta{
    font-size:10px!important;
    line-height:1.45!important;
    margin-bottom:8px!important;
    word-break:normal!important;
  }
  .detail-copy h1,
  #pageDetailTitle{
    font-size:clamp(27px,6vw,40px)!important;
    line-height:.96!important;
    margin:4px 0 12px!important;
    overflow-wrap:normal!important;
  }
  .detail-desc{
    font-size:12px!important;
    line-height:1.52!important;
    margin:0 0 17px!important;
    color:#eee!important;
    display:-webkit-box!important;
    -webkit-line-clamp:6!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
  }
  .detail-actions{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:8px!important;
    width:100%!important;
  }
  .detail-actions .btn{
    width:100%!important;
    min-height:40px!important;
    padding:10px 8px!important;
    font-size:12px!important;
    justify-content:center!important;
    white-space:nowrap!important;
  }
  .detail-body{
    padding:20px 12px 42px!important;
  }
  #pageDetailEpisodes{
    width:100%!important;
    max-width:none!important;
  }
}

@media (max-width:480px){
  .detail-banner{
    grid-template-columns:42% 58%!important;
    min-height:470px!important;
    height:470px!important;
    max-height:470px!important;
  }
  .detail-content{padding:24px 14px 24px!important;}
  .detail-meta{font-size:8.5px!important;}
  .detail-copy h1,#pageDetailTitle{font-size:25px!important;}
  .detail-desc{font-size:11px!important;line-height:1.48!important;-webkit-line-clamp:6!important;}
  .detail-actions .btn{font-size:11px!important;min-height:37px!important;padding:9px 6px!important;}
}

/* ===== STYLE BLOCK ===== */

/* Mobile Bunny preview: the card itself is true 16:9 and the iframe is kept
   at native dimensions. Do not squeeze the player into a taller 4:3 box. */
#pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview{
  aspect-ratio:16/9!important;
  background:#000!important;
  overflow:hidden!important;
}
#pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview .bunny-live-frame{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  min-width:100%!important;
  min-height:100%!important;
  max-width:none!important;
  max-height:none!important;
  transform:none!important;
  left:0!important;
  top:0!important;
  object-fit:fill!important;
  background:#000!important;
}
@media(max-width:720px){
  #pageDetailEpisodes .episode-row{
    grid-template-columns:minmax(138px,42%) minmax(0,1fr) 28px!important;
    column-gap:10px!important;
    padding:10px!important;
  }
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview{
    width:100%!important;
    height:auto!important;
    aspect-ratio:16/9!important;
    align-self:center!important;
  }
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview .bunny-live-frame{
    width:100%!important;
    height:100%!important;
    transform:none!important;
  }
}
@media(max-width:480px){
  #pageDetailEpisodes .episode-row{
    grid-template-columns:minmax(130px,43%) minmax(0,1fr) 26px!important;
    column-gap:8px!important;
  }
}

/* ===== STYLE BLOCK ===== */

/* =========================================================
   FINAL MOBILE POLISH
   - Full poster visible (no cover crop)
   - Bunny episode previews remain animated
   - Bunny frame fills the thumbnail without the previous oversized gutter
   - Hover/touch SFX restored
   - Original procedural anime ambience: no MP3 upload required
   ========================================================= */

/* Full series poster: preserve the complete artwork. */
#detailCover{
  background-size:contain!important;
  background-repeat:no-repeat!important;
  background-position:center center!important;
  background-color:#050505!important;
}

/* Keep the live Bunny iframe visible and truly 16:9. */
#pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview{
  position:relative!important;
  overflow:hidden!important;
  aspect-ratio:16/9!important;
  background:#111!important;
}
#pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview .bunny-live-frame{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  max-width:none!important;
  max-height:none!important;
  transform:none!important;
  margin:0!important;
  border:0!important;
  pointer-events:none!important;
  background:#000!important;
}
#pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview .bunny-preview-fallback{
  display:block!important;
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  background:#000!important;
}

/* Remove the black thumbnail gutter caused by the old 125%/132% iframe patch.
   If Bunny itself supplies letterboxing, keep the video centered rather than
   stretching it. */
#pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview .bunny-live-frame{
  left:0!important;top:0!important;right:auto!important;bottom:auto!important;
}

/* Mobile detail: same left-cover/right-content composition as the supplied
   reference, with enough height to keep the cover and buttons balanced. */
@media(max-width:720px){
  .detail-banner{
    display:grid!important;
    grid-template-columns:42.5% 57.5%!important;
    grid-template-rows:1fr!important;
    width:100%!important;
    min-height:630px!important;
    height:630px!important;
    max-height:630px!important;
    overflow:hidden!important;
  }
  .detail-cover{
    grid-column:1!important;grid-row:1!important;
    width:auto!important;height:100%!important;
    min-width:0!important;min-height:0!important;
    background-size:contain!important;
    background-position:center center!important;
    background-repeat:no-repeat!important;
    background-color:#050505!important;
    padding:0!important;
  }
  .detail-banner-main{
    grid-column:2!important;grid-row:1!important;
    width:auto!important;height:100%!important;min-width:0!important;
    overflow:hidden!important;
  }
  .detail-content{
    width:100%!important;height:100%!important;
    padding:28px 20px 30px!important;
    box-sizing:border-box!important;
  }
  .detail-copy{width:100%!important;max-width:none!important;}
  .detail-actions{width:100%!important;}

  /* Episode card: the video itself occupies the whole left cell. */
  #pageDetailEpisodes .episode-row{
    grid-template-columns:minmax(138px,42%) minmax(0,1fr) 28px!important;
    column-gap:10px!important;
    row-gap:5px!important;
    min-height:0!important;
    padding:10px!important;
  }
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview{
    width:100%!important;
    height:auto!important;
    aspect-ratio:16/9!important;
    align-self:center!important;
  }
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview .bunny-live-frame,
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview .bunny-preview-fallback{
    width:100%!important;height:100%!important;
  }
}
@media(max-width:480px){
  .detail-banner{
    grid-template-columns:42% 58%!important;
    min-height:560px!important;height:560px!important;max-height:560px!important;
  }
  .detail-content{padding:24px 14px!important;}
  #pageDetailEpisodes .episode-row{
    grid-template-columns:minmax(132px,43%) minmax(0,1fr) 26px!important;
    column-gap:8px!important;
  }
}

/* Touch-friendly interaction: visual feedback is separate from the audio SFX. */
button,a,.episode-row,.tv-focusable,[role="button"]{
  -webkit-tap-highlight-color:transparent;
}

/* ===== STYLE BLOCK ===== */

/* MOBILE DETAIL V5: poster on top, banner/content underneath. */
@media (max-width:720px){
  .detail-banner{
    display:block!important;
    width:100%!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    overflow:visible!important;
    background:#090909!important;
  }
  .detail-cover{
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:900/1280!important;
    flex:none!important;
    border:0!important;
    border-radius:0!important;
    padding:0!important;
    background-size:contain!important;
    background-position:center center!important;
    background-repeat:no-repeat!important;
    background-color:#050505!important;
  }
  .detail-cover:after{display:none!important}
  .detail-banner-main{
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    overflow:hidden!important;
    position:relative!important;
  }
  .detail-art{
    position:absolute!important;
    inset:0!important;
    background-size:cover!important;
    background-position:center!important;
  }
  .detail-banner-main:after{
    background:linear-gradient(180deg,rgba(0,0,0,.88),rgba(0,0,0,.72) 65%,rgba(0,0,0,.92))!important;
  }
  .detail-content{
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    box-sizing:border-box!important;
    padding:28px 20px 30px!important;
  }
  .detail-copy{width:100%!important;max-width:none!important}
  .detail-actions{width:100%!important;display:flex!important;flex-direction:column!important;gap:9px!important;margin-top:18px!important}
  .detail-actions .btn{width:100%!important;min-height:46px!important;font-size:13px!important;justify-content:center!important}
  .detail-body{padding:18px 10px 42px!important}
}
@media (max-width:480px){
  .detail-content{padding:24px 16px 28px!important}
  .detail-actions .btn{min-height:44px!important}
}

/* Bunny thumbnail: remove all outer black framing. Keep the preview at native
   16:9 and crop only the player's own letterbox, not the card itself. */
#pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview{
  aspect-ratio:16/9!important;
  width:100%!important;
  height:auto!important;
  background:transparent!important;
  border-radius:0!important;
  border:0!important;
  overflow:hidden!important;
}
#pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview .bunny-live-frame{
  width:142%!important;
  height:142%!important;
  left:-21%!important;
  top:-21%!important;
  right:auto!important;
  bottom:auto!important;
  transform:none!important;
  background:#000!important;
}
@media(max-width:720px){
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview .bunny-live-frame{
    width:148%!important;height:148%!important;left:-24%!important;top:-24%!important;
  }
}
@media(max-width:480px){
  #pageDetailEpisodes .episode-thumb-wrap.bunny-live-preview .bunny-live-frame{
    width:152%!important;height:152%!important;left:-26%!important;top:-26%!important;
  }
}

/* No star in VIP LOCKED badge. */
#pageDetailEpisodes .episode-vip-shade span::before,
#pageDetailEpisodes .episode-vip-shade span::after{content:none!important}

/* ===== STYLE BLOCK ===== */

/* V11: mobile shows the complete banner at its natural aspect ratio.
   No poster/crop on the detail page; posters remain only on home/cards. */
#detailPage .detail-cover{
  background-size:cover!important;
  background-position:center center!important;
  background-repeat:no-repeat!important;
  border-radius:0!important;
}
#detailPage .season-hero{display:none!important;}

@media(max-width:720px){
  #detailPage .detail-banner{
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:visible!important;
    background:#000!important;
  }
  #detailPage .detail-cover{
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:auto!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    background-size:100% auto!important;
    background-position:center top!important;
    background-repeat:no-repeat!important;
    background-color:#000!important;
  }
  #detailPage .detail-cover:after,#detailPage .detail-cover-title{display:none!important;}
  #detailPage .detail-banner-main{
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    overflow:visible!important;
    background:#090909!important;
  }
  #detailPage .detail-art{display:none!important;}
  #detailPage .detail-banner-main:after{display:none!important;}
  #detailPage .detail-content{
    position:relative!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    padding:22px 16px 24px!important;
    box-sizing:border-box!important;
    background:#090909!important;
  }
  #detailPage .detail-copy h1{font-size:clamp(28px,8vw,38px)!important;line-height:.98!important;margin:4px 0 12px!important;}
  #detailPage .detail-desc{font-size:14px!important;line-height:1.5!important;margin-bottom:16px!important;-webkit-line-clamp:none!important;}
  #detailPage .detail-actions{width:100%!important;display:flex!important;flex-direction:column!important;gap:8px!important;margin:0!important;}
  #detailPage .detail-actions .btn{width:100%!important;min-height:44px!important;font-size:12px!important;}
}

/* ===== STYLE BLOCK ===== */

/* ONLY Dragon Ball Z Season 1 and Season 2 use the user's supplied Drive banners.
   Seasons 3-9 keep their existing banners. Home/card covers are untouched. */

/* ===== STYLE BLOCK ===== */

/* ONLY DBZ Season 1 and Season 2 use the user's supplied Drive banners.
   Seasons 3-9 use the original season artwork from the base HTML.
   Home/card covers are untouched. */

/* ===== STYLE BLOCK ===== */

/* AUTHORITATIVE: only Dragon Ball Z Season 1 uses the user's supplied Drive image. */

/* ===== STYLE BLOCK ===== */

/* AOT: user-supplied hero + home card assets only */

/* ===== STYLE BLOCK ===== */

#pageDetailTrailerBtn,.detail-trailer,.detail-trailer-head,.detail-trailer-frame,.official-trailer-link,.trailer-external{display:none!important;}
#pageDetailTrailerBtn.tonflix-show-trailer{display:inline-flex!important;}
#pageDetailTrailerBtn.tonflix-show-trailer:hover{transform:translateY(-1px);}
#detailPage[data-demon-details-active="1"] .detail-body{display:none!important;}
#detailPage[data-demon-details-active="0"] .detail-body{display:block!important;}
#homeContent .row .card .poster,
#row-top10 .card .poster,
#row-favorites .card .poster{
  background-size:cover!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
}
#homeContent .row .card .poster > img:not(.aot-flag-icon),
#row-top10 .card .poster > img:not(.aot-flag-icon),
#row-favorites .card .poster > img:not(.aot-flag-icon){
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
}
#row-movies .card[data-title="Demon City"] .poster,
#row-top10 .card[data-title="Demon City"] .poster,
#row-favorites .card[data-title="Demon City"] .poster{
  background-image:url("/images/demoncitycard.webp")!important;
  background-size:cover!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
  background-color:#080808!important;
}
#heroSlider .slide[data-detail-title="Demon City"]{
  background:linear-gradient(90deg,rgba(0,0,0,.72),rgba(0,0,0,.18)),url("/images/demoncityhero.webp?v=20260826-2k") center/cover no-repeat!important;
}
.detail-scene-section{max-width:1640px;margin:0 auto 36px;padding:0 30px;}
.detail-scene-header{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin:0 0 18px;}
.detail-scene-header h2{margin:6px 0 0;font-size:26px;line-height:1.1;}
.detail-scene-header p{margin:0;max-width:620px;color:rgba(255,255,255,.72);font-size:15px;line-height:1.5;}
.detail-scene-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;}
.detail-scene-card{margin:0;position:relative;overflow:hidden;border-radius:16px;border:1px solid rgba(255,255,255,.10);background:#09090b;box-shadow:0 12px 30px rgba(0,0,0,.25);}
.detail-scene-card img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;transition:transform .28s ease,filter .28s ease;}
.detail-scene-card:hover{border-color:rgba(255,255,255,.32);}
.detail-scene-card:hover img{transform:scale(1.045);filter:brightness(1.08);}
.detail-scene-card figcaption{position:absolute;left:10px;bottom:10px;padding:6px 9px;border-radius:999px;background:rgba(0,0,0,.6);backdrop-filter:blur(8px);font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;}
@media(max-width:1280px){.detail-scene-grid{grid-template-columns:repeat(3,minmax(0,1fr));}}
@media(max-width:900px){.detail-scene-header{flex-direction:column;align-items:flex-start}.detail-scene-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:640px){.detail-scene-section{padding:0 12px}.detail-scene-grid{grid-template-columns:1fr}.detail-scene-header h2{font-size:22px}}

/* ===== STYLE BLOCK ===== */

#pageDetailEpisodes .ep-num .episode-label{
  color:#fff!important;
  font-weight:900!important;
  opacity:1!important;
  visibility:visible!important;
}
#pageDetailEpisodes .ep-num > span:last-child{
  color:#e50914!important;
  font-weight:900!important;
  opacity:1!important;
  visibility:visible!important;
}

/* ===== STYLE BLOCK ===== */

@media (max-width:720px){
  #pageDetailEpisodes .episode-row{
    grid-template-columns:minmax(138px,42%) minmax(0,1fr) 30px!important;
    column-gap:10px!important;
    row-gap:6px!important;
    align-items:center!important;
  }
  #pageDetailEpisodes .episode-thumb-wrap,
  #pageDetailEpisodes .bunny-hover-preview,
  #pageDetailEpisodes .static-episode-thumb{
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:16/9!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }
  #pageDetailEpisodes .episode-thumb-wrap{
    align-self:center!important;
  }
  #pageDetailEpisodes .episode-thumb-wrap img,
  #pageDetailEpisodes .static-episode-thumb img,
  #pageDetailEpisodes .episode-thumb-wrap .clean-episode-thumb{
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    max-width:none!important;
    max-height:none!important;
    object-fit:cover!important;
    object-position:center!important;
    display:block!important;
  }
}
@media (max-width:480px){
  #pageDetailEpisodes .episode-row{
    grid-template-columns:minmax(132px,43%) minmax(0,1fr) 26px!important;
    column-gap:8px!important;
  }
}

/* ===== STYLE BLOCK ===== */

/* Remove the extra TONFLIX fullscreen icon; keep only the original player fullscreen control. */
  #tonflixHardFullscreenButton, #tonflixFullscreenHitTarget{
    display:none!important;
    visibility:hidden!important;
    opacity:0!important;
    width:0!important;
    height:0!important;
    pointer-events:none!important;
  }

/* ===== STYLE BLOCK ===== */

#videoModalOverlay #tonflixStandaloneClose{
  position:absolute!important; top:12px!important; left:50%!important; right:auto!important;
  transform:translateX(-50%)!important; z-index:2147483647!important;
  width:46px!important; height:46px!important; min-width:46px!important; min-height:46px!important;
  display:none!important; opacity:1!important; visibility:visible!important; pointer-events:auto!important;
  transition:opacity .18s ease,visibility .18s ease!important;
}
#videoModalOverlay #tonflixStandaloneClose.is-open{display:flex!important;}
#videoModalOverlay #tonflixStandaloneClose.tonflix-ui-hidden{
  opacity:0!important; visibility:hidden!important; pointer-events:none!important;
}
#tonflixUiWakeLayer{
  position:absolute!important; inset:0!important; z-index:2147483646!important;
  display:none!important; background:transparent!important; pointer-events:auto!important;
}
#videoModalOverlay .video-modal.tonflix-ui-idle-wake #tonflixUiWakeLayer{display:block!important;}
#videoModalOverlay .video-modal.tonflix-ui-awake #tonflixUiWakeLayer{display:none!important;}
.video-modal.tonflix-player-fullscreen > #tonflixStandaloneClose{
  position:fixed!important; top:10px!important; left:50%!important; right:auto!important;
  transform:translateX(-50%)!important; z-index:2147483647!important;
}
@media(max-width:720px){
  #videoModalOverlay #tonflixStandaloneClose{
    top:8px!important; width:44px!important; height:44px!important;
    min-width:44px!important; min-height:44px!important;
  }
  .video-modal.tonflix-player-fullscreen > #tonflixStandaloneClose{top:8px!important;}
}

/* ===== STYLE BLOCK ===== */

#tonflixVastPreroll .tonflix-learn-more,
#tonflixVastPreroll #tonflixLearnMore,
#tonflixVastPreroll [data-tonflix-learn-more],
#tonflixVastPreroll a[aria-label*="Learn more" i]{display:none!important;visibility:hidden!important;pointer-events:none!important;}

/* ===== STYLE BLOCK ===== */

/* Each separate season card uses the exact same artwork as that season's detail hero. */
#row-anime-seasons .season-collection-card .poster{
  background-size:cover!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
}

/* ===== STYLE BLOCK ===== */

#pageDetailFavoriteBtn.favorite-btn{
    color:#e50914!important;
    border-color:rgba(229,9,20,.75)!important;
    background:rgba(229,9,20,.10)!important;
    font-weight:900!important;
    text-shadow:0 0 8px rgba(229,9,20,.35);
    box-shadow:0 0 0 1px rgba(229,9,20,.10),0 0 18px rgba(229,9,20,.10);
  }
  #pageDetailFavoriteBtn.favorite-btn.is-favorite{
    color:#A8FF00!important;
    border-color:rgba(168,255,0,.90)!important;
    background:rgba(168,255,0,.16)!important;
    box-shadow:0 0 0 1px rgba(168,255,0,.18),0 0 20px rgba(168,255,0,.20);
  }
  #pageDetailFavoriteBtn.favorite-btn:focus,
  #pageDetailFavoriteBtn.favorite-btn:hover{
    color:#ff4a54!important;
    border-color:#e50914!important;
  }

/* ===== STYLE BLOCK ===== */

#row-top10 .favorite-star,
#row-top10 .top10-favorite-star,
#row-top10 .top10-star,
#row-top10 [data-favorite-star="1"]{display:none!important;visibility:hidden!important;pointer-events:none!important;}

/* ===== STYLE BLOCK ===== */

#row-favorites .card[data-season-index] .poster{
    background-size:cover!important;
    background-position:center!important;
    background-repeat:no-repeat!important;
  }

/* ===== STYLE BLOCK ===== */

/* FINAL: My Favorites is rendered once with preloaded artwork, then frozen.
     This prevents legacy renderers from repainting cards and causing image flashes. */
  #row-favorites.tonflix-favorites-booting{visibility:hidden!important;}
  #row-favorites.tonflix-favorites-frozen{visibility:visible!important;}
  #row-favorites.tonflix-favorites-frozen .poster{background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important;}

/* ===== STYLE BLOCK ===== */

#pageDetail.demon-city-active .detail-cover,
  #pageDetail.demon-city-active .detail-art{
    background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important;
  }
  #pageDetail.demon-city-active .detail-cover:after{background:linear-gradient(180deg,transparent 52%,rgba(0,0,0,.72) 100%)!important;}
  #pageDetail.demon-city-active .demon-watch-btn{
    background:#fff!important;color:#000!important;font-weight:800!important;
  }
  #demonCityWatchModal{position:fixed;inset:0;background:rgba(0,0,0,.92);display:none;align-items:center;justify-content:center;padding:18px;z-index:300;}
  #demonCityWatchModal.open{display:flex;}
  #demonCityWatchModal .demon-watch-shell{width:min(1120px,100%);position:relative;}
  #demonCityWatchModal .demon-watch-frame{position:relative;width:100%;aspect-ratio:16/9;background:#000;border-radius:10px;overflow:hidden;border:1px solid rgba(255,255,255,.14);box-shadow:0 25px 80px rgba(0,0,0,.6)}
  #demonCityWatchModal iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;}
  #demonCityWatchModal .demon-watch-close{position:absolute;right:0;top:-46px;width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.22);background:#171717;color:#fff;cursor:pointer;font-size:18px;z-index:2;}
  #demonCityWatchModal .demon-watch-close:hover{background:#e50914;border-color:#e50914;}
  @media(max-width:700px){#demonCityWatchModal{padding:10px}#demonCityWatchModal .demon-watch-close{top:-44px;right:0}}

/* ===== STYLE BLOCK ===== */

/* Demon City uses the same VAST + Bunny playback pipeline as anime.
   The custom Demon City iframe modal is fallback-only. */
#demonCityWatchModal{display:none!important;visibility:hidden!important;pointer-events:none!important;}

/* ===== STYLE BLOCK ===== */

#detailPage .demon-watch-btn.tonflix-watch-v24{position:relative;z-index:20;pointer-events:auto!important;cursor:pointer!important;}

/* ===== STYLE BLOCK ===== */

/* FINAL AUTHORITY: DBZ season HERO images are independent from the Season cards. */

/* ===== STYLE BLOCK ===== */

/* Detail pages must never show the Home hero/slider above the title banner. */
body.detail-open #heroSlider,
body.detail-open .mobile-hero-fallback{
  display:none!important;
  visibility:hidden!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  overflow:hidden!important;
  margin:0!important;
  padding:0!important;
}

/* ===== STYLE BLOCK ===== */

/* Tagalog Anime uses the exact same artwork as the matching Anime card. */
  #row-tagalog-anime .card[data-title] .poster{
    background-size:contain!important;
    background-repeat:no-repeat!important;
    background-position:center!important;
  }

/* ===== STYLE BLOCK ===== */

:root{--neon:#A8FF00!important;}

  /* Normalize remaining hard-coded green UI accents without touching red states. */
  .detail-meta,.ep-play,.tv-hint b,.vip-pill,.plan-name,.plan-bonus,
  .lockbadge small,.detail-tagalog-badge,.dub-badge,.tonflix-tagalog-badge-final,
  .hero .hero-tagalog-badge .label,
  .hero .hero-tagalog-badge .flag-svg,
  .media-card .badge{color:#A8FF00!important;}

  .hd-badge,.plan-tag,.mplan.best-choice::after{background:#A8FF00!important;color:#091006!important;}

  .dub-badge,.tonflix-tagalog-badge-final,.detail-tagalog-badge,
  .vip-pill,.mplan.selected{border-color:#A8FF00!important;}

  .tv-focusable:focus-visible,
  .tv-focusable.tv-focus,
  .card.tv-focusable:focus-visible .poster,
  .card.tv-focusable.tv-focus .poster,
  .rank-card.tv-focusable:focus-visible .poster,
  .rank-card.tv-focusable.tv-focus .poster{outline-color:#A8FF00!important;box-shadow:0 0 0 3px #A8FF00,0 18px 34px -12px rgba(0,0,0,.7)!important;}

  /* Add to Favorites: neutral like Back to Browse until actually added. */
  #pageDetailFavoriteBtn.favorite-btn{
    color:#fff!important;
    background:rgba(255,255,255,.10)!important;
    border:1px solid rgba(255,255,255,.20)!important;
    box-shadow:none!important;
    text-shadow:none!important;
  }
  #pageDetailFavoriteBtn.favorite-btn:hover,
  #pageDetailFavoriteBtn.favorite-btn:focus,
  #pageDetailFavoriteBtn.favorite-btn:focus-visible{
    color:#fff!important;
    background:rgba(255,255,255,.14)!important;
    border-color:rgba(255,255,255,.28)!important;
    box-shadow:none!important;
  }

  /* Added state: Apple Green. */
  #pageDetailFavoriteBtn.favorite-btn.is-favorite{
    color:#A8FF00!important;
    background:rgba(168,255,0,.14)!important;
    border-color:rgba(168,255,0,.90)!important;
    box-shadow:0 0 0 1px rgba(168,255,0,.12),0 0 20px rgba(168,255,0,.14)!important;
    text-shadow:none!important;
  }
  #pageDetailFavoriteBtn.favorite-btn.is-favorite:hover,
  #pageDetailFavoriteBtn.favorite-btn.is-favorite:focus,
  #pageDetailFavoriteBtn.favorite-btn.is-favorite:focus-visible{
    color:#A8FF00!important;
    background:rgba(168,255,0,.18)!important;
    border-color:#A8FF00!important;
  }

  /* Back to Browse always remains an active, clickable normal button. */
  #detailPage .back-btn{
    pointer-events:auto!important;
    opacity:1!important;
    cursor:pointer!important;
    color:#fff!important;
    background:rgba(255,255,255,.10)!important;
    border:1px solid rgba(255,255,255,.20)!important;
  }

/* ===== STYLE BLOCK ===== */

#pageDetailEpisodes .episode-thumb-wrap img[data-dbz-s2-current-hero="1"] {
    object-fit: cover !important;
    object-position: center !important;
  }

/* ===== STYLE BLOCK ===== */

#row-favorites .poster .tonflix-tagalog-badge-final,
  #row-favorites .poster .dub-badge[data-tonflix-tagalog-badge],
  #row-favorites .poster .dub-badge.tonflix-favorites-tagalog-single{
    z-index:15!important;
  }

/* ===== STYLE BLOCK ===== */

.english-badge{display:flex!important;align-items:center;gap:4px}.english-badge img{width:22px!important;height:15px!important;object-fit:cover!important;border-radius:2px!important}
.single-movie-player-card{width:100%;max-width:1100px;margin:18px auto 0;background:linear-gradient(160deg,#15181d,#0b0d10);border:1px solid rgba(255,255,255,.10);border-radius:14px;padding:14px;box-shadow:0 18px 45px rgba(0,0,0,.28)}
.single-movie-player-label{display:flex;align-items:center;gap:7px;color:var(--neon);font:800 11px 'JetBrains Mono',monospace;letter-spacing:.08em;text-transform:uppercase;margin:0 0 10px}.single-movie-player-label img{width:24px;height:16px;object-fit:cover;border-radius:2px}
.single-movie-player{position:relative;width:100%;aspect-ratio:16/9;background:#000;border-radius:10px;overflow:hidden}.single-movie-player iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
@media(max-width:700px){.single-movie-player-card{margin-top:14px;padding:10px;border-radius:12px}.single-movie-player-label{font-size:9.5px}}

/* ===== STYLE BLOCK ===== */

#tonflixLearnMore, #tonflix-learn-more, .tonflix-learn-more, #tonflixVastLearnMore, .tonflix-vast-learn-more{
  display:none!important; visibility:hidden!important; opacity:0!important; pointer-events:none!important;
}

/* ===== STYLE BLOCK ===== */

/* Episode row: left-align ALL episode text without changing season cards. */
#pageDetailEpisodes .ep-num,
#pageDetailEpisodes .ep-info,
#pageDetailEpisodes .ep-info h5,
#pageDetailEpisodes .ep-info span{
  text-align:left!important;
  justify-content:flex-start!important;
}

/* ===== STYLE BLOCK ===== */

#row-anime-seasons .season-collection-card[data-title="Dragon Ball Z"][data-season-index="3"] .poster,
#row-anime-seasons .season-collection-card[data-title="Dragon Ball Z"][data-season-index="4"] .poster,
#row-anime-seasons .season-collection-card[data-title="Dragon Ball Z"][data-season-index="5"] .poster,
#row-anime-seasons .season-collection-card[data-title="Dragon Ball Z"][data-season-index="6"] .poster,
#row-anime-seasons .season-collection-card[data-title="Dragon Ball Z"][data-season-index="7"] .poster,
#row-anime-seasons .season-collection-card[data-title="Dragon Ball Z"][data-season-index="8"] .poster{
  background-size:cover!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
}

/* ===== STYLE BLOCK ===== */

#row-anime-seasons .season-collection-card .season-card-image{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  display:block!important;
  object-fit:cover!important;
  object-position:center!important;
  z-index:1!important;
}
#row-anime-seasons .season-collection-card[data-title="Dragon Ball Z"] .poster{
  overflow:hidden!important;
}
#row-anime-seasons .season-collection-card[data-title="Dragon Ball Z"] .season-collection-badge,
#row-anime-seasons .season-collection-card[data-title="Dragon Ball Z"] .season-collection-number{
  z-index:3!important;
}

/* ===== STYLE BLOCK ===== */

#row-anime .card[data-title="Attack on Titan Junior High"] .poster,
  #row-anime-tagalog .card[data-title="Attack on Titan Junior High"] .poster,
  #row-anime-seasons .card[data-title="Attack on Titan Junior High"] .poster,
  .card[data-title="Attack on Titan Junior High"] .poster{
    background-image:url("/images/local-artwork/drive-1ve5uu8k2fQQSPT0SGcdgDpCBqskqnuJZ.webp") !important;
    background-size:cover !important;
    background-position:center !important;
    background-repeat:no-repeat !important;
  }

/* ===== STYLE BLOCK ===== */

/* Premium desktop account popup */
@media (min-width:721px){
  #authModalOverlay .auth-modal{
    width:min(560px,calc(100vw - 48px))!important;
    max-width:560px!important;
    padding:34px 34px 30px!important;
    border-radius:24px!important;
    background:
      radial-gradient(circle at 8% 4%,rgba(229,9,20,.16),transparent 34%),
      linear-gradient(160deg,rgba(24,27,34,.99),rgba(10,12,16,.99))!important;
    border:1px solid rgba(255,255,255,.13)!important;
    box-shadow:0 34px 100px rgba(0,0,0,.72),0 0 0 1px rgba(255,255,255,.025) inset,0 0 55px rgba(229,9,20,.06)!important;
    overflow:hidden!important;
  }
  #authModalOverlay .auth-modal::before{
    content:"";
    position:absolute;
    left:0;top:0;bottom:0;width:4px;
    background:linear-gradient(180deg,#ff3b45,#e50914 55%,#8a060d);
    border-radius:24px 0 0 24px;
  }
  #authModalOverlay .auth-modal::after{
    content:"ACCOUNT";
    position:absolute;
    top:24px;left:34px;
    color:#ff6670;
    font:800 10px 'JetBrains Mono',monospace;
    letter-spacing:.18em;
  }
  #authModalOverlay #authModalTitle{
    font-size:32px!important;
    line-height:1.05!important;
    margin:22px 58px 8px 0!important;
    color:#fff!important;
    letter-spacing:-.02em!important;
  }
  #authModalOverlay #authModalSub{
    margin:0!important;
    color:#b9bec8!important;
    font-size:15px!important;
    line-height:1.55!important;
    max-width:450px!important;
    word-break:break-word!important;
  }
  #authModalOverlay .auth-fields{margin:18px 0 8px!important;gap:10px!important;}
  /* Keep sign-in fields visible on desktop. */
  #authModalOverlay #authEmail,
  #authModalOverlay .auth-password-field,
  #authModalOverlay #authRememberWrap{
    display:block!important;
  }
  /* Logged-in users should see the account panel, not the sign-in form. */
  body.auth-signed-in #authModalOverlay #authEmail,
  body.auth-signed-in #authModalOverlay .auth-password-field,
  body.auth-signed-in #authModalOverlay #authRememberWrap{
    display:none!important;
  }
  #authModalOverlay #authRememberWrap{display:flex!important;}
  #authModalOverlay #authError{
    min-height:0!important;
    margin:0 0 14px!important;
  }
  #authModalOverlay #authSignoutBtn{
    display:block!important;
    width:100%!important;
    margin-top:20px!important;
    padding:14px 16px!important;
    border-radius:12px!important;
    border:1px solid rgba(255,255,255,.13)!important;
    background:linear-gradient(180deg,#17191e,#111318)!important;
    color:#fff!important;
    font-size:14px!important;
    font-weight:800!important;
    letter-spacing:.01em!important;
    box-shadow:0 10px 24px rgba(0,0,0,.25)!important;
  }
  #authModalOverlay #authSignoutBtn:hover{
    border-color:rgba(229,9,20,.62)!important;
    background:linear-gradient(180deg,rgba(229,9,20,.14),#111318)!important;
    color:#fff!important;
    transform:translateY(-1px);
  }
  #authModalOverlay .modal-close{
    top:18px!important;right:18px!important;
    width:42px!important;height:42px!important;
    border-radius:50%!important;
    background:rgba(255,255,255,.035)!important;
    border:1px solid rgba(255,255,255,.12)!important;
    color:#ddd!important;
  }
  #authModalOverlay .modal-close:hover{
    background:rgba(229,9,20,.14)!important;
    border-color:rgba(229,9,20,.55)!important;
    color:#fff!important;
  }
  #authModalOverlay .auth-modal .auth-signout::before{
    content:"↪";
    display:inline-block;
    margin-right:8px;
    color:#ff5963;
    font-size:15px;
  }
}

/* ===== STYLE BLOCK ===== */

#detailPage[data-ippo-hero="1"] #detailBannerImg{display:block!important;width:100%!important;height:auto!important;opacity:1!important;visibility:visible!important;}
  #detailPage[data-ippo-hero="1"] #detailArt{display:block!important;background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important;}
  #detailPage[data-ippo-hero="1"] .detail-cover{display:block!important;background-color:#000!important;background-image:none!important;}

/* ===== STYLE BLOCK ===== */

/* IPPO card images only: keep cards/content, remove artwork. */
#row-anime .card[data-title="Knock Out: IPPO"] .poster,
#row-anime-seasons .season-collection-card[data-title="Knock Out: IPPO"] .poster{
  background-image:none!important;
  background-color:#111827!important;
}
#row-anime .card[data-title="Knock Out: IPPO"] .poster > img,
#row-anime-seasons .season-collection-card[data-title="Knock Out: IPPO"] .poster img.season-card-image{
  display:none!important;
}

/* ===== STYLE BLOCK ===== */

/* IPPO desktop detail: remove the small duplicate cover above the main banner. */
@media (min-width:721px){
  #detailPage[data-ippo-hero="1"] #detailCover{
    display:none!important;
    width:0!important;
    height:0!important;
    min-height:0!important;
    padding:0!important;
    margin:0!important;
    overflow:hidden!important;
    background:none!important;
  }
}

/* ===== STYLE BLOCK ===== */

@media(max-width:720px){
  #detailPage[data-ippo-hero="1"] #detailArt{
    display:none!important;
    background-image:none!important;
  }
  #detailPage[data-ippo-hero="1"] .detail-banner-main{
    display:block!important;
    width:100%!important;
    min-height:0!important;
    height:auto!important;
    overflow:visible!important;
    background:#000!important;
  }
  #detailPage[data-ippo-hero="1"] .detail-cover{
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:auto!important;
    overflow:hidden!important;
    background:#000!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
  }
  #detailPage[data-ippo-hero="1"] #detailBannerImg{
    display:block!important;
    width:100%!important;
    height:auto!important;
    max-width:100%!important;
    max-height:none!important;
    object-fit:contain!important;
    object-position:center top!important;
  }
}

/* ===== STYLE BLOCK ===== */

.tonflix-direct-media-btn{
    position:absolute!important;
    top:8px!important;
    right:8px!important;
    z-index:20!important;
    width:30px!important;
    height:30px!important;
    min-width:30px!important;
    min-height:30px!important;
    padding:0!important;
    border-radius:50%!important;
    border:1px solid rgba(255,255,255,.26)!important;
    background:rgba(12,12,12,.82)!important;
    color:#fff!important;
    display:none!important;
    place-items:center!important;
    font-size:14px!important;
    line-height:1!important;
    cursor:pointer!important;
    box-shadow:0 4px 14px rgba(0,0,0,.28)!important;
    backdrop-filter:blur(6px)!important;
  }
  .tonflix-direct-media-btn:hover{
    border-color:rgba(168,255,0,.75)!important;
    color:#A8FF00!important;
    background:rgba(10,20,16,.95)!important;
  }
  body.admin-full-access .tonflix-direct-media-btn{display:grid!important;}
  .tonflix-direct-media-host{position:relative!important;}
  #detailPage .tonflix-direct-media-btn{
    top:50%!important; left:50%!important; right:auto!important;
    transform:translate(-50%,-50%)!important;
  }

  .poster .tonflix-direct-media-btn,
  .season-collection-card .poster .tonflix-direct-media-btn{
    top:50%!important;
    left:50%!important;
    right:auto!important;
    transform:translate(-50%,-50%)!important;
    width:28px!important;
    height:28px!important;
    min-width:28px!important;
    min-height:28px!important;
    font-size:13px!important;
  }
  @media(max-width:720px){
    .tonflix-direct-media-btn{width:28px!important;height:28px!important;min-width:28px!important;min-height:28px!important;font-size:13px!important;}
  }
  #tonflixDirectMediaInput{display:none!important;}
  #heroSlider > .tonflix-slider-direct-upload{
    position:absolute!important; left:14px!important; top:14px!important; right:auto!important; z-index:80!important;
    width:34px!important; height:34px!important; min-width:34px!important; min-height:34px!important;
  }
  @media(max-width:720px){#heroSlider > .tonflix-slider-direct-upload{left:10px!important;top:10px!important;width:30px!important;height:30px!important;min-width:30px!important;min-height:30px!important;}}

/* ===== STYLE BLOCK ===== */

/* Top 10 is rendered only after the season-card source is ready, preventing
     the default anime cover from flashing before the exact season card is applied. */
  #top10 #row-top10{visibility:hidden!important;}
  #top10.top10-ready #row-top10{visibility:visible!important;}
  #row-top10 .top10-favorite-star,
  #row-top10 .favorite-star,
  #row-top10 [data-favorite-star="1"]{display:none!important;}

/* ===== STYLE BLOCK ===== */

/* Upload feature is intentionally disabled for Top 10 and My Favorites. */
  #row-top10 .tonflix-direct-media-btn,
  #row-favorites .tonflix-direct-media-btn,
  #heroSlider .tonflix-slider-direct-upload,
  #heroSlider .tonflix-direct-media-btn{display:none!important;pointer-events:none!important;}

  /* Keep the card clean; only Favorites gets the green star. */
  #row-top10 .tonflix-favorite-star,
  #row-top10 .favorite-star,
  #row-top10 [data-favorite-star="1"]{display:none!important;}

  /* Match the existing card Tagalog badge exactly: upper-right, green accent. */
  .tonflix-tagalog-badge-final{
    position:absolute!important;
    top:9px!important;
    right:9px!important;
    left:auto!important;
    bottom:auto!important;
    z-index:15!important;
    display:flex!important;
    align-items:center!important;
    gap:4px!important;
    padding:3px 7px!important;
    border-radius:3px!important;
    background:rgba(0,0,0,.65)!important;
    border:1px solid var(--neon)!important;
    color:var(--neon)!important;
    font-family:'JetBrains Mono',monospace!important;
    font-size:9.5px!important;
    font-weight:700!important;
    letter-spacing:.03em!important;
    line-height:1!important;
    box-shadow:none!important;
    pointer-events:none!important;
    text-transform:uppercase!important;
  }
  .tonflix-tagalog-badge-final img{
    width:24px!important;
    height:16px!important;
    object-fit:cover!important;
    border-radius:2px!important;
    display:block!important;
    flex:0 0 auto!important;
  }
  #row-top10 .poster > .tonflix-tagalog-badge-final,
  #row-favorites .poster > .tonflix-tagalog-badge-final{
    top:9px!important;
    right:9px!important;
    min-width:0!important;
    width:auto!important;
    height:24px!important;
    min-height:24px!important;
    max-height:24px!important;
    box-sizing:border-box!important;
    white-space:nowrap!important;
  }
  #row-top10 .poster > .tonflix-tagalog-badge-final img,
  #row-favorites .poster > .tonflix-tagalog-badge-final img{
    width:22px!important;
    height:15px!important;
  }
  #row-top10 .poster > .tonflix-tagalog-badge-final span,
  #row-favorites .poster > .tonflix-tagalog-badge-final span{
    display:block!important;
    line-height:1!important;
  }
  @media(max-width:720px){
    .tonflix-tagalog-badge-final{top:7px!important;right:7px!important;padding:3px 6px!important;font-size:8.5px!important;}
    .tonflix-tagalog-badge-final img{width:22px!important;height:15px!important;}
  }

/* ===== STYLE BLOCK ===== */

#row-anime .card[data-title="Knock Out: IPPO"] .poster .dub-badge,
  #row-tagalog-anime .card[data-title="Knock Out: IPPO"] .poster .dub-badge,
  #row-anime .card[data-title="Knock Out: IPPO"] .poster [data-tonflix-tagalog-badge],
  #row-tagalog-anime .card[data-title="Knock Out: IPPO"] .poster [data-tonflix-tagalog-badge]{
    display:flex!important;position:absolute!important;top:8px!important;right:8px!important;left:auto!important;z-index:20!important;
  }

/* ===== STYLE BLOCK ===== */

#pageDetailEpisodes[data-dbz-season="1"] .episode-thumb-wrap img.episode-thumb,
  #pageDetailEpisodes[data-dbz-season="1"] .episode-thumb-wrap img.static-episode-thumb,
  #pageDetailEpisodes[data-dbz-season="1"] .episode-thumb-wrap .clean-episode-thumb,
  #pageDetailEpisodes[data-dbz-season="1"] .episode-thumb-wrap .bunny-preview-fallback{
    object-fit:cover!important;
    object-position:center!important;
  }

/* Language text remains visible, but hide country flag artwork site-wide. */
#pageDetailMeta .aot-flag-icon{
  display:none!important;
  visibility:hidden!important;
  width:0!important;
  height:0!important;
  margin:0!important;
}

/* Keep every episode thumbnail edge-to-edge, including Bunny previews that
   contain their own letterbox bars. The wrapper clips the small crop so no
   black side gaps are visible on any anime or season page. */
#pageDetailEpisodes .episode-thumb-wrap > img,
#pageDetailEpisodes .episode-thumb-wrap > .static-episode-thumb,
#pageDetailEpisodes .episode-thumb-wrap > .clean-episode-thumb,
#pageDetailEpisodes .episode-thumb-wrap > .bunny-preview-fallback{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  transform:scale(1.38)!important;
  transform-origin:center center!important;
  max-width:none!important;
  max-height:none!important;
}
#pageDetailEpisodes .episode-thumb-wrap .bunny-hover-iframe{
  transform:scale(1.30)!important;
  transform-origin:center center!important;
}

/* ===== STYLE BLOCK ===== */

#row-favorites .card[data-favorite-key][data-season-index] .poster{
    background-size:cover!important;
    background-position:center!important;
    background-repeat:no-repeat!important;
  }

/* ===== STYLE BLOCK ===== */

#row-favorites .card[data-favorite-key][data-season-index] .poster{
    background-size:cover!important;
    background-position:center!important;
    background-repeat:no-repeat!important;
  }
  #row-favorites .card[data-favorite-key] .poster{overflow:hidden!important;}

/* ===== STYLE BLOCK ===== */

/* Demon City: no embedded Bunny player on the detail page. */
#pageDetail .single-movie-player-card,
#pageDetail .single-movie-player,
#pageDetail .single-movie-player iframe{
  display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;
}

/* ===== STYLE BLOCK ===== */

#detailPage[data-demon-city-hero-ready="1"] #detailBannerImg{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center!important;
  }
  #detailPage[data-demon-city-hero-ready="1"] #detailArt{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
    background-size:cover!important;
    background-position:center!important;
    background-repeat:no-repeat!important;
  }
  #detailPage[data-demon-city-hero-ready="1"] .detail-cover{
    background-size:cover!important;
    background-position:center!important;
    background-repeat:no-repeat!important;
  }

/* ===== STYLE BLOCK ===== */

@media (max-width:720px){
  #detailPage.demon-city-active .detail-art,
  #detailPage[data-demon-city-hero-ready="1"] .detail-art{
    display:none!important;
    visibility:hidden!important;
    opacity:0!important;
    background-image:none!important;
    pointer-events:none!important;
    height:0!important;
    min-height:0!important;
    max-height:0!important;
    overflow:hidden!important;
  }
  #detailPage.demon-city-active .detail-banner-main,
  #detailPage[data-demon-city-hero-ready="1"] .detail-banner-main{
    min-height:0!important;
    height:0!important;
    background:#090909!important;
  }
}

/* ===== STYLE BLOCK ===== */

@media (max-width:720px){
  #detailPage.demon-city-active .detail-banner-main{background:#090909!important;}
  #detailPage.demon-city-active .detail-banner-main:after{display:none!important;}
  #detailPage.demon-city-active .detail-art{display:none!important;visibility:hidden!important;opacity:0!important;background-image:none!important;}
  #detailPage.demon-city-active .detail-cover{display:block!important;width:100%!important;height:auto!important;min-height:0!important;aspect-ratio:16/9!important;background:#000!important;background-image:none!important;overflow:hidden!important;}
  #detailPage.demon-city-active .detail-cover .detail-banner-img{display:block!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important;}
}

/* ===== STYLE BLOCK ===== */

#demonCityWatchModal{display:none!important;visibility:hidden!important;pointer-events:none!important;}
  #detailPage .demon-watch-btn.tonflix-watch-v25{pointer-events:auto!important;cursor:pointer!important;position:relative;z-index:25;}
#detailPage .demon-watch-btn.tonflix-watch-v25[data-loading="1"]{opacity:.7;pointer-events:none;}

/* FINAL DEMON CITY MOBILE FLOW + BUNNY SCENE GRID
   Keep the detail content in normal document flow and never crop the scene cards. */
@media (max-width:720px){
  #detailPage.demon-city-active,
  #detailPage[data-demon-details-active="1"]{
    height:auto!important;
    min-height:100vh!important;
    max-height:none!important;
    overflow:visible!important;
  }
  #detailPage.demon-city-active .detail-banner,
  #detailPage[data-demon-details-active="1"] .detail-banner{
    display:block!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:visible!important;
  }
  #detailPage.demon-city-active .detail-banner-main,
  #detailPage[data-demon-details-active="1"] .detail-banner-main{
    display:block!important;
    position:relative!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    overflow:visible!important;
  }
  #detailPage.demon-city-active .detail-content,
  #detailPage[data-demon-details-active="1"] .detail-content{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    padding:18px 12px 22px!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }
  #detailPage.demon-city-active #pageDetailTitle{
    width:100%!important;
    max-width:100%!important;
    overflow:visible!important;
    word-break:normal!important;
  }
  #pageDetailScenePreviews.detail-scene-section{
    display:block;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    max-height:none!important;
    margin:0 0 28px!important;
    padding:16px 10px 0!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }
  #pageDetailScenePreviews .detail-scene-grid{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    width:100%!important;
    height:auto!important;
    gap:12px!important;
    overflow:visible!important;
  }
  #pageDetailScenePreviews .detail-scene-card{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    aspect-ratio:16/9!important;
    margin:0!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }
  #pageDetailScenePreviews .detail-scene-card img{
    display:block!important;
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    object-fit:cover!important;
    object-position:center!important;
    transform:none!important;
  }
  #pageDetailScenePreviews .detail-scene-card figcaption{
    left:8px!important;
    bottom:8px!important;
    max-width:calc(100% - 16px)!important;
    white-space:nowrap!important;
    font-size:11px!important;
  }
}

/* HOME PAGE CLEANUP: hide specific placeholder cards and the entire K-Drama row. */
#kdrama{display:none !important;}
.card[data-title="Neon Shrine"],
.card[data-title="Silver Fang"],
.card[data-title="Echoes of Ember"],
.card[data-title="Paper Moon Chronicles"],
.card[data-title="Iron Blossom"],
.card[data-title="Wolfsong Requiem"],
.card[data-title="Starlit Academy"],
.card[data-title="Obsidian Tide"],
.card[data-title="Drift King"],
.card[data-title="The Last Tide"],
.card[data-title="Glass Horizon"],
.card[data-title="Monsoon Heart"],
.card[data-title="Quiet Static"],
.card[data-title="Velvet Circuit"],
.card[data-title="Midnight Harvest"],
.card[data-title="Paper Lanterns"],
.card[data-title="The Long Detour"],
.card[data-title="Static Bloom"],
.card[data-title="Harbor Lights"]{
  display:none !important;
}


/* MOVIES HOME OVERRIDE: keep only Demon City visible. */
#row-movies .card:not([data-title="Demon City"]){
  display:none !important;
}

/* FINAL HOME VISIBILITY OVERRIDE: hide K-Drama section. */
#homeContent > #kdrama { display: none !important; visibility: hidden !important; }

/* FINAL MY FAVORITES CARD GEOMETRY
   Every renderer must produce the same visible card footprint. */
#row-favorites{
  align-items:flex-start!important;
  overscroll-behavior-x:contain!important;
}
#row-favorites > .card{
  flex:0 0 190px!important;
  width:190px!important;
  min-width:190px!important;
  max-width:190px!important;
  box-sizing:border-box!important;
}
#row-favorites > .card .poster{
  display:block!important;
  width:190px!important;
  height:265px!important;
  min-height:265px!important;
  max-height:265px!important;
  aspect-ratio:190/265!important;
  box-sizing:border-box!important;
  background-size:cover!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
}
#row-favorites > .card .card-info{
  width:100%!important;
  height:auto!important;
  min-height:52px!important;
  max-height:none!important;
  overflow:visible!important;
  box-sizing:border-box!important;
}
#row-favorites > .card .card-info p{
  display:block!important;
  width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
#row-favorites > .card .card-info h4,
#row-anime .card .card-info h4,
#row-tagalog-anime .card .card-info h4,
#row-anime-seasons .card .card-info h4,
#row-top10 .card[data-content-type="Anime"] .card-info h4{
  display:block!important;
  width:100%!important;
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
}

@media (min-width:1400px){
  #row-favorites > .card{
    flex-basis:220px!important;
    width:220px!important;
    min-width:220px!important;
    max-width:220px!important;
  }
  #row-favorites > .card .poster{
    width:220px!important;
    height:307px!important;
    min-height:307px!important;
    max-height:307px!important;
  }
}

/* FINAL HOME CARD GEOMETRY: Top 10 cards use the same portrait footprint as
   the other home rows. The rank number remains beside the card, but the
   poster itself must stay on the shared 190/265, 250/350, or 280/392 grid. */
.rank-card{
  flex:0 0 242px!important;
  box-sizing:border-box!important;
}
.rank-card .card{
  flex:0 0 190px!important;
  width:190px!important;
  min-width:190px!important;
  max-width:190px!important;
  box-sizing:border-box!important;
}
.rank-card .card .poster{
  width:190px!important;
  height:265px!important;
  min-height:265px!important;
  max-height:265px!important;
  aspect-ratio:190/265!important;
  box-sizing:border-box!important;
}
@media (min-width:900px){
  .rank-card{
    flex-basis:318px!important;
  }
  .rank-card .card{
    flex-basis:250px!important;
    width:250px!important;
    min-width:250px!important;
    max-width:250px!important;
  }
  .rank-card .card .poster{
    width:250px!important;
    height:350px!important;
    min-height:350px!important;
    max-height:350px!important;
    aspect-ratio:250/350!important;
  }
}
@media (min-width:1400px){
  .rank-card{
    flex-basis:356px!important;
  }
  .rank-card .card{
    flex-basis:280px!important;
    width:280px!important;
    min-width:280px!important;
    max-width:280px!important;
  }
  .rank-card .card .poster{
    width:280px!important;
    height:392px!important;
    min-height:392px!important;
    max-height:392px!important;
    aspect-ratio:280/392!important;
  }
}

/* FINAL PORTRAIT AUTHORITY: keep the supplied portrait cards from being
   reflowed into square footprints by row-specific renderers. */
#row-anime .card[data-title="Kuroko Basketball"],
#row-tagalog-anime .card[data-title="Kuroko Basketball"],
#row-anime-seasons .season-collection-card[data-title="Kuroko Basketball"],
#row-top10 .card[data-title="Kuroko Basketball"],
#row-anime .card[data-title="Is It Wrong to Try to Pick Up Girls in a Dungeon"],
#row-tagalog-anime .card[data-title="Is It Wrong to Try to Pick Up Girls in a Dungeon"],
#row-anime-seasons .season-collection-card[data-title="Is It Wrong to Try to Pick Up Girls in a Dungeon"],
#row-top10 .card[data-title="Is It Wrong to Try to Pick Up Girls in a Dungeon"],
#row-anime .card[data-title="Hunter x Hunter (1999)"],
#row-tagalog-anime .card[data-title="Hunter x Hunter (1999)"],
#row-anime-seasons .season-collection-card[data-title="Hunter x Hunter (1999)"],
#row-top10 .card[data-title="Hunter x Hunter (1999)"]{
  flex:0 0 190px!important;
  width:190px!important;
  min-width:190px!important;
  max-width:190px!important;
  box-sizing:border-box!important;
}
#row-anime .card[data-title="Kuroko Basketball"] .poster,
#row-tagalog-anime .card[data-title="Kuroko Basketball"] .poster,
#row-anime-seasons .season-collection-card[data-title="Kuroko Basketball"] .poster,
#row-top10 .card[data-title="Kuroko Basketball"] .poster,
#row-anime .card[data-title="Is It Wrong to Try to Pick Up Girls in a Dungeon"] .poster,
#row-tagalog-anime .card[data-title="Is It Wrong to Try to Pick Up Girls in a Dungeon"] .poster,
#row-anime-seasons .season-collection-card[data-title="Is It Wrong to Try to Pick Up Girls in a Dungeon"] .poster,
#row-top10 .card[data-title="Is It Wrong to Try to Pick Up Girls in a Dungeon"] .poster,
#row-anime .card[data-title="Hunter x Hunter (1999)"] .poster,
#row-tagalog-anime .card[data-title="Hunter x Hunter (1999)"] .poster,
#row-anime-seasons .season-collection-card[data-title="Hunter x Hunter (1999)"] .poster,
#row-top10 .card[data-title="Hunter x Hunter (1999)"] .poster{
  width:190px!important;
  height:265px!important;
  min-height:265px!important;
  max-height:265px!important;
  aspect-ratio:190/265!important;
  box-sizing:border-box!important;
}
@media (min-width:900px){
  #row-anime .card[data-title="Kuroko Basketball"],
  #row-tagalog-anime .card[data-title="Kuroko Basketball"],
  #row-anime-seasons .season-collection-card[data-title="Kuroko Basketball"],
  #row-top10 .card[data-title="Kuroko Basketball"],
  #row-anime .card[data-title="Is It Wrong to Try to Pick Up Girls in a Dungeon"],
  #row-tagalog-anime .card[data-title="Is It Wrong to Try to Pick Up Girls in a Dungeon"],
  #row-anime-seasons .season-collection-card[data-title="Is It Wrong to Try to Pick Up Girls in a Dungeon"],
  #row-top10 .card[data-title="Is It Wrong to Try to Pick Up Girls in a Dungeon"],
  #row-anime .card[data-title="Hunter x Hunter (1999)"],
  #row-tagalog-anime .card[data-title="Hunter x Hunter (1999)"],
  #row-anime-seasons .season-collection-card[data-title="Hunter x Hunter (1999)"],
  #row-top10 .card[data-title="Hunter x Hunter (1999)"]{
    flex-basis:250px!important;
    width:250px!important;
    min-width:250px!important;
    max-width:250px!important;
  }
  #row-anime .card[data-title="Kuroko Basketball"] .poster,
  #row-tagalog-anime .card[data-title="Kuroko Basketball"] .poster,
  #row-anime-seasons .season-collection-card[data-title="Kuroko Basketball"] .poster,
  #row-top10 .card[data-title="Kuroko Basketball"] .poster,
  #row-anime .card[data-title="Is It Wrong to Try to Pick Up Girls in a Dungeon"] .poster,
  #row-tagalog-anime .card[data-title="Is It Wrong to Try to Pick Up Girls in a Dungeon"] .poster,
  #row-anime-seasons .season-collection-card[data-title="Is It Wrong to Try to Pick Up Girls in a Dungeon"] .poster,
  #row-top10 .card[data-title="Is It Wrong to Try to Pick Up Girls in a Dungeon"] .poster,
  #row-anime .card[data-title="Hunter x Hunter (1999)"] .poster,
  #row-tagalog-anime .card[data-title="Hunter x Hunter (1999)"] .poster,
  #row-anime-seasons .season-collection-card[data-title="Hunter x Hunter (1999)"] .poster,
  #row-top10 .card[data-title="Hunter x Hunter (1999)"] .poster{
    width:250px!important;
    height:350px!important;
    min-height:350px!important;
    max-height:350px!important;
    aspect-ratio:250/350!important;
  }
}
@media (min-width:1400px){
  #row-anime .card[data-title="Kuroko Basketball"],
  #row-tagalog-anime .card[data-title="Kuroko Basketball"],
  #row-anime-seasons .season-collection-card[data-title="Kuroko Basketball"],
  #row-top10 .card[data-title="Kuroko Basketball"],
  #row-anime .card[data-title="Is It Wrong to Try to Pick Up Girls in a Dungeon"],
  #row-tagalog-anime .card[data-title="Is It Wrong to Try to Pick Up Girls in a Dungeon"],
  #row-anime-seasons .season-collection-card[data-title="Is It Wrong to Try to Pick Up Girls in a Dungeon"],
  #row-top10 .card[data-title="Is It Wrong to Try to Pick Up Girls in a Dungeon"],
  #row-anime .card[data-title="Hunter x Hunter (1999)"],
  #row-tagalog-anime .card[data-title="Hunter x Hunter (1999)"],
  #row-anime-seasons .season-collection-card[data-title="Hunter x Hunter (1999)"],
  #row-top10 .card[data-title="Hunter x Hunter (1999)"]{
    flex-basis:280px!important;
    width:280px!important;
    min-width:280px!important;
    max-width:280px!important;
  }
  #row-anime .card[data-title="Kuroko Basketball"] .poster,
  #row-tagalog-anime .card[data-title="Kuroko Basketball"] .poster,
  #row-anime-seasons .season-collection-card[data-title="Kuroko Basketball"] .poster,
  #row-top10 .card[data-title="Kuroko Basketball"] .poster,
  #row-anime .card[data-title="Is It Wrong to Try to Pick Up Girls in a Dungeon"] .poster,
  #row-tagalog-anime .card[data-title="Is It Wrong to Try to Pick Up Girls in a Dungeon"] .poster,
  #row-anime-seasons .season-collection-card[data-title="Is It Wrong to Try to Pick Up Girls in a Dungeon"] .poster,
  #row-top10 .card[data-title="Is It Wrong to Try to Pick Up Girls in a Dungeon"] .poster,
  #row-anime .card[data-title="Hunter x Hunter (1999)"] .poster,
  #row-tagalog-anime .card[data-title="Hunter x Hunter (1999)"] .poster,
  #row-anime-seasons .season-collection-card[data-title="Hunter x Hunter (1999)"] .poster,
  #row-top10 .card[data-title="Hunter x Hunter (1999)"] .poster{
    width:280px!important;
    height:392px!important;
    min-height:392px!important;
    max-height:392px!important;
    aspect-ratio:280/392!important;
  }
}

/* FINAL MY FAVORITES MOBILE SWIPE
   Allow both horizontal row swipes and vertical page swipes even when the
   finger starts on a card/poster. Native swiping replaces overlay arrows. */
@media (max-width:720px){
  #favoritesSection .row-container{
    width:100%!important;
    overflow:visible!important;
    touch-action:pan-x pan-y!important;
  }
  #favoritesSection .row-arrow{
    display:none!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }
  #row-favorites{
    overflow-x:auto!important;
    overflow-y:hidden!important;
    touch-action:pan-x pan-y!important;
    -webkit-overflow-scrolling:touch!important;
    scroll-snap-type:x proximity!important;
    scroll-behavior:smooth!important;
    cursor:default!important;
  }
  #row-favorites > .card,
  #row-favorites > .card[data-favorite-key],
  #row-favorites > .card .poster{
    touch-action:pan-x pan-y!important;
    -webkit-user-drag:none!important;
  }
  #row-favorites > .card{
    flex-basis:152px!important;
    width:152px!important;
    min-width:152px!important;
    max-width:152px!important;
    scroll-snap-align:start!important;
  }
  #row-favorites > .card .poster{
    width:152px!important;
    height:212px!important;
    min-height:212px!important;
    max-height:212px!important;
  }
  #row-favorites > .card .card-info{
    height:auto!important;
    min-height:48px!important;
    max-height:none!important;
  }
}

/* ABSOLUTE FINAL IPPO BADGE PARITY — must remain after all legacy badge rules. */
#row-anime .card[data-title="Knock Out: IPPO"] .poster > .ippo-tagalog-badge-final,
#row-tagalog-anime .card[data-title="Knock Out: IPPO"] .poster > .ippo-tagalog-badge-final{
  display:flex!important;
  position:absolute!important;
  top:9px!important;
  right:9px!important;
  left:auto!important;
  bottom:auto!important;
  align-items:center!important;
  gap:4px!important;
  padding:3px 7px!important;
  border-radius:3px!important;
  background:rgba(0,0,0,.65)!important;
  border:1px solid var(--neon)!important;
  color:var(--neon)!important;
  font-family:'JetBrains Mono'!important;
  font-size:9.5px!important;
  font-weight:700!important;
  letter-spacing:.03em!important;
  line-height:normal!important;
  z-index:20!important;
  pointer-events:none!important;
}
#row-anime .card[data-title="Knock Out: IPPO"] .poster > .ippo-tagalog-badge-final img,
#row-tagalog-anime .card[data-title="Knock Out: IPPO"] .poster > .ippo-tagalog-badge-final img{
  display:block!important;
  width:22px!important;
  height:15px!important;
  object-fit:cover!important;
  border-radius:2px!important;
  flex:0 0 auto!important;
}
@media(max-width:720px){
  #row-anime .card[data-title="Knock Out: IPPO"] .poster > .ippo-tagalog-badge-final,
  #row-tagalog-anime .card[data-title="Knock Out: IPPO"] .poster > .ippo-tagalog-badge-final{
    top:7px!important;
    right:7px!important;
    padding:3px 6px!important;
    font-size:8.5px!important;
  }
  #row-anime .card[data-title="Knock Out: IPPO"] .poster > .ippo-tagalog-badge-final img,
  #row-tagalog-anime .card[data-title="Knock Out: IPPO"] .poster > .ippo-tagalog-badge-final img{
    width:22px!important;
    height:15px!important;
  }
}
/* English Dub Only: apple-green badge anchored to the thumbnail corner. */
#pageDetailEpisodes .episode-thumb-wrap .episode-dub-badge{
  position:absolute!important;
  top:8px!important;
  left:8px!important;
  z-index:4!important;
  display:inline-flex!important;
  align-items:center!important;
  width:auto!important;
  max-width:calc(100% - 16px)!important;
  box-sizing:border-box!important;
  margin:0!important;
  padding:4px 8px!important;
  border:1px solid #bef264!important;
  border-radius:999px!important;
  background:linear-gradient(135deg,#a3e635,#65a30d)!important;
  box-shadow:0 2px 8px rgba(101,163,13,.38),inset 0 1px 0 rgba(255,255,255,.45)!important;
  color:#102a05!important;
  font:800 10px/1 'Inter',sans-serif!important;
  letter-spacing:.055em!important;
  text-transform:uppercase!important;
  vertical-align:middle!important;
  white-space:nowrap!important;
}
@media(max-width:700px){
  #pageDetailEpisodes .episode-thumb-wrap .episode-dub-badge{
    top:5px!important;
    left:5px!important;
    max-width:calc(100% - 10px)!important;
    padding:3px 6px!important;
    font-size:8px!important;
    letter-spacing:.045em!important;
  }
}
/* Final mobile safeguard for combined labels such as 104 - 105. */
@media(max-width:700px){
  #pageDetailEpisodes .ep-num,
  #pageDetailEpisodes .ep-num .episode-label{font-size:17px!important;line-height:1!important;}
  #pageDetailEpisodes .ep-num{gap:4px!important;}
}
/* TOP 10 PORTRAIT GUARANTEE: movies and anime share the same portrait card footprint. */
#row-top10 .rank-card > .card{
  flex:0 0 190px!important;
  width:190px!important;
  min-width:190px!important;
  max-width:190px!important;
  box-sizing:border-box!important;
}
#row-top10 .rank-card > .card > .poster{
  width:190px!important;
  height:265px!important;
  min-height:265px!important;
  max-height:265px!important;
  aspect-ratio:190/265!important;
  box-sizing:border-box!important;
  background-size:cover!important;
  background-position:center!important;
}
@media (min-width:900px){
  #row-top10 .rank-card > .card{
    flex-basis:250px!important;
    width:250px!important;
    min-width:250px!important;
    max-width:250px!important;
  }
  #row-top10 .rank-card > .card > .poster{
    width:250px!important;
    height:350px!important;
    min-height:350px!important;
    max-height:350px!important;
    aspect-ratio:250/350!important;
  }
}
@media (min-width:1400px){
  #row-top10 .rank-card > .card{
    flex-basis:280px!important;
    width:280px!important;
    min-width:280px!important;
    max-width:280px!important;
  }
  #row-top10 .rank-card > .card > .poster{
    width:280px!important;
    height:392px!important;
    min-height:392px!important;
    max-height:392px!important;
    aspect-ratio:280/392!important;
  }
}


/* FINAL HOME HERO: full viewport width with no side letterbox bars. */
#homeContent > #heroSlider{
  width:100vw!important;
  max-width:none!important;
  margin-left:calc(50% - 50vw)!important;
  margin-right:calc(50% - 50vw)!important;
  overflow:hidden!important;
}
#homeContent > #heroSlider > .slide{
  left:0!important;
  right:0!important;
  width:100%!important;
  max-width:none!important;
  background-size:cover!important;
  background-position:center center!important;
  background-repeat:no-repeat!important;
}


/* JAPANESE SEASON BADGE FLAG */
.japanese-badge{display:flex!important;align-items:center;gap:4px!important;white-space:nowrap!important}
.japanese-badge img{width:22px!important;height:15px!important;object-fit:cover!important;border-radius:2px!important;display:block!important}

/* FINAL CARD FOCUS: a single polished highlight around the whole card. */
.card.tv-focusable{position:relative;border-radius:10px;transition:transform .16s ease,filter .16s ease,box-shadow .16s ease;}
.card.tv-focusable:focus-visible,
.card.tv-focusable.tv-focus,
.card.tv-focusable.tv-spatial-focus{
  outline:none!important;
  transform:translateY(-5px) scale(1.018);
  filter:brightness(1.08);
  box-shadow:0 0 0 2px #c8ff35,0 0 0 4px rgba(7,10,7,.92),0 0 22px rgba(168,255,0,.48),0 18px 32px -14px rgba(0,0,0,.72)!important;
}
.card.tv-focusable:focus-visible .poster,
.card.tv-focusable.tv-focus .poster,
.card.tv-focusable.tv-spatial-focus .poster{
  transform:none!important;
  outline:none!important;
  box-shadow:none!important;
}

/* ACE OF DIAMOND: full-width detail hero */
#detailPage:has(#detailBannerImg[src*="ace-of-diamond-hero"]) .detail-banner{width:100%!important;min-height:0!important;overflow:hidden!important;background:#000!important;}
#detailPage:has(#detailBannerImg[src*="ace-of-diamond-hero"]) .detail-banner-main{width:100%!important;min-height:0!important;height:auto!important;aspect-ratio:16/9!important;overflow:hidden!important;background:#000!important;}
#detailPage:has(#detailBannerImg[src*="ace-of-diamond-hero"]) .detail-art{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;background-size:cover!important;background-position:center!important;}
#detailPage:has(#detailBannerImg[src*="ace-of-diamond-hero"]) #detailBannerImg{display:block!important;width:100%!important;height:100%!important;max-width:none!important;object-fit:cover!important;object-position:center!important;}
@media(max-width:720px){
#detailPage:has(#detailBannerImg[src*="ace-of-diamond-hero"]) .detail-banner-main{aspect-ratio:auto!important;overflow:visible!important;}
#detailPage:has(#detailBannerImg[src*="ace-of-diamond-hero"]) .detail-art{display:none!important;}
#detailPage:has(#detailBannerImg[src*="ace-of-diamond-hero"]) #detailBannerImg{width:100%!important;height:auto!important;max-width:100%!important;object-fit:contain!important;object-position:center top!important;}
}

/* Anime library page */
#animeLibrary{display:none;min-height:100vh;background:#111;color:#fff;padding:120px 32px 80px;}
body.anime-library-open #homeContent{display:none!important;}
body.anime-library-open:not(.detail-open) #animeLibrary{display:block;}
body.detail-open #animeLibrary,html.tonflix-detail-route #animeLibrary{display:none!important;}
.anime-library-inner{max-width:1500px;margin:0 auto;}
.anime-library-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:32px;}
.anime-library-kicker{font:700 12px 'JetBrains Mono',monospace;letter-spacing:.18em;color:var(--neon);}
.anime-library-heading h1{font-family:Anton,sans-serif;font-size:clamp(42px,6vw,76px);line-height:1;margin:10px 0;}
.anime-library-heading p{color:#aaa;margin:0;}
.anime-library-back{color:#fff;text-decoration:none;border:1px solid #555;border-radius:8px;padding:12px 18px;white-space:nowrap;}
.anime-library-back:hover,.anime-library-back:focus-visible{border-color:var(--neon);color:var(--neon);}
.anime-library-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:30px 18px;}
.anime-library-grid .card{display:block;min-width:0;width:100%;color:inherit;text-decoration:none;}
.anime-library-grid .poster{height:auto;aspect-ratio:5/7;background-size:cover;background-position:center;background-repeat:no-repeat;}
.anime-library-grid .poster>.season-card-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.anime-library-grid .card-info h4{white-space:normal;overflow:visible;text-overflow:clip;}
@media(max-width:700px){#animeLibrary{padding:92px 16px 50px;}.anime-library-heading{align-items:start;flex-direction:column;}.anime-library-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 12px;}}

/* Movies library page */
#moviesLibrary{display:none;min-height:100vh;background:#111;color:#fff;padding:120px 32px 80px;}
body.movies-library-open #homeContent{display:none!important;}
body.movies-library-open:not(.detail-open):not(.anime-library-open) #moviesLibrary{display:block;}
body.detail-open #moviesLibrary,html.tonflix-detail-route #moviesLibrary{display:none!important;}
#moviesLibraryGrid .poster>img:not(.aot-flag-icon){position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
@media(max-width:700px){#moviesLibrary{padding:92px 16px 50px;}}

/* Visible mobile Home search and categories */
.mobile-home-tools{display:none;}
@media(max-width:720px){
  .mobile-home-tools{display:block;padding:12px 16px 16px;background:#080808;}
  .mobile-home-search{display:flex;align-items:center;border:1px solid #454545;border-radius:10px;background:#171717;overflow:hidden;}
  .mobile-home-search input{min-width:0;flex:1;border:0;background:transparent;color:#fff;padding:13px 12px;font:400 16px Inter,sans-serif;outline:none;}
  .mobile-home-search:focus-within{border-color:var(--neon);}
  .mobile-home-search button{flex:0 0 48px;align-self:stretch;border:0;background:transparent;color:var(--neon);font-size:25px;cursor:pointer;}
  .mobile-home-categories{display:flex;gap:10px;margin-top:12px;}
  .mobile-home-categories a{flex:1;text-align:center;padding:11px 14px;border:1px solid #555;border-radius:8px;background:#1c1c1c;color:#fff;font:700 14px Inter,sans-serif;}
  .mobile-home-categories a:focus-visible,.mobile-home-categories a:hover{border-color:var(--neon);color:var(--neon);}
}

/* Player fullscreen control and VIP-only notice */
#videoModalOverlay .tonflix-fullscreen-btn{position:absolute;right:14px;top:12px;width:38px;height:38px;display:flex;align-items:center;justify-content:center;border:1px solid #555;border-radius:7px;background:#171717;color:#fff;cursor:pointer;z-index:2147483647;}
#videoModalOverlay .tonflix-fullscreen-btn:hover,#videoModalOverlay .tonflix-fullscreen-btn:focus-visible{border-color:var(--neon);color:var(--neon);}
#videoModalOverlay .tonflix-fullscreen-notice{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);z-index:2147483647;max-width:calc(100% - 32px);width:max-content;padding:14px 18px;border:1px solid var(--neon);border-radius:10px;background:#171717;color:#fff;font:600 14px Inter,sans-serif;box-shadow:0 8px 30px #0008;text-align:center;pointer-events:none;}

/* Shared top-right player controls */
#videoModalOverlay #tonflixStandaloneClose{left:auto!important;right:12px!important;transform:none!important;}
#videoModalOverlay .tonflix-fullscreen-btn{right:66px;top:12px;width:46px;height:46px;transition:opacity .18s ease,visibility .18s ease;}
#videoModalOverlay .video-modal.tonflix-ui-idle-wake .tonflix-fullscreen-btn{opacity:0;visibility:hidden;pointer-events:none;}
@media(max-width:720px){#videoModalOverlay .tonflix-fullscreen-btn{top:8px;width:44px;height:44px;}}

/* Fit to Screen for direct playback */
#videoModalOverlay #videoModalInner video{object-fit:contain!important;object-position:center!important;}
#videoModalOverlay .video-modal.tonflix-video-fill #videoModalInner video{object-fit:cover!important;}
#videoModalOverlay .tonflix-fit-btn{position:absolute;right:120px;top:12px;width:46px;height:46px;display:flex;align-items:center;justify-content:center;border:1px solid #555;border-radius:7px;background:#171717;color:#fff;cursor:pointer;z-index:2147483647;transition:opacity .18s ease,visibility .18s ease;}
#videoModalOverlay .tonflix-fit-btn:hover,#videoModalOverlay .tonflix-fit-btn:focus-visible,#videoModalOverlay .tonflix-fit-btn[aria-pressed="true"]{border-color:var(--neon);color:var(--neon);}
#videoModalOverlay .tonflix-fit-btn:disabled,#videoModalOverlay .tonflix-fit-btn[aria-disabled="true"]{color:#777;border-color:#333;cursor:default;}
#videoModalOverlay .video-modal.tonflix-ui-idle-wake .tonflix-fit-btn{opacity:0;visibility:hidden;pointer-events:none;}
@media(max-width:720px){#videoModalOverlay .tonflix-fit-btn{top:8px;width:44px;height:44px;}}

/* Compact, scrollable Members view and mobile member details. */
body.admin-members-page-open #adminMembers{overflow-y:auto!important;height:100dvh!important;min-height:0!important;scroll-padding-top:12px}
body.admin-members-page-open #adminMembers>.wrap{height:auto;min-height:100%;display:block;padding-bottom:24px}
body.admin-members-page-open #adminMembers .admin-head{position:relative;padding:16px 0 12px;gap:12px}
#adminMembers .admin-head h2{font-size:30px;margin-bottom:3px}
#adminMembers .admin-head p{font-size:12px}
#adminMembers .founder-admin-card{padding:10px;margin-bottom:10px}
#adminMembers .founder-admin-stat strong{font-size:24px}
#adminMembers .members-status{min-height:18px;margin-bottom:8px}
#adminMembers .members-revenue{grid-template-columns:repeat(5,minmax(0,1fr));gap:7px;margin-bottom:10px}
#adminMembers .revenue-card{padding:9px 11px}
#adminMembers .revenue-card strong{font-size:20px;margin-top:4px}
#adminMembers .member-count-filter{color:inherit;text-align:left;font:inherit;cursor:pointer}
#adminMembers .member-count-filter:hover,#adminMembers .member-count-filter[aria-pressed="true"]{border-color:var(--neon);background:#19210e}
#adminMembers .member-count-filter:focus-visible{outline:2px solid var(--neon);outline-offset:2px}
#adminMembers .member-count-filter:disabled{cursor:wait;opacity:.6}
#adminMembers .members-filter-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:12px 0 8px;color:#aaa;font-size:13px}
#adminMembers .members-filter-bar .btn{padding:7px 12px;font-size:12px}
body.admin-members-page-open #adminMembers .members-table-wrap{max-height:none;overflow-x:auto;overflow-y:visible}
#adminMembers .members-table td,#adminMembers .members-table th{padding:9px 10px;font-size:12px}
@media(max-width:720px){
 body.admin-members-page-open #adminMembers>.wrap{padding-bottom:18px}
 #adminMembers .admin-head{gap:8px}
 #adminMembers .admin-actions{display:grid;grid-template-columns:1fr 1fr;width:100%}
 #adminMembers .admin-actions input{grid-column:1/-1;width:100%;box-sizing:border-box}
 #adminMembers .admin-actions .btn{padding:9px 7px;font-size:12px}
 #adminMembers .members-revenue{grid-template-columns:repeat(3,minmax(0,1fr))}
 #adminMembers .revenue-card{padding:8px}
 #adminMembers .revenue-card span{font-size:9px;letter-spacing:0}
 #adminMembers .revenue-card strong{font-size:18px}
 #adminMembers .members-table{display:block;min-width:0}
 #adminMembers .members-table thead{display:none}
 #adminMembers .members-table tbody{display:block}
 #adminMembers .members-table tr{display:grid;grid-template-columns:1fr 1fr;padding:9px;gap:5px 12px;border-bottom:1px solid #333}
 #adminMembers .members-table td{display:block;padding:0;border:0;white-space:normal;overflow-wrap:anywhere;min-width:0}
 #adminMembers .members-table td::before{content:attr(data-label);display:block;color:#888;font-size:9px;text-transform:uppercase;margin-bottom:2px}
 #adminMembers .members-table td:nth-child(1),#adminMembers .members-table td:nth-child(2),#adminMembers .members-table td[colspan]{grid-column:1/-1}
 #adminMembers .members-table td:nth-child(1){font-weight:700;font-size:14px}
}

/* Separate membership counts from income period filters. */
#adminMembers .members-summary-heading{font:700 12px "JetBrains Mono",monospace;color:#c5c9ce;letter-spacing:.08em;text-transform:uppercase;margin:10px 0 8px}
#adminMembers .members-income-heading{border-top:1px solid #30343b;padding-top:14px;margin-top:16px}

/* Messenger chat support: outside the player only. */
.messenger-support{position:fixed;right:18px;bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:900;display:flex;align-items:center;justify-content:center;width:54px;height:54px;border-radius:50%;background:linear-gradient(135deg,#168aff,#7251f5);color:#fff;box-shadow:0 4px 16px #0008;text-decoration:none;transition:transform .15s}
.messenger-support svg{width:34px;height:34px}
.messenger-support:hover{transform:scale(1.06)}
.messenger-support:focus-visible{outline:3px solid #fff;outline-offset:3px}
body:has(#videoModalOverlay.open) .messenger-support,body:has(:fullscreen) .messenger-support,body:has(.tonflix-player-fullscreen) .messenger-support{display:none!important}
@media(max-width:720px){.messenger-support{right:14px;width:48px;height:48px}.messenger-support svg{width:30px;height:30px}}

/* Phone fullscreen occupies the dynamic viewport, including tall screens. */
@media(pointer:coarse), (max-width:720px){
 #videoModalOverlay .video-modal.tonflix-player-fullscreen{
  inset:0!important;width:100vw!important;width:100dvw!important;height:100vh!important;height:100dvh!important;
  min-width:0!important;min-height:0!important;margin:0!important;padding:0!important;border-radius:0!important;
 }
 #videoModalOverlay .video-modal.tonflix-player-fullscreen #videoModalInner{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
  min-height:0!important;max-width:none!important;max-height:none!important;aspect-ratio:auto!important;margin:0!important;padding:0!important;
 }
 #videoModalOverlay .video-modal.tonflix-player-fullscreen #videoModalInner video{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
  max-width:none!important;max-height:none!important;aspect-ratio:auto!important;margin:0!important;padding:0!important;border-radius:0!important;
 }
 #videoModalOverlay .video-modal.tonflix-player-fullscreen.tonflix-video-fill #videoModalInner video{object-fit:cover!important;object-position:center!important}
}

/* Hide inactive toast completely and label Messenger support. */
#toast:not(.show){visibility:hidden;pointer-events:none}
#toast.show{visibility:visible}
#toast{bottom:calc(88px + env(safe-area-inset-bottom,0px));max-width:min(300px,calc(100vw - 32px));overflow-wrap:anywhere;z-index:1000}
.messenger-support{width:auto;gap:8px;padding:0 15px 0 11px;border-radius:28px;font:700 13px Inter,sans-serif}
.messenger-support svg{flex-shrink:0}
.messenger-support span{white-space:nowrap}
@media(max-width:720px){
 .messenger-support{width:48px;height:48px;gap:0;padding:0;border-radius:50%}
 .messenger-support span{display:none}
 #toast{right:16px;bottom:calc(80px + env(safe-area-inset-bottom,0px))}
 body:has(.modal-overlay.open) .messenger-support,body:has(.mobile-menu-overlay.open) .messenger-support,body:has(.anime-search-overlay.open) .messenger-support{display:none!important}
}

/* Live result cards below the mobile Home search. */
#mobileHomeSearchResults[hidden]{display:none!important}
.mobile-home-search-results{max-height:44dvh;overflow-y:auto;overscroll-behavior:contain}
.mobile-home-search-results .anime-search-result{min-height:72px}
.mobile-home-search-results .anime-search-result img{flex-shrink:0}

/* Crop encoded movie letterboxing without enlarging native video controls. */
#videoModalOverlay #videoModalInner video{object-view-box:none!important}
@supports(object-view-box:inset(12% 0)){
 #videoModalOverlay .video-modal.tonflix-video-zoom #videoModalInner video{object-view-box:inset(12% 0)!important}
}
#videoModalOverlay .tonflix-fit-btn::after{content:attr(data-fit-mode);position:absolute;top:100%;margin-top:2px;left:50%;transform:translateX(-50%);font:700 9px Inter,sans-serif;color:#fff;background:#171717cc;border-radius:3px;padding:2px 4px;pointer-events:none}