@font-face{font-family:Pretendard;font-weight:600;font-display:swap;src:url(/fonts/Pretendard-SemiBold.subset.woff2)format("woff2")}@font-face{font-family:Pretendard;font-weight:800;font-display:swap;src:url(/fonts/Pretendard-ExtraBold.subset.woff2)format("woff2")}@font-face{font-family:Pretendard;font-weight:900;font-display:swap;src:url(/fonts/Pretendard-Black.subset.woff2)format("woff2")}*,:before,:after{box-sizing:border-box}*{margin:0}[hidden]{display:none!important}html,body{height:100%}body{-webkit-text-size-adjust:100%;overflow-x:hidden}button,input,textarea{font:inherit;color:inherit}.sr{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:fixed;top:0;left:0;overflow:hidden}:root{--bg:#000;--ink:#f2f2f2;--ink-spin:#f2f2f273;--ink-jamo:#f2f2f2cc;--accent:#ffe500;--wrong:#ff3b30;--miss:#3fd8ff;--mute:#8e8e8e;--line:#2a2a2a;--focus:#ffe500;--pad:12px;--gap:10px;--cell:34px;--cols:8;--rows:13;--top-h:36px;--status-h:86px;--foot-h:44px;--ch:16px;--chg:4px;--sq:22px;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}body{background:var(--bg);color:var(--ink);font-feature-settings:"tnum";font-family:Pretendard,-apple-system,Apple SD Gothic Neo,sans-serif;font-weight:600}.app{height:100dvh;min-height:560px;padding:var(--pad);gap:var(--gap);grid-template-columns:minmax(0,1fr);grid-template-rows:var(--top-h) var(--status-h) minmax(0,1fr) var(--foot-h);padding:max(var(--pad),env(safe-area-inset-top)) max(var(--pad),env(safe-area-inset-right)) max(var(--pad),env(safe-area-inset-bottom)) max(var(--pad),env(safe-area-inset-left));grid-template-areas:"top""status""stage""foot";display:grid;overflow:hidden}.top{white-space:nowrap;grid-area:top;align-items:center;gap:6px;min-width:0;display:flex;overflow:hidden}.status{grid-template:"found chance"28px"prog prog"minmax(0,1fr)/auto minmax(0,1fr);grid-area:status;gap:8px 10px;min-width:0;min-height:0;transition:opacity .3s;display:grid;overflow:hidden}.stage{grid-area:stage;min-width:0;min-height:0;position:relative}.foot{grid-area:foot;align-items:center;gap:10px;min-width:0;transition:opacity .3s;display:flex}.app[data-state=intro] .status,.app[data-state=intro] .foot .hint,.app[data-state=wait] .status,.app[data-state=wait] .foot .hint,.app[data-state=blocked] .status,.app[data-state=error] .status{opacity:.35}.app[data-result] .foot .js-new{display:none}.top h1{text-overflow:ellipsis;letter-spacing:-.04em;flex:0 auto;min-width:0;margin-right:auto;font-size:18px;font-weight:800;line-height:1.1;overflow:hidden}.seg{border:1px solid #3a3a3a;flex:none;height:34px;display:flex}.seg button{color:#bdbdbd;cursor:pointer;white-space:nowrap;background:0 0;border:0;padding:0 7px;font-size:12.5px;font-weight:600}.seg button+button{border-left:1px solid #3a3a3a}.seg button[aria-pressed=true]{background:var(--accent);color:#000}.seg button:focus-visible{outline-offset:-2px;outline:2px solid #fff}.seg.fixed{color:var(--mute);border-style:dashed;align-items:center;padding:0 9px;font-size:12.5px;font-weight:600}.stat{white-space:nowrap;align-items:center;gap:8px;min-width:0;display:flex}.stat-found{grid-area:found}.stat-chance{grid-area:chance;justify-self:end}.lab{color:var(--mute);font-size:12px;font-weight:600}.val{letter-spacing:-.03em;font-size:26px;font-weight:800;line-height:1}#count{color:var(--accent);display:inline-block}.of{color:var(--mute);font-weight:600}.chances{gap:var(--chg);display:flex}.chance{width:var(--ch);height:var(--ch);outline-offset:-1.5px;outline:1.5px solid #3a3a3a;flex:none;position:relative}.chance i{background:var(--accent);position:absolute;inset:2px;box-shadow:0 0 12px #ffe5008c}.chance.used i{opacity:0}.chances.last .chance:not(.used) i{animation:1.2s ease-in-out infinite pulse}@keyframes pulse{50%{transform:scale(1.25)}}.cnum{min-width:1ch;font-size:20px;font-weight:800}.prog{grid-area:prog;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,var(--sq));align-content:center;gap:6px 10px;min-width:0;padding:0;list-style:none;display:grid}.slot{perspective:400px;align-items:center;gap:2px;min-width:0;display:flex}.sq{width:var(--sq);height:var(--sq);line-height:1;font-size:calc(var(--sq)*.6);border:1.5px solid #474747;flex:none;place-items:center;font-weight:800;display:grid}.sq.on{background:var(--accent);border-color:var(--accent);color:#000}.wtxt{font-size:calc(var(--sq)*.78);font-weight:800;line-height:var(--sq);height:var(--sq);letter-spacing:-.02em;color:#d8d8d8;background:linear-gradient(var(--accent),var(--accent)) no-repeat 0 50%/0% 100%;padding:0 .18em;transition:background-size .35s ease-out,color .2s;display:inline-block}.slot.done .wtxt{color:#000;background-size:100% 100%}.hc{font-size:calc(var(--sq)*1.05);color:#bdbdbd;white-space:nowrap;grid-area:1/1/-1/-1;align-self:center;font-weight:600}.hc b{color:var(--accent);margin:0 .1em;font-size:1.3em;font-weight:900}@media (width<=767.98px){.app.prog8{--status-h:142px}.prog8 .prog{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(4,var(--sq))}}.box{width:calc(var(--cell)*var(--cols));height:calc(var(--cell)*var(--rows));margin:auto;position:absolute;inset:0}.layer{pointer-events:none;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.board{grid-template-columns:repeat(var(--cols),var(--cell));grid-auto-rows:var(--cell);touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;cursor:pointer;display:grid;position:absolute;inset:0}.row{display:contents}.cell{font-size:calc(var(--cell)*.68);color:var(--ink);outline:none;justify-content:center;align-items:center;font-weight:600;line-height:1;transition:opacity .6s;display:flex}.cell.spin{color:var(--ink-spin)}.cell.jamo{color:var(--ink-jamo)}.cell.found{color:#000;font-weight:800}.cell.missed{color:var(--miss)}.cell:focus-visible{outline:3px solid var(--focus);outline-offset:-3px;z-index:2;position:relative}.band,.wrongbox,.dictbox{top:calc(var(--cell)*var(--r));left:calc(var(--cell)*var(--c));width:calc(var(--cell)*var(--n));height:var(--cell);pointer-events:none;position:absolute}.band{opacity:0;background:#ffe50057;transform:skew(-8deg)}.band.v,.wrongbox.v,.dictbox.v{width:var(--cell);height:calc(var(--cell)*var(--n))}.band.v{transform:skewY(-8deg)}.band.on{opacity:1}.band.anchor{outline:2px dashed var(--accent);outline-offset:-2px;background:0 0;transform:none}.wrongbox{background:#ff3b306b;animation:.4s ease-out forwards fadeout}.dictbox{background:#ffffff38;animation:.6s ease-out forwards fadeout}@keyframes fadeout{0%{opacity:1}to{opacity:0}}.box.dim .cell:not(.found):not(.missed){opacity:.15}.mk-found{fill:none;stroke:var(--accent);stroke-width:.8px}.draw{stroke-dasharray:1 1;stroke-dashoffset:1px;animation:.35s ease-out forwards draw}@keyframes draw{to{stroke-dashoffset:0}}.mk-miss{fill:#3fd8ff1a;stroke:var(--miss);stroke-width:.06px;stroke-dasharray:.18 .1;animation:.15s ease-out fadein}@keyframes fadein{0%{opacity:0}}.notice{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:18px;padding:0 12px;display:flex;position:absolute;inset:0}.notice p{letter-spacing:-.03em;font-size:20px;font-weight:800;line-height:1.4}.hint{text-overflow:ellipsis;white-space:nowrap;color:#a3a3a3;flex:auto;min-width:0;font-size:13px;transition:opacity .3s;overflow:hidden}.hint.gone{opacity:0}.btn{background:var(--accent);color:#000;letter-spacing:-.01em;cursor:pointer;white-space:nowrap;border:0;flex:none;height:44px;padding:0 22px;font-size:16px;font-weight:800}.btn:active{transform:translateY(1px)}.btn:focus-visible{outline-offset:3px;outline:3px solid #fff}.btn.ghost{color:var(--ink);background:0 0;box-shadow:inset 0 0 0 2px #5a5a5a}.btn.line{color:var(--accent);box-shadow:inset 0 0 0 2px var(--accent);background:0 0}.result{z-index:5;overscroll-behavior:contain;border:2px solid var(--accent);opacity:0;background:#000;max-height:100%;padding:16px 16px 14px;transition:opacity .3s ease-out,transform .3s cubic-bezier(.2,.8,.2,1);position:absolute;inset:auto 0 0;overflow:auto;transform:translateY(24px);box-shadow:0 -16px 48px #000}.result.show{opacity:1;transform:none}.result.lose{border-color:var(--miss)}.r-title{letter-spacing:-.04em;margin-top:2px;font-size:clamp(26px,3vw,40px);font-weight:800}.r-stat{color:#bdbdbd;margin-top:4px;font-size:15px}.r-stat b{color:var(--ink)}.r-first{border-top:1px solid var(--line);margin-top:12px;padding-top:10px}.r-lab{color:var(--mute);font-size:13px}.r-word{letter-spacing:-.03em;color:var(--accent);white-space:nowrap;margin-top:2px;font-size:clamp(50px,5vw,92px);font-weight:900;line-height:1.1}.r-word span{display:inline-block}.r-word .mid{opacity:.5}.r-subs{letter-spacing:-.03em;color:var(--ink);white-space:nowrap;gap:14px;margin-top:2px;font-size:clamp(22px,2vw,30px);font-weight:800;display:flex;overflow:hidden}.r-cmp{border-left:3px solid var(--accent);overflow-wrap:anywhere;background:#141414;margin-top:10px;padding:8px 10px;font-size:14px;font-weight:600;line-height:1.35}.r-next{color:var(--mute);margin-top:8px;font-size:13px}.r-acts{grid-template-columns:1fr 1fr;gap:8px;margin-top:14px;display:grid}.r-acts .btn{width:100%;height:48px;padding:0 8px;font-size:16px}.chal{gap:8px;margin-top:10px;display:flex}.chal input{background:#0e0e0e;border:1.5px solid #474747;border-radius:0;flex:auto;min-width:0;height:44px;padding:0 12px;font-size:16px}.chal input:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}.chal .btn{height:44px;padding:0 16px;font-size:15px}.fallback{margin-top:10px}.fallback p{color:var(--accent);margin-bottom:6px;font-size:13px}.fallback textarea{resize:none;background:#0e0e0e;border:1.5px solid #474747;border-radius:0;width:100%;height:84px;padding:8px 10px;font-size:14px;line-height:1.4;display:block}.r-links{color:var(--mute);margin-top:12px;font-size:12px}.r-links a{color:inherit;text-underline-offset:2px}.r-links a:focus-visible{outline-offset:2px;outline:2px solid #fff}.modal{z-index:70;background:#000000f0;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:16px;display:flex;position:fixed;inset:0}.modal p{text-align:center;font-size:15px;font-weight:600}.modal img{-webkit-touch-callout:default;border:1px solid #333;width:auto;max-width:min(100%,480px);height:auto;max-height:calc(100% - 120px);display:block}.modal .btn{height:44px}.demo-list{z-index:60;background:#0a0a0a;border:1px solid #333;flex-direction:column;gap:4px;max-height:calc(100% - 16px);padding:8px;display:flex;position:fixed;top:8px;right:8px;overflow:auto}.demo-list button{color:#ddd;cursor:pointer;white-space:nowrap;text-align:left;background:#111;border:1px solid #333;padding:6px 10px;font-size:12px;font-weight:600}.demo-list button[aria-pressed=true]{background:var(--accent);color:#000}.demo-list hr{border:0;border-top:1px solid #333;margin:2px 0}.rm .wrongbox,.rm .dictbox,.rm .mk-miss{animation:none}.rm .dictbox{outline-offset:-2px;background:0 0;outline:2px solid #fff}.rm .wrongbox{outline:3px solid var(--wrong);outline-offset:-3px;background:0 0}.rm .draw{stroke-dashoffset:0;animation:none}.rm .chances.last .chance i{animation:none!important}.rm .result,.rm .cell,.rm .status,.rm .foot,.rm .hint,.rm .wtxt{transition:none}@media (width>=768px){:root{--pad:20px;--gap:14px;--top-h:44px;--status-h:54px;--sq:24px;--ch:18px;--chg:5px}.app{grid-template-columns:auto minmax(0,1fr);grid-template-rows:var(--top-h) var(--status-h) minmax(0,1fr);grid-template-areas:"top foot""status status""stage stage"}.top{gap:8px}.top h1{margin-right:6px;font-size:24px}.seg button{padding:0 10px;font-size:14px}.foot{justify-content:flex-end}.hint{flex:0 auto;max-width:320px}.status{grid-template:"found prog chance"minmax(0,1fr)/auto minmax(0,1fr) auto;align-items:center;gap:0 24px}.prog{grid-template-columns:none;grid-auto-columns:max-content;grid-auto-flow:column;grid-template-rows:repeat(2,var(--sq));justify-content:center;gap:6px 18px}.result{width:min(460px,100% - 24px);height:fit-content;margin:auto;inset:0}.r-acts{grid-template-columns:1fr}}@media (width>=1280px){:root{--pad:28px;--sq:clamp(26px,1.9vw,40px);--ch:clamp(24px,1.6vw,30px);--chg:8px}.app{grid-template:"stage top""stage status"minmax(0,1fr)"stage foot"/minmax(0,1fr) clamp(360px,22vw,400px);gap:0 36px}.top,.status,.foot{border-left:1px solid var(--line);padding-left:28px}.top{white-space:normal;flex-wrap:wrap;align-content:flex-start;gap:12px 8px;padding-top:2px;padding-bottom:20px}.top h1{flex-basis:100%;margin:0;font-size:clamp(30px,2.4vw,46px)}.seg{height:36px}.seg button,.seg.fixed{padding:0 12px;font-size:15px}.status{flex-direction:column;justify-content:center;align-items:stretch;gap:clamp(20px,3.4vh,44px);display:flex}.stat{flex-direction:column;align-items:flex-start;gap:6px}.lab{font-size:14px}.val{letter-spacing:-.06em;font-size:clamp(76px,6.6vw,136px)}.of{letter-spacing:0;margin-left:.12em;font-size:.42em}.prog{grid-template-columns:repeat(2,max-content);grid-auto-columns:auto;grid-auto-flow:row;grid-template-rows:repeat(var(--prow,3),var(--sq));flex:none;justify-content:start;gap:12px 16px}.stat-chance{flex-flow:wrap;justify-self:auto;align-items:center;gap:10px 16px}.stat-chance .lab{flex-basis:100%}.cnum{font-size:clamp(26px,1.9vw,38px)}.foot{flex-direction:column;align-items:stretch;gap:12px;padding-top:16px}.hint{white-space:normal;-webkit-line-clamp:2;-webkit-box-orient:vertical;flex:none;max-width:none;height:2.8em;font-size:15px;line-height:1.4;display:-webkit-box;overflow:hidden}.foot .btn{height:60px;font-size:20px}.foot .js-new[hidden],.app[data-result] .foot .js-new{visibility:hidden;display:block!important}}
