/* Charlotte Heartbeat footer (CPR Works of Charlotte, 2026-11-06; Luna's Raleigh Heartbeat with Charlotte's skyline). No Tailwind classes on purpose:
   the site's compiled CSS is shadowed by the bind mount, so this file stands alone. */
.hb{position:relative;height:clamp(190px,18.75vw,330px);overflow:hidden;background:#111827;contain:layout paint;color:#e5e7eb}
.hb>svg{display:block;width:100%;height:100%}

/* always-on life */
.hb-star{animation:hbTwinkle 3.6s ease-in-out infinite alternate;animation-delay:var(--del,0s)}
@keyframes hbTwinkle{from{opacity:.35}to{opacity:1}}
.hb-beacon{animation:hbBeacon 2.4s ease-in-out infinite}
@keyframes hbBeacon{0%,55%{opacity:.25}65%,85%{opacity:1}100%{opacity:.25}}

/* the city warms after ROSC (default markup is lit; the JS rewinds it) */
.hb-win{transition:fill .9s ease var(--d,0s)}
.hb.hb-lit .hb-win.w{fill:#ffd27a}
.hb-wl{transition:stroke .9s ease var(--d,0s)}
.hb.hb-lit .hb-wl.w{stroke:#ffd27a}
.hb-rh{transition:fill 1.1s ease .5s}
.hb.hb-lit .hb-rh{fill:#dc3b36}
.hb-lamp .hb-halo,.hb-lamp .hb-pool{opacity:0;transition:opacity 1.3s ease var(--d,0s)}
.hb-lamp .hb-glass{transition:fill .7s ease var(--d,0s)}
.hb.hb-lit .hb-lamp .hb-halo,.hb.hb-lit .hb-lamp .hb-pool{opacity:1}
.hb.hb-lit .hb-lamp .hb-glass{fill:#fff3cf}
.hb.hb-lit .hb-flk{animation:hbFlicker 3.1s ease-in-out infinite alternate}
@keyframes hbFlicker{0%{opacity:.86}40%{opacity:1}55%{opacity:.9}100%{opacity:1}}
.hb-dl{opacity:0;transition:opacity .8s ease var(--d,0s)}
.hb.hb-lit .hb-dl{opacity:1}
.hb-domeglow{opacity:0;transition:opacity 1.6s ease .6s}
.hb.hb-lit .hb-domeglow{opacity:.9}
.hb-crownglow,.hb-acornglow{opacity:0;transition:opacity 1.6s ease .8s}
.hb.hb-lit .hb-crownglow{opacity:.75}
.hb.hb-lit .hb-acornglow{opacity:.6}
.hb-crown{transition:stroke 1s ease .9s}
.hb.hb-lit .hb-crown{stroke:#fff0c8}
/* 550 South Tryon's line of lights warms to red with the heartbeat */
.hb-led{transition:stroke 1.1s ease .5s}
.hb.hb-lit .hb-led{stroke:#ff5a4f}

/* ambulance light bar: alternate red/white, 1.6 flashes per second per light */
.hb-lt-r,.hb-lt-w{opacity:.85}
.hb.hb-fa .hb-lt-r{opacity:1}.hb.hb-fa .hb-lt-w{opacity:.18}
.hb.hb-fb .hb-lt-r{opacity:.18}.hb.hb-fb .hb-lt-w{opacity:1}


/* monitor readout */
.hb-readout{position:absolute;top:6%;right:14px;font:600 12px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  color:#ff6a64;letter-spacing:.06em;text-shadow:0 0 6px rgba(255,58,54,.55);pointer-events:none;white-space:nowrap}
.hb-ro-lbl{font-size:10px;opacity:.8;margin-right:2px}
.hb-ro-val{font-size:15px}

/* tooltip over the trace */
.hb-ecg-wrap{position:absolute;left:0;right:0;top:7%;height:28%}
.hb-ecg-hit{display:block;width:100%;height:100%;margin:0;padding:0;border:0;background:transparent;cursor:help;border-radius:6px}
.hb-ecg-hit:focus{outline:none}
.hb-ecg-hit:focus-visible{outline:2px dashed rgba(255,106,100,.85);outline-offset:-3px}
.hb-tip{position:absolute;left:50%;top:calc(100% + 4px);transform:translateX(-50%);max-width:min(300px,calc(100vw - 32px));
  width:max-content;padding:8px 12px;border-radius:8px;background:#0b1328;border:1px solid rgba(255,106,100,.45);
  color:#f9fafb;font:500 13px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;text-align:center;
  box-shadow:0 6px 20px rgba(0,0,0,.45);opacity:0;visibility:hidden;transition:opacity .15s ease,visibility .15s;z-index:2}
.hb-ecg-wrap:hover .hb-tip,.hb-ecg-hit:focus-visible+.hb-tip,.hb-ecg-wrap.hb-tip-open .hb-tip{opacity:1;visibility:visible}
.hb-ecg-wrap.hb-tip-esc .hb-tip{opacity:0;visibility:hidden}

/* replay */
.hb-replay{position:absolute;left:10px;bottom:10px;width:30px;height:30px;display:grid;place-items:center;padding:0;
  border-radius:50%;border:1px solid rgba(255,255,255,.22);background:rgba(17,24,39,.6);color:#e5e7eb;cursor:pointer;opacity:.7}
.hb-replay:hover,.hb-replay:focus-visible{opacity:1}
.hb-replay:focus-visible{outline:2px solid #ff6a64;outline-offset:2px}
.hb-replay[hidden]{display:none}

.hb-noanim,.hb-noanim *{transition:none!important}
.hb-paused *{animation-play-state:paused!important}
@media (prefers-reduced-motion:reduce){
  .hb *{animation:none!important;transition:none!important}
  .hb-replay{display:none!important}
}