/* MICHELEBORN JS — motion only */
header .logo,header .playground-label{opacity:0;animation:fadeDown .55s cubic-bezier(.2,.8,.2,1) forwards}header .playground-label{animation-delay:.08s}
.hero-copy h1{opacity:0;transform:translateY(18px);filter:blur(4px);animation:heroTitle .9s cubic-bezier(.16,1,.3,1) .16s forwards}.hero-copy p,.hero-jump{opacity:0;transform:translateY(10px);animation:fadeUp .7s cubic-bezier(.2,.8,.2,1) .48s forwards}.hero-jump{animation-delay:.62s}
.wave-title .wave-letter{transform-origin:center bottom;animation:titleWave 5s ease-in-out infinite;animation-delay:calc(var(--i)*55ms)}
.hero-stack{opacity:0;transform:translateY(18px) scale(.985);animation:stageIn .9s cubic-bezier(.16,1,.3,1) .6s forwards}.hero-cloud{animation:floatMascot 5.5s ease-in-out infinite}.hero-kawaii{animation:floatBooks 6.5s ease-in-out infinite}.hero-path-left::before,.hero-path-left::after,.hero-path-right::before,.hero-path-right::after{animation:nodePulse 2.8s ease-in-out infinite}
.category-switcher{opacity:0;transform:translateY(10px);animation:fadeUp .65s cubic-bezier(.2,.8,.2,1) .8s forwards}.category-tab,.exercise{transition:transform .2s cubic-bezier(.2,.8,.2,1),background .2s ease,color .2s ease,box-shadow .2s ease}.category-tab:hover:not(.active){transform:translateY(-2px)}
.sidebar{opacity:0;transform:translateX(-12px);animation:sidebarIn .7s cubic-bezier(.16,1,.3,1) .9s forwards}.code-panel{opacity:0;transform:translateY(18px) scale(.995);animation:panelIn .8s cubic-bezier(.16,1,.3,1) .94s forwards}.run-button{position:relative;overflow:hidden}.run-button::after{content:"";position:absolute;inset:-2px;background:linear-gradient(110deg,transparent 25%,rgba(255,255,255,.65) 45%,transparent 65%);transform:translateX(-140%);pointer-events:none}.run-button:hover::after{animation:sheen .7s ease}.floating-output{animation:outputIn .7s cubic-bezier(.16,1,.3,1) 1s both}.daisy-one{transform-origin:45% 100%;animation:daisySway 7s ease-in-out infinite}
@keyframes fadeDown{from{opacity:0;transform:translateY(-7px)}to{opacity:1;transform:none}}@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes heroTitle{from{opacity:0;transform:translateY(18px);filter:blur(4px)}to{opacity:1;transform:none;filter:blur(0)}}@keyframes titleWave{0%,4%,18%,100%{transform:none}9%{transform:translateY(-4px) scale(1.075)}}@keyframes stageIn{to{opacity:1;transform:none}}@keyframes floatMascot{0%,100%{transform:rotate(-2deg) translateY(0)}50%{transform:rotate(1deg) translateY(-8px)}}@keyframes floatBooks{0%,100%{transform:rotate(3deg) translateY(0)}50%{transform:rotate(1deg) translateY(-6px)}}@keyframes nodePulse{0%,100%{box-shadow:0 0 0 0 rgba(255,152,178,.2)}50%{box-shadow:0 0 0 7px rgba(255,152,178,.08)}}@keyframes sidebarIn{to{opacity:1;transform:none}}@keyframes panelIn{to{opacity:1;transform:none}}@keyframes sheen{to{transform:translateX(140%)}}@keyframes outputIn{from{opacity:0;transform:translateY(-8px) scale(.98)}to{opacity:1;transform:none}}@keyframes daisySway{0%,100%{transform:rotate(-8deg)}50%{transform:rotate(-5deg)}}
@media(max-width:900px){.hero-stack{animation:none;opacity:1}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;animation-delay:0ms!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}
