/* A folded silhouette from the monogram connects the opening and navigation. */
.page-transition{position:fixed;inset:0;z-index:10000;pointer-events:auto;isolation:isolate}
.page-transition-panel,.page-transition-edge{position:absolute;inset:0;background:#252b2a;will-change:clip-path}
.page-transition-edge{background:#65716b}
.page-transition-logo{position:fixed;left:50%;top:50%;width:220px;height:auto;transform:translate(-50%,-50%);filter:brightness(0) invert(1);pointer-events:none;-webkit-user-select:none;user-select:none}
.page-entering .header .brand{visibility:hidden}
@media(max-width:700px){.page-transition-logo{width:165px}}
@keyframes project-panel-enter{from{opacity:0;transform:translateY(18px) scale(.985)}to{opacity:1;transform:none}}
@keyframes project-copy-enter{from{opacity:0;translate:0 10px}to{opacity:1;translate:0 0}}
@keyframes project-backdrop-enter{from{background-color:#141c1b00;backdrop-filter:blur(0)}to{background-color:#141c1bc7;backdrop-filter:blur(8px)}}
#project-dialog[open]{animation:project-panel-enter .5s cubic-bezier(.22,1,.36,1) both}
#project-dialog[open]::backdrop{animation:project-backdrop-enter .4s ease both}
#project-dialog[open] .dialog-content{animation:project-copy-enter .45s .08s cubic-bezier(.22,1,.36,1) both}
@media(prefers-reduced-motion:reduce){
 .page-transition{display:none}
 .page-entering .header .brand{visibility:visible}
 #project-dialog[open],#project-dialog[open]::backdrop,#project-dialog[open] .dialog-content{animation:none}
}

@keyframes film-buffer-pulse{0%,100%{opacity:.6}50%{opacity:1}}
.page-transition.is-buffering .page-transition-logo{animation:film-buffer-pulse 1.2s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.page-transition.is-buffering .page-transition-logo{animation:none}}