/* One notification component, shared by the website and all application workspaces. */
.app-notification[hidden]{display:none!important}
.app-notification{
  --notification-bg:#181922;--notification-line:#343643;--notification-text:#f8f8fa;
  --notification-muted:#c2c5d3;--notification-accent:#ff7188;--notification-icon-bg:#d90b2e21;
  position:fixed;right:24px;bottom:24px;z-index:150;
  display:grid;grid-template-columns:38px minmax(0,1fr) 44px;align-items:center;gap:13px;
  width:min(420px,calc(100vw - 32px));padding:16px;
  border:1px solid var(--notification-line);border-radius:17px;
  background:var(--notification-bg);color:var(--notification-text);
  box-shadow:0 20px 65px #0005,0 0 0 1px #ffffff03;
  font-family:Inter,"Segoe UI",system-ui,sans-serif;line-height:1.5;
  animation:notification-in .18s ease-out;
}
.app-notification .notification-icon{display:grid;place-items:center;flex-shrink:0;width:38px;height:38px;border-radius:12px;background:var(--notification-icon-bg);color:var(--notification-accent)}
.app-notification .notification-icon svg{width:20px;height:20px;display:block}
.app-notification .notification-content{min-width:0;text-align:left}
.app-notification .notification-title{display:block;font-size:12px;font-weight:700;letter-spacing:.015em;line-height:1.4;color:var(--notification-text);margin:0 0 4px}
.app-notification .notification-message{font-size:13px;font-weight:450;line-height:1.6;color:var(--notification-muted);margin:0;overflow-wrap:anywhere}
.app-notification .notification-close{display:grid;place-items:center;align-self:center;min-width:44px;min-height:44px;padding:0;border:0;border-radius:10px;background:transparent;color:var(--notification-muted);cursor:pointer;touch-action:manipulation}
.app-notification .notification-close svg{display:block;width:18px;height:18px}
.app-notification .notification-close:hover{background:#ffffff09;color:var(--notification-text)}
.app-notification .notification-close:focus-visible{outline:2px solid var(--notification-accent);outline-offset:3px}
:root[data-theme=light] .app-notification,:root[data-site-theme=light] .app-notification{--notification-bg:#fff;--notification-line:#e0e2e9;--notification-text:#171820;--notification-muted:#525666;--notification-accent:#c70a2b;--notification-icon-bg:#d90b2e0d;box-shadow:0 16px 50px #1718201a}
:root[data-theme=light] .app-notification .notification-close:hover,:root[data-site-theme=light] .app-notification .notification-close:hover{background:#17182006}
@keyframes notification-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:599px){.app-notification{right:16px;left:16px;bottom:calc(88px + env(safe-area-inset-bottom));width:auto;padding:14px;gap:10px;border-radius:15px;grid-template-columns:34px minmax(0,1fr) 44px}.app-notification .notification-icon{width:34px;height:34px;border-radius:10px}.app-notification .notification-message{font-size:12px}.app-notification .notification-close{min-height:44px}}
@media(prefers-reduced-motion:reduce){.app-notification{animation:none}}
@media(forced-colors:active){.app-notification{border:1px solid CanvasText}.app-notification .notification-icon{color:CanvasText;border:1px solid CanvasText}}
