/* Smartphone-Ansicht; Desktop bleibt unverändert. */
.nav-icon,.mobile-add{display:none}
@media(max-width:700px){
  .topbar,.studio-footer{display:none}
  main{padding-top:env(safe-area-inset-top)}
  html{scroll-padding-top:80px}
  body{min-width:280px}
  body:has(dialog[open]){overflow:hidden}
  main{width:100%;padding:0 max(16px,env(safe-area-inset-right)) calc(100px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}
  .topbar{position:sticky;top:0;z-index:8;height:auto;min-height:72px;padding:calc(12px + env(safe-area-inset-top)) 0 12px;background:var(--bg);border-bottom:1px solid var(--line);gap:12px}
  .brand{gap:8px;min-width:0}.brand-name{font-size:21px}.brand-mark{width:28px;height:28px;flex-shrink:0}
  .add-button{min-height:44px;padding:9px 12px;white-space:nowrap;font-size:12px}
  .add-button span{margin-right:1px}
  .page-nav{position:fixed;bottom:0;left:0;right:0;z-index:10;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;padding:0 env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);background:#1c1c18;border-top:1px solid #454538;border-bottom:0;box-shadow:0 -8px 24px #0003}
  .page-nav a,.page-nav .mobile-add{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;min-height:68px;padding:9px 4px;font:500 10px "DM Sans",sans-serif;letter-spacing:.2px;text-transform:none;border:0;border-top:3px solid transparent;background:transparent;color:var(--muted);text-decoration:none}
  .page-nav .nav-icon{display:block;width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:square;stroke-linejoin:miter}
  .page-nav .mobile-add{color:var(--accent);border-left:1px solid var(--line)}
  .page-nav .mobile-add:active{background:#393621}
  .topbar #addButton{display:none}
  .page-nav a[aria-current]{border-top-color:var(--accent);background:#2d2c20}
  .studio-intro{grid-template-columns:minmax(0,1fr) auto;gap:12px;padding:26px 0}
  .studio-intro h1{font-size:clamp(26px,7.5vw,34px);overflow-wrap:anywhere}
  .studio-kicker{font-size:8px;letter-spacing:1px;line-height:1.6}
  .studio-description{font-size:12px;line-height:1.6}
  .studio-total{min-width:0;padding-left:4px}.studio-total strong{font-size:29px}.studio-total span{font-size:8px;letter-spacing:.5px}
  .filter-bar{width:100%;gap:3px;padding:4px;display:flex}
  .filter{flex:1;min-height:44px;padding:8px;font-size:12px}
  .small-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 12px}
  .media-card{min-width:0;contain-intrinsic-size:auto 290px}
  .poster{padding:12px;aspect-ratio:2/3}
  .poster-title{font-size:clamp(19px,5.4vw,25px);overflow-wrap:anywhere}
  .media-card h3,.media-card:has(.status-pill) h3{font-size:13px;overflow-wrap:anywhere}
  .media-card p{font-size:11px;overflow-wrap:anywhere}
  .media-label{white-space:normal;font-size:9px}
  .favorite{width:44px;height:44px;top:5px;right:5px;font-size:22px}
  .continue-grid{grid-template-columns:1fr}.resume-row{padding:12px;gap:12px}
  .resume-button{width:44px;height:44px;flex-shrink:0}
  .empty-state{padding:30px 16px}.empty-state .button-primary{min-height:46px}
  .studio-footer{flex-wrap:wrap;line-height:1.6}
  .dialog{width:100%;max-width:100%;height:100dvh;max-height:100dvh;margin:0;border:0;overflow:auto;overscroll-behavior:contain}
  .dialog form,.dialog .detail-inner{padding:calc(20px + env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));min-width:0}
  .dialog-heading,.detail-titlebar{gap:14px;align-items:flex-start}
  .dialog-heading>div,.detail-titlebar>div{min-width:0}
  .dialog h2,.detail-titlebar h2{font-size:24px;line-height:1.25;overflow-wrap:anywhere}
  .close,.close-detail{width:44px;height:44px;min-width:44px;font-size:26px;float:none}
  .dialog label{font-size:13px}
  .dialog input,.dialog select,.login-card input{font-size:16px;min-height:46px}
  .dialog input[type=file]{font-size:13px;max-width:100%}
  .dialog .two-col{grid-template-columns:1fr;gap:0}
  .dialog menu{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:24px}
  .dialog menu button{min-height:48px;padding:10px;font-size:13px;white-space:normal}
  .dialog .detail-action,.dialog .button-primary,.season-complete,.manage-remove{min-height:44px}
  .detail-progress{grid-template-columns:1fr;gap:15px;padding:16px}
  .detail-progress>.button-primary{width:100%}
  .compact-season{grid-template-columns:minmax(0,1fr) 105px;gap:8px;padding:12px 0}
  .compact-season>.progress{display:block;grid-column:1;grid-row:2}
  .compact-season>.season-complete{grid-column:2;grid-row:1/3;font-size:11px}
  .detail-rating{gap:12px}.detail-rating select{width:155px;max-width:55%}
  .detail-manage summary{padding:12px 0;font-size:14px;min-height:48px}
  .detail-manage summary span{display:block;margin:8px 0 0;line-height:1.5}
  .manage-content .action-row{display:grid;grid-template-columns:1fr}
  .login-gate{overflow:auto;place-items:start center;padding:calc(30px + env(safe-area-inset-top)) 18px calc(30px + env(safe-area-inset-bottom))}
  .login-card{width:100%;max-width:390px;padding:24px}
  .login-card button{min-height:46px}
}
@media(max-width:350px){
  .brand-name{font-size:18px}.brand{gap:6px}.add-button{font-size:11px;padding:8px}
  .studio-total{display:none}.studio-intro{grid-template-columns:1fr}
  .dialog menu{grid-template-columns:1fr}
}
@media(pointer:coarse){
  button,a,summary{touch-action:manipulation}
}