:root{--ease-out-cubic: cubic-bezier(.33, 1, .67, 1)}*{box-sizing:border-box;font-family:inherit;margin:0}html,body{width:100%;height:100%}body{font-family:Inter,sans-serif;touch-action:none}button{outline:none;cursor:pointer}kbd{background-color:#eee;border:.0625em solid #bbb;padding:0 .25em}#home,#round{width:100%;min-height:100%;display:flex;flex-direction:column;justify-content:center}#home{text-align:center}#home>:first-child{margin:0 auto}#title{border-bottom:.125rem solid black;font-size:3rem;font-weight:700;margin:1.5rem 0;width:auto}#description{margin:1.5rem 0}#result{font-size:1.5em;margin:1.5rem 0;color:#999}#result-bar{--progress: 0%;background-color:#ccc;margin-bottom:.5rem}#result-bar.enabled{background-color:red}#result-progress{width:var(--progress);height:1rem;background-color:#0f0}#result-correct-line.enabled{color:#0a0}#result-incorrect-line.enabled{color:red}#result-total-line{color:#000}#result-correct,#result-incorrect,#result-total{font-weight:700}#start-buttons{display:grid;grid-template-columns:1fr;grid-gap:.5rem;gap:.5rem}#start-buttons button{display:block;border:.125rem solid #bbb;background-color:#eee;color:#666;padding:1rem;font-size:1.25rem;width:100%}#topbar{display:flex;align-items:center;padding:.5rem 1rem;background-color:#eee;border-bottom:.125rem solid #bbb}#topbar-left,#topbar-right{flex:1}#return-button{font-size:2rem;border:0;padding:0;color:#666}#timer{text-align:center;font-size:2rem}#topbar-right{text-align:right;font-size:1.5rem;line-height:100%;color:#666}#display{display:flex;flex-direction:column;justify-content:center;flex:1;width:100%}#prompt{font-size:5rem;font-weight:700;color:#00f;text-align:center}#input{font-size:5rem;font-weight:700;text-align:center}#input.input-empty{color:#bbb}@keyframes input-flash{0%{background-color:var(--flash-color)}to{background-color:transparent}}#input.input-correct,#input.input-incorrect{animation:.5s var(--ease-out-cubic) input-flash}#input.input-correct{color:#0a0;--flash-color: #0f0}#input.input-incorrect{color:red;--flash-color: #f88}#buttons{display:grid;grid-template-rows:repeat(4,1fr);grid-template-columns:repeat(3,1fr);grid-gap:.5rem;gap:.5rem;margin:0 auto;padding:.5rem;-webkit-user-select:none;user-select:none;width:100%;max-width:25rem}#buttons button{display:block;font-size:3rem;border:.125rem solid #bbb;padding:.5rem;background-color:#eee;color:#666}#buttons button.button-active{background-color:#bbb}