/* Responsive */
:root{--bottomnav-h:0px}

@media(max-width:1400px){.grid{grid-template-columns:repeat(5,1fr)}}
@media(max-width:1200px){.grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:1000px){.grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:900px){
  :root{--bottomnav-h:72px}
  .grid{grid-template-columns:repeat(2,1fr)}
  .popover{top:calc(var(--topbar-h) + 86px)}
  .modal-hero-content{grid-template-columns:1fr}
  .content{padding-bottom:calc(56px + var(--bottomnav-h) + env(safe-area-inset-bottom, 0px))}
  .footer{padding-bottom:calc(var(--bottomnav-h) + env(safe-area-inset-bottom, 0px))}
}

.nav-sep{width:10px}
.movie-footer{grid-template-columns:auto auto 1fr;min-height:34px}
.movie-overview{min-height:54px}
.card-controls{min-width:0}
.mini-select{max-width:118px}

@media(max-width:900px){
  .modal{ width: calc(100vw - 24px); max-width: 720px; }
  .modal-hero{ padding: 18px 16px; }
  .modal-hero-content{ grid-template-columns: 1fr; }
  .modal-actions{ grid-template-columns: 1fr; }
  .grid{gap:16px}
  .movie-body{padding:12px}
  .movie-card:hover{transform:none;box-shadow:none}
  .section-head{flex-direction:column;align-items:flex-start;gap:10px}
  .chips{justify-content:flex-start}
}

@media(max-width:900px){
  .header .container{padding:0;gap:10px}
  .header-left{gap:10px}
  .header-nav{overflow:auto;max-width:46vw}
  .header-nav::-webkit-scrollbar{display:none}
  .header-search{min-width:0;max-width:none;flex:1}
  #filtersToggle{display:none}
  .search{height:40px;border-radius:14px;padding:0 12px}
  #clearSearch{height:40px;min-width:40px}
  #authBtn{height:40px}
}

@media(max-width:680px){
  :root{--topbar-h:60px}
  .header-nav{display:none}
  .header-left{min-width:0}
  .logo{font-size:20px}
  .header-search{gap:8px}
  #authBtn{padding:0 12px;height:40px;border-radius:14px}

  .filters-inline{padding:12px 10px;gap:10px}
  .filters-row{flex-direction:column;align-items:stretch;gap:10px}
  .fi{min-width:0;width:100%}
  .fi-small{min-width:0}
  .fi-years{gap:8px}
  .fi-years .input{width:100%}
  .fi-actions{width:100%;justify-content:space-between;margin-left:0}

  .popular-row{padding:0 36px 6px}
  .popular-row .movie-card{width:160px}

  .bottom-pager{
    position:sticky;
    bottom:calc(12px + var(--bottomnav-h) + env(safe-area-inset-bottom, 0px));
    z-index:1200;
    margin-top:16px;
    padding:10px;
    border-radius:18px;
    border:1px solid var(--border);
    background:rgba(11,16,32,.78);
    backdrop-filter:blur(12px);
  }
}

@media(max-width:520px){
  .grid{gap:12px}
  .movie-body{padding:10px}
  .movie-title{font-size:14px}
  .movie-overview{-webkit-line-clamp:2;min-height:36px}

  .modal-overlay{align-items:stretch;justify-content:stretch}
  .modal{width:100vw;max-width:100vw;height:100vh;border-radius:0;border-left:none;border-right:none;display:flex;flex-direction:column;overflow:hidden}
  .modal-hero{padding:16px 14px;flex:1 1 auto;overflow:auto;-webkit-overflow-scrolling:touch;touch-action:pan-y}
  .modal-close{top:12px;right:12px;width:40px;height:40px}

  .mobile-nav a{font-size:11px}
}

.mobile-nav{display:none}
@media(max-width:900px){
  .mobile-nav{
    position:fixed;left:0;right:0;bottom:0;height:calc(var(--bottomnav-h) + env(safe-area-inset-bottom, 0px));
    padding:10px 10px calc(10px + env(safe-area-inset-bottom, 0px));display:flex;align-items:center;justify-content:flex-start;gap:8px;overflow:auto;
    scrollbar-width:none;border-top:1px solid var(--border);background:rgba(7,11,20,.92);backdrop-filter:blur(14px);z-index:3500;
  }
  .mobile-nav::-webkit-scrollbar{display:none}
  .mobile-nav a{height:38px;padding:0 12px;border-radius:12px;font-size:12px}
}