/* The browser owns navigation; the portal adds no interception or waiting time. */
@view-transition { navigation:auto; }
::view-transition {
  background:var(--ivey-navigation-canvas,#f8f5f1);
}
::view-transition-group(root) {animation-duration:120ms;animation-timing-function:ease-out}
::view-transition-old(root) {animation:ivey-page-leave 120ms ease-out both;mix-blend-mode:normal}
::view-transition-new(root) {animation:ivey-page-arrive 120ms ease-out both;mix-blend-mode:normal}
@keyframes ivey-page-leave {
  from {opacity:1}
  to {opacity:0}
}
@keyframes ivey-page-arrive {
  from {opacity:.65}
  to {opacity:1}
}

/* Cold history restores mount this outside body and remove it synchronously. */
.ivey-navigation-portal {
  position:fixed;inset:0;z-index:2147483646;pointer-events:none;overflow:hidden;contain:paint;
  color:var(--ivey-portal-accent,#dfc386);
  background:radial-gradient(ellipse at var(--portal-x,50vw) var(--portal-y,47vh),#000 0%,#010101 9%,color-mix(in srgb,currentColor 12%,#020202) 47%,#010101 100%);
  opacity:1;animation:ivey-portal-open 80ms ease-out both;
}
.ivey-navigation-portal .ivey-portal-depth {
  position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse at var(--portal-x,50vw) var(--portal-y,47vh),transparent 14%,color-mix(in srgb,currentColor 8%,transparent) 43%,color-mix(in srgb,currentColor 5%,transparent) 61%,#0008 100%);
  opacity:.8;
}
/* Two broken accent/pearl arcs recede into the same dark throat. */
.ivey-navigation-portal .ivey-portal-depth::before,
.ivey-navigation-portal .ivey-portal-depth::after {
  content:"";position:absolute;left:var(--portal-x,50vw);top:var(--portal-y,47vh);
  width:34vmax;height:13vmax;box-sizing:border-box;border:1px solid;border-radius:50%;
  border-color:color-mix(in srgb,currentColor 22%,transparent) transparent color-mix(in srgb,currentColor 14%,transparent) transparent;
  pointer-events:none;opacity:0;
  animation:ivey-portal-lens 340ms cubic-bezier(.55,.04,.85,.4) -90ms infinite both;
}
.ivey-navigation-portal .ivey-portal-depth::after {
  width:25vmax;height:9vmax;border-color:transparent color-mix(in srgb,currentColor 18%,transparent) transparent color-mix(in srgb,currentColor 12%,transparent);
  animation-duration:280ms;animation-delay:-205ms;
}
.ivey-navigation-portal::after {
  content:"";position:absolute;left:var(--portal-x,50vw);top:var(--portal-y,47vh);
  width:6vmax;height:3.5vmax;border-radius:50%;pointer-events:none;z-index:2;
  background:radial-gradient(ellipse,#000 35%,#000c 57%,transparent 75%);
  transform:translate(-50%,-50%) rotate(-21deg);
}
.ivey-navigation-portal .ivey-portal-star {
  position:absolute;left:var(--portal-x,50vw);top:var(--portal-y,47vh);width:var(--star-length,56px);height:1px;
  pointer-events:none;opacity:0;transform-origin:0 50%;border-radius:50%;
  background:linear-gradient(90deg,color-mix(in srgb,currentColor 35%,#f7f5f1),currentColor 22%,transparent);
  animation:ivey-portal-streak var(--star-duration,220ms) cubic-bezier(.52,.04,.86,.38) var(--star-delay,-80ms) infinite both;
}
@keyframes ivey-portal-open {from {opacity:.3} to {opacity:1}}
@keyframes ivey-portal-lens {
  0% {opacity:0;transform:translate(-50%,-50%) rotate(-21deg) scale(3.2)}
  17% {opacity:.62}
  70% {opacity:.42}
  100% {opacity:0;transform:translate(-50%,-50%) rotate(-9deg) scale(.12)}
}
@keyframes ivey-portal-streak {
  0% {opacity:0;transform:rotate(var(--star-angle,-24deg)) translateX(var(--star-travel,64vmax)) translateY(var(--star-bend,3vmax)) rotate(var(--star-curve,10deg)) scaleX(.65)}
  18% {opacity:var(--star-alpha,.2)}
  64% {opacity:calc(var(--star-alpha,.2) * .88);transform:rotate(calc(var(--star-angle,-24deg) + var(--star-curve,10deg))) translateX(calc(var(--star-travel,64vmax) * .34)) translateY(calc(var(--star-bend,3vmax) * .28)) rotate(0deg) scaleX(1.5)}
  100% {opacity:0;transform:rotate(calc(var(--star-angle,-24deg) + var(--star-curve,10deg))) translateX(.6vmax) translateY(0vmax) rotate(0deg) scaleX(.05)}
}
@media(max-width:767px) {
  .ivey-navigation-portal .ivey-portal-star {height:.8px}
}
@media(prefers-reduced-motion:reduce) {
  @view-transition {navigation:none}
  ::view-transition {background:transparent!important}
  ::view-transition-group(root),::view-transition-old(root),::view-transition-new(root) {animation:none!important;transform:none!important}
  .ivey-navigation-portal,.ivey-navigation-portal .ivey-portal-depth {animation:none!important;transform:none!important;opacity:1}
  .ivey-navigation-portal .ivey-portal-star {display:none!important;animation:none!important}
  .ivey-navigation-portal .ivey-portal-depth::before,.ivey-navigation-portal .ivey-portal-depth::after {display:none!important;animation:none!important}
}
html[data-ivey-motion=paused]::view-transition {background:transparent!important}
html[data-ivey-motion=paused]::view-transition-group(root),
html[data-ivey-motion=paused]::view-transition-old(root),
html[data-ivey-motion=paused]::view-transition-new(root) {animation:none!important;transform:none!important}
html[data-ivey-motion=paused] .ivey-navigation-portal,
html[data-ivey-motion=paused] .ivey-navigation-portal .ivey-portal-depth {animation:none!important;transform:none!important;opacity:1}
html[data-ivey-motion=paused] .ivey-navigation-portal .ivey-portal-star {display:none!important;animation:none!important}
html[data-ivey-motion=paused] .ivey-navigation-portal .ivey-portal-depth::before,
html[data-ivey-motion=paused] .ivey-navigation-portal .ivey-portal-depth::after {display:none!important;animation:none!important}
.ivey-navigation-portal[data-portal-motion=quiet] {animation:none!important;opacity:1!important}
.ivey-navigation-portal[data-portal-motion=quiet] .ivey-portal-depth::before,
.ivey-navigation-portal[data-portal-motion=quiet] .ivey-portal-depth::after {display:none!important;animation:none!important}