.icon-bell {mask-image:url('/icons/bell.svg');-webkit-mask-image:url('/icons/bell.svg');}
.header-notifications {display:inline-flex;flex:none;align-items:center;}
.notification-bell {position:relative;flex:none;}
.notification-bell>.notification-count {position:absolute;top:-5px;right:-6px;min-width:19px;height:19px;padding:0 5px;display:flex;align-items:center;justify-content:center;border-radius:12px;background:var(--accent);color:white;font-size:10px;font-weight:650;border:2px solid var(--bg);line-height:1;}
.notification-bell>[data-notification-badge][hidden] {display:none;}
.notification-center-dialog {position:fixed;inset:76px 24px auto auto;margin:0;padding:0;width:min(430px,calc(100vw - 24px));max-width:none;max-height:calc(100vh - 96px);max-height:calc(100dvh - 96px);border:1px solid var(--line);border-radius:22px;color:var(--text);background:var(--solid);overflow:auto;box-shadow:0 20px 65px #0003;overscroll-behavior:contain;}
.notification-center-dialog:not([open]) {display:none;}
.notification-center-dialog::backdrop {background:#12172535;backdrop-filter:blur(2px);}
.notification-center-heading {position:sticky;top:0;z-index:1;background:var(--solid);display:flex;gap:12px;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--divider);}
.notification-center-heading h2 {font-size:17px;margin:0;overflow-wrap:anywhere;}
.notification-center-heading>div {display:flex;align-items:center;gap:6px;flex:none;}
.notification-center-dialog .icon-button {width:36px;height:36px;min-width:36px;padding:8px;}
.notification-center-status {padding:24px 20px;color:var(--muted);font-size:13px;line-height:1.6;margin:0;}
.notification-center-status[hidden] {display:none;}
.notification-center-list {list-style:none;padding:0;margin:0;}
.notification-center-list li {border-bottom:1px solid var(--divider);position:relative;}
.notification-center-list form {margin:0;}
.notification-entry {appearance:none;border:0;background:transparent;color:var(--text);border-radius:0;box-shadow:none;width:100%;text-align:start;padding:16px 20px;display:grid;gap:5px;line-height:1.45;cursor:pointer;font-family:inherit;}
.notification-entry:hover {background:var(--input);}
.notification-entry:focus-visible {outline:2px solid var(--accent);outline-offset:-3px;}
.notification-entry-title {font-size:13px;line-height:1.5;font-weight:600;overflow-wrap:anywhere;}
.notification-entry-kind {font-size:11px;color:var(--accent);}
.notification-entry-body {font-size:12px;color:var(--muted);white-space:pre-wrap;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.notification-entry time {font-size:10px;color:var(--muted);margin-top:3px;}
.notification-center-list .is-unread {background:color-mix(in srgb,var(--accent) 6%,transparent);}
.notification-center-list .is-unread::before {content:'';position:absolute;left:7px;top:23px;width:5px;height:5px;border-radius:50%;background:var(--accent);}
.notification-center-list .is-read .notification-entry-title {font-weight:450;}
.notification-center-footer {display:flex;gap:10px;align-items:center;justify-content:space-between;padding:14px 16px;background:var(--solid);position:sticky;bottom:0;border-top:1px solid var(--divider);font-size:12px;}
.notification-center-footer>a {font-weight:550;color:var(--accent);}
.notification-center-footer .text-button {max-width:180px;font-size:11px;line-height:1.4;white-space:normal;}
.notification-page-actions {display:flex;gap:10px;align-items:center;flex-wrap:wrap;}
.notification-settings-dialog {width:min(860px,calc(100vw - 24px));}
.notification-settings-dialog .settings-dialog-body {padding-top:16px;}
.notification-settings-dialog .notifications-settings {box-shadow:none;border:1px solid var(--divider);background:var(--panel);}
.notification-settings-dialog .notification-preference-card {margin-top:0;}
@media(max-width:640px) {
 body:not([data-mobile-navigation]) .site-header .brand,body:not([data-mobile-navigation]) .site-header .brand img {width:100px;height:auto;}
 body:not([data-mobile-navigation]) .notification-bell {width:36px;min-width:36px;height:44px;padding:8px;}
 .notification-center-dialog {inset:76px 12px auto auto;}
 .notification-center-footer {align-items:flex-start;}
 .notification-page-actions {align-self:flex-start;}
 .notification-settings-dialog .notifications-settings {padding:14px;}
 .notification-center-heading h2 {font-size:16px;}
 .notification-center-footer .text-button {max-width:155px;}
}
@media(max-width:360px) {
 body:not([data-mobile-navigation]) .site-header .brand,body:not([data-mobile-navigation]) .site-header .brand img {width:88px;}
 body[data-mobile-navigation] .site-header .brand,body[data-mobile-navigation] .site-header .brand img {width:64px;}
 body[data-mobile-navigation] .header-actions .icon-button,body[data-mobile-navigation] .header-support {width:32px;min-width:32px;padding:7px;}
 .notification-center-footer {gap:8px;padding-inline:12px;}
 .notification-center-footer .text-button {max-width:135px;}
}
