/* A slow, soft brand halo; text and symbols stay sharp. */
.site-header .brand-lockup,.site-head .brand{position:relative;isolation:isolate}
.site-header .brand-lockup:before,.site-head .brand:before{content:"";position:absolute;z-index:-1;inset:-9px -16px;border-radius:50%;background:radial-gradient(ellipse,#ff79a53d,transparent 72%);filter:blur(10px);pointer-events:none;animation:brand-radiance 5s ease-in-out infinite}
.site-header .brand-logo,.site-head .brand img{filter:drop-shadow(0 0 7px #ff79a566)}
@keyframes brand-radiance{0%,100%{opacity:.45;transform:scale(.96)}50%{opacity:.9;transform:scale(1.06)}}
html[data-background-paused="true"] .site-header .brand-lockup:before,html[data-background-suspended="true"] .site-header .brand-lockup:before{animation-play-state:paused}
.lullaby-control{position:fixed;left:20px;bottom:20px;z-index:80;display:flex;align-items:center;gap:9px;min-height:44px;max-width:calc(100vw - 40px);padding:10px 15px;border:1px solid #986a96;border-radius:28px;background:#3d244c;color:#fff0f4;box-shadow:0 4px 18px #2b163324;font:600 11px/1.4 "DM Sans",Arial,sans-serif;cursor:pointer}
.lullaby-control svg{display:block;width:17px;height:17px;flex:none}
.lullaby-control:focus-visible{outline:3px solid #e4ee9c;outline-offset:4px}
.lullaby-control[aria-pressed=true]{border-color:#e4b2cf}
.lullaby-control:disabled{opacity:.7;cursor:default}
@media(hover:hover){.lullaby-control:hover{background:#573361}}
@media(max-width:760px){.lullaby-control{left:12px;bottom:90px;min-height:43px;padding:10px 13px;font-size:10px}.lullaby-control svg{width:15px;height:15px}}
body.sound-library-active .lullaby-control{bottom:90px}
@media(max-width:760px){body.sound-library-active .lullaby-control{bottom:155px}}
@media(prefers-reduced-motion:reduce){.site-header .brand-lockup:before,.site-head .brand:before{animation:none;opacity:.6}}

/* Keep sound controls in the header instead of covering page or footer content. */
.has-lullaby-control .lullaby-control.lullaby-header{position:relative;left:auto;right:auto;top:auto;bottom:auto;z-index:auto;flex:none;justify-content:center;width:40px;height:40px;min-height:40px;max-width:none;padding:10px;border-color:#b685ac78;box-shadow:none}
.lullaby-header>span{display:none}
.lullaby-header svg{width:18px;height:18px}
@media(max-width:760px){.has-lullaby-control .site-header .nav{gap:12px}}
@media(max-width:480px){.has-lullaby-control .site-head .home{display:none}}
@media(max-width:360px){.has-lullaby-control .site-header .brand-lockup{width:180px}}
/* A brighter breathing halo and tiny points of light, without moving the header. */
.site-header .brand-lockup:before,.site-head .brand:before{inset:-5px -12px;background:radial-gradient(ellipse at 30% 50%,#ff98cd99 0,#d584de55 35%,#f4d28b33 55%,transparent 76%);filter:blur(12px);animation:logo-halo 4.8s ease-in-out infinite}
.site-header .brand-lockup:after,.site-head .brand:after{content:'';position:absolute;pointer-events:none;inset:-3px -6px;z-index:1;background:radial-gradient(circle at 10% 17%,#fff7cb 0 1px,transparent 3px),radial-gradient(circle at 77% 10%,#ffdfeb 0 1px,transparent 3px),radial-gradient(circle at 92% 78%,#fff2be 0 1px,transparent 3px),radial-gradient(circle at 35% 89%,#f5c0ed 0 1px,transparent 3px);animation:logo-sparkle 5.6s ease-in-out infinite}
.site-header .brand-logo,.site-head .brand img{transform-origin:center;animation:logo-light 4.8s ease-in-out infinite;filter:drop-shadow(0 0 5px #ffb9d6aa) drop-shadow(0 0 14px #f777b580)}
@keyframes logo-halo{0%,100%{opacity:.55;transform:scale(.95)}50%{opacity:1;transform:scale(1.13)}}
@keyframes logo-light{0%,100%{transform:scale(1);filter:drop-shadow(0 0 4px #ffb9d680) drop-shadow(0 0 11px #ed78bf66)}50%{transform:scale(1.025);filter:drop-shadow(0 0 7px #fff0d6cc) drop-shadow(0 0 21px #ff83c5aa)}}
@keyframes logo-sparkle{0%,100%{opacity:.25}45%{opacity:1}70%{opacity:.5}}
html[data-background-suspended=true] .site-header .brand-logo,html[data-background-suspended=true] .site-header .brand-lockup:after,html[data-background-suspended=true] .site-header .brand-lockup:before{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.site-header .brand-logo,.site-head .brand img,.site-header .brand-lockup:before,.site-head .brand:before,.site-header .brand-lockup:after,.site-head .brand:after{animation:none;transform:none}.site-header .brand-lockup:before{opacity:.65}.site-header .brand-lockup:after{opacity:.6}}