.notifications-menu{position:relative;flex:0 0 auto}
.notifications-trigger{color:var(--text);cursor:pointer;transition:border-color .2s,background .2s,color .2s}
.notifications-trigger:hover,.notifications-trigger[aria-expanded="true"]{border-color:rgba(201,255,74,.45);background:rgba(201,255,74,.08);color:var(--lime)}
.notifications-menu [hidden]{display:none!important}
.notifications-panel{position:absolute;z-index:120;top:calc(100% + 10px);right:0;width:min(360px,calc(100vw - 28px));overflow:hidden;border:1px solid rgba(201,255,74,.2);border-radius:16px;background:rgba(12,14,20,.98);box-shadow:0 24px 70px rgba(0,0,0,.55);backdrop-filter:blur(22px)}
.notifications-panel::before{content:'';position:absolute;inset:0 0 auto;height:1px;background:linear-gradient(90deg,transparent,var(--lime),transparent);opacity:.55}
.notifications-panel>header{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:18px;border-bottom:1px solid var(--line)}
.notifications-panel h2{margin:0;font:700 16px var(--display);letter-spacing:-.025em}
.notifications-panel header button{padding:0;border:0;background:transparent;color:var(--lime);font-size:8px;font-weight:700;cursor:pointer}
.notifications-panel header button:disabled{color:var(--dim);cursor:default}
.notifications-list{max-height:min(390px,55vh);margin:0;padding:0;overflow-y:auto;list-style:none}
.notification-item{padding:15px 18px;border-bottom:1px solid var(--line)}
.notification-item strong{font:700 11px var(--display)}
.notification-item p{margin:5px 0 0;color:var(--muted);font-size:9px}
.notifications-empty{min-height:180px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:26px;text-align:center}
.notifications-empty .material-symbols-rounded{color:var(--lime);font-size:32px;opacity:.75}
.notifications-empty p{margin:0;color:var(--muted);font-size:10px}
@media(max-width:760px){.notifications-panel{position:fixed;top:76px;right:14px;left:14px;width:auto;max-height:calc(100dvh - 170px)}.notifications-panel>header{padding:16px}.notifications-panel h2{font-size:15px}.notifications-empty{min-height:155px}}
@media(min-width:769px){.notifications-panel{top:calc(100% + 12px);right:0;left:auto;width:360px;max-width:calc(100vw - 32px);border-radius:18px;background:rgba(12,14,20,.97);box-shadow:0 18px 55px rgba(0,0,0,.48),0 0 0 1px rgba(255,255,255,.025);transform-origin:top right}.notifications-panel:not([hidden]){animation:notificationsPanelIn .2s cubic-bezier(.2,.8,.2,1)}}
@keyframes notificationsPanelIn{from{opacity:0;transform:translateY(-7px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(prefers-reduced-motion:reduce){.notifications-panel:not([hidden]){animation:none}}