.page-module__o_PnoG__animationDemo{background:var(--muted);border-radius:.75rem;justify-content:center;align-items:center;height:160px;display:flex;position:relative;overflow:hidden}.page-module__o_PnoG__animationDemoDark{background:#111113;}.page-module__o_PnoG__bounceBall{background:linear-gradient(135deg,var(--primary),#60a5fa);width:50px;height:50px;box-shadow:0 4px 16px oklch(from var(--primary)l c h/.35);border-radius:50%;animation:1s ease-in-out infinite page-module__o_PnoG__bounce}@keyframes page-module__o_PnoG__bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-50px)}}.page-module__o_PnoG__rotateSquare{background:linear-gradient(135deg,var(--secondary),#a78bfa);width:60px;height:60px;box-shadow:0 4px 16px oklch(from var(--secondary)l c h/.35);border-radius:.375rem;animation:2s linear infinite page-module__o_PnoG__rotate}@keyframes page-module__o_PnoG__rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.page-module__o_PnoG__pulseCircle{background:linear-gradient(135deg,#f59e0b,#fbbf24);border-radius:50%;width:80px;height:80px;animation:2s ease-in-out infinite page-module__o_PnoG__pulse;box-shadow:0 4px 16px #f59e0b59;box-shadow:0 4px 16px lab(72.7914% 26.933 75.434/.35)}@keyframes page-module__o_PnoG__pulse{0%{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(1.2)}to{opacity:1;transform:scale(1)}}.page-module__o_PnoG__colorShift{border-radius:.75rem;width:100px;height:100px;animation:4s infinite page-module__o_PnoG__colorShift}@keyframes page-module__o_PnoG__colorShift{0%{background:#3b82f6}25%{background:#8b5cf6}50%{background:#ec4899}75%{background:#f59e0b}to{background:#3b82f6}}.page-module__o_PnoG__timingDemos{flex-direction:column;gap:.625rem;display:flex}.page-module__o_PnoG__timingRow{background:var(--muted);border:1px solid var(--border);border-radius:.625rem;height:2.75rem;position:relative;overflow:hidden}.page-module__o_PnoG__timingLabel{color:var(--muted-foreground);z-index:1;font-size:.75rem;font-weight:600;font-family:var(--font-jetbrains-mono),monospace;position:absolute;top:50%;left:.875rem;transform:translateY(-50%)}.page-module__o_PnoG__timingBox{background:linear-gradient(135deg,var(--primary),var(--secondary));opacity:.85;border-radius:.5rem;width:80px;animation:3s infinite page-module__o_PnoG__timingSlide;position:absolute;top:3px;bottom:3px;left:0}@keyframes page-module__o_PnoG__timingSlide{0%,to{transform:translate(0)}50%{transform:translate(calc(100cqi - 80px))}}.page-module__o_PnoG__timingLinear{animation-timing-function:linear}.page-module__o_PnoG__timingEase{animation-timing-function:ease}.page-module__o_PnoG__timingEaseIn{animation-timing-function:ease-in}.page-module__o_PnoG__timingEaseOut{animation-timing-function:ease-out}.page-module__o_PnoG__timingEaseInOut{animation-timing-function:ease-in-out}.page-module__o_PnoG__timingCubic{background:linear-gradient(135deg,var(--secondary),#c084fc);animation-timing-function:cubic-bezier(.68,-.55,.265,1.55)}.page-module__o_PnoG__directionDemos{grid-template-columns:1fr 1fr;gap:.75rem;display:grid}.page-module__o_PnoG__directionCell{background:var(--muted);border:1px solid var(--border);border-radius:.625rem;justify-content:center;align-items:center;height:70px;display:flex}.page-module__o_PnoG__directionBox{color:#fff;font-size:.8125rem;font-weight:600;font-family:var(--font-jetbrains-mono),monospace;border-radius:.375rem;padding:.5rem 1rem}.page-module__o_PnoG__dirNormal{background:var(--primary);animation:2s ease-in-out infinite page-module__o_PnoG__fadeScale;}.page-module__o_PnoG__dirReverse{background:var(--secondary);animation:2s ease-in-out infinite reverse page-module__o_PnoG__fadeScale;}.page-module__o_PnoG__dirAlternate{background:#f59e0b;animation:2s ease-in-out infinite alternate page-module__o_PnoG__fadeScale;}.page-module__o_PnoG__dirFillBoth{background:#10b981;animation:2s ease-in-out both page-module__o_PnoG__fadeScale;}@keyframes page-module__o_PnoG__fadeScale{0%{opacity:.5;transform:scale(.8)}to{opacity:1;transform:scale(1.1)}}.page-module__o_PnoG__playStateBox{background:linear-gradient(135deg,var(--primary),var(--secondary));color:#fff;cursor:pointer;box-shadow:0 4px 16px oklch(from var(--primary)l c h/.25);border-radius:.75rem;padding:1rem 2rem;font-weight:600;animation:3s ease-in-out infinite page-module__o_PnoG__slideRotate}.page-module__o_PnoG__playStateBox:hover{animation-play-state:paused}@keyframes page-module__o_PnoG__slideRotate{0%,to{transform:translate(-50px)rotate(-5deg)}50%{transform:translate(50px)rotate(5deg)}}.page-module__o_PnoG__loadingSpinner{border:4px solid #fff3;border-top-color:#fff;border-radius:50%;width:50px;height:50px;animation:1s linear infinite page-module__o_PnoG__spin}@keyframes page-module__o_PnoG__spin{to{transform:rotate(360deg)}}.page-module__o_PnoG__typingText{font-family:var(--font-jetbrains-mono),monospace;white-space:nowrap;border-right:3px solid var(--primary);width:0;color:var(--foreground);margin:0;font-size:1.5rem;font-weight:600;animation:3s steps(13,end) infinite page-module__o_PnoG__typing,1s infinite page-module__o_PnoG__blink;overflow:hidden}@keyframes page-module__o_PnoG__typing{0%,90%{width:0}40%,60%{width:13ch}}@keyframes page-module__o_PnoG__blink{50%{border-color:#0000}}.page-module__o_PnoG__floatingContainer{justify-content:space-around;align-items:center;width:100%;height:100%;padding:0 2rem;display:flex;position:relative}.page-module__o_PnoG__floatingElement{font-size:2rem;line-height:1;animation:3s ease-in-out infinite page-module__o_PnoG__float}@keyframes page-module__o_PnoG__float{0%,to{transform:translateY(0)}50%{transform:translateY(-25px)}}.page-module__o_PnoG__morphShape{background:linear-gradient(135deg,var(--primary),var(--secondary));width:80px;height:80px;box-shadow:0 4px 16px oklch(from var(--primary)l c h/.3);animation:4s ease-in-out infinite page-module__o_PnoG__morph}@keyframes page-module__o_PnoG__morph{0%{border-radius:50%;transform:rotate(0)}25%{border-radius:0%;transform:rotate(90deg)}50%{border-radius:50% 0%;transform:rotate(180deg)}75%{border-radius:0% 50%;transform:rotate(270deg)}to{border-radius:50%;transform:rotate(360deg)}}.page-module__o_PnoG__waveContainer{align-items:center;gap:.625rem;display:flex}.page-module__o_PnoG__waveDot{background:linear-gradient(135deg,var(--primary),var(--secondary));border-radius:50%;width:14px;height:14px;animation:1.5s ease-in-out infinite page-module__o_PnoG__wave}@keyframes page-module__o_PnoG__wave{0%,60%,to{transform:translateY(0)}30%{transform:translateY(-18px)}}.page-module__o_PnoG__glitchText{text-transform:uppercase;color:#fff;letter-spacing:.1em;font-size:3rem;font-weight:800;font-family:var(--font-jetbrains-mono),monospace;animation:.5s infinite page-module__o_PnoG__glitch;position:relative}.page-module__o_PnoG__glitchText:before,.page-module__o_PnoG__glitchText:after{content:attr(data-text);width:100%;height:100%;position:absolute;top:0;left:0}.page-module__o_PnoG__glitchText:before{color:#f0f;z-index:-1;animation:.5s infinite page-module__o_PnoG__glitch1}.page-module__o_PnoG__glitchText:after{color:#0ff;z-index:-2;animation:.5s infinite page-module__o_PnoG__glitch2}@keyframes page-module__o_PnoG__glitch{0%,to{text-shadow:2px 2px #f0f,-2px -2px #0ff}25%{text-shadow:-2px 2px #f0f,2px -2px #0ff}50%{text-shadow:2px -2px #f0f,-2px 2px #0ff}}@keyframes page-module__o_PnoG__glitch1{0%,to{clip-path:polygon(0 0,100% 0,100% 35%,0 35%);transform:translate(2px,-2px)}25%{clip-path:polygon(0 65%,100% 65%,100% 100%,0 100%);transform:translate(-2px,2px)}}@keyframes page-module__o_PnoG__glitch2{0%,to{clip-path:polygon(0 65%,100% 65%,100% 100%,0 100%);transform:translate(-2px,2px)}25%{clip-path:polygon(0 0,100% 0,100% 35%,0 35%);transform:translate(2px,-2px)}}.page-module__o_PnoG__flipCard{perspective:1000px;cursor:pointer;width:220px;height:160px}.page-module__o_PnoG__flipCardInner{text-align:center;width:100%;height:100%;transform-style:preserve-3d;transition:transform .6s;position:relative}.page-module__o_PnoG__flipCard:hover .page-module__o_PnoG__flipCardInner{transform:rotateY(180deg)}.page-module__o_PnoG__flipCardFront,.page-module__o_PnoG__flipCardBack{backface-visibility:hidden;border-radius:.75rem;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;padding:1.25rem;display:flex;position:absolute}.page-module__o_PnoG__flipCardFront{background:linear-gradient(135deg,var(--primary),#3b82f6);color:#fff}.page-module__o_PnoG__flipCardBack{background:linear-gradient(135deg,var(--secondary),#a78bfa);color:#fff;transform:rotateY(180deg)}.page-module__o_PnoG__flipCard h4{margin:0 0 .5rem;font-size:1.25rem;font-weight:700}.page-module__o_PnoG__flipCard p{opacity:.9;margin:0;font-size:.875rem}.page-module__o_PnoG__propertyList{background:oklch(from var(--muted)l c h/.5);border-radius:var(--radius);color:var(--foreground);margin-top:1rem;padding:1.25rem;font-size:.9375rem;line-height:1.7}.page-module__o_PnoG__propertyList h4{margin:0 0 .5rem;font-size:1rem;font-weight:700}.page-module__o_PnoG__propertyList ul{margin:0;padding-left:1.25rem;list-style:outside}.page-module__o_PnoG__propertyList li{margin-bottom:.25rem}.page-module__o_PnoG__propertyList code{font-family:var(--font-jetbrains-mono),monospace;background:var(--muted);border-radius:4px;padding:.125rem .375rem;font-size:.8125rem}.page-module__o_PnoG__tipBox{background:oklch(from var(--primary)l c h/.06);border-left:3px solid var(--primary);border-radius:0 var(--radius)var(--radius)0;padding:1.25rem 1.5rem}.page-module__o_PnoG__tipBox h4{color:var(--foreground);margin:0 0 .75rem;font-size:1rem;font-weight:700}.page-module__o_PnoG__tipBox p{color:var(--foreground);margin:.5rem 0 0;font-size:.9375rem;line-height:1.6}.page-module__o_PnoG__tipBox p:first-of-type{margin-top:0}.page-module__o_PnoG__inlineLink{color:var(--primary);text-underline-offset:3px;text-decoration:underline;transition:opacity .15s}.page-module__o_PnoG__inlineLink:hover{opacity:.8}.page-module__o_PnoG__nextGrid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem;max-width:700px;display:grid}.page-module__o_PnoG__nextLink{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);color:inherit;align-items:center;gap:1rem;padding:1.5rem;text-decoration:none;transition:border-color .3s,transform .3s cubic-bezier(.34,1.56,.64,1),box-shadow .3s;display:flex;position:relative;overflow:hidden}.page-module__o_PnoG__nextLink:before{content:"";background:linear-gradient(to bottom,var(--primary),#4ea4ca);opacity:0;width:3px;transition:opacity .3s;position:absolute;top:0;bottom:0;left:0}@supports (color:lab(0% 0 0)){.page-module__o_PnoG__nextLink:before{background:linear-gradient(to bottom,var(--primary),lab(63.1292% -18.1274 -28.0657))}}.page-module__o_PnoG__nextLink:hover{border-color:var(--primary);transform:translateY(-3px);box-shadow:0 12px 28px #357a3a1f,0 4px 10px #0000000f;box-shadow:0 12px 28px lab(45.7706% -33.6758 28.0119/.12),0 4px 10px lab(0% 0 0/.06)}.page-module__o_PnoG__nextLink:hover:before{opacity:1}.page-module__o_PnoG__nextIcon{font-size:2rem;font-family:var(--font-jetbrains-mono),monospace;color:var(--primary);flex-shrink:0}.page-module__o_PnoG__nextLink h3{color:var(--foreground);margin-bottom:.25rem;font-size:1.125rem;font-weight:600}.page-module__o_PnoG__nextLink p{color:var(--muted-foreground);margin:0;font-size:.8125rem}.page-module__o_PnoG__timelineContainer{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:1.5rem}.page-module__o_PnoG__timelinePresets{flex-wrap:wrap;gap:.5rem;margin-bottom:.75rem;display:flex}.page-module__o_PnoG__timelinePresetBtn{border:1px solid var(--border);border-radius:var(--radius);background:var(--muted);color:var(--muted-foreground);cursor:pointer;padding:.5rem 1rem;font-size:.8125rem;font-weight:600;transition:background .2s,color .2s,border-color .2s}.page-module__o_PnoG__timelinePresetBtn:hover{border-color:var(--primary);color:var(--foreground)}.page-module__o_PnoG__timelinePresetBtnActive{background:var(--primary);color:#fff;border-color:var(--primary)}.page-module__o_PnoG__timelineDescription{color:var(--muted-foreground);margin:0 0 1rem;font-size:.875rem;line-height:1.5}.page-module__o_PnoG__timelinePreview{background:var(--muted);border-radius:.75rem;justify-content:center;align-items:center;height:180px;margin-bottom:1rem;display:flex;overflow:hidden}.page-module__o_PnoG__timelineElement{background:linear-gradient(135deg,var(--primary),var(--secondary));width:70px;height:70px;box-shadow:0 4px 16px oklch(from var(--primary)l c h/.3);border-radius:.75rem}.page-module__o_PnoG__timelineBar{background:var(--muted);border-radius:4px;height:8px;margin-bottom:1rem;position:relative;overflow:visible}.page-module__o_PnoG__timelineProgress{background:linear-gradient(90deg,var(--primary),var(--secondary));border-radius:4px;transition:none;position:absolute;top:0;bottom:0;left:0}.page-module__o_PnoG__timelineKeyframeDots{position:absolute;inset:0}.page-module__o_PnoG__timelineKeyframeDot{background:var(--foreground);opacity:.3;border-radius:50%;width:6px;height:6px;position:absolute;top:50%;transform:translate(-50%,-50%)}.page-module__o_PnoG__timelineControls{flex-wrap:wrap;align-items:center;gap:1.25rem;margin-bottom:1rem;display:flex}.page-module__o_PnoG__timelinePlayBtn{background:linear-gradient(135deg,var(--primary),var(--secondary));color:#fff;border-radius:var(--radius);cursor:pointer;box-shadow:0 2px 8px oklch(from var(--primary)l c h/.25);white-space:nowrap;border:none;padding:.5rem 1.25rem;font-size:.8125rem;font-weight:600;transition:transform .2s,box-shadow .2s}.page-module__o_PnoG__timelinePlayBtn:hover{box-shadow:0 4px 12px oklch(from var(--primary)l c h/.35);transform:translateY(-1px)}.page-module__o_PnoG__timelineControlGroup{align-items:center;gap:.5rem;display:flex}.page-module__o_PnoG__timelineControlLabel{color:var(--muted-foreground);white-space:nowrap;font-size:.75rem;font-weight:600}.page-module__o_PnoG__timelineSlider{appearance:none;background:var(--muted);cursor:pointer;border-radius:2px;outline:none;width:100px;height:4px}.page-module__o_PnoG__timelineSlider::-webkit-slider-thumb{appearance:none;background:var(--primary);cursor:pointer;border-radius:50%;width:14px;height:14px}.page-module__o_PnoG__timelineSlider::-moz-range-thumb{background:var(--primary);cursor:pointer;border:none;border-radius:50%;width:14px;height:14px}.page-module__o_PnoG__timelineControlValue{font-family:var(--font-jetbrains-mono),monospace;color:var(--foreground);background:var(--muted);text-align:center;border-radius:.25rem;min-width:3rem;padding:.125rem .375rem;font-size:.75rem}.page-module__o_PnoG__timelineSelect{border:1px solid var(--border);border-radius:var(--radius);background:var(--card);color:var(--foreground);font-size:.75rem;font-family:var(--font-jetbrains-mono),monospace;cursor:pointer;padding:.3rem .5rem}.page-module__o_PnoG__timelineCode{color:#cdd6f4;font-family:var(--font-jetbrains-mono),monospace;background:#1e1e2e;border-radius:.75rem;margin:0;padding:1rem 1.25rem;font-size:.8125rem;line-height:1.7;overflow-x:auto}.page-module__o_PnoG__demoHint{text-align:center;color:var(--muted-foreground);margin:.75rem 0 0;font-size:.8125rem;font-style:italic}@media (max-width:768px){.page-module__o_PnoG__directionDemos{grid-template-columns:1fr}.page-module__o_PnoG__glitchText{font-size:2rem}.page-module__o_PnoG__flipCard{width:180px;height:140px}.page-module__o_PnoG__timelineControls{gap:.75rem}.page-module__o_PnoG__timelineSlider{width:80px}.page-module__o_PnoG__nextGrid{grid-template-columns:1fr}}@media (max-width:480px){.page-module__o_PnoG__timingDemos{font-size:.625rem}.page-module__o_PnoG__typingText{font-size:1.125rem}.page-module__o_PnoG__glitchText{letter-spacing:.05em;font-size:1.5rem}}@media (prefers-reduced-motion:reduce){.page-module__o_PnoG__bounceBall,.page-module__o_PnoG__rotateSquare,.page-module__o_PnoG__pulseCircle,.page-module__o_PnoG__colorShift,.page-module__o_PnoG__timingBox,.page-module__o_PnoG__dirNormal,.page-module__o_PnoG__dirReverse,.page-module__o_PnoG__dirAlternate,.page-module__o_PnoG__dirFillBoth,.page-module__o_PnoG__playStateBox,.page-module__o_PnoG__loadingSpinner,.page-module__o_PnoG__typingText,.page-module__o_PnoG__floatingElement,.page-module__o_PnoG__morphShape,.page-module__o_PnoG__waveDot,.page-module__o_PnoG__glitchText,.page-module__o_PnoG__glitchText:before,.page-module__o_PnoG__glitchText:after,.page-module__o_PnoG__flipCardInner,.page-module__o_PnoG__nextLink{transition:none!important;animation:none!important}}