.mobile-date{display:none}

@media(max-width:820px){
  :root{--mobile-nav-height:72px}
  html{scrollbar-gutter:auto;overflow-x:hidden}
  body{display:block;width:100%;min-height:100svh;padding:0 0 calc(var(--mobile-nav-height) + env(safe-area-inset-bottom));overflow-x:hidden;overflow-y:auto;background:radial-gradient(circle at 80% 0,#ff8a1f10,transparent 28%),var(--bg)}
  body.auth-pending,body.player-mode{padding-bottom:0}

  /* Mobile app navigation */
  aside{position:fixed!important;z-index:900;inset:auto 0 0!important;width:100%!important;height:calc(var(--mobile-nav-height) + env(safe-area-inset-bottom))!important;padding:6px 6px env(safe-area-inset-bottom)!important;border:0!important;border-top:1px solid #ffffff18!important;background:#0b0e13!important;box-shadow:0 -5px 18px #0008;backdrop-filter:none!important;transform:none!important;visibility:visible!important}
  aside .brand,aside .links{display:none!important}
  aside nav{display:flex!important;align-items:stretch;gap:3px;width:100%;height:100%;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;overscroll-behavior-x:contain;scroll-snap-type:x proximity}
  aside nav::-webkit-scrollbar{display:none}
  aside nav button{display:grid!important;grid-template-rows:25px auto;place-items:center;align-content:center;flex:1 0 68px;min-width:68px;height:60px;margin:0!important;padding:5px 4px!important;gap:2px!important;border-radius:12px!important;text-align:center;scroll-snap-align:center;color:#8f98a5!important;font-size:9px!important;line-height:1.1}
  aside nav button>svg{width:21px!important;height:21px!important;min-width:21px!important;max-width:21px!important;stroke-width:1.75!important}
  aside nav button span{display:block!important;max-width:66px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  aside nav button.active{background:#ff8a1f18!important;color:#fff!important;box-shadow:inset 0 0 0 1px #ff8a1f38}
  aside nav button.active>svg{stroke:#ff8a1f!important}
  aside nav button[data-view="overview"]{order:99}

  /* Header and page frame */
  main{width:100%;min-width:0;padding:0 14px 28px!important;overflow:visible!important}
  main>header,body:has(#content .shelf-heading) main>header,body:has(#content .library-summary) main>header{position:sticky;z-index:50;top:0;display:flex!important;min-height:58px;margin:0 -14px 14px;padding:9px 14px;border-bottom:1px solid #ffffff0d;background:#0b0d10;backdrop-filter:none!important}
  main>header>div:first-child{min-width:0}
  main>header .eyebrow{margin:0 0 2px;font-size:7px;letter-spacing:.13em}
  main>header h1{max-width:52vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:20px;line-height:1.1}
  .header-actions{gap:6px;margin-left:auto}
  .header-actions .icon,.header-actions #profile-open{width:38px!important;min-width:38px!important;max-width:38px!important;height:38px!important;min-height:38px!important;max-height:38px!important;padding:8px!important;border-radius:12px}
  .header-actions .live{display:none}
  #content{min-width:0}
  .shelf-heading{margin:4px 0 20px}
  .shelf-heading h1{font-size:28px}
  .panel{padding:15px;border-radius:14px}
  h2{font-size:20px}

  /* Library */
  .library-hero{height:270px!important;min-height:270px!important;max-height:270px!important;margin:0 0 14px;border-radius:17px}
  .library-hero:before{left:0!important;width:100%!important;opacity:1!important;background:linear-gradient(90deg,#090b0f 0%,#090b0ff5 25%,#090b0fb9 53%,#090b0f2b 82%),linear-gradient(0deg,#090b0fe8 0%,transparent 45%),var(--hero) 68% 20%/auto 100% no-repeat!important;mask-image:none!important;-webkit-mask-image:none!important;clip-path:none!important;filter:none!important}
  .library-hero:after{display:none!important}
  .library-hero>div{width:78%!important;height:100%;padding:20px!important;justify-content:flex-end}
  .library-hero .eyebrow{font-size:8px}
  .library-hero h1{min-height:auto!important;max-height:2.16em!important;margin:5px 0 8px;font-size:29px!important;line-height:1.08!important}
  .library-hero p:not(.eyebrow){height:2.9em!important;min-height:2.9em!important;margin:0 0 12px;font-size:12px;line-height:1.45!important;-webkit-line-clamp:2!important}
  .library-hero .primary{width:min(210px,88%);min-height:42px;margin:0;padding:10px 14px}
  .library-toolbar,.library-toolbar:has(.library-search){position:relative!important;top:auto!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:8px;margin-bottom:22px;padding:8px;border-radius:14px}
  .library-search{grid-column:1/-1;height:44px}
  .library-filter-group{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,1fr);width:100%;overflow:visible;padding:3px}
  .library-filter-group button{min-height:38px;padding:7px 4px;font-size:11px}
  .library-toolbar select{width:100%;min-width:0;max-width:none;height:40px;padding:7px 8px;font-size:11px}
  .library-results{margin:0 1px 8px}
  .library-section{margin:25px 0 34px}
  .library-section-head{align-items:center;margin-bottom:11px}
  .library-section-head h2{font-size:20px}
  .library-section-head span{font-size:11px}
  .library-card-grid{grid-template-columns:repeat(auto-fit,minmax(130px,1fr))!important;justify-items:center;gap:19px 11px!important}
  .library-card-grid>.library-card{width:100%;max-width:160px}
  .library-poster{border-radius:12px;box-shadow:0 5px 14px #0007}
  .library-card-copy{padding:8px 2px 0}
  .library-card-copy strong{font-size:13px!important}
  .library-card-copy span{font-size:10px!important}
  .library-load-more{display:block;width:min(260px,100%);min-height:44px;margin:18px auto 0}
  .library-card-actions{inset:auto 7px 8px;gap:5px;opacity:1;transform:none}
  .library-card-actions button{height:32px;padding:0 8px;font-size:10px}
  .poster-toggle{width:29px;height:29px;opacity:1}
  .library-rail{margin:25px 0}
  .rail-wrap{margin-right:-14px}
  .continue-strip,.poster-strip{gap:11px;padding:2px 14px 13px 1px;scroll-snap-type:x proximity}
  .continue-strip{grid-auto-columns:minmax(270px,84vw)!important}
  .poster-strip{grid-auto-columns:clamp(140px,38vw,180px)!important}
  .continue-card,.poster-strip .library-card{scroll-snap-align:start}
  .continue-card>strong{font-size:14px!important;margin-top:8px}
  .continue-card>small{font-size:10px!important}
  .continue-card>div>i{opacity:.9;width:38px;height:38px;transform:translate(-50%,-50%) scale(1)}

  /* Touch interactions should not leave cards enlarged or dimmed. */
  .poster-card:hover,.library-card:hover .library-poster,.continue-card:hover>div,.jf-episode:hover{transform:none;box-shadow:initial}
  .poster-card:hover>img,.library-card:hover .library-poster>img,.continue-card:hover img,.jf-episode:hover img{transform:none;filter:none}

  /* Details and episodes */
  .discover-detail,.detail-head{grid-template-columns:1fr!important;gap:16px;margin-top:14px}
  .discover-detail>img,.detail-head>img{width:128px!important;border-radius:13px;box-shadow:0 12px 32px #0008}
  .discover-detail h1{font-size:28px;line-height:1.08}
  .detail-overview,.detail-head p:not(.eyebrow){font-size:13px;line-height:1.62}
  .detail-add{width:100%;min-height:44px}
  .jf-season{margin:16px -2px 0;padding:12px}
  .jf-season .panel-head{margin-bottom:10px}
  .jf-episode-grid{grid-template-columns:1fr;gap:9px}
  .jf-episode{display:grid;grid-template-columns:42% minmax(0,1fr);min-height:104px;border-radius:11px}
  .jf-episode .episode-image{height:100%;min-height:104px}
  .jf-episode img{height:100%;aspect-ratio:auto;object-fit:cover}
  .jf-episode>div:not(.episode-image){display:grid;align-content:center;padding:10px}
  .jf-episode h3{margin:4px 0;font-size:13px;line-height:1.25}
  .jf-episode>i{display:none}

  /* Discover, requests, downloads, and profile */
  .searchbar,.dub-search{display:grid;grid-template-columns:1fr;gap:8px}
  .searchbar button,.dub-search button{width:100%;min-height:44px;margin:0}
  .discover-tabs{position:sticky;z-index:20;top:65px;width:100%;margin-bottom:16px;background:#11151ae8;backdrop-filter:blur(14px)}
  .discover-tabs button{flex:1;min-height:40px;padding:8px}
  .media-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}
  .media-copy{padding:10px}
  .media-copy h3{font-size:13px;line-height:1.25}
  .torrent{gap:10px;padding:14px 0}
  .torrent-controls{display:grid;grid-template-columns:1fr 1fr;width:100%}
  .torrent-controls select{grid-column:1/-1;width:100%;max-width:none}
  .request-row{gap:9px}
  .request-row .actions{display:grid;grid-template-columns:1fr 1fr}
  .profile-layout{grid-template-columns:1fr;gap:14px}
  .profile-summary{grid-template-columns:74px minmax(0,1fr);grid-template-rows:auto auto auto;align-items:center}
  .profile-summary .profile-avatar{grid-column:1;grid-row:1/3}
  .profile-summary .profile-avatar-tools{grid-column:2;grid-row:2;margin:2px 0 0}
  .profile-summary>div:nth-of-type(3){grid-column:2;grid-row:1;align-self:end}
  .profile-summary>p{grid-column:1/-1;grid-row:3}
  .profile-form{gap:14px}
  .profile-section{padding:16px}
  .profile-section .form-grid{grid-template-columns:1fr}
  .profile-toggle{align-items:flex-start}
  .profile-save{width:100%!important;min-height:44px}
  .anime-language-picker span{padding:10px}
  .invite-row{align-items:flex-start}
  .user-admin-head{align-items:flex-start}
  .user-admin-summary{align-items:flex-start}

  /* Calendar becomes an easy-to-scan mobile agenda. */
  .calendar-stats,.anime-stats{display:flex;grid-template-columns:none;gap:9px;margin-bottom:14px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none}
  .calendar-stats::-webkit-scrollbar,.anime-stats::-webkit-scrollbar{display:none}
  .calendar-stats .card,.anime-stats .card{flex:0 0 148px;scroll-snap-align:start;padding:14px}
  .calendar-stats .big,.anime-stats .big{font-size:25px}
  .calendar-shell{padding:14px;margin:0 -1px 16px}
  .calendar-head{align-items:flex-start;gap:10px;margin-bottom:14px}
  .calendar-head h2{font-size:19px}
  .calendar-nav{gap:4px}
  .calendar-nav .ghost{min-width:38px;min-height:38px;padding:8px}
  .month-calendar{overflow:visible}
  .weekdays{display:none}
  .calendar-days{display:block;min-width:0!important}
  .calendar-day{display:none;min-height:0;margin:8px 0;padding:10px;border:1px solid var(--line)!important;border-radius:12px;background:#101419}
  .calendar-day:has(.calendar-event),.calendar-day.today{display:grid;grid-template-columns:66px minmax(0,1fr);align-items:start;gap:8px}
  .calendar-day.outside:not(:has(.calendar-event)){display:none}
  .calendar-day>header{display:grid;place-items:center;align-content:center;min-height:54px;margin:0;padding:5px;border-right:1px solid var(--line);font-size:0;text-align:center}
  .calendar-day>header span{font-size:0}
  .calendar-day>header .mobile-date{display:block;color:#dce1e8;font-size:10px;font-style:normal;font-weight:800;line-height:1.25}
  .calendar-day>header>b{margin-top:5px;font-size:9px}
  .day-events{gap:7px}
  .calendar-event{grid-template-columns:38px minmax(0,1fr);padding:7px}
  .calendar-event img{width:38px;height:50px}
  .calendar-event strong{font-size:11px}
  .calendar-event small{font-size:9px}
  .tracking-grid{grid-template-columns:1fr;gap:12px}

  /* Admin overview */
  .admin-overview-stats{grid-template-columns:1fr 1fr;gap:9px;margin-top:0}
  .admin-overview-stats button{padding:13px}
  .admin-overview-stats strong{font-size:24px}
  .admin-activity-grid{grid-template-columns:1fr;gap:12px}
  .stats:not(.calendar-stats):not(.anime-stats){grid-template-columns:1fr 1fr;gap:9px}

  /* Dialogs become thumb-friendly bottom sheets. */
  dialog{inset:auto 8px 8px;width:calc(100% - 16px);max-width:none;max-height:88svh;margin:auto;border-radius:20px;overflow:auto}
  dialog form{padding:20px}
  #theme-dialog form{padding:18px}
  #auth-screen{padding:14px}
  #auth-form,#signup-form{width:100%;max-width:430px;padding:24px;border-radius:18px}

  /* Phone player */
  body.player-mode main{padding:0!important}
  body.player-mode aside{display:none!important}
  .player-mode .player-page{height:100svh}
  .player-mode .player-top{height:50px;margin:0;padding:6px 8px;background:#080a0e}
  .player-mode .player-top .ghost{min-height:38px;padding:7px 10px}
  .player-mode .player-top strong{max-width:58vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .player-mode .video-shell{width:100%;height:calc(100svh - 50px)!important;min-height:0!important;border-radius:0!important;box-shadow:none}
  .player-mode .video-stage{height:100%}
  .player-mode .jf-transport{justify-content:center;height:70px!important;min-height:70px!important;padding:28px 4px 4px!important;gap:2px!important;opacity:1!important}
  .player-mode .jf-transport #player-seek{top:3px!important;height:20px!important}
  .player-mode .jf-transport button,.player-mode .jf-transport #player-start,.player-mode .jf-transport #player-prev-chapter,.player-mode .jf-transport #player-next-chapter,.player-mode .jf-transport #player-end,.player-mode .jf-transport #player-cc,.player-mode .jf-transport #player-settings,.player-mode .jf-transport #player-fullscreen{width:34px!important;min-width:34px!important;max-width:34px!important;height:34px!important;min-height:34px!important;max-height:34px!important;padding:7px!important}
  .player-mode .jf-transport #player-toggle{width:40px!important;min-width:40px!important;max-width:40px!important;height:40px!important;min-height:40px!important;max-height:40px!important;padding:9px!important}
  .player-mode .jf-transport #player-time,.player-mode .jf-transport>span:not(#player-time),.player-mode .jf-transport #player-volume,.player-mode .jf-transport #player-pip{display:none!important}
  .player-mode .video-shell>.player-controls{right:7px;bottom:72px;width:calc(100% - 14px);max-height:calc(100svh - 145px);overflow:auto}
  .skip-segment{right:12px!important;bottom:82px!important;min-width:140px;padding:12px 17px!important;font-size:14px!important}
  .next-episode-card{right:10px;bottom:80px;width:calc(100% - 20px);padding:16px}
}

@media(max-width:380px){
  main{padding-left:10px!important;padding-right:10px!important}
  main>header,body:has(#content .shelf-heading) main>header,body:has(#content .library-summary) main>header{margin-left:-10px;margin-right:-10px;padding-left:10px;padding-right:10px}
  .header-actions #refresh{display:none}
  .library-hero>div{width:88%!important;padding:16px!important}
  .library-hero h1{font-size:26px!important}
  .library-card-grid{gap:16px 8px!important}
  .poster-strip{grid-auto-columns:clamp(132px,39vw,145px)!important}
  .player-mode .jf-transport{gap:0!important}
  .player-mode .jf-transport button,.player-mode .jf-transport #player-start,.player-mode .jf-transport #player-prev-chapter,.player-mode .jf-transport #player-next-chapter,.player-mode .jf-transport #player-end,.player-mode .jf-transport #player-cc,.player-mode .jf-transport #player-settings,.player-mode .jf-transport #player-fullscreen{width:32px!important;min-width:32px!important;max-width:32px!important;height:32px!important;min-height:32px!important;max-height:32px!important;padding:6px!important}
}

@media(max-width:820px) and (orientation:landscape) and (max-height:520px){
  :root{--mobile-nav-height:58px}
  aside nav button{grid-template-rows:22px auto;height:48px;font-size:8px!important}
  aside nav button>svg{width:19px!important;height:19px!important}
  .player-mode .player-top{position:absolute;z-index:12;top:8px;left:8px;width:auto;height:auto;padding:0;background:transparent}
  .player-mode .player-top>div{display:none}
  .player-mode .video-shell{height:100svh!important}
}

@media(hover:none) and (pointer:coarse){
  button,.library-card,.continue-card,.jf-episode{-webkit-tap-highlight-color:transparent}
  button:active,.library-card:active,.continue-card:active{transform:scale(.98)}
}