.notif-backdrop{z-index:289;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#00000059;position:fixed;inset:0}.notif-bell{position:relative}.notif-bell__btn{width:36px;height:36px;color:var(--c-text-muted);background:0 0;border:none;border-radius:9999px;justify-content:center;align-items:center;transition:color .15s cubic-bezier(.4,0,.2,1),background .15s cubic-bezier(.4,0,.2,1);display:flex;position:relative}.notif-bell__btn:hover,.notif-bell__btn--active{color:var(--c-text-primary);background:#9585d614}.notif-bell__badge{color:#fff;text-align:center;pointer-events:none;background:#9585d6;border-radius:9999px;min-width:16px;height:16px;padding:0 4px;font-size:10px;font-weight:700;line-height:16px;position:absolute;top:-3px;right:-3px}.notif-panel{width:320px;max-width:calc(100vw - 3rem);max-height:420px;position:absolute;top:calc(100% + 10px);right:0}@media (width>=768px){.notif-panel{width:380px;max-height:480px}}.notif-panel{border:1px solid var(--c-panel-border);background:linear-gradient(180deg, #ffffff0d 0%, #fff0 38%), var(--c-panel-bg);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);box-shadow:var(--c-panel-shadow);z-index:290;border-radius:16px;flex-direction:column;display:flex;overflow:hidden}@media (width>=768px){.notif-panel{top:calc(100% + 12px)}}.notif-panel--portal{position:fixed}@media (width<=768px){.notif-panel--portal{left:50%;right:auto;transform:translate(-50%)}}.notif-panel--inline{-webkit-backdrop-filter:none;backdrop-filter:none;width:100%;max-width:100%;max-height:none;box-shadow:none;background:0 0;border:0;position:static;overflow:visible}.notif-panel--inline .notif-panel__head{padding-left:0;padding-right:0}.notif-panel--inline .notif-panel__list{flex-direction:column;gap:.5rem;padding-top:2px;display:flex;overflow:visible}.notif-panel--inline .notif-row{background:radial-gradient(120% 130% at 0% -10%, #9585d617 0%, transparent 52%), linear-gradient(180deg, #ffffff05 0%, #fff0 42%, #0000000f 100%), var(--c-bg-card);box-shadow:inset 0 1px #ffffff0a,inset 0 -1px #0000001f,0 2px 8px #00000059;box-shadow:var(--c-card-shadow);border:2px solid #ffffff1a;border-color:#ffffff1a #0003 #00000040 #ffffff12;border-radius:16px;margin:0;padding:.5rem 1rem;transition:border-color .3s cubic-bezier(.4,0,.2,1),border-top-color .3s cubic-bezier(.4,0,.2,1),box-shadow .3s cubic-bezier(.4,0,.2,1),transform .3s cubic-bezier(.4,0,.2,1);container-type:inline-size}.notif-panel--inline .notif-row:hover{border-top-color:rgba(var(--user-theme-accent-rgb,149, 133, 214), .32);transform:translateY(-1px)}.notif-panel--inline .notif-row--unread{background:radial-gradient(120% 130% at 0% -10%, #9585d61f 0%, transparent 52%), linear-gradient(180deg, #ffffff05 0%, #fff0 42%, #0000000f 100%), var(--c-bg-card)}.notif-panel--inline .notif-row--unread .notif-row__text{color:var(--c-text-primary)}.notif-panel--inline .notif-row:last-child{border-bottom:0}.notif-panel--inline .notif-panel__section-title{background:0 0;border-bottom:0;padding-inline:0}.notif-panel__head{border-bottom:1px solid var(--c-panel-head-border);flex-shrink:0;justify-content:space-between;align-items:center;gap:.5rem;padding:.5rem 1rem;display:flex}.notif-panel__title{color:var(--c-text-secondary);font-size:.875rem;font-weight:600}.notif-panel__head-actions{align-items:center;gap:.25rem;display:flex}.notif-panel__action-btn{color:var(--c-text-muted);border:1px solid var(--c-action-chip-border);border-radius:9999px;align-items:center;gap:4px;padding:3px 8px;font-size:.75rem;font-weight:500;transition:color .15s cubic-bezier(.4,0,.2,1),border-color .15s cubic-bezier(.4,0,.2,1),background .15s cubic-bezier(.4,0,.2,1);display:inline-flex}.notif-panel__action-btn svg{width:12px!important;height:12px!important}.notif-panel__action-btn:hover{color:var(--c-text-secondary);border-color:var(--c-action-chip-hover-border);background:var(--c-action-chip-hover-bg)}.notif-panel__action-btn--danger:hover{color:#dc2626;background:#dc262614;border-color:#dc26264d}.notif-panel__list{overscroll-behavior:contain;flex:1;overflow-y:auto}.notif-panel__section-title{letter-spacing:.06em;text-transform:uppercase;color:var(--c-text-muted);border-bottom:1px solid var(--c-row-border);background:var(--c-surface-tint);padding:10px 1rem 6px;font-size:11px;font-weight:700}.notif-panel__empty{text-align:center;color:var(--c-text-muted);padding:2rem 1rem}.notif-panel__empty svg{opacity:.35;margin:0 auto .25rem;display:block}.notif-panel__empty p{font-size:.875rem}.notif-row{border-bottom:1px solid var(--c-row-border);border-left:2px solid #0000;align-items:flex-start;gap:12px;padding:10px 1rem;transition:background .15s cubic-bezier(.4,0,.2,1),border-left-color .15s cubic-bezier(.4,0,.2,1);display:flex}.notif-row--unread{background:#9585d60d;border-left-color:#9585d666}.notif-row--unread .notif-row__text{color:var(--c-text-primary)}.notif-row:last-child{border-bottom:none}.notif-row:hover{background:var(--c-surface-tint)}.notif-row__left{flex-shrink:0;padding-top:1px}.notif-row__avatar-wrap{width:36px;height:36px;position:relative}.notif-row__avatar-btn{cursor:pointer;background:0 0;border:none;border-radius:9999px;padding:0;display:flex}.notif-row__type-badge{border:1.5px solid rgba(var(--c-bg-primary-rgb), .97);color:#beb0ef;background:#9585d640;border-radius:9999px;justify-content:center;align-items:center;width:16px;height:16px;display:flex;position:absolute;bottom:-2px;right:-3px}.notif-row__type-badge svg{width:9px!important;height:9px!important}.notif-row__system-icon{color:#beb0ef;background:#9585d61f;border-radius:9999px;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;display:flex}.notif-row__system-icon svg{width:16px!important;height:16px!important}.notif-row__body{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.notif-row__text{color:var(--c-text-secondary);overflow-wrap:break-word;word-break:break-word;margin:0;font-size:.875rem;line-height:1.35}.notif-row__item-name{color:var(--c-text-primary);font-style:normal;font-weight:600}.notif-row__time{color:var(--c-text-muted);letter-spacing:.01em;font-size:11px}.notif-row__actions{gap:.25rem;margin-top:.25rem;display:flex}.notif-row__link{font-size:inherit;color:var(--c-text-primary);cursor:pointer;vertical-align:baseline;overflow-wrap:break-word;word-break:break-word;background:0 0;border:none;padding:0;font-weight:600;transition:color .15s cubic-bezier(.4,0,.2,1);display:inline}.notif-row__link:hover{color:#beb0ef}.notif-row__delete{width:22px;height:22px;color:var(--c-text-muted);opacity:0;border-radius:9999px;flex-shrink:0;justify-content:center;align-self:center;align-items:center;transition:opacity .15s cubic-bezier(.4,0,.2,1),color .15s cubic-bezier(.4,0,.2,1),background .15s cubic-bezier(.4,0,.2,1);display:flex}.notif-row__delete svg{width:11px!important;height:11px!important}.notif-row__delete:hover{color:var(--c-text-primary);background:var(--c-ghost-hover-bg)}@media (hover:none){.notif-row__delete{opacity:1}}.notif-row:hover .notif-row__delete{opacity:1}.notif-row[data-type=friend_request] .notif-row__type-badge{color:#beb0ef;background:#9585d638}.notif-row[data-type=friend_accepted] .notif-row__type-badge,.notif-row[data-type=share_accepted] .notif-row__type-badge{color:#4ade80;background:#16a34a33}.notif-row[data-type=collection_invite] .notif-row__type-badge{color:#93c5fd;background:#2563eb33}.notif-row[data-type=collection_subscribed] .notif-row__type-badge{color:#beb0ef;background:#9585d638}.notif-row[data-type=collection_like] .notif-row__type-badge{color:#fca5a5;background:#dc262633}.notif-row[data-type=collection_item_added] .notif-row__type-badge{color:#fbbf24;background:#c9a84c33}.notif-row[data-type=share_declined] .notif-row__type-badge,.notif-row[data-type=member_left] .notif-row__type-badge{background:rgba(var(--c-text-muted-rgb), .18);color:var(--c-text-secondary)}.notif-row[data-type=pwa_install_reminder] .notif-row__system-icon{color:#9585d6;background:#9585d61a}.btn--xs{height:auto;min-height:0;padding:3px 10px;font-size:.75rem}@media (width<=768px){.notif-panel:not(.notif-panel--inline){top:calc(max(1rem, env(safe-area-inset-top,0px)) + max(1rem, env(safe-area-inset-top,0px)) + 44px + .5rem);transform-origin:top;width:min(380px,100vw - 2rem);max-height:65vh;margin-left:auto;margin-right:auto;position:fixed;bottom:auto;left:0;right:0}}@media (width<=768px) and (display-mode:standalone){.notif-panel:not(.notif-panel--inline){top:calc(env(safe-area-inset-top,0px) + .5rem + 44px + .25rem)}}@media (width<=768px){.notif-panel--inline{border-radius:0;width:100%;max-height:none;margin:0;position:static}}body.notif-panel-open .dashboard__fab,body.notif-panel-open .scroll-to-top{opacity:0!important;pointer-events:none!important;transition:opacity .15s!important}[data-theme=light] .notif-backdrop{background:#503c8c1a}[data-theme=light] .notif-row__type-badge{color:var(--c-accent-primary);background:#7060c026}[data-theme=light] .notif-row__system-icon{color:var(--c-accent-primary);background:#7060c01a}[data-theme=light] .notif-row[data-type=friend_accepted] .notif-row__type-badge,[data-theme=light] .notif-row[data-type=share_accepted] .notif-row__type-badge{color:#15803d;background:#15803d1f}[data-theme=light] .notif-row[data-type=collection_invite] .notif-row__type-badge{color:#1d4ed8;background:#1d4ed81a}[data-theme=light] .notif-row[data-type=collection_like] .notif-row__type-badge{color:#b91c1c;background:#b91c1c1a}[data-theme=light] .notif-row[data-type=collection_item_added] .notif-row__type-badge{color:#b45309;background:#b453091a}@media (width<=767px){.notif-bell{display:none}}
