.ms-app-notifications {
  position: sticky;
  top: 0;
  z-index: 10000;
  flex: 0 0 auto;
  max-height: min(40vh, 320px);
  overflow-y: auto;
  box-shadow: var(--shadow-2);
}

.ms-app-notification {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  max-height: min(20vh, 160px);
  padding: 9px max(14px, calc((100vw - 1440px) / 2));
  border-bottom: 1px solid transparent;
  color: var(--fg-1);
  font: var(--t-body-sm);
  font-weight: 600;
}

.ms-app-notification-info {
  background: var(--status-info-bg);
  border-color: var(--status-info-border);
  color: var(--status-info-fg);
}

.ms-app-notification-warning {
  background: var(--status-warn-bg);
  border-color: var(--sun-500);
  color: var(--status-warn-fg);
}

.ms-app-notification-error {
  background: var(--status-danger-bg);
  border-color: var(--status-danger-border);
  color: var(--status-danger-fg);
}

.ms-app-notification-marker {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: currentColor;
}

.ms-app-notification-message {
  min-width: 0;
  max-height: calc(min(20vh, 160px) - 18px);
  overflow-y: auto;
  overflow-wrap: anywhere;
  white-space: pre-line;
}

.ms-app-notification-close {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  padding: 0;
  border: 0;
  border-radius: var(--r-1);
  color: inherit;
  background: transparent;
  cursor: pointer;
}

.ms-app-notification-close:hover,
.ms-app-notification-close:focus-visible {
  background: rgba(0, 0, 0, .09);
}

.ms-recording-consent {
  max-width: min(440px, calc(100vw - 32px));
  padding: 20px;
  border: 0;
  border-radius: var(--r-card);
  color: var(--fg-1);
  background: var(--bg-surface);
  font: var(--t-body);
  box-shadow: var(--shadow-3);
}

.ms-recording-consent h2 {
  margin: 0 0 8px;
  font: var(--t-h3);
}

.ms-recording-consent p { margin: 0 0 12px; color: var(--fg-2); font: var(--t-body-sm); }

.ms-recording-consent::backdrop { background: var(--bg-backdrop); }

.ms-recording-consent-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}