/* Native Roundcube messages only. Inline form errors and blocking dialogs keep
   their original placement; loading/upload progress retains native lifetime. */
html:root body #messagestack {
  position: fixed;
  box-sizing: border-box;
  z-index: 1050;
  inset: 0;
  display: flex !important;
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
  width: 100%;
  height: 100dvh;
  max-width: none;
  max-height: none;
  margin: 0;
  padding: max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) 16px max(16px, env(safe-area-inset-left));
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  pointer-events: none;
  text-align: left;
}
html:root body #messagestack > .cm-toast {
  position: relative;
  box-sizing: border-box;
  display: block;
  flex: 0 0 auto;
  width: min(360px, 100%);
  min-height: 56px;
  margin: 0;
  padding: 16px 48px 16px 46px;
  border: 1px solid var(--cm-line, #e0e3e7);
  border-radius: 12px;
  background: var(--cm-surface, #fff);
  color: var(--cm-text, #202124);
  box-shadow: 0 2px 8px rgb(32 33 36 / 10%);
  font: 14px/22px Arial, "Helvetica Neue", system-ui, sans-serif;
  text-align: left;
  overflow-wrap: anywhere;
  pointer-events: auto;
  animation: cm-toast-in .28s cubic-bezier(.2, .8, .2, 1) both;
}
html:root body #messagestack > .cm-toast > i.icon { display: none; }
html:root body #messagestack > .cm-toast > span:not(.cm-toast-icon) { display: block; padding: 0; }
html:root body #messagestack > .cm-toast > .cm-toast-icon {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 15px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  margin: 0;
  padding: 0;
  color: var(--cm-primary, #0b57d0);
}
html:root body #messagestack > .cm-toast-confirmation > .cm-toast-icon { color: #188038; }
html:root body #messagestack > .cm-toast-warning > .cm-toast-icon { color: #915d00; }
html:root body #messagestack > .cm-toast-error > .cm-toast-icon { color: #b3261e; }
html.dark-mode body #messagestack > .cm-toast-confirmation > .cm-toast-icon { color: #81c995; }
html.dark-mode body #messagestack > .cm-toast-warning > .cm-toast-icon { color: #fdd663; }
html.dark-mode body #messagestack > .cm-toast-error > .cm-toast-icon { color: #f2b8b5; }
html:root body #messagestack .cm-toast-close {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 4px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  min-width: 44px;
  height: 44px;
  min-height: 44px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--cm-muted, #5f6368);
  cursor: pointer;
  box-shadow: none;
}
html:root body #messagestack .cm-toast-close:hover { background: var(--cm-hover, #eaf1fb); }
html:root body #messagestack .cm-toast-close:focus-visible { outline: 2px solid var(--cm-primary, #0b57d0); outline-offset: 1px; }
html:root body #messagestack .cm-toast-close::before { display: none; }
html:root body #messagestack > .cm-toast a { color: var(--cm-primary, #0b57d0); text-decoration: underline; text-underline-offset: 2px; }
html:root body #messagestack > :is(.cm-toast-loading, .cm-toast-uploading) { padding-right: 18px; }
html:root body #messagestack > :is(.cm-toast-loading, .cm-toast-uploading) .cm-toast-icon svg { animation: cm-toast-spin 1s linear infinite; }
html:root body #messagestack .cm-toast-spinner-track { opacity: .22; }
html:root body #messagestack > .cm-toast-exiting { animation: cm-toast-out .24s cubic-bezier(.4, 0, 1, 1) both; pointer-events: none; }
@keyframes cm-toast-in { from { opacity: 0; transform: translateX(calc(100% + 32px)); } to { opacity: 1; transform: translateX(0); } }
@keyframes cm-toast-out { from { opacity: 1; transform: translateX(0); } to { opacity: 0; transform: translateX(calc(100% + 32px)); } }
@keyframes cm-toast-spin { to { transform: rotate(360deg); } }
@media (max-width: 400px) {
  html:root body #messagestack { padding: max(12px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) 12px max(12px, env(safe-area-inset-left)); }
}
@media (prefers-reduced-motion: reduce) {
  html:root body #messagestack > .cm-toast,
  html:root body #messagestack .cm-toast-icon svg { animation: none !important; transition: none !important; }
}

/* Waiting cards do not spend their reading time outside the visible stack. */
html:root body #messagestack > .cm-toast-queued { display: none; animation: none; }
html:root body #messagestack > .cm-toast-repeated:not(.cm-toast-exiting) { animation: none; }

html:root body #messagestack :is(.cm-toast-icon,.cm-toast-close)>svg {display:block;flex-shrink:0;}