@charset "UTF-8";.cpt-line-base{height:285px}.cpt-line{width:1200px;position:relative;margin:0 auto;margin-top:5rem;overflow:hidden;--un-bg-opacity:1;background-color:rgb(255 255 255 / var(--un-bg-opacity));padding:0;border:16px solid #fff;box-sizing:border-box}.cpt-line .region-letter{transition:all .5s;position:relative;margin:0 auto;box-sizing:border-box;width:100%;display:flex;flex-wrap:wrap;--un-bg-opacity:1;background-color:rgb(255 255 255 / var(--un-bg-opacity));--un-text-opacity:1;color:rgb(0 0 0 / var(--un-text-opacity))}.cpt-line .region-letter .breakline{border-bottom:1px solid #ccc;flex:0 0 100%}.cpt-line .region-letter .letters{display:flex;height:76px;line-height:76px}.cpt-line .region-letter .letter{border-bottom:3px solid transparent;color:#4a4a4a;flex:1;font-family:pt-mono;width:20px;box-sizing:border-box;--un-bg-opacity:1;background-color:rgb(255 255 255 / var(--un-bg-opacity));text-align:center;line-height:4.5rem;background:transparent;font-size:1.7rem;font-weight:400;height:76px;line-height:76px}.cpt-line .region-letter .letter.todo{animation:cursorBlink 2s linear infinite;animation-delay:1s;border-color:var(--blue);border-radius:0;color:var(--blue)}.cpt-line .region-letter .letter.isT{--un-bg-opacity:1;background-color:rgb(220 252 231 / var(--un-bg-opacity));--un-text-opacity:1;color:rgb(74 222 128 / var(--un-text-opacity))}.cpt-line .region-letter .letter.isF{--un-bg-opacity:1;background-color:rgb(254 226 226 / var(--un-bg-opacity));--un-text-opacity:1;color:rgb(248 113 113 / var(--un-text-opacity));animation:error-shake .2s linear 1;animation-delay:0s}@keyframes cursorBlink{0%{border-color:#3295db}50%{border-color:transparent}to{border-color:#3295db}}@keyframes error-shake{0%{opacity:0;transform:translate(0) translateY(0)}15%{transform:translate(-25%) translateY(7.5%) rotate(-10deg)}30%{opacity:1;transform:translate(20%) translateY(15%) rotate(5deg)}45%{transform:translate(-15%) translateY(22.5%) rotate(-5deg)}60%{transform:translate(10%) translateY(30%) rotate(3deg)}75%{transform:translate(-5%) translateY(37.5%) rotate(-1deg)}to{opacity:0;transform:translate(0) translateY(50%)}}@media only screen and (min-width:1440px){.cpt-line{width:1433px}}.cpt-fingers-image{bottom:0;display:flex;height:600px;left:0;position:absolute;width:100%}.cpt-fingers-image .hand{background-repeat:no-repeat;bottom:0;height:100%;position:absolute;width:700px;z-index:100}.cpt-fingers-image .left{background-position:-140px 80px;background-size:593px auto;left:0}.cpt-fingers-image .right{background-position:160px 85px;background-size:672px auto;right:0}.cpt-keyboard{margin:0 auto;padding-bottom:160px;transform:scale(1);width:800px}.cpt-keyboard .keyboard{align-items:center;border-radius:15px;box-sizing:border-box;display:grid;gap:6px;grid-template-columns:repeat(30,1fr);grid-template-rows:repeat(5,1fr);height:320px;justify-content:center;margin:20px auto;overflow:hidden;padding:18px;position:relative;width:800px}.cpt-keyboard .keyboard .key{border-radius:10px;cursor:pointer;display:grid;grid-column:auto / span 2;height:50px;place-items:center;transition:all .3s}.cpt-keyboard .keyboard .kl3{grid-column:auto / span 3}.cpt-keyboard .keyboard .kl4{grid-column:auto / span 4}.cpt-keyboard .keyboard .kl5{grid-column:auto / span 5}.cpt-keyboard .keyboard .kl12{grid-column:auto / span 12}.cpt-keyboard .keyboard.themeBase{background:#d9dadb}.cpt-keyboard .keyboard.themeBase .key{background:#fff;color:#4a4a4a}.cpt-keyboard .keyboard.themeBase .key.active{background:var(--green);color:#fff}.cpt-keyboard .keyboard.themeBase .key:hover{box-shadow:0 0 #fff,0 0 #ddd,inset 3px 3px 6px #0003,inset -3px -3px 10px #ffffff4d}.cpt-keyboard .keyboard.themeBase .click{box-shadow:0 0 #fff,0 0 #ddd,inset 3px 3px 6px #0003,inset -3px -3px 10px #fff9}.cpt-keyboard .keyboard.themeDark{background:#000;box-shadow:-3px -3px 10px #fff,3px 3px 6px #ddd}.cpt-keyboard .keyboard.themeDark .key{background:#000;box-shadow:-3px -3px 10px #fff,3px 3px 6px #ddd;color:#fff}.cpt-keyboard .keyboard.themeDark .key:hover{box-shadow:0 0 #fff,0 0 #ddd,inset 3px 3px 6px #0003,inset -3px -3px 10px #ffffff4d}.cpt-keyboard .keyboard.themeDark .click{box-shadow:0 0 #fff,0 0 #ddd,inset 3px 3px 6px #0003,inset -3px -3px 10px #fff9}.cpt-keyboard .keyboard.themeDark .color1{background:#ed4c67;color:#fbdbe1}.cpt-keyboard .keyboard.themeDark .color2{background:#d63031;color:#f7d6d6}.cpt-keyboard .keyboard.themeDark .color3{background:#12cbc4;color:#cafaf8}.cpt-keyboard .keyboard.themeDark .color4{background:#ee5a24;color:#fcded3}.cpt-keyboard .keyboard.themeDark .color5{background:#fdcb6e;color:#fff5e2}.cpt-keyboard .keyboard.themeDark .color6{background:#1e90ff;color:#d2e9ff}.cpt-keyboard .keyboard.themeDark .color7{background:#be2edd;color:#f2d5f8}.cpt-keyboard .keyboard.themeDark .color8{background:#5352ed;color:#dddcfb}.cpt-keyboard .keyboard.themeDark .color9{background:#26de81;color:#d4f8e6}@keyframes breathe{0%{box-shadow:0 1px 2px #ffffff1a}10%{box-shadow:1px 1px 80px #3bffff}20%{box-shadow:0 1px 2px #ffffff1a}30%{box-shadow:1px 1px 80px #eb0552}40%{box-shadow:0 1px 2px #ffffff1a}50%{box-shadow:1px 1px 80px #0fe20f}60%{box-shadow:0 1px 2px #ffffff1a}70%{box-shadow:1px 1px 80px #4807df}80%{box-shadow:0 1px 2px #ffffff1a}to{box-shadow:1px 1px 80px #b8e909}}