/* THE SCREEN EDGE IS THE APP EDGE (L108). Global rule, loaded last, applies to every screen, sheet and form.
   1. No field is ever smaller than 16px on a phone: iOS Safari zooms the whole page in when a smaller field gets focus —
      that zoom is what pushed buttons and icons off the screen. 16px = no zoom.
   2. The page can never be wider than the screen: html/body clip sideways overflow, media shrink to fit, long words wrap.
   3. Popups, sheets and drawers can never be wider than the screen.
   Check any change with:  node tools/fit-audit.mjs */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;max-width:100%;overflow-x:clip}
body{max-width:100%;overflow-x:clip;overscroll-behavior-x:none;overflow-wrap:break-word}
img,svg,video,canvas,iframe,picture{max-width:100%}
img,video{height:auto}
pre,code,kbd{white-space:pre-wrap;overflow-wrap:anywhere}
:is(main,section,article,li,td,th,header,footer,form,fieldset,label){min-width:0}
input,select,textarea{max-width:100%;min-width:0}
@media (pointer:coarse),(max-width:900px){
  input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=color]):not([type=hidden]),select,textarea,[contenteditable=""],[contenteditable="true"]{font-size:16px!important}
}
.sheet,.modal,.toast,#dr,[role=dialog],[role=menu],[role=listbox]{max-width:100vw}
@supports (width:100dvw){.sheet,.modal,.toast,#dr,[role=dialog],[role=menu],[role=listbox]{max-width:100dvw}}
