/*
  Ulysess Ortiz Author House Heartbeat
  Additive atmospheric layer only.
  No layout, typography, color-token, route, content, or interaction replacement.
*/

#uo-site-heartbeat{
  --uo-heart-x:50vw;
  --uo-heart-y:70vh;
  --uo-heart-strength:1;
  position:fixed;
  inset:0;
  z-index:18;
  overflow:hidden;
  pointer-events:none;
  contain:strict;
  opacity:1;
}

#uo-site-heartbeat[hidden]{display:none!important}

.uo-heartbeat-aura,
.uo-heartbeat-ring{
  position:absolute;
  left:var(--uo-heart-x);
  top:var(--uo-heart-y);
  border-radius:50%;
  opacity:0;
  transform:translate(-50%,-50%) scale(.42);
  transform-origin:center;
  will-change:transform,opacity;
}

.uo-heartbeat-aura{
  width:min(62vw,700px);
  aspect-ratio:1;
  background:
    radial-gradient(circle,
      rgba(240,217,156,calc(.115 * var(--uo-heart-strength))) 0%,
      rgba(214,183,114,calc(.075 * var(--uo-heart-strength))) 18%,
      rgba(91,27,30,calc(.065 * var(--uo-heart-strength))) 38%,
      rgba(5,3,3,0) 70%);
  filter:blur(7px);
}

.uo-heartbeat-ring{
  width:min(22vw,230px);
  aspect-ratio:1;
  border:1px solid rgba(240,217,156,calc(.30 * var(--uo-heart-strength)));
  box-shadow:
    0 0 0 1px rgba(214,183,114,calc(.05 * var(--uo-heart-strength))) inset,
    0 0 32px rgba(214,183,114,calc(.10 * var(--uo-heart-strength)));
}

#uo-site-heartbeat.is-beating .uo-heartbeat-aura{
  animation:uo-heartbeat-aura 2.35s cubic-bezier(.18,.72,.20,1) both;
}

#uo-site-heartbeat.is-beating .uo-heartbeat-ring-one{
  animation:uo-heartbeat-ring 1.65s cubic-bezier(.18,.74,.22,1) both;
}

#uo-site-heartbeat.is-beating .uo-heartbeat-ring-two{
  animation:uo-heartbeat-ring 1.72s .24s cubic-bezier(.18,.74,.22,1) both;
}

#uo-site-heartbeat.is-returning{
  --uo-heart-strength:1.16;
}

@keyframes uo-heartbeat-aura{
  0%{opacity:0;transform:translate(-50%,-50%) scale(.38)}
  11%{opacity:.68;transform:translate(-50%,-50%) scale(.56)}
  20%{opacity:.20;transform:translate(-50%,-50%) scale(.67)}
  29%{opacity:.50;transform:translate(-50%,-50%) scale(.76)}
  52%{opacity:.18;transform:translate(-50%,-50%) scale(.98)}
  100%{opacity:0;transform:translate(-50%,-50%) scale(1.18)}
}

@keyframes uo-heartbeat-ring{
  0%{opacity:0;transform:translate(-50%,-50%) scale(.40)}
  12%{opacity:.78;transform:translate(-50%,-50%) scale(.57)}
  31%{opacity:.23;transform:translate(-50%,-50%) scale(.78)}
  100%{opacity:0;transform:translate(-50%,-50%) scale(1.45)}
}

@media(max-width:700px){
  .uo-heartbeat-aura{width:min(112vw,610px)}
  .uo-heartbeat-ring{width:min(48vw,210px)}
}

@media(prefers-reduced-motion:reduce){
  #uo-site-heartbeat{display:none!important}
}

@media print{
  #uo-site-heartbeat{display:none!important}
}
