/* Notification bell (all pages, signed in) and toasts (dashboard). Uses landing.css variables. */
.nav-right .btn.sm.dash{gap:6px}
/* notification bell */
.bell{position:relative}
.bell summary{list-style:none;cursor:pointer;width:36px;height:36px;display:grid;place-items:center;border-radius:9px;color:var(--muted);position:relative}
.bell summary::-webkit-details-marker{display:none}
.bell summary:hover,.bell[open] summary{background:var(--card2);color:var(--strong)}
.bell summary:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.bell svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.badge{position:absolute;top:3px;right:2px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:var(--gold);color:var(--gold-ink);
  font:700 10.5px/17px var(--sans);text-align:center;box-shadow:0 0 0 2px var(--bg)}
.bell-panel{position:absolute;right:-8px;top:calc(100% + 10px);width:min(370px,calc(100vw - 32px));background:#1d1d1d;border:1px solid var(--line2);
  border-radius:14px;box-shadow:0 18px 50px rgba(0,0,0,.55);z-index:50;overflow:hidden;animation:pop .14s ease-out}
@keyframes pop{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.bell-panel{animation:none}}
.bell-head{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-bottom:1px solid var(--line)}
.bell-head b{color:var(--strong);font-size:14.5px}.n-mark .link{font-size:13px;color:var(--gold)}
.bell-list{list-style:none;margin:0;padding:6px 0;max-height:min(420px,70vh);overflow-y:auto}
.n-item{display:grid;grid-template-columns:28px minmax(0,1fr);gap:11px;padding:11px 16px;position:relative}
.n-item+.n-item{border-top:1px solid var(--line)}
.n-item b{display:block;color:var(--strong);font-size:14px;font-weight:600}
.n-item p{margin:2px 0 0;color:var(--muted);font-size:13.5px;line-height:1.5}.n-item p a{color:var(--gold)}
.n-item code{font-size:12px;color:var(--text)}
.n-item time{display:block;margin-top:4px;color:var(--dim);font-size:12px}
.n-item.unread{background:rgba(227,176,75,.045)}
.n-item.unread::after{content:"";position:absolute;right:16px;top:17px;width:7px;height:7px;border-radius:50%;background:var(--gold)}
.n-ico{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font:700 12.5px var(--sans);background:var(--card2);color:var(--muted)}
.n-success .n-ico{background:rgba(76,195,138,.13);color:var(--ok)}
.n-warning .n-ico{background:rgba(227,176,75,.15);color:var(--gold)}
.n-security .n-ico{background:rgba(120,150,230,.14);color:#9db2f0}
.n-item.pinned{background:rgba(227,176,75,.07)}
.n-empty{padding:26px 16px;text-align:center;color:var(--dim);font-size:14px}
/* toasts */
.toasts{position:fixed;top:74px;right:20px;z-index:60;display:flex;flex-direction:column;gap:10px;width:min(380px,calc(100vw - 32px))}
.toast{display:grid;grid-template-columns:22px minmax(0,1fr) auto;gap:10px;align-items:start;padding:12px 12px 12px 14px;border-radius:12px;
  background:#1f1f1f;border:1px solid var(--line2);box-shadow:0 14px 40px rgba(0,0,0,.5);color:var(--text);font-size:14px;line-height:1.5;
  animation:slidein .2s ease-out;transition:opacity .25s,transform .25s}
.toast.hide{opacity:0;transform:translateX(12px)}
@keyframes slidein{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.toast{animation:none;transition:none}}
.t-ico{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font:700 12px var(--sans)}
.toast.ok .t-ico{background:rgba(76,195,138,.15);color:var(--ok)}.toast.err .t-ico{background:rgba(229,119,90,.16);color:var(--warn)}
.toast.err{border-color:rgba(229,119,90,.4)}
.t-close{background:none;border:0;color:var(--dim);font-size:18px;line-height:1;cursor:pointer;padding:0 2px}.t-close:hover{color:var(--strong)}
@media (max-width:520px){.toasts{right:16px;left:16px;width:auto;top:68px}.bell-panel{right:-60px}}
.n-ico svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
