.top{padding-left:max(var(--pad),env(safe-area-inset-left));padding-right:max(var(--pad),env(safe-area-inset-right))}
.layer,.password-layer{min-height:100dvh}
.film-strip{-webkit-overflow-scrolling:touch;touch-action:pan-x}
.close,.photo-nav{min-width:48px;min-height:48px}
.password-layer{padding-bottom:max(20px,env(safe-area-inset-bottom))}
@media(max-width:600px){
  .intro{padding-left:max(20px,env(safe-area-inset-left));padding-right:max(20px,env(safe-area-inset-right))}
  .rolls{padding-left:max(20px,env(safe-area-inset-left));padding-right:max(20px,env(safe-area-inset-right))}
  .film-strip{scroll-padding-inline:20px}
  .viewer-head{padding-top:max(12px,env(safe-area-inset-top))}
  .photo-nav{bottom:max(18px,env(safe-area-inset-bottom))}
  .password-layer form{max-height:calc(100dvh - 32px);overflow:auto}
  .password-layer input{font-size:16px}
  footer{padding-bottom:max(40px,env(safe-area-inset-bottom))}
}