@font-face{font-family:HanlimMyungjo;src:url(https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2204@1.0/HallymMjo-Regular.woff2)format("woff2");font-weight:400;font-display:swap}@font-face{font-family:HanlimMyungjo;src:url(https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2204@1.0/HallymMjo-Bold.woff2)format("woff2");font-weight:700;font-display:swap}:root{--background-body:#fff;--background:#efefef;--background-alt:#f7f7f7;--selection:#9e9e9e;--text-main:#363636;--text-bright:#000;--text-muted:#70777f;--links:#0076d1;--focus:#0096bfab;--border:#dbdbdb;--code:#000;--animation-duration:.1s;--button-base:#d0cfcf;--button-hover:#9b9b9b;--scrollbar-thumb:#aaa;--scrollbar-thumb-hover:var(--button-hover);--form-placeholder:#949494;--form-text:#1d1d1d;--variable:#39a33c;--highlight:#ff0;--select-arrow:url("data:image/svg+xml;charset=utf-8,%3C?xml version='1.0' encoding='utf-8'?%3E %3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' height='62.5' width='116.9' fill='%23161f27'%3E %3Cpath d='M115.3,1.6 C113.7,0 111.1,0 109.5,1.6 L58.5,52.7 L7.4,1.6 C5.8,0 3.2,0 1.6,1.6 C0,3.2 0,5.8 1.6,7.4 L55.5,61.3 C56.3,62.1 57.3,62.5 58.4,62.5 C59.4,62.5 60.5,62.1 61.3,61.3 L115.2,7.4 C116.9,5.8 116.9,3.2 115.3,1.6Z'/%3E %3C/svg%3E")}html{scrollbar-color:#aaa #fff;scrollbar-color:var(--scrollbar-thumb) var(--background-body);scrollbar-width:thin}body{word-wrap:break-word;color:var(--text-main);max-width:800px;background:#fff;background:var(--background-body);text-rendering:optimizelegibility;margin:20px auto;padding:0 10px;font-family:HanlimMyungjo,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,Segoe UI Emoji,Apple Color Emoji,Noto Color Emoji,sans-serif;line-height:1.4}button,input,textarea{transition:background-color .1s linear,border-color .1s linear,color .1s linear,box-shadow .1s linear,transform .1s;transition:background-color var(--animation-duration) linear, border-color var(--animation-duration) linear, color var(--animation-duration) linear, box-shadow var(--animation-duration) linear, transform var(--animation-duration) ease}h1{margin-top:0;font-size:2.2em}h1,h2,h3,h4,h5,h6{color:var(--text-bright);margin-top:24px;margin-bottom:12px}strong{color:var(--text-bright)}h1,h2,h3,h4,h5,h6,b,strong,th{font-weight:600}q:before,q:after{content:none}blockquote,q{border-left:4px solid #0096bfab;border-left:4px solid var(--focus);margin:1.5em 0;padding:.5em 1em;font-style:italic}blockquote>footer{border:0;font-style:normal}blockquote cite,address{font-style:normal}a[href^=mailto\:]:before{content:"📧 "}a[href^=tel\:]:before{content:"📞 "}a[href^=sms\:]:before{content:"💬 "}mark{background-color:#ff0;background-color:var(--highlight);color:#000;border-radius:2px;padding:0 2px}a>code,a>strong{color:inherit}button,select,input[type=submit],input[type=reset],input[type=button],input[type=checkbox],input[type=range],input[type=radio]{cursor:pointer}input,select{display:block}[type=checkbox],[type=radio]{display:initial}input,button,textarea,select{color:var(--form-text);background-color:#efefef;background-color:var(--background);font-family:inherit;font-size:inherit;border:none;border-radius:6px;outline:none;margin-bottom:6px;margin-right:6px;padding:10px}button,input[type=submit],input[type=reset],input[type=button]{background-color:#d0cfcf;background-color:var(--button-base);padding-left:30px;padding-right:30px}button:hover,input[type=submit]:hover,input[type=reset]:hover,input[type=button]:hover{background:#9b9b9b;background:var(--button-hover)}input[type=color]{cursor:pointer;min-height:2rem;padding:8px}input[type=checkbox],input[type=radio]{width:1em;height:1em}input[type=radio]{border-radius:100%}input{vertical-align:top}label{vertical-align:middle;margin-bottom:4px;display:inline-block}input:not([type=checkbox]):not([type=radio]),input[type=range],select,button,textarea{-webkit-appearance:none}textarea{box-sizing:border-box;resize:vertical;margin-right:0;display:block}textarea:not([cols]){width:100%}textarea:not([rows]){height:140px;min-height:40px}select{background:#efefef url("data:image/svg+xml;charset=utf-8,%3C?xml version='1.0' encoding='utf-8'?%3E %3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' height='62.5' width='116.9' fill='%23161f27'%3E %3Cpath d='M115.3,1.6 C113.7,0 111.1,0 109.5,1.6 L58.5,52.7 L7.4,1.6 C5.8,0 3.2,0 1.6,1.6 C0,3.2 0,5.8 1.6,7.4 L55.5,61.3 C56.3,62.1 57.3,62.5 58.4,62.5 C59.4,62.5 60.5,62.1 61.3,61.3 L115.2,7.4 C116.9,5.8 116.9,3.2 115.3,1.6Z'/%3E %3C/svg%3E") calc(100% - 12px)/12px no-repeat;background:var(--background) var(--select-arrow) calc(100% - 12px) 50% / 12px no-repeat;padding-right:35px}select::-ms-expand{display:none}select[multiple]{background-image:none;padding-right:10px;overflow-y:auto}input:focus,select:focus,button:focus,textarea:focus{box-shadow:0 0 0 2px #0096bfab;box-shadow:0 0 0 2px var(--focus)}input[type=checkbox]:active,input[type=radio]:active,input[type=submit]:active,input[type=reset]:active,input[type=button]:active,input[type=range]:active,button:active{transform:translateY(2px)}input:disabled,select:disabled,button:disabled,textarea:disabled{cursor:not-allowed;opacity:.5}:-ms-placeholder-shown{color:var(--form-placeholder)}::placeholder{color:var(--form-placeholder)}fieldset{border:1px solid #0096bfab;border:1px var(--focus) solid;border-radius:6px;margin:0 0 12px;padding:10px}legend{font-size:.9em;font-weight:600}input[type=range]{background:0 0;margin:10px 0;padding:10px 0}input[type=range]:focus{outline:none}input[type=range]::-webkit-slider-runnable-track{background:#efefef;background:var(--background);border-radius:3px;width:100%;height:9.5px;transition:all .2s}input[type=range]::-webkit-slider-thumb{background:#dbdbdb;background:var(--border);-webkit-appearance:none;border-radius:50%;width:20px;height:20px;margin-top:-7px;box-shadow:0 1px 1px #000,0 0 1px #0d0d0d}input[type=range]:focus::-webkit-slider-runnable-track{background:#efefef;background:var(--background)}input[type=range]::-moz-range-track{background:#efefef;background:var(--background);border-radius:3px;width:100%;height:9.5px;transition:all .2s}input[type=range]::-moz-range-thumb{background:#dbdbdb;background:var(--border);border-radius:50%;width:20px;height:20px;box-shadow:1px 1px 1px #000,0 0 1px #0d0d0d}input[type=range]::-ms-track{color:#0000;background:0 0;border-width:16px 0;border-color:#0000;width:100%;height:9.5px}input[type=range]::-ms-fill-lower{background:#efefef;background:var(--background);border:.2px solid #010101;border-radius:3px;box-shadow:1px 1px 1px #000,0 0 1px #0d0d0d}input[type=range]::-ms-fill-upper{background:#efefef;background:var(--background);border:.2px solid #010101;border-radius:3px;box-shadow:1px 1px 1px #000,0 0 1px #0d0d0d}input[type=range]::-ms-thumb{background:#dbdbdb;background:var(--border);border:1px solid #000;border-radius:50%;width:20px;height:20px;box-shadow:1px 1px 1px #000,0 0 1px #0d0d0d}input[type=range]:focus::-ms-fill-lower{background:#efefef;background:var(--background)}input[type=range]:focus::-ms-fill-upper{background:#efefef;background:var(--background)}a{color:var(--links);text-decoration:none}a:hover{text-decoration:underline}code,samp,time{background:#efefef;background:var(--background);color:var(--code);border-radius:6px;padding:2.5px 5px;font-size:1em}pre>code{padding:10px;display:block;overflow-x:auto}var{color:var(--variable);font-family:monospace;font-style:normal}kbd{background:#efefef;background:var(--background);border:1px solid #dbdbdb;border:1px solid var(--border);color:var(--text-main);border-radius:2px;padding:2px 4px}img,video{max-width:100%;height:auto}hr{border:none;border-top:1px solid #dbdbdb;border-top:1px solid var(--border)}table{border-collapse:collapse;table-layout:fixed;width:100%;margin-bottom:10px}table caption{text-align:left}td,th{text-align:left;vertical-align:top;word-wrap:break-word;padding:6px}thead{border-bottom:1px solid #dbdbdb;border-bottom:1px solid var(--border)}tfoot{border-top:1px solid #dbdbdb;border-top:1px solid var(--border)}tbody tr:nth-child(2n){background-color:#efefef;background-color:var(--background)}tbody tr:nth-child(2n) button{background-color:#f7f7f7;background-color:var(--background-alt)}tbody tr:nth-child(2n) button:hover{background-color:#fff;background-color:var(--background-body)}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:#efefef;background:var(--background);border-radius:6px}::-webkit-scrollbar-thumb{background:#aaa;background:var(--scrollbar-thumb);border-radius:6px}::-webkit-scrollbar-thumb:hover{background:#9b9b9b;background:var(--scrollbar-thumb-hover)}::selection{background-color:#9e9e9e;background-color:var(--selection);color:var(--text-bright)}details{background-color:#f7f7f7;background-color:var(--background-alt);border-radius:6px;flex-direction:column;align-items:flex-start;margin:1em 0;padding:10px 10px 0;display:flex;overflow:hidden}details[open]{padding:10px}details>:last-child{margin-bottom:0}details[open] summary{margin-bottom:10px}summary{background-color:#efefef;background-color:var(--background);cursor:pointer;outline:none;margin:-10px -10px 0;padding:10px;display:list-item}summary:hover,summary:focus{text-decoration:underline}details>:not(summary){margin-top:0}summary::-webkit-details-marker{color:var(--text-main)}dialog{background-color:#f7f7f7;background-color:var(--background-alt);color:var(--text-main);border:#dbdbdb;border-color:var(--border);border-radius:6px;padding:10px 30px}dialog>header:first-child{background-color:#efefef;background-color:var(--background);text-align:center;border-radius:6px 6px 0 0;margin:-10px -30px 10px;padding:10px}dialog::backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0000009c}footer{border-top:1px solid #dbdbdb;border-top:1px solid var(--border);color:var(--text-muted);padding-top:10px}body>footer{margin-top:40px}@media print{body,pre,code,summary,details,button,input,textarea{background-color:#fff}button,input,textarea{border:1px solid #000}body,h1,h2,h3,h4,h5,h6,pre,code,button,input,textarea,footer,summary,strong{color:#000}summary::marker{color:#000}summary::-webkit-details-marker{color:#000}tbody tr:nth-child(2n){background-color:#f2f2f2}a{color:#00f;text-decoration:underline}}*,:before,:after{box-sizing:border-box}.gameboard{width:min(100%,27rem)}.menu{padding:1em}.menu #natmal_title{font-weight:700;position:relative}.menu #natmal_title #natmal{text-align:center;font-size:3em}.menu #natmal_title #nat{text-align:center;font-size:1em;position:absolute;top:-.5em;left:0;right:0;transform:translate(-2.25em)}.menu #natmal_title #mal{text-align:center;font-size:1em;position:absolute;top:-.5em;left:0;right:0;transform:translate(2.15em)}.gamearea{flex-direction:column;justify-content:center;align-items:center;display:flex}.gamerow{flex-direction:row;justify-content:center;margin-bottom:.5em;display:flex}.gamerow .letter{border:1px solid #ccc;justify-content:center;align-items:center;width:min(4em,16.6667vw - .416667rem);height:min(4em,16.6667vw - .416667rem);margin:.25em;transition:transform .5s;display:flex;transform:rotateX(0)}.gamerow .letter.unchecked{background-color:#f4f4f4}.gamerow .letter.correct{background-color:#108f10;transform:rotateX(180deg)}.gamerow .letter.correct .letter-text{color:#fff;transform:rotateX(-180deg)}.gamerow .letter.malposition{background-color:#ca0;transform:rotateX(180deg)}.gamerow .letter.malposition .letter-text{color:#fff;transform:rotateX(-180deg)}.gamerow .letter.absent{background-color:#444;transform:rotateX(180deg)}.gamerow .letter.absent .letter-text{color:#fff;transform:rotateX(-180deg)}.gamerow .letter .letter-text{color:#000;font-size:clamp(1.75rem,10vw,3rem);transition:transform .5s;transform:rotateX(0)}.message-area{flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;display:flex}.keyboard{flex-direction:column;justify-content:center;align-items:center;width:100%;display:flex}.keyboard .keyboard-row{flex-direction:row;justify-content:center;width:100%;margin-bottom:.5em;display:flex}.keyboard .keyboard-row .keyboard-key{border:1px solid #888;flex-direction:column;flex:1;justify-content:center;align-items:center;width:4em;height:4em;margin:.25em;display:flex}.keyboard .keyboard-row .keyboard-key .keyboard-key-input{border:1px solid #ccc;flex:1;justify-content:center;align-items:center;width:100%;height:100%;display:flex;overflow:visible;container-type:inline-size}.keyboard .keyboard-row .keyboard-key .keyboard-key-input.unchecked{color:#000;background-color:#fff}.keyboard .keyboard-row .keyboard-key .keyboard-key-input.unchecked:hover{background-color:#eee}.keyboard .keyboard-row .keyboard-key .keyboard-key-input.correct{color:#fff;background-color:#108f10}.keyboard .keyboard-row .keyboard-key .keyboard-key-input.correct:hover{background-color:#109f10}.keyboard .keyboard-row .keyboard-key .keyboard-key-input.malposition{color:#fff;background-color:#ca0}.keyboard .keyboard-row .keyboard-key .keyboard-key-input.malposition:hover{background-color:#ddbb10}.keyboard .keyboard-row .keyboard-key .keyboard-key-input.absent{color:#fff;background-color:#444}.keyboard .keyboard-row .keyboard-key .keyboard-key-input.absent:hover{background-color:#555}.keyboard .keyboard-row .keyboard-key .keyboard-key-input:active{transform:scale(.9)}.keyboard .keyboard-row .keyboard-key .keyboard-key-input .keyboard-key-text{-webkit-user-select:none;user-select:none;cursor:default;pointer-events:none;font-size:max(1.2em,1em + 7cqw);overflow:visible}.keyboard .keyboard-row .keyboard-key .keyboard-key-child{flex-direction:row;flex:1;justify-content:center;align-items:center;width:100%;display:flex}.keyboard .keyboard-row .keyboard-key.key-enter,.keyboard .keyboard-row .keyboard-key.key-backspace{flex:1.5;width:4em;height:4em;margin:.25em}.keyboard .keyboard-row .keyboard-pad-full{flex:1;width:4em;height:4em;margin:.25em}.keyboard .keyboard-row .keyboard-pad{flex:.5;width:4em;height:4em;margin:.25em}@media (width<=767px){.keyboard{--keyboard-gap:clamp(.125rem, .6vw, .25rem);--keyboard-key-height:clamp(2.25rem, 10vw, 2.75rem);gap:var(--keyboard-gap);width:calc(100vw - .5rem)}.keyboard .keyboard-row{gap:var(--keyboard-gap);margin-bottom:0}.keyboard .keyboard-row .keyboard-key{width:auto;min-width:0;height:var(--keyboard-key-height);flex-basis:0;margin:0}.keyboard .keyboard-row .keyboard-key.key-enter,.keyboard .keyboard-row .keyboard-key.key-backspace{width:auto;height:var(--keyboard-key-height);margin:0}.keyboard .keyboard-row .keyboard-key .keyboard-key-input{min-width:0}.keyboard .keyboard-row .keyboard-key .keyboard-key-input .keyboard-key-text{font-size:clamp(1.1rem,5vw,1.4rem)}.keyboard .keyboard-row .keyboard-key .keyboard-key-child .keyboard-key-text{font-size:clamp(.75rem,3.4vw,1rem)}.keyboard .keyboard-row .keyboard-pad,.keyboard .keyboard-row .keyboard-pad-full{width:auto;min-width:0;height:var(--keyboard-key-height);margin:0}.gamearea:has(#advanced-keyboard:checked) .keyboard{--keyboard-key-height:clamp(3.5rem, 16vw, 4rem)}}@keyframes pop{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}