.notification-center{margin-left:auto;position:relative;flex-shrink:0;color:var(--text,#172b4d)}
.notification-bell{display:inline-flex;align-items:center;justify-content:center;position:relative;min-width:44px;min-height:44px;padding:8px;background:var(--surface,#fff);color:var(--accent,#16775f);border:1px solid var(--border,#8590a2);border-radius:8px}
.notification-count{background:#ae2e24;color:#fff;border-radius:10px;padding:1px 5px;font-size:11px;line-height:16px;position:absolute;top:-7px;right:-7px;font-variant-numeric:tabular-nums}
.notification-center [hidden]{display:none!important}
.notification-panel{position:absolute;right:0;top:calc(100% + 8px);width:min(380px,calc(100vw - 32px));max-height:calc(100dvh - 100px);overflow:auto;background:#fff;border:1px solid #8590a2;border-radius:10px;box-shadow:0 8px 24px #172b4d24;z-index:1100;padding:12px;text-align:left;white-space:normal;font-size:14px;line-height:1.45}
.notification-header{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:16px}.notification-close{padding:4px 10px;min-height:36px;font-size:20px}.notification-settings{padding:10px 0;border-block:1px solid #dce2e8}.notification-settings label{display:flex;align-items:center;gap:8px;font-size:14px}.notification-settings input{width:18px;height:18px;margin:0}.notification-test,.notification-read-all{min-height:36px;font-size:13px;margin-top:8px;padding:6px 10px}.notification-center p{font-size:12px;line-height:1.45;margin:8px 0}.notification-connection{color:#44546f}.notification-connection.is-error{color:#ae2e24}.notification-audio-status{color:#44546f}.notification-list{list-style:none;padding:0;margin:8px 0}.notification-list li{border-bottom:1px solid #dce2e8}.notification-link{display:block;padding:10px 8px;text-decoration:none;overflow-wrap:anywhere;color:#172b4d}.notification-link.is-unread{background:#e5f2ed;font-weight:650;border-left:3px solid #16775f}.notification-link small{display:block;font-size:12px;font-weight:400;color:#44546f;margin-top:4px}.notification-link:hover{background:#f0f5f4}.notification-center button:focus-visible,.notification-center a:focus-visible,.notification-sound:focus-visible{outline:2px solid #005fcc;outline-offset:2px}.notification-toasts{position:fixed;right:20px;bottom:20px;z-index:1090;width:min(380px,calc(100vw - 32px));display:grid;gap:8px}.notification-toast{background:#fff;border:1px solid #16775f;box-shadow:0 4px 18px #172b4d24;border-radius:8px;padding:12px;display:flex;align-items:start;gap:8px}.notification-toast a{flex:1;color:#172b4d;overflow-wrap:anywhere}.notification-toast button{min-width:32px;min-height:32px;padding:2px 8px}.notification-center button:disabled{opacity:.55;cursor:not-allowed}
@media(max-width:1100px){.topbar:has(.notification-center){display:flex!important;position:relative;min-height:52px;gap:8px}.topbar>.desktop-mode{display:none}.notification-panel{position:fixed;top:80px;right:16px;max-height:calc(100dvh - 96px)}.notification-center button{min-height:44px}.notification-toasts{right:16px;bottom:16px}}

.notification-pages{display:flex;flex-wrap:wrap;gap:8px}.notification-pages button{min-height:36px;font-size:13px;padding:6px 10px}
.topbar:has(.notification-center){display:flex!important;align-items:center;gap:12px;min-height:52px;margin-bottom:8px}.topbar:has(.notification-center)>span{font-size:12px;color:#44546f}
.topbar:has(.notification-center){width:100%!important;margin:0 0 8px!important;padding:4px 8px;box-sizing:border-box;min-width:0}.topbar:has(.notification-center)>span:first-child{min-width:0;overflow-wrap:anywhere}
