.theme-heartbeat { color: var(--hb-color, var(--color-secondary-300)); pointer-events: none; overflow: hidden; display: block; }

.theme-heartbeat--middle, .theme-heartbeat--top, .theme-heartbeat--bottom { position: fixed; left: 0; right: 0; width: 100vw; z-index: 9999; }
.theme-heartbeat--middle { top: 50%; transform: translateY(-50%); }
.theme-heartbeat--top { top: 0; }
.theme-heartbeat--bottom { bottom: 0; }

.theme-heartbeat--inline { position: relative; z-index: 1; width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); }

.theme-heartbeat__clip { width: 100%; height: var(--hb-height, 80px); clip-path: inset(0 100% 0 0); }
.theme-heartbeat__svg { display: block; width: 100%; height: 100%; }

.theme-heartbeat.is-playing .theme-heartbeat__clip { animation: theme-heartbeat-reveal var(--hb-duration, 3.2s) var(--hb-delay, 0.2s) cubic-bezier(0.45, 0.05, 0.55, 0.95) forwards; }

@keyframes theme-heartbeat-reveal { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }

.theme-heartbeat.is-static .theme-heartbeat__clip { clip-path: inset(0 0 0 0); }

@media (prefers-reduced-motion: reduce) { .theme-heartbeat__clip { clip-path: inset(0 0 0 0); animation: none !important; } }