/* :Dejoiy brand motion: the |:D) mark, loading screen, footer logo */
.djb-boxg,.djb-shape,.djb-eye,.djb-dot,.djb-dee,.djb-letters{transform-box:fill-box}
.djb-shape{transform-origin:0 50%}
.djb-eye,.djb-dot,.djb-dee{transform-origin:50% 50%}
.djb-boxg{transform-origin:30% 100%}

/* loading screen (every page load, ~1.2s) */
html.djb-loading{overflow:hidden}
.djb-load{position:fixed;inset:0;z-index:2147483000;display:grid;place-items:center;background:var(--ld-bg,var(--bg,#D4FF3A));color:var(--ld-fg,var(--word,#121212));clip-path:ellipse(160% 160% at 50% 0%);transition:clip-path .45s cubic-bezier(.7,0,.2,1)}
.djb-load.is-out{clip-path:ellipse(160% 0% at 50% 0%)}
.djb-load-stack{display:flex;flex-direction:column;align-items:center;gap:clamp(18px,3vw,30px);max-width:100%;transition:transform .4s cubic-bezier(.7,0,.2,1),opacity .3s ease}
.djb-load.is-out .djb-load-stack{transform:translateY(-.6em) scale(.94);opacity:0}
.djb-load-in{display:flex;align-items:center;gap:.2em;font-size:clamp(52px,11vw,136px);padding:0 16px;max-width:100%}
.djb-load-markwrap{position:relative;display:block;flex:none;line-height:0}
.djb-load .djb-mark{height:1em;width:auto;display:block;overflow:visible}
.djb-load .djb-shape{animation:djbGrow .45s cubic-bezier(.3,1.5,.5,1) both}
.djb-load .djb-eye{animation:djbDrop .38s .2s cubic-bezier(.3,1.7,.5,1) both,djbWink .28s .82s ease-in-out}
.djb-load .djb-dot{animation:djbDrop .38s .27s cubic-bezier(.3,1.7,.5,1) both}
.djb-load .djb-dee{animation:djbPopIn .42s .33s cubic-bezier(.3,1.8,.5,1) both}
.djb-load .djb-boxg{animation:djbLaugh .5s .74s ease-in-out}
.djb-load-name{display:block;overflow:hidden;padding:.06em .04em .16em;margin:-.06em 0 -.16em;font-family:var(--ld-font,var(--wfont,'Bricolage Grotesque',sans-serif));font-weight:800;letter-spacing:-.04em;line-height:1.05;white-space:nowrap}
.djb-load-name>span{display:block;transform:translateY(115%) rotate(4deg);transform-origin:0 100%;animation:djbRise .55s .4s cubic-bezier(.2,.9,.2,1) forwards}
body.djw-nexus .djb-load-name,body.djw-renew .djb-load-name{font-weight:400}
.djb-spark{position:absolute;width:.16em;height:.16em;background:var(--djb-eye,#FF4FA3);clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%);transform:scale(0);animation:djbSpark .55s .74s cubic-bezier(.2,.9,.2,1) both}
.djb-spark:nth-of-type(1){top:-.18em;right:-.08em}
.djb-spark:nth-of-type(2){top:.1em;right:-.3em;width:.11em;height:.11em;background:var(--ld-fg,var(--word,#121212));animation-delay:.8s}
.djb-spark:nth-of-type(3){bottom:-.14em;right:.02em;width:.12em;height:.12em;background:var(--djb-box,#D4FF3A);animation-delay:.86s}
.djb-load-worlds{display:flex;gap:10px}
.djb-load-worlds i{width:16px;height:16px;border-radius:999px;background:var(--c);box-shadow:0 0 0 2px var(--ld-fg,#121212);transform:scale(0);animation:djbDot .4s cubic-bezier(.3,1.8,.5,1) both,djbHop .5s ease-in-out}
.djb-load-worlds i:nth-child(1){animation-delay:.5s,.95s}.djb-load-worlds i:nth-child(2){animation-delay:.55s,1s}.djb-load-worlds i:nth-child(3){animation-delay:.6s,1.05s}.djb-load-worlds i:nth-child(4){animation-delay:.65s,1.1s}.djb-load-worlds i:nth-child(5){animation-delay:.7s,1.15s}.djb-load-worlds i:nth-child(6){animation-delay:.75s,1.2s}
.djb-load-bar{width:min(220px,50vw);height:4px;border-radius:999px;overflow:hidden;background:color-mix(in srgb,currentColor 16%,transparent)}
.djb-load-bar i{display:block;height:100%;border-radius:inherit;background:currentColor;transform:scaleX(0);transform-origin:0 50%;animation:djbBar 1.15s cubic-bezier(.6,0,.2,1) forwards}
@keyframes djbGrow{0%{transform:scale(0,.55);opacity:0}40%{opacity:1}100%{transform:none}}
@keyframes djbDrop{0%{transform:translateY(-160%) scale(.4);opacity:0}100%{transform:none;opacity:1}}
@keyframes djbPopIn{0%{transform:scale(0) rotate(-25deg)}100%{transform:none}}
@keyframes djbWink{50%{transform:scaleY(.12)}}
@keyframes djbLaugh{0%,100%{transform:none}25%{transform:rotate(-8deg) scale(1.04)}55%{transform:rotate(5deg)}80%{transform:rotate(-2deg)}}
@keyframes djbRise{to{transform:none}}
@keyframes djbSpark{0%{transform:scale(0) rotate(0)}55%{transform:scale(1.25) rotate(90deg)}100%{transform:scale(1) rotate(135deg)}}
@keyframes djbDot{0%{transform:scale(0)}100%{transform:none}}
@keyframes djbHop{0%,100%{translate:0 0}40%{translate:0 -9px}}
@keyframes djbBar{0%{transform:scaleX(0)}60%{transform:scaleX(.72)}100%{transform:scaleX(1)}}

/* footer logo: always on, a little laugh every few seconds */
.djb-foot-logo{display:inline-block;color:inherit;text-decoration:none;--djb-box:#D4FF3A;--djb-ink:#121212;--djb-eye:#FF4FA3}
.djb-foot-logo .djb-word{display:block;height:clamp(44px,5vw,64px);width:auto;overflow:visible}
.djb-foot-logo .djb-boxg{animation:djbFootLaugh 4.5s ease-in-out infinite}
.djb-foot-logo .djb-eye{animation:djbFootEye 4.5s cubic-bezier(.3,1.6,.5,1) infinite}
.djb-foot-logo .djb-dot{animation:djbFootDot 4.5s cubic-bezier(.3,1.6,.5,1) infinite}
.djb-foot-logo .djb-dee{animation:djbFootDee 4.5s cubic-bezier(.3,1.6,.5,1) infinite}
.djb-foot-logo .djb-letters{transform-origin:0 100%;animation:djbFootLean 4.5s ease-in-out infinite}
.djb-foot-logo:hover .djb-boxg,.djb-foot-logo:hover .djb-eye,.djb-foot-logo:hover .djb-dot,.djb-foot-logo:hover .djb-dee,.djb-foot-logo:hover .djb-letters,.djb-foot-logo:focus-visible .djb-boxg{animation-duration:1.5s}
@keyframes djbFootLaugh{0%,60%,100%{transform:none}66%{transform:rotate(-9deg) scale(1.05)}74%{transform:rotate(6deg)}82%{transform:rotate(-2deg)}88%{transform:none}}
@keyframes djbFootEye{0%,62%,100%{transform:none}67%{transform:translateY(-55%)}72%{transform:none}78%{transform:scaleY(.12)}82%{transform:none}}
@keyframes djbFootDot{0%,64%,100%{transform:none}69%{transform:translateY(-55%)}75%{transform:none}}
@keyframes djbFootDee{0%,64%,100%{transform:none}70%{transform:scale(1.12,.9)}77%{transform:scale(.95,1.06)}84%{transform:none}}
@keyframes djbFootLean{0%,64%,100%{transform:none}72%{transform:skewX(-6deg)}84%{transform:none}}
@media (prefers-reduced-motion:reduce){.djb-load{display:none}.djb-foot-logo *{animation:none !important}}
