.header-notification-menu{position:absolute;top:calc(100% + 8px);right:58px;z-index:3500;width:min(390px,calc(100vw - 28px));height:auto;max-height:min(520px,calc(100vh - 150px));max-height:min(520px,calc(100dvh - 150px));display:none;flex-direction:column;background:#fff;border:1px solid #dce4eb;border-radius:16px;box-shadow:0 18px 48px rgba(15,39,66,.22);overflow:hidden}
.header-notification-menu.show{display:flex;animation:headerNotifyIn .18s ease both}
.header-notification-menu-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-bottom:1px solid #e4eaee;background:#f9fbfc}
.header-notification-menu-head strong{display:block;color:#17314b;font-size:.96rem}
.header-notification-menu-head small{display:block;color:#7b8792;font-size:.72rem;margin-top:2px}
.header-notification-menu-head button{width:34px;height:34px;border:0;border-radius:50%;background:#eef2f5;color:#34495d;font-size:1.45rem;line-height:1;cursor:pointer}
.header-notification-list{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.header-notification-item{width:100%;border:0;border-bottom:1px solid #edf1f4;background:#fff;padding:14px 16px;text-align:left;display:flex;gap:11px;cursor:pointer;font:inherit;transition:background .15s ease}
.header-notification-item:last-child{border-bottom:0}
.header-notification-item:hover,.header-notification-item:focus-visible{background:#f7fafc;outline:none}
.header-notification-item.unread{background:#f3f8fc}
.header-notification-dot{margin-top:7px;flex:0 0 8px;width:8px;height:8px;border-radius:50%;background:#bd1e2d}
.header-notification-item:not(.unread) .header-notification-dot{background:#cbd4db}
.header-notification-copy strong{display:block;color:#243b51;font-size:.86rem}
.header-notification-copy p{margin:3px 0 0;color:#647381;font-size:.78rem;line-height:1.4}
.header-notification-copy time{display:block;color:#96a1aa;font-size:.68rem;margin-top:5px}
.header-notification-menu-footer{position:relative;z-index:2;flex:0 0 auto;padding:10px 12px calc(10px + env(safe-area-inset-bottom,0px));border-top:1px solid #e4eaee;background:#f9fbfc;box-shadow:0 -6px 14px rgba(15,39,66,.04)}
.header-notification-menu-footer button{display:block;width:100%;min-height:42px;border:1px solid #d9e1e7;border-radius:10px;background:#fff;color:#a12622;font:inherit;font-size:.82rem;font-weight:700;cursor:pointer;transition:background .15s ease,border-color .15s ease,color .15s ease}
.header-notification-menu-footer button:hover,.header-notification-menu-footer button:focus-visible{background:#fff4f3;border-color:#d8aaa7;color:#821f1b;outline:none}
.header-notification-menu-footer button:disabled{background:#f2f4f6;border-color:#e2e7eb;color:#98a1a9;cursor:not-allowed}
@keyframes headerNotifyIn{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:600px){.header-notification-menu{right:0;left:0;width:auto;top:calc(100% + 8px);height:auto;max-height:min(520px,72vh,calc(100dvh - 125px));border-radius:14px}}