:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}code{display:none}@property --spin-angle{syntax: "<angle>"; inherits: false; initial-value: 0deg;}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh;background-image:url(/goat.gif),conic-gradient(from var(--spin-angle),#ff004c,#ff8a00,#2bff00,#00e5ff,#b300ff,#ff004c);background-repeat:no-repeat,no-repeat;background-attachment:fixed,fixed;background-position:center center,center center;background-size:contain,200% 200%;animation:bg-hue 4s linear infinite,bg-spin .6s linear infinite}h1{font-size:6.2em;line-height:1.1;text-shadow:1px 1px 2px black;animation:title-spin 2s linear infinite}@keyframes title-spin{0%{transform:rotate(1turn)}to{transform:rotate(0)}}@keyframes bg-hue{to{filter:hue-rotate(360deg) saturate(1.6)}}@keyframes bg-spin{to{--spin-angle: 360deg}}@media(prefers-reduced-motion:reduce){body{animation:none}}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}html,body{overflow:hidden}#root{max-width:1280px;margin:0 auto;padding:2rem;text-align:center}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media(prefers-reduced-motion:no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.card{padding:2em}.read-the-docs{color:#888}.audio-toggle{position:fixed;right:1rem;bottom:1rem;opacity:.2;transition:opacity .15s}.audio-toggle:hover,.audio-toggle:focus-visible{opacity:1}h1{perspective:900px}.spin-wild{display:inline-block;transform-style:preserve-3d;animation:wild-spin 1.6s cubic-bezier(.68,-.6,.32,1.6) infinite,wild-color 1.2s linear infinite}.shake-wild{display:inline-block;animation:wild-shake .25s steps(2,end) infinite}@keyframes wild-spin{0%{transform:rotate3d(.4,1,.2,0) scale(1) skew(0)}15%{transform:rotate3d(1,.3,.6,220deg) scale(1.5) skew(8deg)}30%{transform:rotate3d(.2,1,1,400deg) scale(.7) skew(-10deg)}50%{transform:rotate3d(1,1,.3,620deg) scale(1.6) skew(6deg)}70%{transform:rotate3d(.5,.2,1,860deg) scale(.8) skew(-6deg)}85%{transform:rotate3d(1,.6,.4,1040deg) scale(1.4) skew(4deg)}to{transform:rotate3d(.4,1,.2,1260deg) scale(1) skew(0)}}@keyframes wild-color{0%{filter:hue-rotate(0deg) saturate(3) drop-shadow(0 0 .6em #ff00cc)}25%{filter:hue-rotate(90deg) saturate(3) drop-shadow(0 0 .6em #00e5ff)}50%{filter:hue-rotate(180deg) saturate(3) drop-shadow(0 0 .6em #ffee00)}75%{filter:hue-rotate(270deg) saturate(3) drop-shadow(0 0 .6em #39ff14)}to{filter:hue-rotate(360deg) saturate(3) drop-shadow(0 0 .6em #ff00cc)}}@keyframes wild-shake{0%{transform:translate(0)}to{transform:translate(3px)}}@media(prefers-reduced-motion:reduce){.spin-wild,.shake-wild{animation:none}}