/* One app viewport; only page content and sheets scroll. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
.app-shell,.app,.screen,.sheet,.join-shell{min-width:0;max-width:100%}
.screen,.join-shell{overflow-x:hidden;overflow-anchor:none;scrollbar-gutter:auto}
.screen>*{max-width:100%}
.grow,.grid-2>*,.card-row>*,.topbar>*,.composer-box{min-width:0}
.bubble,.title,.chat-title,.vote-title,.sub,.timeline-card,.recap-cover h1{overflow-wrap:anywhere}
.sheet,.memory-confirm-sheet{overscroll-behavior:contain;max-height:calc(100% - max(var(--safe-top),16px));overflow-y:auto;scroll-padding-block:16px;flex-shrink:0}
.sheet input,.sheet textarea,.sheet select,.join-form input,.join-form textarea,.join-form select{scroll-margin-block:18px}
.modal-backdrop{overflow:hidden;min-height:0}
.screen:not(.chat-screen){scroll-padding-bottom:calc(var(--tabbar-h) + var(--safe-bottom) + 24px)}
@media(pointer:coarse){
 html,body{touch-action:pan-x pan-y}
 button,a,input,textarea,select{touch-action:manipulation}
 input:not([type=checkbox]):not([type=radio]),textarea,select{font-size:max(16px,1em)}
}
@media(max-width:759px){
 html,body{width:100%;height:100%;min-height:0;overflow:hidden}
 body{position:fixed;inset:0}
 .app-shell{position:absolute;top:var(--viewport-top,0px);left:0;right:0;bottom:auto;width:100%;height:var(--app-height,100dvh);min-height:0;max-height:none;margin:0}
 .app{height:100%;min-height:0;max-height:100%}
 .join-shell{height:100%;min-height:0;overflow-y:auto}
 .sheet,.product-sheet{max-height:calc(100% - max(var(--safe-top),16px))}
 .keyboard-open .sheet{padding-bottom:16px}
}
html.phone-layout,html.phone-layout body{height:100%;min-height:0;overflow:hidden}
.phone-layout body{position:fixed;inset:0;display:block;padding:0}
.phone-layout .app-shell{position:absolute;top:var(--viewport-top,0px);left:0;width:100%;height:var(--app-height,100dvh);min-height:0;max-height:none;margin:0;border:0;border-radius:0;box-shadow:none}
.phone-layout .app{height:100%;min-height:0;border-radius:0}
.phone-layout .modal-backdrop{border-radius:0}
/* Preserve the standalone fix: both the shell AND its clipping ancestors must
   use the large viewport. visualViewport/100dvh can omit the iOS status bar. */
@media(display-mode:standalone){
 html.phone-layout,html.phone-layout body{height:100lvh}
 .phone-layout .app-shell{height:var(--app-height,100lvh)}
}
@media(max-width:759px) and (display-mode:standalone){
 html,body{height:100lvh}
 .app-shell{height:var(--app-height,100lvh)}
}
@media print{html.phone-layout,html.phone-layout body{height:auto;overflow:visible;position:static}.phone-layout .app-shell,.phone-layout .app{height:auto;max-height:none;position:static}}