:root{--color-grey-1: #151515;--color-grey-2: #2c2c2c;--color-grey-3: #8a8a8a;--color-grey-4: #c1c1c1;--color-grey-5: #f2f2f2;--color-grey-6: #f6f6f6;--color-prim-1: #71afcd;--color-prim-2: #7dc2e4;--color-prim-3: #97cee9;--color-prim-4: #e5f3fa;--color-prim-5: #f2f9fc;--green-light: #f2fcf2;--green-dark: #b4ffb4;--red-light: #f4cbcb;--red-dark: #ff0000}.btn--1{text-decoration:none;display:inline-block;font-size:1.6rem;color:#fff;padding:1.4rem 3.2rem;background-color:var(--color-grey-1);border-radius:100px;transition:all .2s;cursor:pointer}.btn--1:hover{background-color:var(--color-grey-2)}.btn--2{text-decoration:none;width:max-content;font-size:1.6rem;color:#fff;background-color:var(--color-grey-1);border-radius:100px;transition:all .2s;padding:1.4rem 2.4rem 1.4rem 1.6rem;cursor:pointer;display:flex;align-items:center;gap:.8rem}.btn--2:hover{background-color:var(--color-grey-2)}.btn--3{width:max-content;font-size:1.6rem;padding:1.4rem 2.4rem 1.4rem 1.6rem;background-color:var(--color-prim-4);border-radius:1.4rem;color:var(--color-prim-1);box-shadow:0 .5rem .5rem #0000000d;cursor:pointer;transition:all .2s;font-weight:600;display:flex;gap:.8rem;align-items:center}.btn--3 svg{width:2.8rem;height:2.8rem}.btn--3:hover{transform:translateY(-4px);box-shadow:0 .2rem .2rem #0000000a}.btn--3:active{background-color:var(--color-prim-5);transform:translateY(-2.5px)}.btn--ghost{border:2px solid var(--color-prim-1);padding:1.4rem 2.4rem;font-size:1.6rem;color:var(--color-prim-1);border-radius:1.4rem;width:max-content;cursor:pointer;transition:all .2s}.btn--ghost:hover{background-color:var(--color-prim-4);border:2px solid var(--color-prim-4)}@media only screen and (max-width:28.12em){.component-keyboard-wrapper{scale:.4}}.component-keyboard{display:flex;flex-direction:column;align-items:center}.component-keyboard .keys-cont{display:flex;gap:10px}.component-keyboard .keys-cont .key{width:52px;height:52px;outline:2px solid transparent;display:flex;justify-content:center;align-items:center;flex-direction:column}.component-keyboard .keys-cont .key--active{background-color:var(--color-grey-5);color:var(--color-grey-1);outline:2px solid var(--color-grey-4)}.component-keyboard .keys-cont .key--active.right{background-color:#e4ffe4;outline:2px solid #0eff0e}.component-keyboard .keys-cont .key--active.wrong{background-color:#f4cbcb;outline:2px solid #fe1919}.component-keyboard .keys-cont .key--inactive{background-color:#fbfbfb;color:var(--color-grey-4);outline:2px solid #f3f3f3}.component-keyboard .keys-cont .key--inactive.wrong{outline:2px solid #ff8080}.component-keyboard .keys-cont .key.right{background-color:#e4ffe4;outline:2px solid #0eff0e}.component-keyboard .keys-cont .key.wrong{background-color:#f4cbcb;outline:2px solid #fe1919}.component-keyboard .keys-cont .key.space{width:350px;height:52px}.component-keyboard .keys-cont .key-shift{font-family:Open Sans,sans-serif;width:70px;font-size:16px;padding:10px}.component-keyboard .keys-cont .key-shift.right{background-color:#e4ffe4;outline:2px solid #0eff0e}.notification{font-size:1.4rem;font-weight:700;color:#fff;background-color:var(--color-prim-2);display:inline-block;padding:.5rem 1.6rem;border-radius:100px}.fingers-svg path{fill:var(--color-grey-2)}.section-typing .typing-el{display:grid;grid-template-columns:100px 1fr 100px;grid-template-rows:max-content max-content;grid-template-areas:"hand1 input hand2"}@media only screen and (max-width:56.25em){.section-typing .typing-el{margin-top:32px;display:flex;flex-direction:column;align-items:center}}.section-typing.result .filters,.section-typing.result .screen-cont,.section-typing.result .typing-el{display:none}.section-typing.result .section-result{display:flex!important}.section-result{max-width:480px;margin:0 auto;box-shadow:0 10px 20px #0000000d;padding:32px;border-radius:32px;color:var(--color-grey-2);display:none;flex-direction:column;align-items:center}.section-result__heading{width:100%;font-size:24px;font-weight:800;display:flex;justify-content:space-between;align-items:center}.section-result__score{font-size:18px;font-weight:400;margin:40px 0;display:flex;flex-direction:column;align-items:center}.section-result__score span{font-size:86px;font-weight:800;line-height:1}.section-result__details{width:100%;background-color:var(--color-prim-4);border-radius:20px;padding:5px 32px 16px;display:flex;justify-content:space-between}.section-result__details--detail{font-size:14px}.section-result__details--detail p span{font-size:32px;font-weight:700}.section-details{max-width:1000px;margin:0 auto;color:var(--color-grey-2);padding:0 0 80px}@media only screen and (max-width:56.25em){.section-details{padding:0 10px 80px}}.section-details iframe{width:600px;height:300px;display:block;margin:16px auto}.section-details h1{font-size:36px}.section-details h2{font-size:24px;margin:20px 0 6px}.section-details p,.section-details li{font-size:16px;line-height:1.7}.section-details a{color:#007cee}.learn-charblock,.test-charblock{display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem;width:100%;-webkit-user-select:none;user-select:none}.learn-charblock--1,.learn-charblock--2,.test-charblock--1,.test-charblock--2{display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem}.learn-charblock__char,.learn-charblock__space,.test-charblock__char,.test-charblock__space{display:inline-flex;align-items:center;justify-content:center;min-width:2.75rem;height:3.5rem;padding:0 .75rem;font-size:1.75rem;border-radius:8px;font-weight:500;border:2px solid transparent;background-color:#ffffff0a;color:#d4d4d8;transition:all .15s ease}.learn-charblock__space,.test-charblock__space{min-width:4.5rem;font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;color:#71717a}button#chapter-btn,button#key-basic-btn{transition:all .2s cubic-bezier(.4,0,.2,1)}button#chapter-btn.active,button#key-basic-btn.active{background-color:#6366f126!important;color:#818cf8!important;border-color:#6366f14d!important;box-shadow:0 4px 12px #6366f10d}