/* Brainify top progress bar. Add <div class="bf-topbar" role="progressbar" aria-label="Loading"></div>
   as the first element in <body>, show it while a route or request is loading. */
.bf-topbar{position:fixed;top:0;left:0;right:0;height:3px;z-index:9999;overflow:hidden;background:rgba(5,120,110,.12)}
.bf-topbar::before{content:"";position:absolute;top:0;bottom:0;left:0;width:35%;border-radius:0 3px 3px 0;
  background:#05786E;animation:bf-slide 1.4s cubic-bezier(.45,0,.25,1) infinite}
@keyframes bf-slide{0%{transform:translateX(-100%)}100%{transform:translateX(300%)}}
/* Determinate version: set style="--p:0.62" and add class bf-determinate */
.bf-topbar.bf-determinate::before{width:100%;animation:none;transform-origin:left;transform:scaleX(var(--p,0));transition:transform .3s ease-out}
@media (prefers-reduced-motion:reduce){.bf-topbar::before{animation:none;width:45%}}