/* Ember preloader: unit A091 wakes up. Dot-matrix eyes light up with progress, blink, then the dark closes into the eyes. */
#pre{--r:150vmax;--dot:clamp(8px,1.3vw,22px);--gap:clamp(4px,.6vw,10px);--ease:cubic-bezier(.76,0,.24,1)}
html.motion-loading{overflow:hidden}
#pre{display:block;position:fixed;inset:0;z-index:10000;background:#000;color:#fff;font-family:Onest,system-ui,sans-serif;clip-path:circle(var(--r) at 50% 46%);-webkit-clip-path:circle(var(--r) at 50% 46%)}


#pre .pre-top,#pre .pre-bottom{position:absolute;left:clamp(16px,2.5vw,48px);right:clamp(16px,2.5vw,48px);display:flex;justify-content:space-between;align-items:baseline;text-transform:uppercase;letter-spacing:.06em;font-size:clamp(10px,.78vw,14px);line-height:1.3;color:#8c8a94;transition:opacity .45s ease}
#pre .pre-top{top:clamp(18px,2.4vw,44px)}
#pre .pre-bottom{bottom:clamp(22px,2.6vw,48px)}
#pre .pre-top b{font-weight:400;color:#fff}
#pre .pre-count{font-variant-numeric:tabular-nums;color:#fff}
#pre .pre-count i{font-style:normal;color:#55535b}

/* eyes */
#pre .pre-face{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);display:flex;gap:calc(var(--dot) * 3.2)}
#pre .pre-eye{display:grid;grid-template-columns:repeat(6,var(--dot));grid-auto-rows:var(--dot);gap:var(--gap);transform-origin:50% 50%}
#pre .pre-eye i{display:block;border-radius:30%;background:#18181c;transition:background-color .35s ease,box-shadow .35s ease}
#pre .pre-eye i.x{visibility:hidden}
#pre .pre-eye i.on{background:#fff;box-shadow:0 0 calc(var(--dot) * .9) rgba(255,255,255,.55)}
#pre.blink .pre-eye{animation:pre-blink .5s var(--ease) both}
#pre.blink .pre-eye:last-child{animation-delay:.02s}
@keyframes pre-blink{0%,100%{transform:scaleY(1)}40%,55%{transform:scaleY(.08)}}

/* status under the eyes */
#pre .pre-status{position:absolute;left:50%;top:calc(46% + var(--dot) * 4 + var(--gap) * 3 + clamp(28px,3.6vw,64px));transform:translateX(-50%);height:1.4em;overflow:hidden;text-align:center;text-transform:uppercase;letter-spacing:.08em;font-size:clamp(10px,.78vw,14px);white-space:nowrap}
#pre .pre-status span{display:block;transition:transform .5s var(--ease),opacity .5s ease}
#pre .pre-status span.leave{transform:translateY(-110%);opacity:0}
#pre .pre-status span.enter{transform:translateY(110%);opacity:0}

/* hairline progress */
#pre .pre-line{position:absolute;left:clamp(16px,2.5vw,48px);right:clamp(16px,2.5vw,48px);bottom:clamp(54px,5.2vw,96px);height:1px;background:#222127;overflow:hidden;transition:opacity .45s ease}
#pre .pre-line::after{content:"";position:absolute;inset:0;background:#fff;transform-origin:0 50%;transform:scaleX(calc(var(--p,0) / 100))}
#pre.blink .pre-top,#pre.blink .pre-bottom,#pre.blink .pre-line,#pre.blink .pre-status{opacity:0}

@media(max-width:767px){#pre .pre-face{top:44%}#pre .pre-status{top:calc(44% + var(--dot) * 4 + var(--gap) * 3 + 28px)}#pre{clip-path:circle(var(--r) at 50% 44%);-webkit-clip-path:circle(var(--r) at 50% 44%)}#pre .pre-top span:last-child{display:none}}
@media(prefers-reduced-motion:reduce){#pre,#pre *{transition:none!important;animation:none!important}}
.mobile-feature-card{display:none}
