/* Keep the in-place panel inside the current surface's shared shell clearance. */
html[data-simphoni-browser-footer] .notifications-panel {
  top: calc(var(--simphoni-account-header-height, 52px) + 8px);
  height: min(680px, calc(var(--simphoni-visible-viewport-height, 100dvh) - var(--simphoni-account-header-height, 52px) - var(--simphoni-browser-footer-height, 71px) - 16px));
  max-height: calc(var(--simphoni-visible-viewport-height, 100dvh) - var(--simphoni-account-header-height, 52px) - var(--simphoni-browser-footer-height, 71px) - 16px);
}

/* Current notification surface: clear labels, restrained emphasis, visible states. */
.notifications-panel { font: 400 15px/1.45 system-ui, sans-serif; background:#17121f; border:1px solid #695779; box-shadow:0 12px 36px #0008; }
.notifications-panel::after { display:none; }
.notifications-panel .notifs-header h3 { font-size:1.2rem; text-transform:none; letter-spacing:0; color:#fff; }
.notifications-panel .notif-subtitle { color:#cfc6d8; text-transform:none; letter-spacing:0; }
.notifications-panel .notif-item { background:#231b2b; border:1px solid #695779; box-shadow:none; }
.notifications-panel button { min-height:44px; }
.notifications-panel button:focus-visible { outline:3px solid #a8f1f1; outline-offset:3px; }
.notification-feed-status { margin:0 0 12px; color:#e6dcea; }
@media(prefers-reduced-motion:reduce){.notifications-panel,.notifications-panel .fade-in { animation:none!important;transition:none!important; }}
/* Explicit specificity survives the retained application's later CSS import. */
.notifications-panel.open { background: #17121f; color:#f7f2fa; backdrop-filter:none; box-shadow:0 12px 36px #0008; }
.notifications-panel.open::after { display:none; }
.notifications-panel.open .notifs-title h4 { font:600 20px/1.25 system-ui,sans-serif; color:#fff; text-transform:none; letter-spacing:0; }
.notifications-panel.open .notifs-subtitle { font:400 14px/1.4 system-ui,sans-serif; color:#d8cfdf; text-transform:none; letter-spacing:0; }
.notifications-panel.open .notif-item { background:#231b2b; color:#f7f2fa; box-shadow:none; animation:none; opacity:1; }
.notifications-panel.open .notif-item p { color:#f7f2fa; font:400 15px/1.45 system-ui,sans-serif; }
.notifications-panel.open .notif-item__header { flex-wrap:wrap; }
.notifications-panel.open .notif-item button,.notifications-panel.open .notifs-close-btn { min-width:44px;min-height:44px;font-size:15px; }
.notifications-panel.open .notif-item__badge { max-width:100%; }
.notification-send-status { padding:12px; border:1px solid #887493; border-radius:10px; background:#231b2b;color:#f7f2fa; }
.notifications-panel.open .notif-item__header { display:flex; flex-wrap:wrap; }
.notifications-panel.open .notif-item__badge { overflow:visible; white-space:normal; text-transform:none; letter-spacing:0; font-size:13px; }

/* Processing feedback scrolls with messages, preserving the composer space. */
.notification-processing-action {
  align-self: flex-start;
  border: 1px solid #56d9c5;
  border-radius: 12px;
  padding: 10px 14px;
  min-height: 44px;
  background: #073f3b;
  color: #effffa;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
  flex-shrink: 0;
}
.notification-processing-action:focus-visible { outline: 3px solid #ba9aff; outline-offset: 3px; }
.notification-processing-action:disabled { opacity: .65; cursor: wait; }
.chat-messages > .notification-send-status { flex-shrink: 0; margin-block: 8px; }