*,*:before,*:after{box-sizing:border-box;-webkit-user-select:none;user-select:none}a,button{cursor:revert}#root{display:contents}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;padding:0;min-width:320px;min-height:100vh;height:100%;display:flex;align-items:center;justify-content:center;font-family:Helvetica Neue,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,-apple-system,BlinkMacSystemFont,sans-serif;font-size:24px;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:var(--gray-900);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1{font-size:3.2em;line-height:1.1}#app{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 rgba(100,108,255,.6666666667))}.logo.vanilla:hover{filter:drop-shadow(0 0 2em rgba(49,120,198,.6666666667))}.card{padding:2em}.read-the-docs{color:#888}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{--gray-50: #f1f1f1;--gray-300: #ccc;--gray-400: #aaa;--gray-500: #999;--gray-600: #666;--gray-700: #444;--gray-800: #333;--gray-900: #222;--yellow: #d4aa00;--green: #28a745}button{font:inherit;cursor:pointer}html{height:100%}a{color:var(--gray-50)}.notify{position:fixed;z-index:100;background:#fff;padding:.5rem;border-radius:.25rem;color:var(--gray-700);top:3rem;opacity:0;left:50%;transform:translate(-50%);font-weight:700;transition:all .2s}.notify:empty{display:none}.app{width:100%;max-width:600px;margin:0 auto;padding:0;height:100%;overflow:hidden;max-width:412px;display:flex;flex-direction:column;justify-content:space-between}.app h1{text-align:center;font-size:2rem;margin:.5rem 0 .25rem;color:var(--gray-400)}.app h1 span{color:#fff;display:inline-block;transition:all 3s;transform:scale(1) translateY(0)}.app.loading h1 span{transition:none;animation:loader 2s ease-in-out infinite}@keyframes loader{0%{transform:scale(1) translateY(0)}10%{transform:scale(1.1,.9) translateY(0)}30%{transform:scale(.9,1.1) translateY(-1rem)}50%{transform:scale(1.05,.95) translateY(0)}57%{transform:scale(1) translateY(-.07rem)}64%{transform:scale(1) translateY(0)}to{transform:scale(1) translateY(0)}}.app main{display:contents}.app .overlay{z-index:1000;position:fixed;top:0;right:0;bottom:0;left:0;background:#000c;display:flex;align-items:flex-start;justify-content:center;padding:4rem 1rem}.app .overlay:empty{display:none}.app .overlay .modal{max-height:100%;overflow:hidden;width:500px;background-color:var(--gray-800);border-radius:.25rem;display:flex;flex-direction:column}.app .overlay .modal .body{padding:1rem 1rem 0;color:var(--gray-300);overflow:auto;overflow-x:hidden;word-break:break-word;font-size:18px}.app .overlay .modal .body h2{color:#fff;text-shadow:0 1px 0 rgba(255,255,255,.4)}.app .overlay .modal .body .subtitle{font-size:1.1rem;opacity:.9}.app .overlay .modal .body .success,.app .overlay .modal .body .fail{text-align:center}.app .overlay .modal .body h3{font-size:3rem;margin:0}.app .overlay .modal .body ul{list-style:none;margin:0;padding:0}.app .overlay .modal .body ol{margin:0;padding:0 0 0 2rem}.app .overlay .modal .body .part-of-speech span{background-color:var(--gray-600);padding:.25rem;display:inline-block}.app .overlay .modal .body .example{font-style:italic}.app .overlay .modal .footer{padding:1rem 2rem 2rem;height:5rem;text-align:center}.app .overlay .modal button{padding:.5em .75em;font-weight:700;font-size:1.3rem;background:var(--gray-600);border:none;border-radius:.25rem;color:#fff;text-shadow:0 1px 0 rgba(255,255,255,.4)}.app .attempts{display:flex;flex-direction:column;text-transform:uppercase;margin:0 1rem}.app .attempts .attempt{display:flex;flex-direction:row;margin:0}.app .attempts .attempt .char{display:flex;position:relative;width:20%;margin:.25rem;text-transform:uppercase;font-weight:700;font-size:2.5rem;transition:transform .17675s;text-decoration:none;transform-style:preserve-3d;transition:.707s transform}.app .attempts .attempt .char:before{content:"";display:block;padding-top:100%}.app .attempts .attempt .char:active{transform:scale(.975)}.app .attempts .attempt .char .front,.app .attempts .attempt .char .back{content:"";backface-visibility:hidden;position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center}.app .attempts .attempt .char .front{border:solid 2px var(--gray-600)}.app .attempts .attempt .char .back{border:none;background-color:var(--gray-600);transform:rotateX(-180deg)}.app .attempts .attempt .char.yellow .back{background-color:var(--yellow);color:#fff}.app .attempts .attempt .char.green .back{background-color:var(--green);color:#fff}.app .attempts .attempt .char.flip{transform:rotateX(-180deg)}.app .keyboard{display:flex;flex-direction:column;max-width:500px;margin:.25rem auto 0;width:100%}.app .keyboard>div{display:flex;flex-direction:row;margin:2px 8px}.app .keyboard>div:nth-child(2){margin:0 23px}.app .keyboard>div button{cursor:pointer;text-transform:uppercase;padding:0;height:3rem;flex-grow:1;flex-shrink:1;flex-basis:0px;overflow:hidden;font-weight:700;font-size:1.2rem;margin:.35rem 3px;background-color:var(--gray-600);color:#fff;border:none;border-radius:.25rem;transition:all .2s}.app .keyboard>div button[data-key=enter]{font-size:.9rem;flex-basis:20px}.app .keyboard>div button[data-key=backspace]{flex-basis:20px}.app .keyboard>div button:first-child{margin-left:0}.app .keyboard>div button:last-child{margin-right:0}.app .keyboard>div button[disabled],.app .keyboard>div button:disabled{opacity:.5;pointer-events:none}.app .keyboard>div button:active{background-color:var(--gray-700)}.app .keyboard>div button svg{fill:#fff;width:1.5rem;pointer-events:none}.app .keyboard>div button.lg{width:14%}.app .keyboard>div button.yellow{background-color:var(--yellow);color:#fff}.app .keyboard>div button.green{background-color:var(--green);color:#fff}.app .keyboard>div button.none{background-color:var(--gray-800)}.horizontal-shake{animation:horizontal-shaking .35s infinite}@keyframes horizontal-shaking{0%{transform:translate(0)}25%{transform:translate(5px)}50%{transform:translate(-5px)}75%{transform:translate(5px)}to{transform:translate(0)}}footer{margin:.5rem 1rem;display:flex;flex-direction:row;justify-content:space-between;align-items:center;opacity:.5}footer .version{opacity:.8;font-size:80%}footer>div{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:.25rem}footer svg{fill:var(--gray-400);height:1rem;margin:0 .125rem;vertical-align:text-top}.landscape-only{height:100%;flex-direction:column;justify-content:center;justify-items:center;text-align:center;color:var(--gray-500);display:none}.landscape-only h1{margin:0}.landscape-only h1 span{color:#fff;display:inline-block;transition:all 3s;transform:scale(1) translateY(0)}.landscape-only p{margin:1rem 0 1.5rem}.landscape-only svg{fill:var(--gray-500);width:5rem;margin:0 auto}@media (orientation: landscape) and (hover: none) and (pointer: coarse){.app{display:none!important}.landscape-only{display:flex}}