/* ---------- particle network ---------- */
#net{position:fixed;inset:0;width:100vw;height:100vh;z-index:0;pointer-events:none}
header{z-index:20}
main#app,footer{position:relative;z-index:1}
[data-theme="dark"] body{background-attachment:fixed}

/* ---------- custom cursor ---------- */
html.cur, html.cur *{cursor:none}
html.cur input:not([type=range]), html.cur textarea, html.cur [contenteditable]{cursor:text}
.cdot,.cring{position:fixed;left:0;top:0;pointer-events:none;z-index:200;border-radius:50%}
.cdot{width:6px;height:6px;margin:-3px 0 0 -3px;background:var(--cobalt)}
.cring{width:34px;height:34px;margin:-17px 0 0 -17px;border:1.5px solid var(--cobalt);opacity:.7;
  transition:width .25s cubic-bezier(.2,.7,.2,1),height .25s cubic-bezier(.2,.7,.2,1),margin .25s cubic-bezier(.2,.7,.2,1),background .25s,opacity .25s,border-color .25s}
html.cur-hov .cring{width:58px;height:58px;margin:-29px 0 0 -29px;background:rgba(113,134,255,.12);opacity:1}
html.cur-down .cring{width:24px;height:24px;margin:-12px 0 0 -12px}
html.cur-text .cring,html.cur-text .cdot,html.cur-out .cring,html.cur-out .cdot{opacity:0}
.mag{transition:translate .18s cubic-bezier(.2,.7,.2,1)}
.btn,.askbar button,.chips button,.gbtns button,.iconbtn,.brand,.tabs button,[data-range]{transition-property:translate,transform,background,border-color,color,box-shadow;transition-duration:.35s,.15s,.2s,.2s,.2s,.2s;transition-timing-function:cubic-bezier(.2,.7,.2,1)}

/* ---------- horizon page transition ---------- */
.wipe{position:fixed;inset:0;z-index:150;pointer-events:none;visibility:hidden}
.wipe.on{visibility:visible;pointer-events:auto}
.wipe .wtop,.wipe .wbot{position:absolute;left:0;right:0;height:50.5%;background:#0A1117;transition:transform .5s cubic-bezier(.75,0,.2,1)}
.wipe .wtop{top:0;transform:translateY(-101%)}
.wipe .wbot{bottom:0;transform:translateY(101%)}
.wipe .wline{position:absolute;left:0;right:0;top:50%;height:2px;margin-top:-1px;background:#EAF0F5;transform:scaleX(0);transition:transform .45s cubic-bezier(.7,0,.2,1) .15s,opacity .3s}
.wipe .wsun{position:absolute;left:50%;top:50%;width:64px;height:32px;margin:-33px 0 0 -32px;border-radius:64px 64px 0 0;background:#7186FF;
  box-shadow:0 0 50px 8px rgba(113,134,255,.45);transform:translateY(34px);opacity:0;transition:transform .45s cubic-bezier(.2,.7,.2,1) .3s,opacity .2s .3s}
.wipe .wname{position:absolute;left:0;right:0;top:50%;margin-top:22px;text-align:center;font:600 13px/1 var(--body);letter-spacing:.04em;color:#8D9DAC;opacity:0;transition:opacity .3s .35s}
.wipe.close .wtop,.wipe.close .wbot{transform:none}
.wipe.close .wline{transform:scaleX(1)}
.wipe.close .wsun{transform:none;opacity:1}
.wipe.close .wname{opacity:1}
.wipe.open .wtop{transform:translateY(-101%);transition-delay:.05s}
.wipe.open .wbot{transform:translateY(101%);transition-delay:.05s}
.wipe.open .wline{opacity:0;transition-delay:0s}
.wipe.open .wsun{transform:translateY(-40px);opacity:0;transition:transform .35s,opacity .25s}
.wipe.open .wname{opacity:0;transition-delay:0s}

/* ---------- headings, word by word ---------- */
.wsplit .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.wsplit .wi{display:inline-block;transform:translateY(105%);opacity:0;transition:transform .7s cubic-bezier(.2,.7,.2,1),opacity .5s}
.wsplit.in .wi{transform:none;opacity:1}
.wsplit.now .wi{transition:none}

@media (prefers-reduced-motion: reduce){
  .wsplit .wi{transform:none;opacity:1;transition:none}
  .wipe{display:none}
}
