/* Public donations tracker; builds on site.css (sticker style). */
.wrap.wide { max-width: 640px; }
.live-hero { padding-top: 22px; }
.live-chip {
  display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border-radius: 10px;
  font-weight: 800; font-size: 14px; letter-spacing: .08em; color: #fff;
  background: var(--bad); border: 3px solid var(--ink); box-shadow: var(--shadow-sm); transform: rotate(-2deg);
}
.live-dot { width: 9px; height: 9px; border-radius: 50%; background: #fff; animation: blink 1.2s steps(2, jump-none) infinite; }
@keyframes blink { 50% { opacity: .2; } }

.counter { text-align: center; padding: 24px 18px 22px; background: var(--mint); }
.counter-k { font-weight: 800; font-size: 16px; }
.counter-v {
  font-weight: 800; font-size: clamp(56px, 17vw, 92px); line-height: 1; letter-spacing: -0.05em; margin: 8px 0 10px;
  font-variant-numeric: tabular-nums; color: var(--ink);
}
.counter-sub { display: inline-block; font-size: 16px; font-weight: 600; background: var(--card); border: 2px solid var(--ink); border-radius: 999px; padding: 6px 14px; }
.counter-sub b { font-weight: 800; font-variant-numeric: tabular-nums; }

.feed-card { padding: 4px 16px; }
.feed { list-style: none; margin: 0; padding: 0; }
.feed li { display: grid; grid-template-columns: auto 1fr auto; gap: 12px; align-items: center; padding: 13px 0; border-top: 2px dashed #d8cfbb; }
.feed li:first-child { border-top: none; }
.feed li.new { animation: slideIn .6s cubic-bezier(.2,1.3,.4,1) both; }
@keyframes slideIn { from { opacity: 0; transform: translateY(-12px) rotate(-1deg); } to { opacity: 1; transform: none; } }
.feed li.new .f-ava { background: var(--sun); }
.f-ava { width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; background: var(--mint-soft); border: 2px solid var(--ink); transition: background 3s; }
.f-ava img { width: 26px; height: 26px; transform: rotate(-12deg); }
.f-main { min-width: 0; }
.f-amt { font-weight: 800; font-size: 17px; line-height: 1.2; }
.f-amt small { display: block; font-weight: 700; font-size: 14px; color: var(--mint-deep); }
.f-to { font-size: 13px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.f-to a { color: var(--ink-soft); font-family: ui-monospace, Menlo, Consolas, monospace; }
.f-side { text-align: right; }
.f-time { display: block; font-size: 12px; color: var(--muted); margin-bottom: 4px; }
.f-tx {
  display: inline-flex; align-items: center; gap: 4px; padding: 5px 11px; border-radius: 999px; font-size: 13px; font-weight: 800;
  text-decoration: none; color: var(--ink); background: var(--card); border: 2px solid var(--ink); box-shadow: 2px 2px 0 var(--ink);
}
.f-tx:active { transform: translate(2px, 2px); box-shadow: none; }
.empty-feed { text-align: center; color: var(--muted); padding: 24px 10px; margin: 0; font-weight: 600; }
@media (max-width: 380px) { .feed li { grid-template-columns: 1fr auto; } .f-ava { display: none; } }
.live-hero h1 { font-size: clamp(40px, 11vw, 60px); }