.af-header-notifications {
  position: relative;
  display: inline-flex;
  align-items: center;
}
.af-notification-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid rgba(239, 68, 68, .35);
  background: rgba(127, 29, 29, .18);
  color: #fff;
  border-radius: 999px;
  padding: 8px 12px;
  cursor: pointer;
  font: inherit;
}
.af-notification-btn:hover { border-color: rgba(239, 68, 68, .75); }
.af-notification-badge {
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #ef4444;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
}
.af-notification-badge.is-zero {
  background: rgba(107, 114, 128, .55);
  color: rgba(255,255,255,.75);
}
.af-notification-popover {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  width: min(380px, calc(100vw - 24px));
  max-height: 520px;
  overflow: hidden;
  z-index: 1000;
  border: 1px solid rgba(239, 68, 68, .35);
  border-radius: 18px;
  background: rgba(15, 23, 42, .98);
  box-shadow: 0 24px 70px rgba(0,0,0,.45);
}
.af-notification-popover-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.af-notification-close {
  width: 28px;
  height: 28px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.06);
  color: #fff;
  cursor: pointer;
}
.af-notification-list {
  max-height: 380px;
  overflow: auto;
  padding: 8px;
}
.af-notification-item {
  padding: 12px;
  margin-bottom: 8px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px;
  background: rgba(255,255,255,.045);
}
.af-notification-item.is-unread {
  border-color: rgba(239, 68, 68, .45);
  background: rgba(127, 29, 29, .22);
}
.af-notification-title { font-weight: 800; color: #fff; }
.af-notification-release { margin-top: 4px; color: #fecaca; font-size: 13px; }
.af-notification-body { margin-top: 6px; color: rgba(255,255,255,.78); font-size: 13px; line-height: 1.45; }
.af-notification-meta { margin-top: 8px; color: rgba(255,255,255,.45); font-size: 12px; }
.af-notification-open,
.af-notification-all {
  display: inline-flex;
  margin-top: 10px;
  color: #fca5a5;
  text-decoration: none;
  font-weight: 700;
}
.af-notification-all {
  display: flex;
  padding: 12px 16px;
  border-top: 1px solid rgba(255,255,255,.08);
}
.af-notification-empty {
  padding: 18px;
  color: rgba(255,255,255,.7);
  text-align: center;
}
@media (max-width: 640px) {
  .af-notification-popover {
    position: fixed;
    left: 12px;
    right: 12px;
    top: 72px;
    width: auto;
  }
}

/* ArtistFlow v0.9.39 — compact bell notifications in header */
.af-header-notifications{position:relative;display:inline-flex;align-items:center;margin-left:2px}
.af-notification-btn{position:relative;width:42px;height:42px;display:inline-grid;place-items:center;gap:0;border-radius:999px;border:1px solid rgba(255,255,255,.11);background:linear-gradient(135deg,rgba(255,255,255,.08),rgba(255,255,255,.025));color:#fff;padding:0;cursor:pointer;font:inherit;box-shadow:inset 0 1px 0 rgba(255,255,255,.06);transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease,background .16s ease}
.af-notification-btn:hover{transform:translateY(-1px);border-color:rgba(233,38,38,.42);background:linear-gradient(135deg,rgba(233,38,38,.18),rgba(255,255,255,.035));box-shadow:0 10px 28px rgba(0,0,0,.25),0 0 0 3px rgba(233,38,38,.09)}
.af-notification-bell{font-size:18px;line-height:1;filter:drop-shadow(0 5px 12px rgba(233,38,38,.22))}
.af-notification-badge{position:absolute;right:-4px;top:-5px;min-width:20px;height:20px;padding:0 6px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;background:#ef4444;color:#fff;font-size:11px;font-weight:900;line-height:1;border:2px solid #11111a;box-shadow:0 8px 18px rgba(239,68,68,.32)}
.af-notification-badge.is-zero{display:none!important}
.af-notification-popover{right:0;top:calc(100% + 12px);border-radius:20px;background:linear-gradient(145deg,rgba(25,25,34,.98),rgba(10,10,14,.98));border:1px solid rgba(255,255,255,.12);box-shadow:0 24px 70px rgba(0,0,0,.58),0 0 0 1px rgba(233,38,38,.08)}
.af-notification-popover:before{content:"";position:absolute;right:18px;top:-7px;width:13px;height:13px;background:#181820;border-left:1px solid rgba(255,255,255,.12);border-top:1px solid rgba(255,255,255,.12);transform:rotate(45deg)}
@media(max-width:760px){.af-header-notifications{width:100%;display:grid;margin-left:0}.af-notification-btn{width:100%;height:42px}.af-notification-popover:before{display:none}}