body.entry-lock{overflow:hidden}
body.entry-lock>.nav,body.entry-lock>.hero,body.entry-lock>main,body.entry-lock>footer{opacity:0;filter:blur(14px);transform:scale(1.025);transform-origin:50% 18%}
body.entry-revealing>.nav,body.entry-revealing>.hero,body.entry-revealing>main,body.entry-revealing>footer{opacity:1;filter:blur(0);transform:scale(1);transition:opacity 1.15s ease,filter 1.15s ease,transform 1.35s cubic-bezier(.16,1,.3,1)}
body.entry-revealing>.hero{transition-delay:.08s}
.entry{position:fixed;inset:0;z-index:9999;background:#06080c;color:#fff;display:grid;place-items:center;overflow:hidden;pointer-events:all}
.entry-grid{position:absolute;inset:0;background:linear-gradient(#ffffff08 1px,transparent 1px),linear-gradient(90deg,#ffffff08 1px,transparent 1px);background-size:64px 64px;opacity:0;animation:entryGrid 2.7s ease forwards}
.entry-line{position:absolute;z-index:2;left:50%;top:0;width:2px;height:0;background:#78a4ff;box-shadow:0 0 18px #3977ff,0 0 80px #3977ff;transform:translateX(-50%);animation:entryLine 1.65s cubic-bezier(.77,0,.18,1) .25s forwards}
.entry-mark{position:relative;z-index:3;display:flex;align-items:center;gap:18px;opacity:0;transform:scale(.82);animation:entryMark 1s cubic-bezier(.2,.8,.2,1) .38s forwards}
.entry-mark span{width:86px;height:86px;border-radius:22px;background:#3977ff;display:grid;place-items:center;font-size:32px;font-weight:800;letter-spacing:-.08em;box-shadow:0 0 80px #3977ff55}
.entry-mark b{font-size:17px;letter-spacing:.28em;white-space:nowrap}
.entry-words{position:absolute;z-index:3;left:50%;bottom:12%;transform:translateX(-50%);height:26px;overflow:hidden;width:220px;text-align:center;color:#8fa2c2;font-size:11px;font-weight:800;letter-spacing:.5em}
.entry-words span{position:absolute;inset:0;opacity:0;transform:translateY(18px)}
.entry-words span:nth-child(1){animation:entryWord .5s ease .35s forwards}.entry-words span:nth-child(2){animation:entryWord .5s ease 1s forwards}.entry-words span:nth-child(3){animation:entryWordLast .65s ease 1.65s forwards}
.entry-count{position:absolute;z-index:3;right:4%;bottom:3%;font-size:12px;letter-spacing:.2em;color:#71809a;margin:0}
.entry-panel{position:absolute;top:0;bottom:0;width:50%;background:#06080c;z-index:1;transform:translateX(0)}
.entry-panel-left{left:0}.entry-panel-right{right:0}
.entry.exit{animation:entryFade 1.15s ease .15s forwards}
.entry.exit .entry-panel-left{animation:panelLeft 1.15s cubic-bezier(.77,0,.18,1) forwards}.entry.exit .entry-panel-right{animation:panelRight 1.15s cubic-bezier(.77,0,.18,1) forwards}
.entry.exit .entry-mark,.entry.exit .entry-words,.entry.exit .entry-count,.entry.exit .entry-grid,.entry.exit .entry-line{opacity:0;transition:opacity .25s ease}
.entry.done{display:none}
@keyframes entryGrid{30%,80%{opacity:.35}100%{opacity:.1}}
@keyframes entryLine{0%{height:0}65%{height:100%}100%{height:100%;width:7px}}
@keyframes entryMark{to{opacity:1;transform:scale(1)}}
@keyframes entryWord{0%{opacity:0;transform:translateY(18px)}35%,65%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-18px)}}
@keyframes entryWordLast{to{opacity:1;transform:none;color:#b9ccf2}}
@keyframes panelLeft{to{transform:translateX(-101%)}}
@keyframes panelRight{to{transform:translateX(101%)}}
@keyframes entryFade{65%{background:#06080c00}100%{background:#06080c00;opacity:0}}
@media(max-width:600px){.entry-mark{gap:12px}.entry-mark span{width:66px;height:66px;border-radius:17px;font-size:25px}.entry-mark b{font-size:12px;letter-spacing:.2em}.entry-words{bottom:16%}}
@media(prefers-reduced-motion:reduce){.entry{display:none!important}body.entry-lock{overflow:auto}body.entry-lock>.nav,body.entry-lock>.hero,body.entry-lock>main,body.entry-lock>footer{opacity:1;filter:none;transform:none}}
