.nf-v18-notifications{
  position:fixed;
  top:18px;
  right:24px;
  z-index:7000;
  font-family:inherit;
}

.nf-v18-bell{
  position:relative;
  width:42px;
  height:42px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:12px;
  background:rgba(24,27,34,.94);
  color:#fff;
  cursor:pointer;
  box-shadow:0 8px 24px rgba(0,0,0,.22);
}

.nf-v18-bell:hover,
.nf-v18-bell:focus-visible{
  border-color:rgba(255,255,255,.32);
  outline:none;
}

.nf-v18-bell-icon{
  font-size:18px;
  line-height:1;
}

.nf-v18-badge{
  position:absolute;
  top:-6px;
  right:-6px;
  min-width:18px;
  height:18px;
  padding:0 5px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:#e24d4d;
  color:white;
  font-size:10px;
  font-weight:700;
  border:2px solid #171a21;
}

.nf-v18-panel{
  position:absolute;
  top:50px;
  right:0;
  width:min(390px,calc(100vw - 32px));
  max-height:min(590px,calc(100vh - 90px));
  overflow:hidden;
  display:flex;
  flex-direction:column;
  border:1px solid rgba(255,255,255,.13);
  border-radius:16px;
  background:#1b1f27;
  color:#f5f7fa;
  box-shadow:0 18px 55px rgba(0,0,0,.38);
}

.nf-v18-panel-head{
  padding:16px;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  border-bottom:1px solid rgba(255,255,255,.09);
}

.nf-v18-summary{
  margin-top:3px;
  font-size:12px;
  color:#9ba5b4;
}

.nf-v18-read-all{
  padding:0;
  border:0;
  background:none;
  color:#aeb9c9;
  font-size:11px;
  cursor:pointer;
  white-space:nowrap;
}

.nf-v18-read-all:hover,
.nf-v18-read-all:focus-visible{
  color:#fff;
  outline:none;
  text-decoration:underline;
}

.nf-v18-list{
  max-height:470px;
  overflow:auto;
  overscroll-behavior:contain;
}

.nf-v18-item{
  width:100%;
  display:flex;
  gap:11px;
  padding:14px 16px;
  border:0;
  border-bottom:1px solid rgba(255,255,255,.07);
  background:transparent;
  color:inherit;
  text-align:left;
  cursor:pointer;
}

.nf-v18-item:hover,
.nf-v18-item:focus-visible{
  background:rgba(255,255,255,.055);
  outline:none;
}

.nf-v18-item.is-unread{
  background:rgba(255,255,255,.035);
}

.nf-v18-item-dot{
  width:7px;
  height:7px;
  margin-top:6px;
  flex:0 0 auto;
  border-radius:50%;
  background:transparent;
}

.nf-v18-item.is-unread .nf-v18-item-dot{
  background:#f0b94a;
}

.nf-v18-item-content{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:4px;
}

.nf-v18-item-content strong{
  font-size:13px;
  font-weight:650;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.nf-v18-item-content span{
  color:#c2c9d3;
  font-size:12px;
  line-height:1.4;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.nf-v18-item-content small{
  color:#7f8998;
  font-size:10px;
}

.nf-v18-empty{
  padding:28px 18px;
  text-align:center;
  color:#8d97a6;
  font-size:12px;
}

.nf-v18-system-footer{
  padding:11px 14px 13px;
  display:flex;
  flex-direction:column;
  gap:4px;
  border-top:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.018);
}

.nf-v18-toast-stack{
  position:fixed;
  top:72px;
  right:24px;
  z-index:6995;
  width:min(380px,calc(100vw - 32px));
  display:flex;
  flex-direction:column;
  gap:10px;
  pointer-events:none;
}

.nf-v18-toast{
  width:100%;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:start;
  gap:10px;
  padding:12px 11px 12px 13px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:14px;
  background:rgba(27,31,39,.97);
  color:#f5f7fa;
  box-shadow:0 16px 42px rgba(0,0,0,.32);
  opacity:0;
  transform:translateY(-8px) scale(.985);
  transition:opacity .16s ease,transform .16s ease,border-color .16s ease;
  pointer-events:auto;
}

.nf-v18-toast.is-visible{
  opacity:1;
  transform:translateY(0) scale(1);
}

.nf-v18-toast:hover{
  border-color:rgba(240,185,74,.45);
}

.nf-v18-toast-mark{
  width:8px;
  height:8px;
  margin-top:7px;
  flex:0 0 auto;
  border-radius:50%;
  background:#f0b94a;
  box-shadow:0 0 0 4px rgba(240,185,74,.12);
}

.nf-v18-toast-action{
  min-width:0;
  padding:0;
  border:0;
  background:none;
  color:inherit;
  text-align:left;
  cursor:pointer;
}

.nf-v18-toast-action:focus-visible{
  outline:2px solid rgba(240,185,74,.75);
  outline-offset:4px;
  border-radius:6px;
}

.nf-v18-toast-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:3px;
}

.nf-v18-toast-copy small{
  color:#9ba5b4;
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.04em;
}

.nf-v18-toast-copy strong{
  font-size:13px;
  line-height:1.3;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.nf-v18-toast-copy span{
  color:#c2c9d3;
  font-size:12px;
  line-height:1.4;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.nf-v18-toast-close{
  width:28px;
  height:28px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin:-5px -4px 0 0;
  padding:0;
  border:0;
  border-radius:8px;
  background:transparent;
  color:#8e98a7;
  font-size:18px;
  line-height:1;
  cursor:pointer;
}

.nf-v18-toast-close:hover,
.nf-v18-toast-close:focus-visible{
  background:rgba(255,255,255,.06);
  color:#fff;
  outline:none;
}

.nf-v18-notification-target{
  outline:2px solid #f0b94a;
  outline-offset:4px;
  animation:nf-v18-target-pulse 2.4s ease-out;
}

@keyframes nf-v18-target-pulse{
  0%,35%{
    box-shadow:0 0 0 5px rgba(240,185,74,.22);
  }
  100%{
    box-shadow:0 0 0 0 rgba(240,185,74,0);
  }
}

.nf-v18-notifications .hidden{
  display:none!important;
}

@media(max-width:720px){
  .nf-v18-notifications{
    top:max(12px,env(safe-area-inset-top));
    right:max(12px,env(safe-area-inset-right));
  }

  .nf-v18-panel{
    width:calc(100vw - 24px - env(safe-area-inset-left) - env(safe-area-inset-right));
    max-height:calc(100dvh - 78px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
  }

  .nf-v18-toast-stack{
    top:calc(max(64px,env(safe-area-inset-top) + 52px));
    right:max(12px,env(safe-area-inset-right));
    width:calc(100vw - 24px - env(safe-area-inset-left) - env(safe-area-inset-right));
  }

  .nf-v18-toast{
    border-radius:13px;
  }
}

@media(prefers-reduced-motion:reduce){
  .nf-v18-toast,
  .nf-v18-notification-target{
    transition:none;
    animation:none;
  }
}
