/* Safe areas belong to the website only in standalone mode; native shells own theirs. */
html.site-webapp {--webapp-top:env(safe-area-inset-top,0px);--webapp-bottom:env(safe-area-inset-bottom,0px);--webapp-left:env(safe-area-inset-left,0px);--webapp-right:env(safe-area-inset-right,0px)}
html.site-webapp body {min-height:100dvh;box-sizing:border-box}
html.site-webapp body.site-page:has(.site-header) {padding-top:calc(var(--site-top-height) + var(--webapp-top));padding-left:calc(var(--site-side-width) + var(--webapp-left));padding-right:var(--webapp-right);padding-bottom:var(--webapp-bottom)}
html.site-webapp .site-page .site-header {height:calc(var(--site-top-height) + var(--webapp-top));padding-top:var(--webapp-top);box-sizing:border-box}
html.site-webapp .site-header .site-topbar {padding-left:calc(12px + var(--webapp-left));padding-right:calc(12px + var(--webapp-right))}
html.site-webapp .site-header .site-sidebar {top:calc(var(--site-top-height) + var(--webapp-top));left:var(--webapp-left);padding-bottom:calc(12px + var(--webapp-bottom))}
html.site-webapp .site-header .site-account-popover {max-height:calc(var(--site-visual-height,100dvh) - var(--site-top-height) - var(--webapp-top) - 24px)}
html.site-webapp #site-webapp-back {display:inline-flex;align-items:center;justify-content:center;min-width:40px;min-height:40px;padding:6px;flex-shrink:0}
#site-webapp-back[hidden] {display:none!important}
html.site-webapp dialog[open] {max-width:calc(100vw - var(--webapp-left) - var(--webapp-right) - 24px);max-height:calc(var(--site-visual-height,100dvh) - var(--webapp-top) - var(--webapp-bottom) - 24px);box-sizing:border-box;overflow:auto}
html.site-webapp .mail-workspace.mail-split .mail-columns {height:calc(100dvh - var(--mail-columns-top,240px) - var(--webapp-bottom) - 12px)}
html.site-webapp #mail-file-dialog {height:calc(var(--site-visual-height,100dvh) - var(--webapp-top) - var(--webapp-bottom) - 24px)}
html.site-webapp.site-keyboard-open dialog[open] {position:fixed;top:calc(var(--site-visual-top,0px) + 8px);bottom:auto;margin-block:0;max-height:calc(var(--site-visual-height,100dvh) - 16px)}
html.site-webapp .auth-layout,html.site-webapp .security-layout {padding-top:calc(24px + var(--webapp-top));padding-bottom:calc(24px + var(--webapp-bottom));padding-left:calc(16px + var(--webapp-left));padding-right:calc(16px + var(--webapp-right))}
@media(max-width:760px) {
 html.site-webapp body.site-page:has(.site-header) {padding-bottom:calc(62px + var(--webapp-bottom))}
 html.site-webapp .site-header .site-sidebar {top:0;left:0;padding-top:calc(14px + var(--webapp-top));padding-left:calc(12px + var(--webapp-left))}
 html.site-webapp .site-header .site-mobile-nav {padding-left:calc(8px + var(--webapp-left));padding-right:calc(8px + var(--webapp-right))}
 html.site-webapp.site-keyboard-open .site-header .site-mobile-nav {display:none}
 html.site-webapp.site-keyboard-open body.site-page:has(.site-header) {padding-bottom:var(--webapp-bottom)}
}
@media(pointer:coarse) {
 html.site-webapp input:not([type=checkbox]):not([type=radio]):not([type=range]),html.site-webapp textarea,html.site-webapp select {font-size:16px!important}
 html.site-webapp .site-header .site-sidebar-resizer {width:14px;touch-action:none}
}

/* Login and device approval intentionally have no JavaScript. */
@media(display-mode:standalone) {
 .auth-layout,.security-layout{padding-top:calc(24px + env(safe-area-inset-top));padding-bottom:calc(24px + env(safe-area-inset-bottom));padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right);min-height:100dvh;box-sizing:border-box}
 .auth-layout input,.security-layout input{font-size:16px}
}