@import"https://fonts.googleapis.com/css2?family=Noto+Sans+Mono&family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap";html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,main,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section{display:block}*[hidden]{display:none}body{line-height:1}menu,ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}table{border-collapse:collapse;border-spacing:0}.header{display:flex;justify-content:space-between;width:100%}.header__logo{color:var(--color-black);font-size:40px;font-style:italic;font-weight:900}.header__button{padding:8px 16px 8px 8px;box-shadow:inset 0 0 0 1px var(--color-black);border-radius:100px;display:flex;gap:8px;align-items:center;cursor:pointer;transition:background-color .2s ease-in-out}.header__button-icon{transition:filter .2s ease-in-out}.header__button:hover{background:var(--color-black)}.header__button:hover .header__button-text{color:var(--color-white)}.header__button-text{color:var(--color-black);font-size:16px;transition:color .2s ease-in-out}.header__button:hover .header__button-icon{filter:brightness(0) invert(1)}.statistics{display:flex;gap:24px}.statistics__number{color:var(--color-black);font-size:24px}.statistics__description{color:var(--color-black);font-size:12px;opacity:.5}.statistics__slash{color:var(--color-black);font-size:40px;font-weight:100;opacity:.1}.statistics__item{display:flex;flex-direction:column;gap:4px;align-items:center}@media (max-width: 580.5px){.header__button{padding:8px}.header__button-text{display:none}.statistics{gap:8px}}.container{padding:12px;box-sizing:border-box;max-width:1710px;width:100%;margin:0 auto;display:flex;gap:48px;flex-direction:column;justify-content:space-between;min-height:100dvh;align-items:center}body{background:linear-gradient(180deg,#fff,#d6e8f4) no-repeat center/cover;font-family:Noto Sans,sans-serif;font-style:normal;font-weight:400}button{padding:0;background:none;border:none}input{padding:0;border:none;outline:none;font:inherit;background:none}:root{--color-black: #0C0E0B;--color-white: #fff;--color-red: #D7303B;--color-blue: #D6E8F4}.footer{display:flex}.footer__text{color:var(--color-black);font-size:16px}.footer__link{color:var(--color-black);font-size:16px;text-decoration-color:color-mix(in srgb,currentColor 10%,transparent);transition:text-decoration-color .2s ease-in-out}.footer__link:hover{text-decoration-color:color-mix(in srgb,currentColor 50%,transparent)}.typing{text-align:center;width:100dvw;overflow-x:hidden;position:relative}.typing__input{color:var(--color-black);font-size:40px;font-family:Noto Sans Mono,monospace;background-color:transparent;border:none;border-bottom:1px solid color-mix(in srgb,var(--color-black) 10%,transparent);padding-bottom:24px;box-sizing:border-box;outline:none;position:absolute;top:0;left:0;transition:border .2s ease-in-out;z-index:100}.typing__input:hover{border-bottom:1px solid color-mix(in srgb,var(--color-black) 50%,transparent)}.typing__input:focus{border-bottom:1px solid var(--color-black)}.typing__text{display:inline-block;position:relative}.typing__phrase{color:var(--color-black);font-size:40px;font-family:Noto Sans Mono,monospace;background-color:transparent;border:none;padding-bottom:24px;pointer-events:none;opacity:.2;z-index:1}.typing__button{cursor:pointer;animation:animation-blink 1s infinite alternate ease-in-out;padding:16px 24px;display:inline-block;border-radius:100px;margin-top:24px}.typing__translation{opacity:.5;margin-top:40px}.typing__translate{color:var(--color-black);font-size:24px;text-align:center;line-height:145%;width:calc((100% + 24px) / 3 * 2);margin:0 auto}.typing__progress{width:100%;height:calc(100% - 24px);pointer-events:none;position:absolute;top:0;left:50%;transform:translate(-50%);z-index:10;display:flex}.typing__line{flex:1}.typing__line_error{background-color:var(--color-red);border-radius:100px;position:relative}.typing__line_error+.typing__line_error:after{content:"";position:absolute;width:100%;height:100%;display:block;background:var(--color-red);left:-50%}.typing__btn{width:40px;height:40px;background:transparent;position:absolute;left:50%;transform:translate(-50%);top:59.5px;border-radius:100px;z-index:1000;cursor:pointer;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);display:flex;justify-content:center;align-items:center;transition:box-shadow .2s ease-in-out}.typing__btn:hover{box-shadow:inset 0 0 0 11px var(--color-black)}.keyboard{display:flex;width:calc(100% + 24px);align-items:center}.keyboard__center{border-radius:min(100dvw * 48 / 2430,1710px * 48 / 2430);flex:4;width:100%;background:color-mix(in srgb,var(--color-white) 50%,transparent) url(/noise.png) no-repeat center/cover;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px)}.keyboard__left,.keyboard__right{display:flex;justify-content:center;flex:1}.keyboard__rows{padding:min(100dvw * 24 / 2430,1710px * 24 / 2430);gap:min(100dvw * 12 / 2430,1710px * 12 / 2430);box-sizing:border-box;display:flex;flex-direction:column}.keyboard__key{border-radius:min(100dvw * 8 / 2430,1710px * 8 / 2430);padding:min(100dvw * 16 / 2430,1710px * 16 / 2430);background:var(--color-white);box-sizing:border-box;display:flex}.keyboard__key_animation-blink{animation:animation-blink 1s infinite alternate ease-in-out}.keyboard__key_size-96{width:6.106870229%;aspect-ratio:1/1}.keyboard__key_size-168{width:10.6870229008%}.keyboard__key_size-192{width:12.213740458%}.keyboard__key_size-180{width:11.4503816794%}.keyboard__key_size-240{width:15.2671755725%}.keyboard__key_size-144{width:9.1603053435%}.keyboard__key_size-504{width:32.0610687023%}.keyboard__key_type-text{font-size:min(100dvw * 19 / 2430,1710px * 19 / 2430);color:var(--color-black)}.keyboard__key_align-bottom-right{align-items:flex-end;justify-content:flex-end}.keyboard__key_align-left{flex-direction:column;justify-content:space-between;align-items:flex-start}.keyboard__key_align-center{justify-content:center;align-items:center;flex-direction:column}.keyboard__key_align-center:has(span:nth-child(2)){justify-content:space-between}.keyboard__key_align-right{flex-direction:column;justify-content:space-between;align-items:flex-end}.keyboard__key_align-bottom-left{align-items:flex-end;justify-content:flex-start}.keyboard__key_type-letter{font-size:min(100dvw * 24 / 2430,1710px * 24 / 2430);color:var(--color-black);align-items:center;justify-content:center}.keyboard__key_opacity-20{color:color-mix(in srgb,var(--color-black) 20%,transparent)}.keyboard__key_divider{position:relative}.keyboard__key_divider:after{content:"";display:block;width:100%;position:absolute;height:1px;background-color:var(--color-black);opacity:.1;top:50%;left:50%;transform:translate(-50%,-50%)}.keyboard__row{gap:min(100dvw * 12 / 2430,1710px * 12 / 2430);display:flex;width:100%;justify-content:space-between}.keyboard__row:first-child .keyboard__key:first-child{border-top-left-radius:min(100dvw * 32 / 2430,1710px * 32 / 2430)}.keyboard__row:first-child .keyboard__key:last-child{border-top-right-radius:min(100dvw * 32 / 2430,1710px * 32 / 2430)}.keyboard__row:last-child .keyboard__key:first-child{border-bottom-left-radius:min(100dvw * 32 / 2430,1710px * 32 / 2430)}.keyboard__row:last-child .keyboard__key:last-child{border-bottom-right-radius:min(100dvw * 32 / 2430,1710px * 32 / 2430)}.button-icon{width:40px;height:40px;border:1px solid var(--color-black);border-radius:100px;cursor:pointer;display:flex;justify-content:center;align-items:center;transition:all .2s ease-in-out}.button-icon:hover{background:var(--color-black)}.button-icon:hover .button-icon__ic{filter:brightness(0) invert(1)}.button-icon__ic{transition:all .2s ease-in-out}.button-icon__bg{width:24px;height:24px;border-radius:100px;object-fit:cover}@media (hover: none) and (pointer: coarse){.keyboard{gap:24px;justify-content:center}.keyboard__center{display:none}.keyboard__left,.keyboard__right{flex:unset}}@keyframes animation-blink{to{background:var(--color-blue)}}