:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color:#ffffffde;background-color:#121213;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:.25rem;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;color:#1a1a1a;background-color:transparent;cursor:pointer;transition:border-color .25s;outline:none}button:hover,button:focus{color:#eaeaea}#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.solid:hover{filter:drop-shadow(0 0 2em #61dafbaa)}.card{padding:2em}.read-the-docs{color:#888}.letterbox{aspect-ratio:1/1;height:3.5rem;border:2px rgb(58,58,60) solid;display:grid}.letterbox.entered{border-color:#565758}.letterbox.okYes{border-color:transparent;background-color:#538d4e}.letterbox.okClose{border-color:transparent;background-color:#b59f3b}.letterbox.okNo{border-color:transparent;background-color:#3a3a3c}.letter{-webkit-user-select:none;user-select:none;color:#fff;place-self:center;font-size:1.75rem;font-weight:800}.letterbox.shake{animation:.2s shake 0ms 1}.letterbox.flip{animation:1.2s flip 0ms 1;animation-iteration-count:1}.letterbox.flip>.letter{animation:1.2s flip 0ms 1;animation-iteration-count:1}@keyframes shake{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}@keyframes flip{0%{transform:scaleY(1);background-color:#121213;border-color:#565758}25%{background-color:#121213;border-color:#565758;transform:scaleY(0)}50%{background-color:#121213;border-color:#565758;transform:scaleY(-1)}25%{transform:scaleY(0)}to{transform:scaleY(1)}}.letter-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:.3rem}.key{-webkit-user-select:none;user-select:none;display:grid;height:2.5rem;font-size:1.3rem;font-weight:600;background-color:#818384;color:#f7f7f7;border-radius:.25rem;height:3.5rem}.key.okYes{background-color:#538d4e}.key.okNo{background-color:#3a3a3c}.keyLabel{place-self:center}.key.wide>.keyLabel{font-size:.8rem}.keyboard{display:grid;grid-template-columns:repeat(22,1rem);grid-template-rows:repeat(3,1fr);row-gap:.5rem;column-gap:.4rem}.keyboard>.key{grid-column:span 2}.keyboard>.key.wide,.keyboard>.key.wideicon{grid-column:span 3}