/* WOW layer (Oct 19): 10 surprises. Own file, prefix .w- / #w- . transform/opacity only. */
#w-prog{position:fixed;left:0;top:0;height:2px;width:100%;z-index:9060;pointer-events:none;opacity:0;transition:opacity .3s}
#w-prog.on{opacity:1}
#w-prog .w-bar{position:absolute;inset:0;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,#FF4FA3,#FFD600,#00D68F,#3D7BFF,#7A5CFF);opacity:.8;will-change:transform}
#w-prog .w-bal{position:absolute;left:0;top:5px;font-size:15px;line-height:1;will-change:transform;transform:translate(-50%,0)}
#w-prog .w-bal i{display:block;font-style:normal;animation:wbob 1.6s ease-in-out infinite}
@keyframes wbob{50%{transform:translateY(2px) rotate(-8deg)}}

/* 2 typing line */
.w-type{font-size:14px;font-weight:600;color:#555;margin:-28px 0 28px;min-height:20px;letter-spacing:-.2px;opacity:0;animation:win .5s 1.9s forwards}
.w-type b{font-weight:800;background:linear-gradient(90deg,#FF4FA3,#7A5CFF,#3D7BFF);-webkit-background-clip:text;background-clip:text;color:transparent}
.w-type .w-car{display:inline-block;width:1.5px;height:1em;background:#999;margin-left:2px;vertical-align:-2px;animation:wblink .9s steps(1) infinite}
@keyframes wblink{50%{opacity:0}}
@keyframes win{to{opacity:1}}
/* 7 greeting chip */
.w-greet{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;color:#444;background:#fff;border:1px solid #ececec;border-radius:999px;padding:5px 11px;opacity:0;transform:translateY(-8px);animation:wgin .6s .6s cubic-bezier(.2,1.5,.4,1) forwards;white-space:nowrap;max-width:calc(100vw - 40px);overflow:hidden;text-overflow:ellipsis}
.w-greet i{font-style:normal;display:inline-block;animation:wbob 2.4s ease-in-out infinite}
@keyframes wgin{to{opacity:1;transform:none}}

/* 3 sparkles */
.w-spk{position:fixed;left:0;top:0;width:5px;height:5px;margin:-2.5px 0 0 -2.5px;pointer-events:none;z-index:9097;border-radius:2px;animation:wspk .45s cubic-bezier(.15,.7,.35,1) forwards;will-change:transform,opacity}
.w-spk.st{clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%);width:8px;height:8px;margin:-4px 0 0 -4px;border-radius:0}
@keyframes wspk{0%{transform:translate(var(--x0),var(--y0)) scale(.3) rotate(0);opacity:1}70%{opacity:1}100%{transform:translate(var(--x1),var(--y1)) scale(1) rotate(var(--r));opacity:0}}

/* 4 confetti canvas + toast */
#w-cf{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:9090}
.w-toast{position:fixed;left:50%;top:calc(14px + env(safe-area-inset-top));z-index:9095;transform:translate(-50%,-30px) scale(.8);opacity:0;background:#000;color:#fff;font:800 14px/1.2 -apple-system,Helvetica,Arial,sans-serif;padding:11px 16px;border-radius:999px;box-shadow:0 10px 30px rgba(0,0,0,.25);transition:transform .45s cubic-bezier(.2,1.6,.4,1),opacity .3s;white-space:nowrap;max-width:calc(100vw - 30px);overflow:hidden;text-overflow:ellipsis;pointer-events:none}
.w-toast.on{transform:translate(-50%,0) scale(1);opacity:1}
.w-toast.btn{pointer-events:auto;cursor:pointer}

/* 5 tilt */
.hcards,.cards,.tiles{perspective:800px}
.w-tilt .w-gloss{position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .35s;background:radial-gradient(circle at var(--gx,50%) var(--gy,50%),rgba(255,79,163,.16),rgba(255,255,255,0) 60%);background:radial-gradient(circle at var(--gx,50%) var(--gy,50%),color-mix(in srgb,var(--c,#FF4FA3) 20%,transparent),rgba(255,255,255,0) 60%);z-index:1}
.w-tilt.w-on .w-gloss{opacity:1}

/* 6 party */
#w-party{position:fixed;inset:0;z-index:9040;pointer-events:none;opacity:0;transition:opacity .4s}
#w-party.on{opacity:1}
#w-party .w-fl{position:absolute;inset:0;opacity:0;animation:wfl 1.2s steps(1) infinite}
#w-party .w-fl:nth-child(1){background:rgba(255,79,163,.22);animation-delay:0s}
#w-party .w-fl:nth-child(2){background:rgba(255,214,0,.24);animation-delay:-.3s}
#w-party .w-fl:nth-child(3){background:rgba(61,123,255,.22);animation-delay:-.6s}
#w-party .w-fl:nth-child(4){background:rgba(0,214,143,.22);animation-delay:-.9s}
@keyframes wfl{0%{opacity:1}25%,100%{opacity:0}}
#w-party .w-beam{position:absolute;left:50%;top:-20vh;width:30vw;height:140vh;margin-left:-15vw;transform-origin:50% 0;background:linear-gradient(rgba(255,255,255,.55),rgba(255,255,255,0));opacity:.55;animation:wbeam 1.6s ease-in-out infinite alternate}
#w-party .w-beam.b2{animation-delay:-.8s;animation-direction:alternate-reverse}
@keyframes wbeam{from{transform:rotate(-35deg)}to{transform:rotate(35deg)}}
#w-ball{position:fixed;left:50%;top:0;z-index:9045;pointer-events:none;transform:translate(-50%,-140px);transition:transform .8s cubic-bezier(.2,1.5,.4,1);text-align:center}
#w-ball.on{transform:translate(-50%,0)}
#w-ball .w-str{width:2px;height:96px;background:#222;margin:0 auto}
#w-ball .w-db{font-size:64px;line-height:1;display:block;animation:wspin 1.1s linear infinite}
@keyframes wspin{0%{transform:scaleX(1)}25%{transform:scaleX(.55)}50%{transform:scaleX(-1)}75%{transform:scaleX(-.55)}100%{transform:scaleX(1)}}
html.w-party .emx,html.w-party .m .e,html.w-party .hcard .he,html.w-party .tile .te,html.w-party nav.nt5 a i{animation:wdance .42s ease-in-out infinite alternate!important}
html.w-party .hcard:nth-child(2n) .he,html.w-party .emx:nth-child(2n){animation-delay:-.21s!important}
@keyframes wdance{0%{translate:0 0;rotate:-16deg;scale:1}100%{translate:0 -.3em;rotate:16deg;scale:1.25}}
html.w-party .nt-wrap{animation:wlogo .42s ease-in-out infinite alternate!important}
@keyframes wlogo{0%{rotate:-3deg}100%{rotate:3deg}}

/* 8 end of page */
#w-end{position:fixed;left:50%;bottom:calc(70px + env(safe-area-inset-bottom));z-index:9070;transform:translate(-50%,30px) scale(.9);opacity:0;transition:transform .5s cubic-bezier(.2,1.4,.4,1),opacity .3s;display:flex;align-items:center;gap:8px;background:#fff;border:1px solid #e3e3e3;border-radius:999px;padding:6px 6px 6px 14px;box-shadow:0 8px 24px rgba(0,0,0,.12);font:700 13px/1.2 -apple-system,Helvetica,Arial,sans-serif;color:#000;white-space:nowrap;max-width:calc(100vw - 24px);box-sizing:border-box;pointer-events:none}
#w-end.on{transform:translate(-50%,0) scale(1);opacity:1;pointer-events:auto}
#w-end a{background:#000;color:#fff!important;text-decoration:none!important;border-radius:999px;padding:7px 11px;font-weight:800;border:0!important}
#w-end .w-x{border:0;background:none;font-size:15px;color:#888;padding:4px 6px;cursor:pointer}
#w-end .w-up{position:absolute;left:50%;top:0;font-size:26px;line-height:1;transform:translate(-50%,0);opacity:0;pointer-events:none}
#w-end.on .w-up{animation:wup 2.6s cubic-bezier(.3,.6,.4,1) .1s forwards}
@keyframes wup{0%{transform:translate(-50%,10px) scale(.4);opacity:0}15%{opacity:1}60%{transform:translate(-30%,-90px) rotate(8deg) scale(1)}100%{transform:translate(-55%,-170px) rotate(-6deg) scale(1);opacity:0}}
html.night #w-end{background:#000;color:#fff;border-color:#555}
html.night #w-end a{background:#fff;color:#000!important}

/* 9 wipe */
#w-wipe{position:fixed;left:0;top:0;width:40px;height:40px;margin:-20px 0 0 -20px;border-radius:50%;z-index:2147483000;pointer-events:none;transform:translate(var(--wx),var(--wy)) scale(0);background:conic-gradient(#FF4FA3,#FFD600,#00D68F,#3D7BFF,#7A5CFF,#FF4FA3);animation:wwipe .24s cubic-bezier(.5,0,.75,0) forwards}
#w-wipe span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:20px}
@keyframes wwipe{to{transform:translate(var(--wx),var(--wy)) scale(var(--ws))}}

/* 10 magnetic */
.w-mag{transition:transform .35s cubic-bezier(.2,1.6,.4,1)!important;will-change:transform}
.w-mag.w-sq{transition:transform .1s ease-out!important}

@media (prefers-reduced-motion:reduce){
 #w-prog .w-bal i,.w-greet i,.w-type .w-car{animation:none}
 .w-type,.w-greet{animation:win .01s forwards}
 #w-party,#w-ball,.w-spk,#w-wipe{display:none!important}
 html.w-party *{animation-play-state:paused!important}
 #w-end .w-up{display:none}
}

/* 11 (Benzion 8:28): desktop — hovering any emoji pops it. Mouse only. */
@media (hover:hover) and (pointer:fine){
 html .emx:hover,html .hcard .he:hover,html .tile .te:hover,html .mfe:hover,html .soon .emo:hover,html .floaters .emo:hover,html .ebob:hover,html .m .e:hover,html nav.nt5 a i:hover,html .dmcard .dmem:hover,html .tdshabgrid .e:hover,html .tdwxnow .e:hover,html .w-emo:hover{animation:whov .55s cubic-bezier(.3,1.7,.5,1) both!important;display:inline-block;cursor:default;position:relative;z-index:6}
 html .rwrap .emx:hover,html #rgrid .emx:hover,html .nt-bal .emx:hover{animation:none!important}
 .w-emo{display:inline-block}
}
@keyframes whov{0%{scale:1;rotate:0deg}35%{scale:1.38;rotate:-12deg}60%{scale:1.3;rotate:9deg}80%{scale:1.36;rotate:-4deg}100%{scale:1.35;rotate:0deg}}
@media (prefers-reduced-motion:reduce){html .emx:hover,html .w-emo:hover{animation:none!important}}

/* 8:35 spacing pass: more air on landing */
.w-greet{margin-bottom:22px!important}
body .wrap #h{margin-bottom:30px}
body .wrap .row{row-gap:22px}
body .wrap .dmrow{margin-top:34px}
.w-type{margin-top:26px!important;font-size:14px!important;opacity:.75}

.w-type.w-nearlogo{position:fixed;top:calc(60px + env(safe-area-inset-top));left:20px;margin:0!important;font-size:12.5px!important;text-align:left;z-index:4;opacity:.8}

/* 9:00 calmer landing */
.w-greet{margin-bottom:34px!important}
body .wrap #h{margin-bottom:42px}
body .wrap .row{row-gap:30px}
body .wrap .dmrow{margin-top:50px}
