/* The opening: dots that are pulled together into one (js/splash.js). It lies over the page until it is done. */

#splash {
  --splash-dot: #5e7d38;
  position: fixed; inset: 0; z-index: 9999; background: var(--bg);
  transition: opacity 450ms var(--ease);
  /* If the script never runs, the page must not stay covered */
  animation: splash-failsafe 0s linear 9s forwards;
}
[data-theme="paper"] #splash, [data-theme="mist"] #splash, [data-theme="ink"] #splash { --splash-dot: #55772c; }

#splash canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
#splash.is-done { opacity: 0; pointer-events: none; }

@keyframes splash-failsafe { to { opacity: 0; visibility: hidden; pointer-events: none; } }