:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;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}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}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}}#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}.analog-clock{width:300px;height:300px;border:10px solid #333;border-radius:50%;position:relative;margin:2rem auto;background:#fff}.hand{position:absolute;bottom:50%;left:50%;transform-origin:bottom;background:#000;border-radius:4px}.hour-hand{width:4px;height:25%;background:#333}.minute-hand{width:3px;height:35%;background:#666}.second-hand{width:2px;height:40%;background:red}.center-dot{position:absolute;width:12px;height:12px;border-radius:50%;background:#000;top:50%;left:50%;transform:translate(-50%,-50%)}.hour-marks{position:absolute;width:100%;height:100%}.hour-marks div{position:absolute;width:2px;height:12px;background:#333;left:50%;transform-origin:50% 150px}.rotate-0{transform:rotate(0)}.rotate-6{transform:rotate(6deg)}.rotate-12{transform:rotate(12deg)}.rotate-18{transform:rotate(18deg)}.rotate-24{transform:rotate(24deg)}.rotate-30{transform:rotate(30deg)}.rotate-36{transform:rotate(36deg)}.rotate-42{transform:rotate(42deg)}.rotate-48{transform:rotate(48deg)}.rotate-54{transform:rotate(54deg)}.rotate-60{transform:rotate(60deg)}.rotate-66{transform:rotate(66deg)}.rotate-72{transform:rotate(72deg)}.rotate-78{transform:rotate(78deg)}.rotate-84{transform:rotate(84deg)}.rotate-90{transform:rotate(90deg)}.rotate-96{transform:rotate(96deg)}.rotate-102{transform:rotate(102deg)}.rotate-108{transform:rotate(108deg)}.rotate-114{transform:rotate(114deg)}.rotate-120{transform:rotate(120deg)}.rotate-126{transform:rotate(126deg)}.rotate-132{transform:rotate(132deg)}.rotate-138{transform:rotate(138deg)}.rotate-144{transform:rotate(144deg)}.rotate-150{transform:rotate(150deg)}.rotate-156{transform:rotate(156deg)}.rotate-162{transform:rotate(162deg)}.rotate-168{transform:rotate(168deg)}.rotate-174{transform:rotate(174deg)}.rotate-180{transform:rotate(180deg)}.rotate-186{transform:rotate(186deg)}.rotate-192{transform:rotate(192deg)}.rotate-198{transform:rotate(198deg)}.rotate-204{transform:rotate(204deg)}.rotate-210{transform:rotate(210deg)}.rotate-216{transform:rotate(216deg)}.rotate-222{transform:rotate(222deg)}.rotate-228{transform:rotate(228deg)}.rotate-234{transform:rotate(234deg)}.rotate-240{transform:rotate(240deg)}.rotate-246{transform:rotate(246deg)}.rotate-252{transform:rotate(252deg)}.rotate-258{transform:rotate(258deg)}.rotate-264{transform:rotate(264deg)}.rotate-270{transform:rotate(270deg)}.rotate-276{transform:rotate(276deg)}.rotate-282{transform:rotate(282deg)}.rotate-288{transform:rotate(288deg)}.rotate-294{transform:rotate(294deg)}.rotate-300{transform:rotate(300deg)}.rotate-306{transform:rotate(306deg)}.rotate-312{transform:rotate(312deg)}.rotate-318{transform:rotate(318deg)}.rotate-324{transform:rotate(324deg)}.rotate-330{transform:rotate(330deg)}.rotate-336{transform:rotate(336deg)}.rotate-342{transform:rotate(342deg)}.rotate-348{transform:rotate(348deg)}.rotate-354{transform:rotate(354deg)}