/* Every X belongs to the dialog chrome, so scrolling never moves it away. */
dialog.app-sheet .sheet-close,
dialog.fixed-dialog .sheet-close {
  position:absolute; top:20px; right:14px; z-index:10;
  display:grid; place-items:center; flex:0 0 44px;
  width:44px; height:44px; min-width:44px; min-height:44px;
  padding:10px; margin:0; border:1px solid #e1e3d8;
  border-radius:50%; background:#f1f0e8; color:#66765a;
  box-shadow:0 1px 5px #25341906;
}
dialog .sheet-close svg { width:20px; height:20px; }
dialog.app-sheet .sheet-close:focus-visible,
dialog.fixed-dialog .sheet-close:focus-visible { outline:2px solid #647b54; outline-offset:2px; }
.collection-dialog.app-sheet .collection-header,
.memory-box-dialog.app-sheet .memory-box-header,
.memory-studio-dialog.app-sheet .memory-studio-header { padding-right:74px; }
.memory-detail-dialog.app-sheet .memory-detail-header { padding-right:72px; }
.memory-detail-dialog.app-sheet .memory-detail-header>.eyebrow { flex:1; }
dialog.fixed-dialog { padding:0; overflow:hidden; max-height:calc(100dvh - max(16px,env(safe-area-inset-top))); }
dialog.fixed-dialog[open] { display:flex; flex-direction:column; }
.fixed-dialog .dialog-topbar { position:relative; flex:0 0 56px; height:56px; background:inherit; }
dialog.fixed-dialog .sheet-close { top:6px; }
.fixed-dialog .dialog-content { flex:0 1 auto; min-height:0; padding:0 24px max(24px,env(safe-area-inset-bottom)); overflow:auto; overscroll-behavior:contain; scrollbar-width:none; -webkit-overflow-scrolling:touch; scroll-padding:14px; }
.fixed-dialog .dialog-content::-webkit-scrollbar { display:none; width:0; height:0; }
.fixed-dialog .dialog-content:focus-visible { outline:2px solid #8e9e7c; outline-offset:-3px; }
.fixed-dialog .dialog-content>.primary-button,
.fixed-dialog .dialog-content>.outline-button { width:100%; }
.pwa-dialog .dialog-content>.outline-button { margin-top:9px; }
.info-dialog .dialog-content>.eyebrow,
.pwa-dialog .dialog-content>.eyebrow { font-size:10px; letter-spacing:.5px; color:#7c896d; }
.info-dialog .dialog-content>p,
.error-dialog .dialog-content>p,
.account-dialog .dialog-content>p { font-size:13px; line-height:1.9; color:#78866a; }
.error-dialog .dialog-content>p { white-space:pre-line; margin-bottom:23px; }
.account-dialog .dialog-content>.eyebrow { font-size:9px; letter-spacing:.7px; color:#7d8c6c; }
@media(max-width:359px) {
  .fixed-dialog .dialog-content { padding-inline:16px; }
  dialog.app-sheet .sheet-close { right:12px; }
}
@media(max-height:560px) and (orientation:landscape) {
  dialog.app-sheet .sheet-close { top:15px; }
  .fixed-dialog .dialog-topbar { flex-basis:52px; height:52px; }
  dialog.fixed-dialog .sheet-close { top:4px; }
}
@media(forced-colors:active) {
  .fixed-dialog .dialog-content { scrollbar-width:auto; }
  .fixed-dialog .dialog-content::-webkit-scrollbar { display:revert; width:revert; height:revert; }
}