/* Fluid layout rules that work together with --fz (see tokens.css and js/fluid.js): safe areas, dynamic viewport height, input sizing and overflow protection. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;-webkit-tap-highlight-color:transparent}
body{overflow-wrap:break-word;padding-inline:max(var(--sa-l),var(--sa-r)) }
img,svg,canvas{max-width:100%}
button,[role=button],a,summary,label,select,input[type=checkbox],input[type=radio]{touch-action:manipulation}
/* mobile browsers: 100vh includes the hidden address bar, 100dvh does not */
@supports (height:100dvh){.app,.e,.pv-page{min-height:100dvh}body{min-height:100dvh}.pv-stage video{max-height:76dvh}.chat.blank .composer{margin-bottom:12dvh}}
/* iOS zooms the page when a field under 16px gets focus */
@media(hover:none) and (pointer:coarse){input,select,textarea{font-size:max(16px,calc(14px*var(--fz)))}}
/* notches and the home indicator */
.mbar{padding-top:calc(8px + var(--sa-t))}.composer{margin-bottom:max(var(--s4),var(--sa-b))}.side{padding-bottom:max(var(--s4),var(--sa-b))}
#toasts{max-width:calc(100vw - var(--s4)*2)}
/* very small phones and short landscape screens */
@media(max-width:340px){.main{padding-inline:12px}.btn{padding-inline:var(--s3)}}
html[data-short="1"] .main{padding-block:var(--s4)}html[data-short="1"] .hello{margin-block:var(--s2)}
/* wide screens: keep line length readable and centre the content instead of stretching it */
.thread,.main{margin-inline:auto}
@media(min-width:2200px){.main{max-width:calc(1560px*var(--fz))}}
/* the editor preview is only ~110px tall on a landscape phone: show just the title and the button */
@media(max-height:420px){.pst .brand-mark,.pst p{display:none}.pst{gap:var(--s2)}.pst h3{margin:0}}