:root{
  --bg: #ffffff;
  --c1: #fdc4a4;
  --c2: #fc9189;
  --c3: #fcaa96;
  --c4: #ffffff;
  --rw2: #fc9189;
  --rv2: #7b6cff;

  --blur: 44px;
  --sat: 1.08;
  --bri: 1.03;
  --bubble-size: min(900px, 78vw);
}

.bubble-orange{ width: var(--bubble-size); }

.blob{
  width: 100%;
  height: auto;
  display: block;
  filter: blur(var(--blur)) saturate(var(--sat)) brightness(var(--bri));
  transform-origin: 50% 55%;
  animation: breathe 11s ease-in-out infinite;
}

@keyframes breathe{
  0%,100%{ transform: translateY(0) scale(1); opacity: .95; }
  50%{ transform: translateY(-1.1%) scale(1.025); opacity: 1; }
}

.rim{
  filter: blur(6px);
  mix-blend-mode: screen;
  transition: opacity 220ms ease;
}

.talk-notch{
  filter: blur(1.5px);
  transition: opacity 120ms linear;
}

.echo-wing{
  filter: blur(3px);
  mix-blend-mode: multiply;
  transition: opacity 120ms linear;
}

.echo-wing--outer{ filter: blur(4px); }

@media (prefers-reduced-motion: reduce){
  .blob{ animation: none; }
  .rim, .talk-notch, .echo-wing{ transition: none; }
}