/* The header and scroll viewport occupy separate flex rows. Content cannot paint
   into the header or the dialog's outer padding when its body scrolls. */
dialog.site-dialog{padding:0;overflow:hidden;max-height:min(92svh,calc(100svh - 32px));isolation:isolate}
dialog.site-dialog[open]{display:flex;flex-direction:column}
.site-dialog .dialog-header{position:relative;top:auto;z-index:2;flex:0 0 auto;margin:0;padding:20px 28px;background:var(--cream);border-bottom:1px solid var(--line);min-width:0}
.site-dialog .dialog-body{flex:1 1 auto;min-height:0;min-width:0;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;padding:28px;background:var(--cream);scroll-padding:24px}
.site-dialog .dialog-body:focus-visible{outline:2px solid var(--wine);outline-offset:-4px}
.site-dialog .gallery-layout{padding:8px 10px 10px}
.site-dialog .privacy-content{padding:0 10px 8px}
.site-dialog .download-dialog-content{padding:0 12px 8px}
.site-dialog#screenshot-dialog{padding:0}
.site-dialog .screenshot-body{display:flex;flex-direction:column;overflow:hidden;padding:20px;scrollbar-gutter:auto}
.site-dialog .screenshot-viewport{flex:1 1 auto;min-height:0;max-height:none;overflow:auto;margin:0;overscroll-behavior:contain}
@media(max-width:580px){
 .site-dialog .dialog-header{padding:14px 18px;gap:12px}
 .site-dialog .dialog-body{padding:18px;scroll-padding:18px}
 .site-dialog .gallery-layout{padding:6px 0 0}
 .site-dialog .privacy-content{padding:7px 0 8px}
 .site-dialog .download-dialog-content{padding:7px 0 8px}
 .site-dialog .screenshot-body{padding:12px}
}
@media(max-width:360px){
 .site-dialog .dialog-header{padding:12px 14px}
 .site-dialog .dialog-body{padding:14px}
 .site-dialog .screenshot-body{padding:10px}
}
