/* Tablet */
@media (min-width:640px){
  .page,.hdr{padding-left:22px;padding-right:22px}
  .grid-p{grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}
  .grid-v{grid-template-columns:repeat(3,1fr)}
  .pcard{width:clamp(130px,19vw,170px)}
  .vcard,.ccard{width:clamp(220px,32vw,300px)}
  .cat{font-size:13px;min-height:84px}
  .p-vol{width:90px}
  .dposter{flex-basis:26%}
  .banner{border-radius:22px}
}
/* Small phones */
@media (max-width:420px){
  .p-vol{display:none}
  .pb{min-width:36px}
  .ep .thumb{flex-basis:42%}
}
/* Desktop: sidebar replaces bottom navigation */
@media (min-width:1024px){
  .bnav{display:none}
  .main{padding-bottom:30px}
  #toast{bottom:28px}
  .side{display:flex;flex-direction:column;gap:8px;position:sticky;top:0;align-self:flex-start;height:100vh;width:220px;padding:20px 12px;background:var(--bg2);border-right:1px solid var(--border);flex:none;transition:width .2s}
  .side .logo{padding:0 8px 16px}
  .side nav{display:flex;flex-direction:column;gap:4px}
  .side .nav-i{flex-direction:row;justify-content:flex-start;gap:14px;padding:0 14px;min-height:48px;border-radius:12px;font-size:15px}
  .side .nav-i.active{background:var(--card2)}
  .side .nav-i.active::before{top:12px;left:0;width:3px;height:24px;border-radius:0 4px 4px 0}
  .side-toggle{margin-top:auto;display:flex;align-items:center;gap:14px;padding:0 14px;min-height:44px;color:var(--muted);border-radius:12px}
  .side-toggle:hover{background:var(--card2)}
  .app.collapsed .side{width:72px}
  .app.collapsed .side .logo span,.app.collapsed .side .nav-i span,.app.collapsed .side-toggle span{display:none}
  .app.collapsed .side .nav-i,.app.collapsed .side-toggle{justify-content:center;padding:0}
  .app.collapsed .side .logo{justify-content:center;padding:0 0 16px}
  .grid-p{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
  .grid-v{grid-template-columns:repeat(4,1fr)}
  .pcard{width:clamp(140px,12vw,180px)}
  .vcard,.ccard{width:clamp(240px,22vw,300px)}
  .banner{aspect-ratio:21/9;max-height:520px}
  .slide-ov{padding:28px 36px 40px}
  .cover{aspect-ratio:21/9}
  .dhead{margin-top:-90px}
  .dposter{flex-basis:200px}
  .cats{max-width:760px}
  .detail-cols{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:24px;align-items:start}
  .watch-cols{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:24px;align-items:start}
}
@media (min-width:1400px){
  .grid-v{grid-template-columns:repeat(5,1fr)}
}
@media (max-width:1023px){
  .side-toggle{display:none}
}
@media (orientation:landscape) and (max-height:480px){
  .player.r916{width:min(100%,calc(90vh * 9 / 16))}
}