/* Loaded after the application CSS: one deterministic reveal, no double native transition. */
@view-transition { navigation: none; }
.sv-page-curtain {
  position: fixed; inset: 0; z-index: 2147483000;
  pointer-events: none; contain: strict;
  background-color: var(--sv-tone-580b23, #580b23);
  background-image:
    url('./logo-v1.png'),
    linear-gradient(115deg, transparent 36%, #ffffff12 49%, transparent 62%),
    url('./vine-v1.png'),
    radial-gradient(ellipse at 75% 25%, var(--sv-tone-a52249, #a52249) 0%, var(--sv-tone-730d2d, #730d2d) 46%, var(--sv-tone-3d0718, #3d0718) 100%);
  background-repeat: no-repeat;
  background-size: 76px auto, 200% 100%, auto 76%, cover;
  background-position: center, 160% 0, 94% center, center;
  animation: sv-curtain-reveal 680ms cubic-bezier(.25,.8,.25,1) both, sv-curtain-sheen 680ms ease-out both;
}
html[data-sv-theme="gold"] .sv-page-curtain { background-blend-mode: luminosity, normal, luminosity, normal; }
@keyframes sv-curtain-reveal {
  0%, 15% { clip-path: inset(0 0 0 0); }
  100% { clip-path: inset(0 0 0 100%); }
}
@keyframes sv-curtain-sheen {
  from { background-position: center, 160% 0, 94% center, center; }
  to { background-position: center, -60% 0, 94% center, center; }
}
@media(max-width:600px) {
  .sv-page-curtain { background-size:58px auto,200% 100%,auto 55%,cover; animation-duration:480ms; }
}
@media(prefers-reduced-motion:reduce), (forced-colors:active), print {
  .sv-page-curtain { display:none; animation:none; }
}
