/* ===== living header logo (driven by js/logo.js) =====
   Idle: the sparkle floats, fidgets now and then, naps when nothing happens (.lg-sleep).
   Hover: the sparkle drifts toward the cursor and bobs; the letters wave (.lg-hover). It never changes size.
   Hover ~4.5s: it glides over the word, each letter jumps beneath it, then it flips home (.lg-party). */
/* colours: one colour per design (--lg-ink) for the letters (--lg-c1..3) and the sparkle (--lg-s1..2) */
.ba-logo{--lg-ink:var(--t-ink,#111318);--lg-c1:var(--lg-ink);--lg-c2:var(--lg-ink);--lg-c3:var(--lg-ink);--lg-s1:var(--lg-ink);--lg-s2:var(--lg-ink)}
body[data-theme="dark"] .ba-logo{--lg-ink:var(--t-ink-d,#eef1f7)}
body[data-theme="neo"] .ba-logo{--lg-ink:#000}
body[data-theme="neo"] .ba-logo .lg-spark-in>path{stroke:#000;stroke-width:7}
.brand .ba-logo{display:block;height:46px;width:auto;overflow:visible}
.ba-logo.footer-logo{height:36px;width:auto;display:block;overflow:visible}
body[data-theme="dark"] svg.footer-logo{filter:none}
.lg-l,.lg-word{transform-box:fill-box;transform-origin:50% 100%}
.lg-spark,.lg-spark-in{transform-box:fill-box;transform-origin:50% 50%}
.lg-spark-in{animation:lgFloat 3.4s ease-in-out infinite;transition:opacity .6s}
.lg-star{transform-box:view-box;transform-origin:0 0;pointer-events:none}

.lg-hover .lg-l{animation:lgWave 1.8s ease-in-out infinite;animation-delay:calc(var(--i) * 70ms)}
.lg-hover .lg-spark-in{animation:lgBob 1.5s ease-in-out infinite}
.lg-party .lg-l{animation:none}.lg-party .lg-spark-in{animation:none}
/* idle life: fidgets, naps, waking up */
.lg-tw .lg-spark-in,.lg-wake .lg-spark-in{animation:lgSpin .9s cubic-bezier(.3,1.5,.5,1)}
.lg-ripple .lg-l{animation:lgWave 1.4s ease-in-out 1;animation-delay:calc(var(--i) * 60ms)}
.lg-sleep .lg-spark-in{opacity:.4;animation:lgDoze 4s ease-in-out infinite}
.lg-l.lg-pop{animation:lgPop .5s cubic-bezier(.3,1.6,.5,1)!important}
.lg-cheer .lg-l{animation:lgJump .7s cubic-bezier(.3,1.5,.5,1) both!important;animation-delay:calc(var(--i) * 45ms)!important}
.lg-star{fill:#ff8fb3}
.lg-star.alt{fill:#ffb36b}.lg-star.alt2{fill:var(--brand-b,#7c5cff)}

@keyframes lgWave{0%,55%,100%{transform:none}20%{transform:translateY(-6%) scale(1.02,.98)}35%{transform:translateY(1%)}}
@keyframes lgFloat{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-16px) rotate(10deg)}}
@keyframes lgSpin{0%{transform:none}100%{transform:rotate(360deg)}}
@keyframes lgDoze{0%,100%{transform:scale(.85) rotate(-12deg)}50%{transform:scale(.95) rotate(-4deg) translateY(4px)}}
@keyframes lgBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px) rotate(-5deg)}}
@keyframes lgPop{0%{transform:none}30%{transform:scale(1.14,.8)}60%{transform:translateY(-12%) scale(.94,1.08)}100%{transform:none}}
@keyframes lgJump{0%,100%{transform:none}40%{transform:translateY(-16%) scale(.96,1.06)}70%{transform:translateY(2%) scale(1.04,.96)}}

body[data-theme="neo"] .lg-star{fill:#ffd84d;stroke:#000;stroke-width:3}
body[data-theme="neo"] .lg-star.alt{fill:#ff6b9a}body[data-theme="neo"] .lg-star.alt2{fill:#fff}
body[data-theme="dark"] .lg-hover .lg-spark,body[data-theme="dark"] .lg-party .lg-spark{filter:drop-shadow(0 0 10px rgba(255,150,200,.7))}
body[data-theme="dark"] .lg-star{fill:var(--brand-l,#b4a8ff)}body[data-theme="dark"] .lg-star.alt2{fill:var(--brand-b,#7c5cff)}

@media (prefers-reduced-motion: reduce){.lg-hover .lg-l,.lg-spark-in,.lg-ripple .lg-l{animation:none!important}}
