[data-tl-bell][hidden]{display:none!important}
[data-tl-bell]{position:relative;cursor:pointer}
[data-tl-bell] svg{transform-origin:50% 12%}
.tl-bell-n{position:absolute;top:-5px;right:-6px;z-index:1;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:#00ff88;color:#03110a;
  font:800 10px/17px -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;text-align:center;letter-spacing:0;
  box-shadow:0 0 0 2px var(--tl-bell-ring,#ffffff);pointer-events:none;box-sizing:border-box}
.tl-bell-n[hidden]{display:none!important}
@media(prefers-reduced-motion:no-preference){
  .tl-bell-ring svg{animation:tlBellRing 1s cubic-bezier(.36,.07,.19,.97)}
  .tl-bell-n.pop{animation:tlBellPop .45s cubic-bezier(.34,1.56,.64,1)}
}
@keyframes tlBellRing{0%{transform:rotate(0)}12%{transform:rotate(16deg)}26%{transform:rotate(-14deg)}40%{transform:rotate(10deg)}54%{transform:rotate(-7deg)}68%{transform:rotate(4deg)}82%{transform:rotate(-2deg)}100%{transform:rotate(0)}}
@keyframes tlBellPop{0%{transform:scale(.3)}60%{transform:scale(1.18)}100%{transform:scale(1)}}
/* the site header: in the row beside search and theme on wide screens, beside the menu button on narrow ones */
.tn .tn-bell{position:relative}
.tn .tn-bell svg{width:18px;height:18px}
.tn .tn-bell-m{display:none!important}
html[data-theme="dark"] .tn .tl-bell-n{--tl-bell-ring:#0a0a0f}
@media(max-width:1199px){
  .tn .tn-right .tn-bell{display:none!important}
  .tn .tn-bell-m:not([hidden]){display:flex!important;margin-left:auto}
  .tn .tn-bell-m:not([hidden])+.tn-burger{margin-left:2px}
}
/* the chart's top bar: a round button the size of the account button beside it, so no row grows; the tap area is 44 px */
.tbar-bell{--tl-bell-ring:#0e0e16}
.topbar .tbar-bell{width:30px!important;height:30px!important;min-width:30px!important;min-height:30px!important;padding:0!important;border-radius:50%!important}
.topbar .tbar-bell::before{content:"";position:absolute;inset:-7px}
.topbar .tbar-bell svg{width:15px;height:15px}
[data-theme="light"] .tbar-bell{--tl-bell-ring:#ffffff}
@media(min-width:769px) and (max-width:1023px){
  .topbar .tbar-right .tbar-bell{margin-left:auto}
  .topbar .tbar-right .tbar-bell+.tbar-more-wrap{margin-left:0}
}
/* the dashboard's nav: a round button the size of the account button */
.tnav .tnav-bell{width:34px;height:34px;padding:0;border-radius:50%;border:1px solid var(--border);background:var(--w03,rgba(255,255,255,.03));color:var(--dim);
  display:inline-flex;align-items:center;justify-content:center;font-family:inherit;transition:color .15s,border-color .15s,background .15s;--tl-bell-ring:var(--bg,#0a0a0f)}
.tnav .tnav-bell:hover{color:var(--accent);border-color:rgba(0,255,136,.45)}
.tnav .tnav-bell svg{width:16px;height:16px}
@media(hover:none){.tnav .tnav-bell{width:44px;height:44px}}
/* the settings page's bar */
.nav-links .tls-bell{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:0 8px;border-radius:8px;border:1px solid transparent;
  background:transparent;color:var(--dim);font-family:inherit;--tl-bell-ring:var(--bg,#0a0a0f)}
.nav-links .tls-bell:hover{color:var(--accent)}
.nav-links .tls-bell svg{width:17px;height:17px}
.nav-links .tls-bell .tl-bell-n{top:4px;right:2px}
