/* Shared cinematic transitions between ImCraft portal zones. */
@view-transition { navigation: auto; }
::view-transition-old(root){animation:imOld .38s ease both}
::view-transition-new(root){animation:imNew .55s cubic-bezier(.2,.78,.2,1) both}
@keyframes imOld{to{opacity:.18;filter:blur(7px);transform:scale(.992)}}
@keyframes imNew{from{opacity:0;clip-path:inset(8% 0 8% 0);transform:scale(1.008)}to{opacity:1;clip-path:inset(0);transform:none}}
.portal-transition{--gate:#8ff081;position:fixed;inset:0;z-index:5000;pointer-events:none;display:grid;grid-template-columns:1fr 1fr 1fr;visibility:hidden;overflow:hidden}
.portal-transition__panel{background:#050809;transform:translateY(105%);transition:transform .56s cubic-bezier(.72,0,.16,1);border-left:1px solid rgba(255,255,255,.045)}
.portal-transition__panel:nth-child(2){transition-delay:.035s;background:linear-gradient(180deg,#07100f,#050809)}
.portal-transition__panel:nth-child(3){transition-delay:.07s}
.portal-transition__copy{position:absolute;left:50%;top:50%;transform:translate(-50%,-42%);display:grid;justify-items:center;gap:10px;opacity:0;transition:opacity .2s ease .2s,transform .45s cubic-bezier(.2,.8,.2,1) .12s;color:#eef7f2;text-align:center;white-space:nowrap}
.portal-transition__copy i{width:8px;height:8px;border-radius:50%;background:var(--gate);box-shadow:0 0 26px var(--gate)}
.portal-transition__copy span{font:800 .62rem/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.22em;color:var(--gate)}
.portal-transition__copy b{font:900 clamp(2.1rem,6vw,6.8rem)/.84 Inter,ui-sans-serif,sans-serif;letter-spacing:-.07em;text-transform:uppercase}
.portal-transition__scan{position:absolute;left:0;right:0;top:50%;height:1px;background:linear-gradient(90deg,transparent,var(--gate),transparent);opacity:0;box-shadow:0 0 26px var(--gate)}
.portal-transition.is-leaving{visibility:visible;pointer-events:all}
.portal-transition.is-leaving .portal-transition__panel{transform:translateY(0)}
.portal-transition.is-leaving .portal-transition__copy{opacity:1;transform:translate(-50%,-50%)}
.portal-transition.is-leaving .portal-transition__scan{animation:gateScan .75s ease .18s both}
.portal-transition.is-entering{visibility:visible}
.portal-transition.is-entering .portal-transition__panel{transform:translateY(0);transition:none}
.portal-transition.is-entering .portal-transition__copy{opacity:1;transform:translate(-50%,-50%);transition:none}
.portal-transition.is-entering.release .portal-transition__panel{transform:translateY(-105%);transition:transform .62s cubic-bezier(.72,0,.16,1)}
.portal-transition.is-entering.release .portal-transition__panel:nth-child(2){transition-delay:.04s}.portal-transition.is-entering.release .portal-transition__panel:nth-child(3){transition-delay:.08s}
.portal-transition.is-entering.release .portal-transition__copy{opacity:0;transform:translate(-50%,-60%);transition:.28s ease}
@keyframes gateScan{0%{opacity:0;transform:translateY(-120px)}25%{opacity:.8}100%{opacity:0;transform:translateY(130px)}}
.portal-transition[data-zone="guide"]{--gate:#8bd9ff}.portal-transition[data-zone="city"]{--gate:#eff88d}.portal-transition[data-zone="community"]{--gate:#ff8bac}.portal-transition[data-zone="trust"]{--gate:#8ff081}.portal-transition[data-zone="home"]{--gate:#8ff081}
@media(max-width:680px){.portal-transition{grid-template-columns:1fr 1fr}.portal-transition__panel:nth-child(3){display:none}.portal-transition__copy b{font-size:clamp(2.3rem,14vw,4.8rem)}.portal-transition__copy span{font-size:.52rem}}
@media(prefers-reduced-motion:reduce){.portal-transition{display:none!important}::view-transition-old(root),::view-transition-new(root){animation:none}}
