.portfolio-page-motion{position:fixed;inset:0 0 auto;height:100vh;height:100lvh;z-index:100010;overflow:hidden;pointer-events:auto;touch-action:none;isolation:isolate}
html.portfolio-transition-present::before,html.portfolio-transition-present::after{display:none!important}
html.portfolio-transition-present .portfolio-theme-dialog{opacity:0!important;pointer-events:none}
html.portfolio-transition-present .portfolio-theme-dialog::backdrop{background:transparent!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
html.portfolio-route-covered::before{background:linear-gradient(90deg,#212431 50%,#d4d5d9 50%)!important}
html[data-portfolio-theme="frosted"].portfolio-route-covered::before{background:radial-gradient(ellipse at 70% 65%,#fab38770,transparent 60%),radial-gradient(ellipse at 20% 30%,#cba6f780,transparent 65%),#1e1e2e!important}
html[data-portfolio-theme="tactile"].portfolio-route-covered::before{background:repeating-linear-gradient(0deg,#1d202140 0px,#1d202140 1px,transparent 1px,transparent 4px),radial-gradient(ellipse at 50% 45%,#3c3836,#282828 75%)!important}
.portfolio-motion-door{position:absolute;top:0;bottom:0;width:50.1%;display:grid;place-items:center;background:#212431;color:#e8e8e8;font:500 clamp(16px,2.3vw,32px) 'Hanken Grotesk',sans-serif;letter-spacing:.1em}
.portfolio-motion-door:first-child{left:0;padding:24px;text-align:center;text-transform:uppercase;overflow-wrap:anywhere;text-wrap:balance}
.portfolio-motion-door:last-child{right:0;background:#d4d5d9;color:#212431;font:italic 500 clamp(88px,15vw,220px) 'Novela Regular Italic',Georgia,serif;letter-spacing:-.08em}
.portfolio-motion-lens{position:absolute;inset:0;display:grid;place-items:center;background:radial-gradient(ellipse at 70% 65%,#fab38770,transparent 60%),radial-gradient(ellipse at 20% 30%,#cba6f780,transparent 65%),#1e1e2e;color:#fab387;font:500 clamp(64px,10vw,144px) 'Portfolio Pixel',monospace;letter-spacing:-.04em}
.portfolio-motion-lens-title{max-width:calc(100vw - 64px);font-size:clamp(32px,5vw,72px);text-align:center;text-transform:uppercase;overflow-wrap:anywhere;text-wrap:balance}
.portfolio-motion-scan{position:absolute;inset:0;background:repeating-linear-gradient(0deg,#1d202140 0px,#1d202140 1px,transparent 1px,transparent 4px),radial-gradient(ellipse at 50% 45%,#3c3836,#282828 75%);display:flex;align-items:center;justify-content:center;padding:24px;color:#ebdbb2;font-family:'Portfolio Plex',monospace}
.portfolio-motion-scan::before{content:"";position:absolute;inset:24px;border:1px solid #665c54;box-shadow:inset 0 0 40px #1d202122}
.portfolio-motion-scan::after{content:"";position:absolute;width:34px;height:3px;left:24px;top:24px;background:#d79921;box-shadow:0 0 12px #d7992140}
.portfolio-motion-stamp{position:relative;display:flex;flex-direction:column;align-items:center;gap:12px}
.portfolio-motion-route{font-size:clamp(24px,4vw,48px);font-weight:500;letter-spacing:-.04em;text-transform:uppercase;color:#d79921;max-width:calc(100vw - 80px);overflow-wrap:anywhere;text-wrap:balance;text-align:center}
.portfolio-motion-scan-line{position:absolute;left:0;right:0;top:-10px;height:14px;background:linear-gradient(0deg,#d7992100,#d7992130 45%,#d79921 48%,#ebdbb2 52%,#d7992120 60%,#d7992100);box-shadow:0 5px 20px #d7992114}
.portfolio-motion-door,.portfolio-motion-scan,.portfolio-motion-scan-line{will-change:transform;backface-visibility:hidden}
.portfolio-motion-lens{will-change:clip-path;contain:paint;backface-visibility:hidden;transform:translateZ(0)}
.portfolio-motion-stamp{position:absolute;inset:0;justify-content:center;will-change:opacity;color:#d79921;font-family:'Portfolio Plex',monospace;pointer-events:none}