/* Responsive polish */
@media(max-width:1180px){
  .app{max-width:100%;padding-left:20px;padding-right:20px}
  .category-grid{grid-template-columns:repeat(3,1fr)}
}

@media(max-width:980px){
  body{padding-bottom:132px}
  .topbar{padding-top:10px}
  .home-layout{grid-template-columns:1fr}
  .side-panel{position:static;top:auto}
  .category-grid,.series-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hero{min-height:300px}
  .hero h1{font-size:clamp(38px,7vw,60px)}
  .section-head{align-items:flex-start;flex-direction:column}
  .rail{grid-auto-columns:minmax(230px,280px)}
}

@media(max-width:760px){
  .nav-actions{gap:6px}
  .btn{padding:10px 12px;font-size:13px}
  .hero-actions .btn{width:100%;text-align:center}
  .page-title h1{font-size:34px;letter-spacing:-1.5px}
  .search-panel{margin:18px auto;border-radius:26px;padding:14px}
  .search-top{position:sticky;top:0;z-index:2;background:#0d110e;padding-bottom:10px}
  .playlist-panel{margin:34px auto}
  .player-shell{bottom:10px;width:calc(100% - 20px)}
  .mini-player{grid-template-columns:46px minmax(0,1fr) auto;border-radius:24px}
}

@media(max-width:620px){
  body{padding-bottom:148px}
  .app{padding:12px}
  .topbar{align-items:center;gap:10px}
  .logo{width:40px;height:40px;border-radius:14px;font-size:20px}
  .brand strong{font-size:13px}
  .brand small{font-size:10px}
  .nav-actions .btn:first-child,
  .nav-actions .btn:nth-child(2){display:none}
  .nav-actions .btn.gold{padding:10px 13px}
  .hero{min-height:310px;padding:22px;border-radius:28px;margin-bottom:22px}
  .hero h1{font-size:40px;line-height:.96;letter-spacing:-2.2px}
  .hero p{font-size:14px;line-height:1.55}
  .pill{font-size:11px;margin-bottom:14px}
  .section{margin:24px 0}
  .section-head h2{font-size:21px}
  .category-grid,.series-grid{grid-template-columns:1fr;gap:12px}
  .category-card{min-height:142px;border-radius:24px;padding:16px}
  .category-card h3{font-size:18px;max-width:80%}
  .card{border-radius:24px;padding:14px}
  .art{height:126px;border-radius:20px}
  .rail{grid-auto-columns:minmax(176px,78vw);gap:12px}
  .episode{grid-template-columns:44px minmax(0,1fr);padding:12px;gap:10px;position:relative}
  .ep-art{width:44px;height:44px;border-radius:15px}
  .ep-title{font-size:13px;padding-right:88px}
  .ep-sub{font-size:11px;line-height:1.35;padding-right:82px}
  .ep-actions{position:absolute;right:10px;top:50%;transform:translateY(-50%);gap:5px}
  .icon-btn{width:34px;height:34px;font-size:12px}
  .status{font-size:9px}
  .side-panel{border-radius:24px;padding:14px}
  .library-list{max-height:none}
  .bottom-nav{display:grid;grid-template-columns:repeat(4,1fr);bottom:82px;width:calc(100% - 20px);border-radius:22px}
  .bottom-nav button{font-size:10px;padding:9px 4px}
  .player-shell.expanded{max-width:none;width:100%;bottom:0}
  .full-player{max-height:95vh;border-radius:28px 28px 0 0;padding:14px}
  .player-top h2{font-size:22px}
  .big-art{height:210px;border-radius:24px}
  .player-quick-actions{grid-template-columns:1fr;gap:8px}
  .controls{gap:8px}
  .controls button{width:44px;height:44px}
  .controls .main-play{width:64px;height:64px}
  .queue-item{grid-template-columns:40px minmax(0,1fr) auto;padding:9px;border-radius:16px}
  .queue-art{width:40px;height:40px}
  .search-modal,.playlist-modal{padding:10px}
  .search-panel{margin:10px auto;border-radius:24px;max-height:calc(100vh - 20px);overflow:auto}
  .search-top{gap:8px}
  .search-top input{padding:13px 14px;border-radius:17px;font-size:14px}
  .playlist-panel{margin:18px auto;border-radius:24px;padding:14px}
  .playlist-create{grid-template-columns:1fr}
  .section-actions{width:100%}
  .section-actions input{width:100%}
}

@media(max-width:420px){
  .hero h1{font-size:34px;letter-spacing:-1.8px}
  .hero{min-height:292px;padding:18px}
  .page-title h1{font-size:30px}
  .card h3{font-size:15px}
  .card p{font-size:12px}
  .mini-actions button{width:38px;height:38px}
  .mini-player{grid-template-columns:44px minmax(0,1fr) auto;padding:8px;gap:9px}
  .mini-art{width:44px;height:44px;border-radius:15px}
  .episode{grid-template-columns:40px minmax(0,1fr)}
  .ep-art{width:40px;height:40px}
  .ep-title{padding-right:76px}
  .ep-sub{padding-right:76px}
  .icon-btn{width:31px;height:31px}
  .controls button{width:40px;height:40px}
  .controls .main-play{width:58px;height:58px}
  .bottom-nav{bottom:78px}
}

@media(min-width:981px){
  .category-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .series-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
