.notifications-page{min-height:100vh;background:radial-gradient(circle at top left,rgba(24,119,242,.08),transparent 26%),var(--app-page-bg);color:#050505;padding:calc(var(--app-header-height, 74px) + 18px) var(--app-page-gutter) 32px}.notifications-shell{width:100%}.notifications-surface.app-section-card{width:min(880px,100%);margin:0 auto;padding:0;overflow:hidden}.notifications-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px 24px 14px}.notifications-header p{margin:0 0 4px;color:#1877f2;font-size:var(--app-font-size-meta);font-weight:var(--app-font-weight-emphasis);letter-spacing:.08em;text-transform:uppercase}.notifications-header h2{margin:0;color:#050505;font-size:var(--app-font-size-page-title);line-height:1.1}.notifications-header-count{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;border-radius:14px;background:#edf5ff;color:#1877f2;font-size:var(--app-font-size-body-lg);font-weight:var(--app-font-weight-emphasis)}.notifications-section{display:grid;gap:2px;border-top:1px solid #edf0f4;padding:10px 0 14px}.notifications-section h3{margin:0;padding:8px 24px;color:#050505;font-size:var(--app-font-size-ui-lg)}.notification-row{display:grid;grid-template-columns:64px minmax(0,1fr) 36px;align-items:center;gap:12px;color:inherit;text-decoration:none;padding:10px 24px}.notification-row:hover{background:#edf5ff}.notification-avatar{position:relative;width:58px;height:58px;aspect-ratio:1/1;display:grid;place-items:center;border-radius:50%;color:#fff;font-weight:var(--app-font-weight-emphasis);overflow:visible}.notification-avatar img{display:block;width:100%;height:100%;aspect-ratio:1/1;border-radius:50%;object-fit:cover}.notification-kind{position:absolute;right:-3px;bottom:-3px;width:25px;height:25px;display:grid;place-items:center;border:2px solid #fff;border-radius:50%;color:#fff;font-size:var(--app-font-size-small)}.notification-kind.is-like{background:#1877f2}.notification-kind.is-comment{background:#10b981}.notification-kind.is-mention{background:#0ea5e9}.notification-kind.is-share{background:#f97316}.notification-kind.is-friend{background:#8b5cf6}.notification-kind.is-follow{background:#14b8a6}.notification-kind.is-system{background:#0f766e}.notification-copy{min-width:0}.notification-copy p{margin:0;color:#050505;font-size:var(--app-font-size-body-lg);line-height:1.35}.notification-copy span{display:block;margin-top:3px;color:#1877f2;font-size:var(--app-font-size-small);font-weight:var(--app-font-weight-control)}.notification-more{color:#050505;font-size:var(--app-font-size-section-title);font-weight:var(--app-font-weight-emphasis);text-align:center}.notifications-empty,.notifications-error{display:grid;gap:10px;justify-items:center;padding:42px 24px;color:#65676b;text-align:center}.notifications-empty>span:first-child{color:#1877f2;font-size:var(--app-font-size-display)}.notifications-empty strong,.notifications-state-card h2{color:#050505}.notifications-empty a,.notifications-state-card a{display:inline-flex;align-items:center;min-height:36px;border-radius:999px;background:#1877f2;color:#fff;font-weight:var(--app-font-weight-heading);padding:0 16px;text-decoration:none}.notifications-error{color:#b42318;background:#fff1f2}.notifications-state-card{min-height:250px;margin:0 16px 16px}@media (max-width:860px){body:has(.notifications-page){overflow:hidden;padding-bottom:0}.notifications-page{height:calc(100dvh - var(--app-mobile-header-height, 60px) - var(--app-mobile-nav-height, 72px) - env(safe-area-inset-bottom));margin-top:var(--app-mobile-header-height,60px);padding:14px var(--app-mobile-edge-inset,4px) calc(14px + env(safe-area-inset-bottom));overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:rgba(24,119,242,.5) transparent}.notifications-page::-webkit-scrollbar{width:5px}.notifications-page::-webkit-scrollbar-track{background:transparent}.notifications-page::-webkit-scrollbar-thumb{border-radius:999px;background:rgba(24,119,242,.5)}.notifications-shell{width:100%}.notifications-header{padding:20px 18px 12px}.notifications-header h2{font-size:var(--app-font-size-section-title)}.notification-row{grid-template-columns:58px minmax(0,1fr) 28px;gap:10px;padding:10px 18px}.notification-copy p{font-size:var(--app-font-size-ui)}}@media (max-width:640px){.notifications-page{padding-inline:var(--app-mobile-edge-inset,4px)}.notifications-surface.app-section-card{border-radius:16px}.notifications-header{gap:12px;padding:18px 16px 10px}.notifications-header h2{font-size:var(--app-font-size-section-title)}.notifications-section h3{padding-inline:16px;font-size:var(--app-font-size-ui)}.notification-row{grid-template-columns:52px minmax(0,1fr) 24px;padding:10px 16px}.notification-avatar{width:52px;height:52px}.notification-copy p{font-size:var(--app-font-size-body)}.notifications-header-count{min-width:38px;min-height:38px;border-radius:12px}.notifications-state-card{margin-inline:12px}}