.notification-center{position:fixed;z-index:1150;top:max(5px,env(safe-area-inset-top));right:max(70px,calc(env(safe-area-inset-right) + 60px));left:auto}.notification-bell{position:relative;display:grid;place-items:center;width:36px;height:36px;margin:0;padding:0;border:2px solid var(--border-button, rgba(255, 255, 255, .2));border-radius:50%;background:var(--bg-button, rgba(20, 22, 30, .96));color:var(--text-on-action, #fff);box-shadow:0 4px 10px var(--shadow-soft, rgba(0, 0, 0, .22));cursor:pointer;transition:border-color .2s ease,background .2s ease,box-shadow .2s ease,color .2s ease}.notification-bell:hover,.notification-bell:focus-visible{border-color:var(--color-primary, #8c7bff)}.notification-bell.has-unread{border-color:var(--color-primary, #8c7bff);background:rgba(var(--color-primary-rgb, 140, 123, 255),.2);color:var(--color-primary, #a99cff);box-shadow:0 0 0 4px rgba(var(--color-primary-rgb, 140, 123, 255),.12),0 6px 18px rgba(var(--color-primary-rgb, 140, 123, 255),.2)}.notification-badge{position:absolute;top:-5px;right:-7px;min-width:21px;height:21px;padding:0 5px;border:2px solid var(--bg-body, #11131b);border-radius:999px;background:var(--color-danger, #ef4444);color:#fff;font-size:.7rem;font-weight:800;line-height:17px;text-align:center}.notification-panel-backdrop{position:fixed;z-index:1190;inset:0;display:flex;justify-content:flex-end;background:#080a0e94;backdrop-filter:blur(4px)}.notification-panel{display:flex;flex-direction:column;overflow:hidden;width:min(430px,100%);height:100dvh;border-left:1px solid var(--border-subtle, rgba(255, 255, 255, .1));background:var(--surface-card, #171922);color:var(--text-primary, #fff);box-shadow:-16px 0 40px #00000047}.notification-panel-header{position:relative;z-index:1;flex:0 0 auto;display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:max(22px,env(safe-area-inset-top)) 22px 18px;border-bottom:1px solid var(--border-subtle, rgba(255, 255, 255, .1));background:var(--surface-card, #171922)}.notification-panel-header h2,.notification-panel-header p{margin:0}.notification-panel-header p{margin-top:5px;color:var(--text-muted, rgba(255, 255, 255, .68))}.notification-panel-content{position:relative;z-index:0;flex:1 1 auto;min-height:0;overflow-y:auto}.notification-panel-close{flex:0 0 auto;display:grid;place-items:center;width:42px;height:42px;margin:0;padding:0;border:1px solid var(--border-subtle, rgba(255, 255, 255, .1));border-radius:50%;background:var(--surface-control, rgba(255, 255, 255, .05));color:var(--text-secondary, #626876);cursor:pointer;transition:border-color .2s ease,background .2s ease,color .2s ease}.notification-panel-close:hover,.notification-panel-close:focus-visible{border-color:var(--color-primary, #8c7bff);background:rgba(var(--color-primary-rgb, 140, 123, 255),.1);color:var(--color-primary, #6f5ce7)}.notification-list{display:grid;align-content:start;gap:10px;margin:0;padding:16px;overflow-y:auto;list-style:none}.notification-item{display:grid;grid-template-columns:10px minmax(0,1fr) auto;gap:12px;padding:14px;border:1px solid var(--border-subtle, rgba(255, 255, 255, .1));border-radius:var(--radius-panel);background:var(--surface-control, rgba(255, 255, 255, .04))}.notification-item.is-unread{border-color:rgba(var(--color-primary-rgb, 140, 123, 255),.4);background:rgba(var(--color-primary-rgb, 140, 123, 255),.08)}.notification-item.has-action{cursor:pointer}.notification-severity{width:9px;height:9px;margin-top:7px;border-radius:50%;background:var(--text-muted, #8d93a6)}.notification-item[data-severity=success] .notification-severity{background:var(--color-success, #22c55e)}.notification-item[data-severity=attention] .notification-severity,.notification-item[data-severity=warning] .notification-severity{background:var(--color-warning, #f59e0b)}.notification-item[data-severity=critical] .notification-severity{background:var(--color-danger, #ef4444)}.notification-copy{min-width:0}.notification-copy strong,.notification-copy p,.notification-copy time{display:block;margin:0}.notification-copy p{margin-top:4px;color:var(--text-muted, rgba(255, 255, 255, .72));line-height:1.4;overflow-wrap:anywhere;tab-size:4;white-space:pre-wrap}.notification-copy time{margin-top:8px;color:var(--text-muted, rgba(255, 255, 255, .58));font-size:.75rem}.notification-item-actions{display:flex;align-items:flex-start;gap:6px}.notification-action,.notification-dismiss{min-height:34px;margin:0;padding:6px 9px;border:1px solid var(--border-subtle, rgba(255, 255, 255, .1));border-radius:var(--radius-control);background:transparent;color:inherit;cursor:pointer}.notification-action{color:var(--color-primary, #a99cff)}.notification-loading,.notification-empty,.notification-error{margin:20px;padding:22px;border:1px dashed var(--border-subtle, rgba(255, 255, 255, .14));border-radius:var(--radius-panel);color:var(--text-muted, rgba(255, 255, 255, .68));text-align:center}.notification-loading{position:relative;overflow:hidden}.notification-loading:after{position:absolute;inset:0;background:linear-gradient(100deg,transparent 20%,rgba(255,255,255,.08) 50%,transparent 80%);content:"";transform:translate(-100%);animation:notification-loading-shimmer 1.2s ease-in-out infinite}@keyframes notification-loading-shimmer{to{transform:translate(100%)}}@media (prefers-reduced-motion: reduce){.notification-loading:after{animation:none}}@media (max-width: 520px){.notification-panel{width:100%;border-left:0}.notification-panel-header{padding-inline:18px}.notification-item{grid-template-columns:10px minmax(0,1fr)}.notification-item-actions{grid-column:2}}