#root{max-width:1280px;padding:2rem;text-align:center}body{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}input[type=text]{height:30px;background-color:#f7f7f7;border-radius:4px;font-size:20px;padding-inline:8px;color:#333;transition:all .2s linear}input[type=text]:focus{border-width:2px;border-style:solid;border-color:#338ad1;outline:0}button.danger{background-color:#980909}button.success{background-color:#0e6c18}button.warning{background-color:#ae650c}button{font-weight:700!important}button:hover{box-shadow:0 2px 5px #90ee90}button:focus{box-shadow:0 2px 5px #f08080}button:active{box-shadow:0 2px 5px #fff}.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}.branding{position:fixed;height:64px;width:max-content;padding:8px;top:2px;right:16px;display:flex;align-items:center;gap:6px}.branding .yt,.branding .it{display:flex;align-items:center;gap:6px;letter-spacing:.8px}.branding a{color:#f7f7f7;font-size:12px}.circle-comp{height:200px;width:200px;background-color:red;border-radius:50%;position:absolute;transform:translate(-100px,-100px) scale(0);animation:animation .3s ease-in forwards}@keyframes animation{to{transform:translate(-100px,-100px) scale(1)}}