body{margin:0;padding:0;width:100vw;height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:#343434;color:#f3f3f3;text-shadow:.05em .05em .1em rgba(0,0,0,1);font-family:GowunDodum;overflow:hidden;transition:background-color .5s,border-color .5s,text-color .5s}#root{display:flex;justify-content:center;align-items:center;width:100%;height:100%}.hidden{display:none}@font-face{font-family:GowunDodum;src:url(https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2108@1.1/GowunDodum-Regular.woff) format("woff");font-weight:400;font-style:normal}@font-face{font-family:GowunBatang;src:url(https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2108@1.1/GowunBatang-Regular.woff) format("woff");font-weight:400;font-style:normal}@font-face{font-family:Pretendard;src:url(https://fastly.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Light.woff) format("woff");font-weight:400;font-style:normal}@font-face{font-family:NanumBarunpen;src:url(https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_two@1.0/NanumBarunpen.woff) format("woff");font-weight:400;font-style:normal}@font-face{font-family:D2Coding;src:url(https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_three@1.0/D2Coding.woff) format("woff");font-weight:400;font-style:normal}@font-face{font-family:NeoDunggeunmo;src:url(https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.3/NeoDunggeunmo.woff) format("woff");font-weight:400;font-style:normal}.courier-prime-regular{font-family:Courier Prime,monospace;font-weight:400;font-style:normal}.box{border:solid 2px;border-color:#f3f3f3;border-radius:28px;corner-shape:squircle;box-shadow:.1em .1em .2em #000;margin:4px;overflow:hidden}.element{height:26px;cursor:default;line-height:26px}#boxes{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;max-width:800px;margin:25px}#header-box{display:grid;grid-template-columns:auto 3fr 2fr;width:100%;height:84px;font-size:18px;align-content:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}#header-box .box{height:52px}#header-box div{align-content:center}#main-box{display:flex;flex-direction:column;justify-content:center;margin-left:0;margin-right:0;width:100%;height:100%}#current-box{display:flex;flex-direction:column;align-content:center;justify-content:center;margin:20px}#current-box [role=alert] button{all:unset;margin-left:8px;cursor:pointer;text-decoration:underline}#current-box [role=alert] button:focus-visible{outline:2px solid currentColor;outline-offset:2px}#next-box{margin:0 20px}#footer-box{display:flex;flex-direction:column;align-content:center;width:100%;height:100%}#info{display:flex;flex-direction:column;align-content:center;justify-content:center;text-align:left;text-shadow:.05em .05em .1em rgba(0,0,0,1)}#logo{all:unset;align-content:center;padding:10px 10px 0;text-shadow:.05em .05em .1em rgba(0,0,0,1);font-family:Courier Prime,Courier,monospace;font-size:32px;text-align:center}#logo a{color:#996dff;text-decoration:none;text-align:center}#date{cursor:default;padding:0 10px 10px;font-size:16px;color:#996dff;height:23px;width:100%;box-sizing:border-box;text-align:right}.dark #logo a{color:#f3f3f3}.dark #logo{text-shadow:.05em .05em .1em rgba(0,0,0,1)}.dark #date{color:#f3f3f3;text-shadow:.05em .05em .1em rgba(0,0,0,1)}.dark .wrong{color:#f33}.system #logo a{color:#f3f3f3}.system #logo{text-shadow:.05em .05em .1em rgba(0,0,0,1)}.system #date{color:#f3f3f3;text-shadow:.05em .05em .1em rgba(0,0,0,1)}.system .wrong{color:#f33}#stats{align-content:center;display:grid;grid-template-columns:auto auto auto;grid-gap:20px;padding:10px 18px;text-align:right}#best{all:unset;display:block;width:100%;cursor:pointer}#best:focus-visible{outline:2px solid currentColor;outline-offset:2px}#best-context-menu{position:fixed;z-index:999;min-width:170px;border:2px solid #f3f3f3;border-radius:24px;corner-shape:squircle;background-color:#343434;box-shadow:.1em .1em .2em #000;overflow:hidden}#best-context-menu button{all:unset;box-sizing:border-box;display:block;width:100%;padding:10px 12px;cursor:pointer;text-align:left}#best-context-menu button:hover{background-color:#ffffff1f}#option{display:grid;grid-template-columns:1fr 2fr;grid-template-rows:1fr 1fr;align-content:center;justify-content:center;margin-right:-2px;padding:10px 16px;overflow:visible}#option span{display:flex;align-items:center;justify-content:left;text-align:right}#option .selector-wrap{position:relative;display:flex;align-items:center;justify-content:right}.selector-trigger{all:unset;box-sizing:border-box;width:118px;min-width:118px;height:24px;line-height:24px;text-align:right;cursor:pointer;padding:0 8px;position:relative}.selector-menu{position:absolute;top:calc(100% + 6px);right:0;min-width:118px;max-height:240px;overflow-x:hidden;overflow-y:auto;overscroll-behavior-x:none;overscroll-behavior:contain;border:2px solid #f3f3f3;border-radius:24px;corner-shape:squircle;background-color:#454545;box-shadow:.1em .1em .2em #000;z-index:1000}@supports not (corner-shape: squircle){.box{border-radius:14px}#best-context-menu,.selector-menu{border-radius:12px}}.selector-item{all:unset;box-sizing:border-box;display:flex;align-items:center;justify-content:flex-end;gap:6px;position:relative;width:100%;padding:8px 10px 8px 24px;cursor:pointer;text-align:right;transition:all .15s ease}.selector-check{position:absolute;left:8px;width:12px;text-align:left}.selector-item.focused{background-color:#fff3;outline:2px solid rgba(255,255,255,.4);outline-offset:-2px;transform:scale(1.02)}.selector-item.selected{font-weight:700}.font-menu .selector-item.focused{filter:brightness(1.15);outline:2px solid rgba(255,255,255,.5);box-shadow:0 0 6px #ffffff4d}.theme-menu .selector-item.focused[data-theme=dark]{filter:brightness(1.25) contrast(1.1);outline:2px solid rgba(255,255,255,.6);outline-offset:-2px;transform:scale(1.02);box-shadow:0 0 8px #fff6}.theme-menu .selector-item.focused[data-theme=light]{filter:brightness(.85) contrast(1.1);outline:2px solid rgba(0,0,0,.5);outline-offset:-2px;transform:scale(1.02);box-shadow:0 0 8px #0000004d}.theme-menu .selector-item.focused[data-theme=terminal]{filter:brightness(1.4) contrast(1.15);outline:2px solid rgba(0,249,0,.8);outline-offset:-2px;transform:scale(1.02);box-shadow:0 0 12px #00f90099}.theme-menu .selector-item.focused[data-theme=telnet]{filter:brightness(1.3) contrast(1.1);outline:2px solid rgba(255,255,255,.7);outline-offset:-2px;transform:scale(1.02);box-shadow:0 0 10px #ffffff80}.theme-menu .selector-item.focused[data-theme=system]{filter:brightness(.85) contrast(1.1);outline:2px solid rgba(0,0,0,.5);outline-offset:-2px;transform:scale(1.02);box-shadow:0 0 8px #0000004d}.theme-menu .selector-item{border-bottom:1px solid rgba(255,255,255,.2)}.font-menu{touch-action:pan-y}.theme-menu{overflow-y:hidden}.theme-menu .selector-item span:last-child{flex:1;text-align:right}.theme-menu .selector-item:last-child{border-bottom:none}.phrase{margin:10px;font-size:24px;text-align:left;padding:0;min-height:35px;line-height:35px;cursor:default;white-space:pre-wrap;word-wrap:break-word;overflow-wrap:break-word;overflow:visible;width:auto}.word{display:inline-block;position:relative;white-space:pre}#currentPhrase .word:not(.typed):not(.active){opacity:.68}.word.active:after{content:"";position:absolute;left:18%;right:18%;bottom:-3px;border-bottom:2px solid currentColor}.wrong{color:red;background:#ff4b4b38;border-radius:3px}#textInput{all:unset;box-sizing:border-box;border:none;border-bottom:2px solid #f3f3f3;margin:10px 10px 8px;outline:none;font-size:24px;background-color:#454545;color:#f3f3f3;caret-color:#f3f3f3;text-shadow:.05em .05em .1em rgba(0,0,0,1);text-align:left;font-family:GowunDodum;height:35px;padding:0;min-height:35px;line-height:35px;resize:none;overflow:hidden;white-space:pre-wrap;word-wrap:break-word;overflow-wrap:break-word;transition:background-color .5s,text-color .5s;display:block;width:calc(100% - 20px)}.phrase-progress{height:4px;margin:8px 10px 0;overflow:hidden;border-radius:4px;background:#9696964d}.phrase-progress>div{height:100%;background:currentColor;transition:width .12s ease}#textInput::placeholder{color:#76767a}#textInput::selection{background:#616266}#textInput::-moz-selection{background:#616266}.phrase span::selection{background:#616266}.phrase span::-moz-selection{background:#616266}::selection{background:transparent}::-moz-selection{background:transparent}@media (max-width: 800px){.cpm{display:none}#boxes{width:95%}}@media (max-width: 720px){#header-box{display:grid;grid-template-columns:auto 2fr;grid-template-rows:auto auto;width:100%;height:168px;align-content:center}#footer-box{display:none}#stats{margin-left:-2px;margin-right:-2px;grid-column:1/3;grid-row:2}.cpm{display:inline}}@media (max-width: 450px){#option{display:grid;grid-template-columns:1fr;grid-template-rows:1fr 1fr}#option span{display:none}}@media (max-width: 375px){.cpm{display:none}}.light{background-color:#f3f3f3;color:#343434;box-shadow:.1em .1em .2em #00000080;text-shadow:.05em .05em .1em rgba(0,0,0,.2)}.light .box{box-shadow:.1em .1em .2em #00000080;border-color:#343434}.light #logo a{color:#343434}.light #logo{text-shadow:.05em .05em .1em rgba(0,0,0,.2)}.light #date{color:#343434;text-shadow:.05em .05em .1em rgba(0,0,0,.2)}.light .wrong{color:#c00;background:#cc000029}.light option{color:#343434;background-color:#f3f3f3}.light .selector-menu{border-color:#343434;background-color:#f3f3f3;box-shadow:.1em .1em .2em #00000080}.light .selector-item.focused{background-color:#00000024;outline:2px solid rgba(0,0,0,.3);outline-offset:-2px;transform:scale(1.02)}.light .font-menu .selector-item.focused{filter:brightness(.9);outline:2px solid rgba(0,0,0,.4);box-shadow:0 0 6px #0003}.light .theme-menu .selector-item{border-bottom:1px solid rgba(0,0,0,.14)}.light #textInput{background-color:#f3f3f3;color:#343434;caret-color:#343434;border-bottom:2px solid #343434;text-shadow:.05em .05em .1em rgba(0,0,0,.2)}.light #textInput::selection{background:#76767a;color:#f3f3f3}.light #textInput::-moz-selection{background:#76767a;color:#f3f3f3}.light #best-context-menu{border-color:#343434;background-color:#f3f3f3;box-shadow:.1em .1em .2em #00000080}.light #best-context-menu button:hover{background-color:#00000014}.light .phrase span::selection{background:#76767a;color:#f3f3f3}.light .phrase span::-moz-selection{background:#76767a;color:#f3f3f3}.terminal{background-color:#000;color:#00f900;box-shadow:none;text-shadow:none}.terminal .box{box-shadow:none;border-color:#00f900}.terminal #logo a{color:#00f900}.terminal #logo{text-shadow:0 0 .25em rgba(0,249,0,.75)}.terminal #date{color:#00f900;text-shadow:0 0 .2em rgba(0,249,0,.7)}.terminal .wrong{color:#ff0080;background:#ff008042}.terminal option{color:#00f900;background-color:#000}.terminal .selector-menu{border-color:#00f900;background-color:#000}.terminal .selector-item.focused{background-color:#00f90047;outline:2px solid rgba(0,249,0,.5);outline-offset:-2px;transform:scale(1.02)}.terminal .font-menu .selector-item.focused{filter:brightness(1.3);outline:2px solid rgba(0,249,0,.6);box-shadow:0 0 10px #00f90080}.terminal .theme-menu .selector-item{border-bottom:1px solid rgba(0,249,0,.28)}.terminal #textInput{background-color:#000;color:#00f900;caret-color:#00f900;border-bottom:2px solid #00f900;text-shadow:none}.terminal #textInput::selection{background:#00f900;color:#000}.terminal #textInput::-moz-selection{background:#00f900;color:#000}.terminal #best-context-menu{border-color:#00f900;background-color:#000}.terminal #best-context-menu button:hover{background-color:#00f90033}.terminal .phrase span::selection{background:#00f900;color:#000}.terminal .phrase span::-moz-selection{background:#00f900;color:#000}.telnet{background-color:#00007d;color:#fff;box-shadow:none;text-shadow:none}.telnet .box{box-shadow:none;border-color:#fff}.telnet #logo a{color:#fff}.telnet #logo{text-shadow:0 0 .2em rgba(255,255,255,.55)}.telnet #date{color:#fff;text-shadow:0 0 .18em rgba(255,255,255,.5)}.telnet .wrong{color:#f66;background:#ff666647}.telnet option{color:#fff;background-color:#00007d}.telnet .selector-menu{border-color:#fff;background-color:#00007d}.telnet .selector-item.focused{background-color:#ffffff47;outline:2px solid rgba(255,255,255,.5);outline-offset:-2px;transform:scale(1.02)}.telnet .font-menu .selector-item.focused{filter:brightness(1.2);outline:2px solid rgba(255,255,255,.6);box-shadow:0 0 8px #fff6}.telnet .theme-menu .selector-item{border-bottom:1px solid rgba(255,255,255,.35)}.telnet #textInput{background-color:#00007d;color:#fff;caret-color:#fff;border-bottom:2px solid #ffffff;text-shadow:none}.telnet #textInput::selection{background:#fff;color:#00007d}.telnet #textInput::-moz-selection{background:#fff;color:#00007d}.telnet #best-context-menu{border-color:#fff;background-color:#00007d}.telnet #best-context-menu button:hover{background-color:#fff3}.telnet .phrase span::selection{background:#fff;color:#00007d}.telnet .phrase span::-moz-selection{background:#fff;color:#00007d}@media (prefers-color-scheme: light){.system{background-color:#f3f3f3;color:#343434;box-shadow:.1em .1em .2em #00000080;text-shadow:.05em .05em .1em rgba(0,0,0,.2)}.system .box{box-shadow:.1em .1em .2em #00000080;border-color:#343434}.system #logo a{color:#343434}.system #logo{text-shadow:.05em .05em .1em rgba(0,0,0,.2)}.system #date{color:#343434;text-shadow:.05em .05em .1em rgba(0,0,0,.2)}.system .wrong{color:#c00;background:#cc000029}.system option{color:#343434;background-color:#f3f3f3}.system .selector-menu{border-color:#343434;background-color:#f3f3f3;box-shadow:.1em .1em .2em #00000080}.system .selector-item.focused{background-color:#00000024;outline:2px solid rgba(0,0,0,.3);outline-offset:-2px;transform:scale(1.02)}.system .font-menu .selector-item.focused{filter:brightness(.9);outline:2px solid rgba(0,0,0,.4);box-shadow:0 0 6px #0003}.system .theme-menu .selector-item{border-bottom:1px solid rgba(0,0,0,.14)}.system #textInput{background-color:#f3f3f3;color:#343434;caret-color:#343434;border-bottom:2px solid #343434;text-shadow:.05em .05em .1em rgba(0,0,0,.2)}.system #textInput::selection{background:#76767a;color:#f3f3f3}.system #textInput::-moz-selection{background:#76767a;color:#f3f3f3}.system #best-context-menu{border-color:#343434;background-color:#f3f3f3;box-shadow:.1em .1em .2em #00000080}.system #best-context-menu button:hover{background-color:#00000014}.system .phrase span::selection{background:#76767a;color:#f3f3f3}.system .phrase span::-moz-selection{background:#76767a;color:#f3f3f3}}.pixel .box{border-radius:0}.pixel #logo{font-family:GalmuriMono7}.pixel #date{font-family:Galmuri7}.pixel .selector-trigger,.pixel .selector-item{font-family:inherit}.pixel .selector-menu,.pixel #best-context-menu{border-radius:0}.pixel #best-context-menu button{font-family:inherit}.selector-menu::-webkit-scrollbar{display:none}.selector-menu{scrollbar-width:none;-ms-overflow-style:none}.scroll-indicator{all:unset;position:sticky;left:0;right:0;height:24px;display:flex;align-items:center;justify-content:center;pointer-events:auto;opacity:1;transition:opacity .2s ease-in-out;font-size:12px;color:#f3f3f399;cursor:pointer;z-index:10;box-sizing:border-box;width:100%}.scroll-indicator-top{top:0;background:linear-gradient(to bottom,#454545,#454545f2,#45454500)}.scroll-indicator-bottom{bottom:0;background:linear-gradient(to top,#454545,#454545f2,#45454500)}.scroll-indicator.hidden{opacity:0;pointer-events:none}.scroll-indicator:hover{color:#f3f3f3e6}.light .scroll-indicator-top{background:linear-gradient(to bottom,#f3f3f3,#f3f3f3f2,#f3f3f300);color:#34343499}.light .scroll-indicator-bottom{background:linear-gradient(to top,#f3f3f3,#f3f3f3f2,#f3f3f300);color:#34343499}.light .scroll-indicator:hover{color:#343434e6}.terminal .scroll-indicator-top{background:linear-gradient(to bottom,#000,#000000f2,#0000);color:#00f90099}.terminal .scroll-indicator-bottom{background:linear-gradient(to top,#000,#000000f2,#0000);color:#00f90099}.terminal .scroll-indicator:hover{color:#00f900e6}.telnet .scroll-indicator-top{background:linear-gradient(to bottom,#00007d,#00007df2,#00007d00);color:#fff9}.telnet .scroll-indicator-bottom{background:linear-gradient(to top,#00007d,#00007df2,#00007d00);color:#fff9}.telnet .scroll-indicator:hover{color:#ffffffe6}@media (prefers-color-scheme: light){.system .scroll-indicator-top{background:linear-gradient(to bottom,#f3f3f3,#f3f3f3f2,#f3f3f300);color:#34343499}.system .scroll-indicator-bottom{background:linear-gradient(to top,#f3f3f3,#f3f3f3f2,#f3f3f300);color:#34343499}.system .scroll-indicator:hover{color:#343434e6}}#preloader{position:fixed;bottom:0;left:0;visibility:hidden}