.notification-center-bell{position:relative;display:inline-flex;align-items:center;justify-content:center;width:2.75rem;height:2.75rem;border-radius:var(--radius-md,.375rem);color:color-mix(in oklch,var(--foreground) 70%,transparent);transition:color .2s}.notification-center-bell:hover{color:var(--foreground)}.notification-center-bell:focus,.notification-center-bell:focus-visible{outline:none}.notification-center-bell__icon{width:1.25rem;height:1.25rem;transition:filter .2s}.notification-center-bell:hover .notification-center-bell__icon--enabled{filter:drop-shadow(0 0 6px rgba(244,81,30,.3))}.notification-center-bell__badge{position:absolute;top:.075rem;right:.075rem;background-color:var(--ketchup-orange)}.notification-center-bell__badge:hover{background-color:var(--ketchup-orange-dark)}.notification-center{position:relative}.notification-center-backdrop{position:fixed;inset:0;z-index:49}.notification-center-dropdown{position:absolute;right:0;top:calc(100% + .5rem);width:22rem;z-index:50}.notification-center-dropdown__header{padding:0 0 .5rem;font-weight:600;display:flex;align-items:center;justify-content:space-between}.notification-center-dropdown__separator{margin:0;height:1px;background:var(--border)}.notification-center-item{display:flex;flex-direction:column;gap:.25rem;width:100%;padding:.75rem;border-radius:var(--radius-xl);transition:background-color .15s;cursor:pointer;text-align:left}.notification-center-item:hover{background:color-mix(in oklch,var(--accent) 20%,transparent)}.notification-center-item--unread{background:color-mix(in oklch,var(--accent) 30%,transparent)}.notification-center-item--unread:hover{background:color-mix(in oklch,var(--accent) 45%,transparent)}.notification-center-item--unread .notification-center-item__title{font-weight:600}.notification-center-item--unread .notification-center-item__icon{position:relative}.notification-center-item--unread .notification-center-item__icon:after{content:"";position:absolute;top:0;right:0;width:.5rem;height:.5rem;border-radius:9999px;background:var(--primary);border:1.5px solid var(--background)}.notification-center-item__row{display:flex;align-items:center;gap:.75rem}.notification-center-item__icon{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;border-radius:9999px;background:color-mix(in oklch,var(--primary) 10%,transparent);flex-shrink:0}.notification-center-item__icon svg{width:1rem;height:1rem;color:var(--primary)}.notification-center-item__text{flex:1;min-width:0;display:flex;align-items:baseline;gap:.5rem}.notification-center-item__title{flex:1;min-width:0;font-size:.875rem;font-weight:500;color:var(--foreground);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.notification-center-item__time{font-size:.75rem;color:var(--muted-foreground);white-space:nowrap;flex-shrink:0}.notification-center-item__chevron{width:1rem;height:1rem;color:var(--muted-foreground);flex-shrink:0}.notification-center-item__chevron--hidden{visibility:hidden}.notification-center-item__body{padding-left:2.75rem;font-size:.75rem;color:var(--muted-foreground);text-align:left;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.notification-center-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem 1rem;text-align:center}.notification-center-empty__icon{width:3rem;height:3rem;border-radius:9999px;background:color-mix(in oklch,var(--muted) 50%,transparent);display:flex;align-items:center;justify-content:center;margin-bottom:.75rem}.notification-center-empty__icon svg{width:1.5rem;height:1.5rem;color:var(--muted-foreground)}.notification-center-empty__title{font-size:.875rem;font-weight:500;color:var(--foreground)}.notification-center-empty__description{font-size:.75rem;color:var(--muted-foreground);margin-top:.25rem}.notification-center-content__scroll--desktop{max-height:300px;overflow-y:auto}.notification-center-sheet{display:flex;flex-direction:column;overflow:hidden}.notification-center-sheet .notification-center-content{flex:1;min-height:0}.notification-center-content__scroll--mobile{height:100%;overflow-y:auto}.notification-permission-banner{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:.75rem;text-align:center;border-bottom:1px solid var(--border)}.notification-permission-banner__icon{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;border-radius:9999px;background:color-mix(in oklch,var(--muted) 50%,transparent)}.notification-permission-banner__icon svg{width:1rem;height:1rem;color:var(--muted-foreground)}.notification-permission-banner__title{font-size:.8125rem;font-weight:500;color:var(--foreground)}.notification-permission-banner__actions{display:flex;align-items:center;gap:.75rem}.notification-permission-banner__action{font-size:.75rem}.notification-permission-banner__spinner{width:.875rem;height:.875rem;margin-right:.375rem;animation:spin 1s linear infinite}.notification-permission-banner__dismiss{border:none;background:transparent;color:var(--muted-foreground);font-size:.75rem;cursor:pointer;padding:.25rem .5rem;border-radius:var(--radius);transition:color .15s}.notification-permission-banner__dismiss:hover{color:var(--foreground)}.notification-permission-guide{max-width:22rem;padding:0;border-radius:var(--radius-secondary)}.notification-permission-guide__icon{display:flex;align-items:center;justify-content:center;width:3.5rem;height:3.5rem;border-radius:9999px;background:color-mix(in oklch,var(--muted) 50%,transparent);margin:1.5rem auto 0}.notification-permission-guide__icon svg{width:1.75rem;height:1.75rem;color:var(--muted-foreground)}.notification-permission-guide__title{font-size:1rem;font-weight:600;color:var(--foreground);text-align:center;margin:.75rem 1.5rem 0}.notification-permission-guide__description{font-size:.8125rem;color:var(--muted-foreground);text-align:center;padding:0 1.5rem;margin-top:.25rem}.notification-permission-guide__steps{list-style:decimal;padding:0 1.5rem 0 3rem;margin:.75rem 0;display:flex;flex-direction:column;gap:.5rem}.notification-permission-guide__step{font-size:.875rem;color:var(--foreground);line-height:1.4}.notification-permission-guide__refresh-button{margin:0 1.5rem 1.5rem;width:calc(100% - 3rem)}.notification-permission-guide__refresh-icon{width:.875rem;height:.875rem;margin-right:.375rem}