.course-map{background:var(--paper);color:var(--ink)}.course-map .sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.course-map .ko{font-family:Nanum Gothic,sans-serif;font-weight:800}.course-map .ico{flex:none;width:14px;height:14px}.course-map .topbar{box-sizing:border-box;justify-content:space-between;align-items:center;width:100%;max-width:1120px;margin:0 auto;padding:20px 32px 0;display:flex}.course-map .topbar__title{color:var(--ink-soft);margin:0;font-size:15px;font-weight:800}.course-map .pill{appearance:none;color:var(--ink);background:var(--card);border:1.5px solid var(--line);cursor:pointer;border-radius:12px;align-items:center;gap:6px;padding:8px 14px;font-size:14px;font-weight:800;display:inline-flex}.course-map .layout{box-sizing:border-box;grid-template-columns:240px 1fr;align-items:start;gap:28px;width:100%;max-width:1120px;margin:0 auto;padding:24px 32px 64px;display:grid}.course-map .map-switch{display:none}.course-map .side{position:sticky;top:20px}.course-map .side__h{letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint);margin:0 0 8px 4px;font-size:12px;font-weight:800}.course-map .group{background:var(--card);border:1.5px solid var(--line);border-radius:16px;margin-bottom:22px;overflow:hidden}.course-map .course{appearance:none;width:100%;color:var(--ink);border:0;border-top:1.5px solid var(--line);text-align:left;font:inherit;cursor:pointer;background:0 0;justify-content:space-between;align-items:center;gap:10px;padding:12px 14px;display:flex}.course-map .group>.course:first-child{border-top:0}.course-map .course b{font-size:15px;display:block}.course-map .course small{color:var(--ink-faint);margin-top:1px;font-size:12px;font-weight:600;display:block}.course-map .course[data-active]{background:var(--action);color:var(--on-action);cursor:default}.course-map .course[data-active] small{color:inherit;opacity:.8}.course-map .course[data-active] .go{background:var(--on-action);width:26px;height:26px;color:var(--action);border-radius:8px;place-items:center;display:grid}.course-map .course[data-locked]{color:var(--ink-faint);cursor:default}.course-map .course[data-locked] b{color:var(--ink-soft)}.course-map .chev{color:var(--ink-faint);font-size:20px;font-weight:800}.course-map .panel{background:var(--deep);border:1.5px solid var(--line);border-radius:20px;padding:20px 22px 26px}.course-map__dev{color:var(--jamo-current);margin:0 0 10px;font:800 13px/1.3 Nunito,sans-serif}.course-map .progress{align-items:center;gap:16px;margin-bottom:6px;display:flex}.course-map .map-done{color:var(--ink-soft);white-space:nowrap;margin:0;font-size:14px;font-weight:800}.course-map .bar{background:var(--card);border:1.5px solid var(--line);border-radius:10px;flex:1;height:30px;position:relative;overflow:hidden}.course-map .bar span{background:var(--action);position:absolute;inset:0 auto 0 0}.course-map .bar em{color:var(--ink);place-items:center;font-size:13px;font-style:normal;font-weight:800;display:grid;position:absolute;inset:0}.course-map .unit h2{align-items:baseline;gap:10px;margin:22px 0 10px;font-size:19px;display:flex}.course-map .unit__n{letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint);font-size:12px;font-weight:800}.course-map .lessons{flex-direction:column;gap:10px;margin:0;padding:0;list-style:none;display:flex}.course-map .lesson{background:var(--card);border:1.5px solid var(--line);border-radius:14px;grid-template-columns:auto 1fr auto;align-items:center;gap:4px 14px;padding:14px 16px 20px;display:grid;position:relative;overflow:hidden}.course-map .num{border:2px solid;border-radius:50%;place-items:center;width:30px;height:30px;font-size:14px;font-weight:800;display:grid}.course-map .lesson h3{border-bottom:1.5px solid var(--line);margin:0 0 6px;padding-bottom:6px;font-size:18px;font-weight:800}.course-map .stats{color:var(--ink-soft);flex-wrap:wrap;align-items:center;gap:4px 16px;margin:0;font-size:13px;display:flex}.course-map .stats b{color:var(--ink);font-weight:800}.course-map .lat{color:var(--ink-faint);margin-right:4px;font-size:11px;font-weight:800}.course-map .flag{background:var(--ok-soft);color:var(--ok);border-radius:6px;padding:1px 7px;font-size:11.5px;font-weight:800}.course-map .stars i{color:#0000;-webkit-text-stroke:1.2px currentColor;letter-spacing:1px;font-size:15px;font-style:normal}.course-map .stars i.on{color:#f2b33d;-webkit-text-stroke:0}.course-map .lbtn{white-space:nowrap;border-radius:11px;justify-content:center;align-items:center;gap:7px;min-width:104px;padding:9px 14px;font-size:14px;font-weight:800;display:inline-flex}.course-map button.lbtn{appearance:none;cursor:pointer;font:inherit;border:0;font-size:14px;font-weight:800}.course-map .lbtn--primary{background:var(--action);color:var(--on-action)}.course-map .lbtn--big{min-width:0;padding:10px 18px}.course-map .lbtn--ghost{background:var(--card);color:var(--ok)}.course-map .lbtn--lock{min-width:104px;color:var(--ink-faint)}.course-map .lbtn--lock .ico{width:18px;height:18px}.course-map .lesson__hit{appearance:none;z-index:1;cursor:pointer;border-radius:inherit;background:0 0;border:0;padding:0;position:absolute;inset:0}.course-map .lesson__hit:focus-visible{outline:2px solid var(--action);outline-offset:-2px}.course-map .segs{pointer-events:none;gap:3px;height:6px;display:flex;position:absolute;bottom:0;left:0;right:0}.course-map .segs i{background:var(--track);flex:1}.course-map .lesson[data-state=done]{--g:light-dark(#3f8f68,#2b4d3b);background:var(--g);border-color:var(--g);color:light-dark(#fff,#e4f3ea)}.course-map .lesson[data-state=done] h3{border-color:light-dark(#ffffff40,#fff2)}.course-map .lesson[data-state=done] .stats,.course-map .lesson[data-state=done] .stats b{color:inherit}.course-map .lesson[data-state=done] .stats{opacity:.95}.course-map .lesson[data-state=done] .segs i{background:light-dark(#ffffff59,#ffffff30)}.course-map .lesson[data-state=done] .stars i{color:light-dark(#fff,#0000)}.course-map .lesson[data-state=done] .stars i.on{color:#ffd166}.course-map .lesson[data-state=done] .stars i:not(.on){color:#0000;-webkit-text-stroke:1.2px light-dark(#fffa,#fff6)}.course-map .lesson[data-state=current]{border:2px solid var(--action);box-shadow:0 0 0 4px var(--action-wash)}.course-map .lesson[data-state=current] .num{background:var(--action);border-color:var(--action);color:var(--on-action)}.course-map .lesson[data-state=current] .segs i.on{background:var(--action)}.course-map .lesson[data-state=locked]{color:var(--ink-soft);background:0 0}.course-map .lesson[data-state=locked] h3{color:var(--ink-soft)}.course-map .lesson[data-state=locked] .num{color:var(--ink-faint)}.course-map .lesson[data-state=locked] .segs i{background:var(--line)}.course-map .lesson h3 .ko{vertical-align:-1px;font-size:1.2em}.course-map .stats .ko{color:var(--ink);font-size:1.1em}.course-map[data-layout=mobile] .topbar{padding:14px 16px 0}.course-map[data-layout=mobile] .map-switch{background:var(--deep);border:1.5px solid var(--line);border-radius:14px;margin:14px 16px 0;padding:4px;display:flex}.course-map[data-layout=mobile] .map-switch button{appearance:none;text-align:center;color:var(--ink-soft);cursor:pointer;background:0 0;border:0;border-radius:10px;flex:1;padding:9px 0;font-size:13.5px;font-weight:800}.course-map[data-layout=mobile] .map-switch button[aria-selected=true]{background:var(--action);color:var(--on-action)}.course-map[data-layout=mobile] .map-switch button:disabled{opacity:1;cursor:default}.course-map[data-layout=mobile] .layout{padding:12px 12px 40px;display:block}.course-map[data-layout=mobile] .side{display:none}.course-map[data-layout=mobile] .panel{border-radius:18px;padding:14px 12px 18px}.course-map[data-layout=mobile] .progress{flex-direction:column;align-items:stretch;gap:10px}.course-map[data-layout=mobile] .bar{flex:none}.course-map[data-layout=mobile] .lesson{grid-template-columns:auto 1fr auto;grid-template-areas:"n t b""s s s";gap:4px 10px;padding:12px 12px 18px}.course-map[data-layout=mobile] .num{grid-area:n}.course-map[data-layout=mobile] .lesson__main{display:contents}.course-map[data-layout=mobile] .lesson h3{border:0;grid-area:t;margin:0;padding:0;font-size:16px}.course-map[data-layout=mobile] .lesson>.lbtn{grid-area:b}.course-map[data-layout=mobile] .stats{border-top:1.5px solid var(--line);grid-area:s;gap:2px 12px;margin-top:4px;padding-top:8px;font-size:12.5px}.course-map[data-layout=mobile] .lesson[data-state=done] .stats{border-color:light-dark(#ffffff40,#fff2)}.course-map[data-layout=mobile] .lbtn{min-width:0;padding:8px 11px;font-size:13px}.course-map[data-layout=mobile] .lbtn--lock{padding:8px 4px}.course-map[data-layout=mobile] .lbtn--big{padding:12px;font-size:15px}.course-map[data-layout=mobile] .lesson[data-state=done] .lbtn{min-width:0;padding:8px 10px}.home{box-sizing:border-box;flex:1;gap:48px;width:min(1120px,100%);min-height:0;margin:0 auto;padding:32px 40px 40px;display:flex;overflow:auto}.home__continue{flex-direction:column;flex:none;gap:16px;width:min(400px,100%);display:flex}.home__greet{color:var(--ink-soft);margin:0;font:700 14px/1.3 Nunito,sans-serif}.home__dev{color:var(--jamo-current);margin:0;font:800 13px/1.3 Nunito,sans-serif}.home__title{letter-spacing:-.01em;margin:0;font:800 clamp(26px,3vw,34px)/1.15 Nunito,sans-serif}.home__card{background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:20px;flex-direction:column;gap:12px;padding:20px;display:flex}.home__card-top,.path-card__top,.home__bar{justify-content:space-between;align-items:center;gap:12px;display:flex}.home__eyebrow{letter-spacing:.08em;text-transform:uppercase;color:var(--jamo-current);margin:0;font:800 12px/1 Nunito,sans-serif}.home__meta,.home__en{color:var(--ink-soft);margin:0;font:600 14px/1.4 Nunito,sans-serif}.home__ko{color:var(--done);margin:0;font:800 34px/1.2 Nanum Gothic,sans-serif}.home__ko--jamo{font-size:72px;font-weight:400;line-height:1}.home__track{background:var(--track);border-radius:9px;flex:1;height:6px;overflow:hidden}.home__track div{background:var(--action);border-radius:9px;height:100%}.home__bar span{color:var(--ink-soft);white-space:nowrap;font:700 13px/1 Nunito,sans-serif}.home__cta{border-radius:14px;min-height:52px;font:800 16px/1 Nunito,sans-serif}.home__placement{border:1px dashed var(--key-hint-line);border-radius:16px;justify-content:space-between;align-items:center;gap:12px;padding:14px 16px;display:flex}.home__placement strong{font:800 15px/1.3 Nunito,sans-serif;display:block}.home__placement span{color:var(--ink-soft);font:600 13px/1.4 Nunito,sans-serif;display:block}.home__path{flex:1;min-width:0}.home__path h3{letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);margin:8px 0 16px;font:800 12px/1 Nunito,sans-serif}.home__path ol{flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.path-step{gap:16px;display:flex}.path-step__rail{flex-direction:column;flex:none;align-items:center;width:38px;display:flex}.path-step__node{box-sizing:border-box;border:2px dashed var(--key-hint-line);width:38px;height:38px;color:var(--ink-soft);background:0 0;border-radius:50%;place-items:center;font:800 15px/1 Nunito,sans-serif;display:grid}.path-step--complete .path-step__node{background:var(--ink);border:2px solid var(--ink);color:var(--paper)}.path-step--current .path-step__node,.path-step--start .path-step__node{background:var(--action);border:2px solid var(--action);color:var(--on-action)}.path-step__line{background:var(--key-hint-line);flex:1;width:2px;margin:4px 0}.path-step--complete .path-step__line{background:var(--ink)}.path-card{text-align:left;background:var(--card);border:1px solid var(--line);min-width:0;color:inherit;cursor:pointer;box-shadow:var(--shadow);border-radius:16px;flex-direction:column;flex:1;gap:8px;margin:0 0 12px;padding:16px 20px;display:flex}.path-step--current .path-card,.path-step--start .path-card{border-color:var(--action);box-shadow:0 0 0 3px var(--action-wash)}.path-step--locked .path-card{border-style:dashed;border-color:var(--key-hint-line);box-shadow:none;background:0 0}.path-card__name{font:800 18px/1.2 Nunito,sans-serif}.path-step--locked .path-card__name{color:var(--ink-soft)}.path-card__ko{color:var(--ink-soft);font:700 15px/1 Nanum Gothic,sans-serif}.path-card__pill{background:var(--deep);color:var(--ink-soft);border-radius:99px;padding:4px 10px;font:800 12px/1 Nunito,sans-serif}.path-step--complete .path-card__pill{background:var(--ok-soft);color:var(--ok)}.path-step--current .path-card__pill,.path-step--start .path-card__pill{background:var(--action-wash);color:var(--jamo-current)}.path-card__desc{color:var(--ink-soft);margin:0;font:600 14px/1.45 Nunito,sans-serif}.path-card__sample{color:var(--done);margin:0;font:700 16px/1.3 Nanum Gothic,sans-serif}.path-step--locked .path-card__sample{color:var(--remaining)}.keys-complete__rail{justify-content:center;align-items:flex-start;gap:6px;display:flex}.keys-complete__done,.keys-complete__next,.keys-complete__later{flex-direction:column;align-items:center;gap:4px;font:800 16px/1 Nunito,sans-serif;display:flex}.keys-complete__done{background:var(--ink);width:56px;height:56px;color:var(--paper);border-radius:50%;place-items:center;display:grid}.keys-complete__next{background:var(--action);width:56px;height:56px;color:var(--on-action);box-shadow:0 0 0 6px var(--action-wash);border-radius:50%;place-items:center;display:grid}.keys-complete__later{border:2px dashed var(--key-hint-line);width:40px;height:40px;color:var(--ink-soft);border-radius:50%;place-items:center;margin-top:8px;display:grid}.keys-complete__done small,.keys-complete__next small,.keys-complete__later small{color:var(--ink-soft);white-space:nowrap;margin-top:78px;font:700 12px/1 Nunito,sans-serif;position:absolute}.keys-complete__rail{padding-bottom:28px;position:relative}.keys-complete__done,.keys-complete__next,.keys-complete__later{position:relative}.keys-complete__done small,.keys-complete__next small,.keys-complete__later small{margin:0;position:absolute;top:calc(100% + 8px)}.keys-complete__join{background:var(--ink);width:28px;height:2px;margin-top:27px}.keys-complete__join--dashed{border-top:2px dashed var(--key-hint-line);background:0 0}.keys-complete__first{border:1px dashed var(--key-hint-line);text-align:left;border-radius:14px;flex-direction:column;gap:2px;padding:12px 14px;display:flex}.keys-complete__first span{letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);font:800 11px/1 Nunito,sans-serif}.keys-complete__first strong{font:800 22px/1.2 Nanum Gothic,sans-serif}.keys-complete__first em{color:var(--ink-soft);font:600 13px/1.3 Nunito,sans-serif}.mode-overview{flex-direction:column;gap:14px;width:min(720px,100%);margin:0 auto;padding:28px 20px 40px;display:flex}.mode-overview h2{margin:0;font:800 34px/1.1 Nunito,sans-serif}.mode-overview__desc{color:var(--ink-soft);margin:0;font:600 15px/1.45 Nunito,sans-serif}.unit-list{flex-direction:column;gap:8px;margin:8px 0 0;padding:0;list-style:none;display:flex}.unit-row{border:1px solid var(--line);width:100%;color:inherit;text-align:left;cursor:pointer;background:0 0;border-radius:14px;align-items:center;gap:14px;padding:12px 16px;display:flex}.unit-row--current{background:var(--card);border-color:var(--action)}.unit-row__node{border:1.5px solid var(--line);border-radius:50%;flex:none;place-items:center;width:32px;height:32px;font:800 14px/1 Nunito,sans-serif;display:grid}.unit-row--current .unit-row__node{border-color:var(--action);color:var(--jamo-current)}.unit-row__text{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.unit-row__text strong{font:800 16px/1.2 Nunito,sans-serif}.unit-row__text em{color:var(--ink-soft);font:700 14px/1.3 Nanum Gothic,sans-serif}.unit-row__meta{color:var(--ink-soft);font:700 13px/1 Nunito,sans-serif}.practice-app--phrases .phrase{letter-spacing:0;gap:0;font-size:clamp(40px,min(8vw,10dvh),96px)}.dialogue{flex-direction:column;flex:1;gap:12px;width:min(880px,100%);min-height:0;margin:0 auto;padding:12px 24px 8px;display:flex;overflow:hidden}.dialogue .practice-footer{flex:none;padding-top:4px}.dialogue__log{flex-direction:column;flex:1;justify-content:flex-end;gap:12px;min-height:0;display:flex;overflow:auto}.bubble-row{flex-direction:column;align-items:flex-start;gap:4px;max-width:80%;display:flex}.bubble-row--you{align-self:flex-end;align-items:flex-end}.bubble__who,.bubble__en{color:var(--ink-soft);font:700 12px/1.3 Nunito,sans-serif}.bubble{background:var(--card);border:1px solid var(--line);border-radius:6px 18px 18px;align-items:center;gap:10px;padding:10px 14px;font:700 18px/1.35 Nanum Gothic,sans-serif;display:flex}.bubble-row--you .bubble{background:var(--action-wash);border-color:#0000;border-radius:18px 6px 18px 18px}.bubble--live{border-color:var(--action)}.bubble__play{background:var(--deep);cursor:pointer;border:none;border-radius:50%;width:28px;height:28px;font:800 11px/1 Nunito,sans-serif}.dialogue__title{flex:none}.dialogue__title h2{margin:0;font:800 20px/1.2 Nunito,sans-serif}.dialogue__title span{color:var(--ink-soft);font:700 16px/1 Nanum Gothic,sans-serif}.dialogue__compose{background:var(--card);border:1.5px solid var(--action);border-radius:18px;flex-direction:column;flex:none;gap:8px;padding:14px 18px 16px;font-size:clamp(26px,3vw,36px);line-height:1.45;display:flex}.dialogue__compose-top{color:var(--ink-soft);justify-content:space-between;gap:10px;font:700 12px/1.3 Nunito,sans-serif;display:flex}.dialogue__compose-top span:first-child{color:var(--jamo-current);letter-spacing:.06em;text-transform:uppercase;font-weight:800}.line-results{text-align:left;flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.line-results li{background:var(--paper);border-radius:12px;justify-content:space-between;gap:10px;padding:8px 12px;display:flex}.line-results strong{font:800 15px/1.3 Nanum Gothic,sans-serif;display:block}.line-results em{color:var(--ink-soft);font:600 12px/1.3 Nunito,sans-serif;display:block}.line-results li>span:last-child{flex:none;font:800 13px/1.3 Nunito,sans-serif}.passage{flex-direction:column;flex:1;justify-content:flex-start;align-items:center;gap:16px;min-height:0;padding:12px 20px 24px;display:flex;overflow:auto}.passage__sheet{background:var(--card);border:1px solid var(--line);width:min(880px,100%);box-shadow:var(--shadow);border-radius:20px;flex-direction:column;gap:16px;padding:22px 28px 18px;font-size:clamp(20px,2.2vw,30px);line-height:1.9;display:flex}.passage__head{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px;font-size:16px;line-height:1.2;display:flex}.passage__head strong{margin-top:4px;font:800 20px/1.2 Nanum Gothic,sans-serif;display:block}.passage__tools{justify-content:flex-end;font-size:16px;line-height:1;display:flex}.live-stats{align-items:baseline;gap:8px;font:800 20px/1 Nunito,sans-serif;display:flex}.live-stats span{color:var(--ink-soft);margin-right:8px;font:700 12px/1 Nunito,sans-serif}.wpm-chart{background:var(--paper);border-radius:14px;align-items:stretch;gap:8px;padding:12px;display:flex}.wpm-chart__scale{color:var(--ink-soft);flex-direction:column;justify-content:space-between;font:700 11px/1 Nunito,sans-serif;display:flex}.wpm-chart__bars{flex:1;align-items:flex-end;gap:5px;height:84px;display:flex}.wpm-chart__bars div{background:var(--action);border-radius:4px 4px 2px 2px;flex:1;min-height:8px}.wpm-chart__labels{color:var(--ink-soft);justify-content:space-between;gap:8px;font:700 11px/1 Nunito,sans-serif;display:flex}.wpm-chart__note{text-align:center;color:var(--ink-soft);margin:0;font:600 12px/1.4 Nunito,sans-serif}.dialogue__log{justify-content:flex-end}.practice-app[data-mode=course] .keyboard-shell[data-compact=true] .keyboard-key{height:clamp(34px,min(10vw,5.2dvh),42px)}@media (width<=860px){.home{flex-direction:column;gap:20px;padding:18px 20px 28px}.home__continue{width:100%}.home__ko{font-size:28px}.path-card__desc{display:none}}.practice-app{background:var(--paper);min-height:100vh;color:var(--ink);flex-direction:column;display:flex}.practice-app[data-mode=practice]{color:#22242a;background:#f7f8fa}.practice-header{border-bottom:1px solid var(--line);background:0 0;justify-content:space-between;align-items:center;gap:28px;padding:16px 32px 14px;display:flex}.practice-app[data-mode=practice] .practice-header{background:#fff;border-bottom:1px solid #e8eaee}.brand{align-items:center;gap:13px;display:flex}button.brand,a.brand{color:inherit;cursor:pointer;font:inherit;text-align:left;background:0 0;border:0;padding:0;text-decoration:none}.brand__mark{border:2px solid var(--ink,#1a1614);width:40px;height:40px;box-shadow:3px 3px 0 var(--action,#2a5fdb);background:var(--card,#fffbf5);color:var(--ink,#1a1614);border-radius:12px;place-items:center;font-family:Nanum Gothic,sans-serif;font-size:21px;font-weight:800;line-height:1;display:grid}.brand h1{letter-spacing:-.03em;margin:0;font:600 19px/1 Nunito,Nanum Gothic,system-ui,-apple-system,sans-serif}.practice-header__tools{align-items:center;gap:14px;display:flex}.practice-main{flex-direction:column;flex:1;justify-content:center;align-items:center;padding:28px 24px 8px;display:flex}.course-progress{flex-direction:column;flex:1;gap:8px;min-width:180px;display:flex}.course-progress__row{justify-content:space-between;align-items:baseline;gap:16px;display:flex}.course-progress__step{color:#ffffff9e;font:500 13px/1 ui-monospace,SF Mono,Monaco,monospace}.course-progress__name{color:#ffffffeb;font:500 15px/1.2 Nunito,Nanum Gothic,system-ui,sans-serif}.course-progress__track{background:#ffffff1a;border-radius:99px;height:3px;overflow:hidden}.course-progress__fill{background:#4d74ff;border-radius:99px;height:100%}.course-new{flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;margin:0 0 18px;display:flex}.course-new__label{letter-spacing:.12em;text-transform:uppercase;color:#ffffff61;margin-right:4px;font:500 11px/1 ui-monospace,SF Mono,Monaco,monospace}.course-new__key{color:#e7edff;background:#3157ff38;border:1px solid #9db4ff8c;border-radius:8px;place-items:center;min-width:30px;height:30px;padding:0 8px;font:600 16px/1 Nunito,Nanum Gothic,sans-serif;display:inline-grid}.phrase{letter-spacing:0;flex-wrap:wrap;justify-content:center;align-items:flex-end;gap:0;margin:0;font-family:Nunito,Nanum Gothic,sans-serif;font-size:clamp(64px,10vw,104px);font-weight:700;line-height:1.35;display:flex}.phrase__space{min-width:.45em;display:inline-block}.phrase__char{color:#9aa0a8;white-space:pre;border-bottom:3px solid #0000;display:inline-block}.phrase__char[data-state=complete]{color:#3b5bdb}.phrase__char[data-state=current]{color:#14151a;border-color:#3b5bdb}.phrase__char[data-error=true]{color:#cf3341;border-color:#cf3341;animation:.15s ease-out nudge}.phrase__syllable{border-bottom:3px solid #0000;display:inline-block}.phrase__syllable[data-state=current]{border-color:#3b5bdb}.phrase__syllable[data-error=true]{border-color:#cf3341;animation:.15s ease-out nudge}@keyframes nudge{0%{transform:translate(0)}35%{transform:translate(2.5px)}70%{transform:translate(-2px)}to{transform:translate(0)}}.phrase__text{white-space:pre}.metrics{color:#4c5058;margin:40px 0 0;font:500 15px/1.4 ui-monospace,SF Mono,Monaco,Cascadia Code,monospace}.metrics--note{color:#8a8f97;margin-top:10px;font-size:12px}.completion{flex-direction:column;align-items:center;gap:14px;margin-top:22px;display:flex}.completion__label{color:#22242a;margin:0;font-size:26px;font-weight:600}.completion__retry{color:#fff;cursor:pointer;background:#3b5bdb;border:1.5px solid #3b5bdb;border-radius:9px;padding:11px 22px;font:600 14px/1 ui-monospace,SF Mono,Monaco,monospace}.completion__retry:hover{background:#34509f}.practice-footer{text-align:center;padding:12px 24px 44px}.practice-footer p{color:#6c7078;margin:14px 0 0;font-size:12.5px}.practice-hint{margin-top:8px}.keyboard-shell{box-sizing:border-box;flex-direction:column;align-items:center;width:100%;max-width:100%;padding:2px 0 8px;display:flex;overflow:visible;container-type:inline-size}.keyboard{--key-base:52px;--key-h-base:48px;--gap-base:6px;--row:13.35;--key:var(--key-base);--key-h:var(--key-h-base);--gap:var(--gap-base);gap:var(--gap);flex-direction:column;width:max-content;max-width:100%;display:flex}.keyboard__row{justify-content:flex-start;align-items:stretch;gap:var(--gap);width:max-content;display:flex}.keyboard__row--bottom{margin-top:0}.keyboard-key{--u:1;box-sizing:border-box;width:calc(var(--u) * (var(--key) + var(--gap)) - var(--gap));height:var(--key-h);color:#5c6068;cursor:pointer;background:#fff;border:1px solid #e4e6ea;border-radius:8px;flex-direction:column;flex:none;justify-content:center;align-items:center;gap:1px;padding:0;font-family:Nunito,Nanum Gothic,sans-serif;display:inline-flex;position:relative;box-shadow:0 1px 1px #14161c08}.keyboard-key--wide{color:#6c7078;font-size:12px}.keyboard-key--spacer{box-shadow:none;pointer-events:none;height:var(--key-h);background:0 0;border:none}.keyboard--mobile{--key-base:28px;--key-h-base:36px;--gap-base:3px;--row:10.04}@supports (width:1cqi){.keyboard-shell>.keyboard{--board:calc(var(--row) * (var(--key-base) + var(--gap-base)) - var(--gap-base));--fit:min(1, 100cqi / var(--board));--key:calc(var(--key-base) * var(--fit));--key-h:calc(var(--key-h-base) * var(--fit));--gap:calc(var(--gap-base) * var(--fit));width:min(var(--board), 100cqi);min-width:0;max-width:100%}}@media (width>=1194px){.keyboard:not(.keyboard--hero):not(.keyboard--mobile){--key-base:60px;--key-h-base:55px}}.keyboard--hero{--key-base:25px;--key-h-base:27px;--gap-base:3px;--row:10;align-self:flex-start;min-width:0}@supports (width:1cqi){.keyboard--hero{--board:calc(var(--row) * (var(--key-base) + var(--gap-base)) - var(--gap-base));--fit:min(1, 100cqi / var(--board));--key:calc(var(--key-base) * var(--fit));--key-h:calc(var(--key-h-base) * var(--fit));--gap:calc(var(--gap-base) * var(--fit));width:min(var(--board), 100cqi);max-width:100%}}@media (width>=701px){.keyboard--hero{--key-base:46px;--key-h-base:48px;--gap-base:6px}}@media (width>=1194px){.keyboard--hero{--key-base:42px;--key-h-base:44px;--gap-base:5px}}@media (width<=700px){.keyboard--hero .keyboard-key__jamo{font-size:14px}.keyboard--hero .keyboard-key__latin,.keyboard--hero .keyboard-key__shifted{font-size:8px}}.keyboard-key:disabled{cursor:default;opacity:.6}.keyboard-key__shifted{color:#7d828a;height:auto;font-size:10px;line-height:1;position:absolute;top:3px;left:4px}.keyboard-key__jamo{color:#22242a;font-size:18px;line-height:1.1}.keyboard-key__latin{color:#9aa0a8;font-family:ui-monospace,SF Mono,Monaco,monospace;font-size:10px;line-height:1}.keyboard-key[data-locked=true]{opacity:.22;cursor:default}.keyboard-key[data-state=expected]{opacity:1;background:#e7ecfc;border-color:#5b7fff;box-shadow:0 0 0 3px #5b7fff47,0 0 18px #5b7fff73}.keyboard-key[data-state=expected] .keyboard-key__jamo{color:#3b5bdb;font-weight:600}.keyboard-key[data-state=correct]{background:#eef2fe;border-color:#9db2f5}.keyboard-key[data-state=wrong]{background:#fdecec;border-color:#ff5959}.keyboard-key[data-state=wrong] .keyboard-key__jamo{color:#cf3341;font-weight:600}.keyboard--reference .keyboard-key[data-kind=jamo][data-finger=pinky],.keyboard--hero .keyboard-key[data-kind=jamo][data-finger=pinky]{background:#ebe2f1;box-shadow:0 1.5px #9c84c4}.keyboard--reference .keyboard-key[data-kind=jamo][data-finger=ring],.keyboard--hero .keyboard-key[data-kind=jamo][data-finger=ring]{background:#e0e8f2;box-shadow:0 1.5px #6f95c8}.keyboard--reference .keyboard-key[data-kind=jamo][data-finger=middle],.keyboard--hero .keyboard-key[data-kind=jamo][data-finger=middle]{background:#e0ede2;box-shadow:0 1.5px #6fae84}.keyboard--reference .keyboard-key[data-kind=jamo][data-finger=index],.keyboard--hero .keyboard-key[data-kind=jamo][data-finger=index]{background:#f5e7d1;box-shadow:0 1.5px #d4a25e}.keyboard--hero .keyboard-key[data-state=expected]{color:#fff;background:#2a5fdb;border-color:#1d46a8;box-shadow:0 1.5px #1d46a8}.keyboard--hero .keyboard-key[data-state=expected] .keyboard-key__jamo,.keyboard--hero .keyboard-key[data-state=expected] .keyboard-key__latin,.keyboard--hero .keyboard-key[data-state=expected] .keyboard-key__shifted{color:#fff}@media (width<=680px){.practice-header{flex-direction:column;align-items:stretch;gap:12px;padding:14px 16px 12px}.practice-main{padding-top:20px}.practice-footer{padding-inline:12px}.keyboard-key__jamo{font-size:15px}}.lesson-selector{position:relative}.lesson-selector__button{font:inherit;color:#4c5058;cursor:pointer;background:#fff;border:1px solid #e2e4e8;border-radius:9px;align-items:center;gap:9px;padding:7px 13px;font-size:13.5px;display:flex}.lesson-selector__button[aria-expanded=true]{background:#f2f3f6;border-color:#c9ccd2}.lesson-selector__button:hover{color:#1c1d21;border-color:#c9ccd2}.lesson-selector__caret{color:#9aa0a8;font-size:10px;line-height:1}.lesson-selector__menu{z-index:30;background:#fff;border:1px solid #e4e6ea;border-radius:12px;flex-direction:column;gap:2px;width:min(312px,100vw - 32px);padding:12px 8px 8px;display:flex;position:absolute;top:44px;right:0;box-shadow:0 12px 30px -14px #14161c47}.lesson-selector__label{letter-spacing:.12em;text-transform:uppercase;color:#9aa0a8;padding:0 12px 10px;font-size:11px;font-weight:500}.lesson-selector__item{cursor:pointer;font:inherit;text-align:left;background:0 0;border:none;border-radius:8px;align-items:center;gap:10px;padding:9px 12px;display:flex}.lesson-selector__item:hover{background:#f4f5f8}.lesson-selector__item[aria-selected=true]{background:#f7f8fa}.lesson-selector__check{color:#3b5bdb;flex-shrink:0;width:13px;font-size:12px;line-height:1}.lesson-selector__item-title{color:#4c5058;flex:1;font-size:14px;font-weight:400}.lesson-selector__item[aria-selected=true] .lesson-selector__item-title{color:#14151a;font-weight:500}.lesson-selector__item-count{color:#9aa0a8;font:400 12px/1 ui-monospace,SF Mono,Monaco,monospace}.practice-stage{opacity:1;flex-direction:column;align-items:center;transition:opacity .14s;display:flex}.practice-stage--transition{opacity:0}.translation{color:#8c9099;text-align:center;max-width:34em;margin:26px 0 0;font-size:clamp(17px,2.2vw,20px);line-height:1.4}.item-progress{color:#4c5058;margin:16px 0 0;font:500 14px/1 ui-monospace,SF Mono,Monaco,monospace}.practice-done{flex-direction:column;flex:1;justify-content:center;align-items:center;padding:120px 32px;display:flex}.practice-done__title{color:#14151a;letter-spacing:-.02em;margin:0;font-size:clamp(32px,4vw,40px);font-weight:400}.practice-done__stats{color:#6c7078;flex-direction:column;align-items:center;gap:9px;margin-top:34px;font:400 14px/1 ui-monospace,SF Mono,Monaco,monospace;display:flex}.practice-done__actions{flex-direction:column;align-items:center;gap:18px;margin-top:46px;display:flex}.button--primary{font:inherit;color:#fff;background:var(--action-pressed);border:1px solid var(--action-pressed);cursor:pointer;border-radius:9px;padding:11px 26px;font-size:14px}.button--primary:hover{background:color-mix(in srgb, var(--action-pressed) 84%, #000)}.button--ghost{font:inherit;color:var(--ink-soft);cursor:pointer;background:0 0;border:none;padding:2px;font-size:13.5px}.button--ghost:hover{color:var(--ink)}.completion{display:none}.mode-toggle{background:#ffffff0d;border-radius:8px;gap:4px;padding:4px;display:flex}.mode-toggle__button{font:inherit;color:#fff9;cursor:pointer;background:0 0;border:none;border-radius:6px;padding:6px 16px;font-size:13px;transition:all .15s}.mode-toggle__button:hover{color:#ffffffe6;background:#ffffff0d}.mode-toggle__button--active{color:#fff;background:#ffffff1f;font-weight:500}.mode-toggle__link{font:inherit;color:#ffffff80;cursor:pointer;background:0 0;border:none;padding:6px 12px;font-size:13px;transition:color .15s}.mode-toggle__link:hover{color:#ffffffe6}.practice-app[data-mode=practice] .mode-toggle__link{color:#6c7078}.practice-app[data-mode=practice] .mode-toggle__link:hover{color:#1c1d21}.practice-app[data-mode=course] .brand__mark{border-color:var(--ink);color:var(--ink);background:var(--card);box-shadow:3px 3px 0 var(--action)}.practice-app[data-mode=course] .brand h1{color:var(--ink)}.practice-app[data-mode=course] .translation{color:var(--ink-soft);margin-top:10px;font-size:clamp(18px,2.4vw,22px)}.practice-app[data-mode=course] .metrics{color:var(--ink-soft);margin:0;font:700 13px/1 Nunito,sans-serif}.practice-app[data-mode=course] .item-progress{color:var(--ink-faint)}.practice-app[data-mode=course]{background:var(--paper);color:var(--ink);max-width:100%;container-type:inline-size}.practice-app--lock{height:100svh;min-height:0;max-height:100svh;overflow:hidden}@supports (height:100dvh){.practice-app--lock{height:100dvh;max-height:100dvh}}.practice-main:focus{outline:none}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.lesson-bar{box-sizing:border-box;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;height:68px;padding:0 28px;display:grid}.lesson-bar__lead{align-items:center;gap:14px;min-width:0;display:flex}.lesson-bar__crumb{color:var(--ink-soft);white-space:nowrap;align-items:center;gap:6px;font:700 14px/1 Nunito,sans-serif;display:flex}.lesson-bar__jamo{color:var(--ink);font:800 20px/1 Nanum Gothic,sans-serif;position:relative;top:1px}.lesson-bar__center{flex-direction:column;align-items:center;gap:7px;display:flex}.lesson-bar__actions{justify-content:flex-end;align-items:center;gap:8px;display:flex}.lesson-bar__count{color:var(--ink-soft);font:700 13px/1 Nunito,sans-serif}.lesson-bar__track{background:var(--track);border-radius:9px;width:200px;height:5px;overflow:hidden}.lesson-bar__fill{background:var(--action);border-radius:9px;height:100%}.icon-btn{border:1px solid var(--line);background:var(--card);width:40px;height:40px;color:var(--ink);cursor:pointer;border-radius:12px;justify-content:center;align-items:center;display:inline-flex}.icon-btn:disabled{opacity:.55;cursor:default}.pause-chip{border:1px solid var(--line);background:var(--card);height:40px;color:var(--ink);cursor:pointer;border-radius:12px;align-items:center;gap:8px;padding:0 10px 0 14px;font:800 14px/1 Nunito,sans-serif;display:inline-flex}.keycap{color:var(--ink-soft);border:1px solid var(--line);border-radius:6px;padding:2px 6px;font:700 11px/1 Nunito,sans-serif}.button--primary .keycap{color:var(--on-action);border-color:color-mix(in srgb, var(--on-action) 65%, transparent);background:color-mix(in srgb, var(--on-action) 18%, transparent)}.stage-kicker{letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);margin:0;font:800 12px/1 Nunito,sans-serif}.stage-kicker--accent{color:var(--jamo-current)}.practice-stage{text-align:center;flex-direction:column;align-items:center;gap:14px;display:flex}.stroke-card{aspect-ratio:1;background:var(--action-wash);border-radius:28px;place-items:center;width:min(190px,46vw);display:grid}.stroke-card .phrase{font-size:clamp(72px,14vw,124px);font-weight:400}.stroke-name{align-items:baseline;gap:10px;margin:0;display:flex}.stroke-name strong{color:var(--ink);font:800 24px/1 Nunito,sans-serif}.stroke-name span{color:var(--ink-soft);font:600 17px/1 Nunito,sans-serif}.stroke-how{max-width:420px;color:var(--ink-soft);margin:0;font:600 16px/1.5 Nunito,sans-serif}.stroke-how kbd{color:var(--ink);border:1px solid var(--line);background:var(--card);border-radius:6px;padding:1px 7px;font:800 15px/1 Nunito,sans-serif}.stroke-how__dot{vertical-align:middle;border-radius:50%;width:9px;height:9px;margin:0 6px 1px 0;display:inline-block}.gloss-row{align-items:center;gap:10px;margin-top:6px;display:flex}.gloss-row__text{color:var(--ink);font:700 22px/1.2 Nunito,sans-serif}.listen-btn{border:1px solid var(--line);background:var(--card);width:34px;height:34px;color:var(--ink);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;display:inline-flex}.listen-btn:disabled{opacity:.45;cursor:default}.play-pill{border:1px solid var(--line);background:var(--card);height:34px;color:var(--ink);cursor:pointer;border-radius:99px;align-items:center;gap:6px;padding:0 12px 0 10px;font:800 13px/1 Nunito,sans-serif;display:inline-flex}.play-pill:disabled{opacity:.45;cursor:default}.rhythm{flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;margin-top:4px;display:flex}.rhythm__label{color:var(--ink-soft);font:700 12px/1 Nunito,sans-serif}.rhythm__chip{border:1px solid #0000;border-radius:9px;align-items:center;height:30px;padding:0 10px;font:700 14px/1 Nanum Gothic,sans-serif;display:inline-flex}.rhythm__chip[data-state=done]{background:var(--action-wash);color:var(--done)}.rhythm__chip[data-state=current]{border-style:dashed;border-color:var(--jamo-current);color:var(--jamo-current);background:0 0}.rhythm__chip[data-state=todo]{color:var(--ink-soft)}.phrase-next{color:var(--ink-soft);margin:0;font:600 13px/1.3 Nunito,sans-serif}.phrase-next span{font-family:Nanum Gothic,sans-serif;font-weight:700}.stage-slot{justify-content:center;align-items:center;min-height:36px;display:flex}.shift-pill{background:var(--card);border:1px solid var(--line);height:36px;color:var(--ink);white-space:nowrap;border-radius:99px;align-items:center;gap:8px;margin:0;padding:0 6px 0 14px;font:700 14px/1 Nunito,sans-serif;display:flex}.shift-pill__shift{border:1px solid var(--action);background:var(--action);color:var(--on-action);border-radius:7px;padding:2px 8px;font-size:12px;font-weight:800}.shift-pill__shift--held{background:var(--action-wash);color:var(--jamo-current)}.shift-pill__out{background:var(--action-wash);color:var(--jamo-current);border-radius:99px;padding:3px 10px;font-family:Nanum Gothic,sans-serif;font-size:15px}.mistake{background:var(--error-wash);width:auto;height:36px;color:var(--error-ink);border:1px solid var(--key-wrong-line);white-space:nowrap;border-radius:99px;align-items:center;gap:8px;margin:0;padding:0 8px 0 14px;font:700 14px/1 Nunito,sans-serif;display:flex;position:static;transform:none}.mistake__dot{background:var(--error);border-radius:50%;width:7px;height:7px}.mistake__sep{opacity:.55}.mistake__key{background:var(--card);color:var(--ink);border-radius:99px;align-items:center;gap:5px;padding:3px 9px 3px 8px;display:inline-flex}.mistake__key b{color:var(--ink);font-family:Nanum Gothic,sans-serif;font-size:15px}.mistake__key small{opacity:.75;color:var(--ink-soft);font-size:11px;font-weight:700}.sound-toggle{border:1px solid var(--line);background:var(--card);color:var(--ink);cursor:pointer;border-radius:10px;padding:8px 14px;font:600 14px/1 Nunito,sans-serif}.sound-toggle:hover{background:var(--deep)}.mistake{background:var(--error-ink);color:var(--on-action);box-shadow:none;border-radius:999px;align-items:center;gap:10px;margin:0 0 18px;padding:10px 16px;font:700 16px/1 Nunito,sans-serif;display:flex}.practice-app[data-mode=course] .practice-main{flex:auto;justify-content:center;min-width:0;min-height:0;padding:clamp(8px,2dvh,28px) 24px 4px;overflow:hidden}.practice-app[data-mode=course] .phrase{font-synthesis:none;font-size:clamp(56px,min(14vw,16dvh),132px);font-weight:800}.practice-app[data-mode=course] .phrase[data-solo=true]{font-size:clamp(84px,min(22vw,20dvh),148px);font-weight:400}.practice-app[data-mode=course] .phrase__char{color:var(--jamo-remaining);font-synthesis:none;font-feature-settings:normal;font-variant-ligatures:none;border-bottom-color:#0000;font-family:Nanum Gothic,sans-serif;font-weight:700;line-height:1}.practice-app[data-mode=course] .phrase__syllable{line-height:1;display:inline-block;position:relative}.practice-app[data-mode=course] .phrase__jamo{display:block;overflow:visible}.practice-app[data-mode=course] .phrase__text{font-family:Nunito,Nanum Gothic,sans-serif;font-weight:700}.practice-app[data-mode=course] .phrase__char[data-state=complete]{color:var(--jamo-complete);border-color:#0000}.practice-app[data-mode=course] .phrase__char[data-state=current]{color:var(--jamo-current);border-color:#0000}.practice-app[data-mode=course] .phrase__glyph{align-items:flex-end;line-height:1;display:inline-flex}.practice-app[data-mode=course] .practice-stage{position:relative}.practice-app[data-mode=course] .mistake{position:static;transform:none}.practice-app[data-mode=course] .phrase__char[data-error=true],.practice-app[data-mode=course] .phrase__syllable[data-error=true]{color:var(--jamo-error);background:var(--error-wash);box-shadow:inset 0 -.08em 0 var(--jamo-error);border-radius:.12em;animation:.15s ease-out nudge}.practice-app[data-mode=course] .metrics{color:var(--ink-soft);font-variant-numeric:tabular-nums;margin:0;font:700 13px/1 Nunito,sans-serif}.practice-app[data-mode=course] .practice-footer{min-height:0;max-height:62dvh;padding:2px 16px max(8px, env(safe-area-inset-bottom));flex:0 auto;overflow:hidden auto}.practice-app[data-mode=course] .keyboard-shell{flex-direction:column;align-items:center;width:100%;max-width:100%;display:flex;overflow:visible}.practice-app[data-mode=course] .course-run>.keyboard-shell{box-sizing:border-box;width:100cqi;max-width:100cqi;margin-left:calc(50% - 50cqi);padding-inline:16px}.practice-app[data-mode=course] .keyboard{width:min(var(--board,768px), 100%);max-width:100%}.practice-app[data-mode=course] .keyboard__row{width:max-content}.practice-app[data-mode=course] .keyboard__row--bottom{margin-top:0}.practice-app[data-mode=course] .keyboard-key{background:var(--key-idle);min-height:0;box-shadow:0 1.5px 0 var(--key-edge);color:var(--ink);border:1px solid #0000;border-radius:10px;gap:3px;padding:0 1px}.practice-app[data-mode=course] .keyboard-key:active{background:var(--key-press);transform:translateY(1.5px);box-shadow:inset 0 1.5px 2px #00000029}.practice-app[data-mode=course] .keyboard-key--wide{color:var(--ink-faint);font:800 clamp(11px,1.6dvh,13px)/1 Nunito,sans-serif}.practice-app[data-mode=course] .keyboard-key--spacer{box-shadow:none;pointer-events:none;background:0 0;border:none}.practice-app[data-mode=course] .keyboard-key__jamo{color:var(--ink);font-synthesis:none;font-feature-settings:normal;font-family:Nanum Gothic,sans-serif;font-size:clamp(13px,min(3.2vw,2.4dvh),20px);font-weight:700;line-height:1}.practice-app[data-mode=course] .keyboard-key__latin{color:var(--ink-faint);font-family:Nunito,sans-serif;font-size:11px;font-weight:700;line-height:1}.keyboard-shell[data-compact=true] .keyboard-key__latin{display:none}.practice-app[data-mode=course] .keyboard-key__shifted{color:var(--ink-faint);height:auto;font-family:Nanum Gothic,sans-serif;font-size:clamp(9px,1.5dvh,11px);font-weight:700;line-height:1}.keyboard-shell[data-mistake=true] .keyboard-key[data-state=expected]{animation:none}.practice-app[data-mode=course] .keyboard-key[data-locked=true]{opacity:1;background:var(--deep);box-shadow:none}.practice-app[data-mode=course] .keyboard-key[data-locked=true] .keyboard-key__jamo,.practice-app[data-mode=course] .keyboard-key[data-locked=true] .keyboard-key__latin,.practice-app[data-mode=course] .keyboard-key[data-locked=true] .keyboard-key__shifted{color:var(--ink-faint)}.practice-app[data-mode=course] .keyboard-key:disabled{opacity:1;background:var(--deep);box-shadow:none;color:var(--ink-faint)}.practice-app[data-mode=course] .keyboard-key[data-finger=pinky]{--finger:var(--finger-pinky);--finger-mark:var(--finger-pinky-mark)}.practice-app[data-mode=course] .keyboard-key[data-finger=ring]{--finger:var(--finger-ring);--finger-mark:var(--finger-ring-mark)}.practice-app[data-mode=course] .keyboard-key[data-finger=middle]{--finger:var(--finger-middle);--finger-mark:var(--finger-middle-mark)}.practice-app[data-mode=course] .keyboard-key[data-finger=index]{--finger:var(--finger-index);--finger-mark:var(--finger-index-mark)}.practice-app[data-mode=course] .keyboard-key[data-finger=thumb]{--finger:var(--finger-thumb);--finger-mark:var(--finger-thumb-mark)}.practice-app[data-mode=course] .keyboard-key[data-state=expected]{opacity:1;background:var(--finger,var(--finger-thumb));border-color:var(--finger-mark,var(--finger-thumb-mark));box-shadow:0 2px 0 var(--finger-mark,var(--finger-thumb-mark));color:var(--ink)}.practice-app[data-mode=course] .keyboard-key[data-state=expected]:active{background:color-mix(in srgb, var(--finger,var(--finger-thumb)) 78%, #000);box-shadow:none;transform:translateY(1.5px)}.practice-app[data-mode=course] .keyboard-key[data-state=expected] .keyboard-key__jamo,.practice-app[data-mode=course] .keyboard-key[data-state=expected] .keyboard-key__latin,.practice-app[data-mode=course] .keyboard-key[data-state=expected] .keyboard-key__shifted{color:var(--ink)}.practice-app[data-mode=course] .keyboard-key[data-state=held]{background:var(--finger,var(--finger-pinky));color:var(--ink);border-color:#0000;transform:translateY(1.5px);box-shadow:inset 0 1.5px 2px #00000029}.practice-app[data-mode=course] .keyboard-key[data-state=dim]{opacity:.42}.practice-app[data-mode=course] .keyboard-key[data-state=correct]{background:var(--key-press);transform:translateY(1.5px);box-shadow:inset 0 1.5px 2px #00000029}.practice-app[data-mode=course] .keyboard-key[data-kind=shift][data-state=expected]{color:#3b5bdb;background:#e7ecfc;border-color:#5b7fff;box-shadow:0 0 0 3px #5b7fff47,0 0 18px #5b7fff59}.practice-app[data-mode=course] .keyboard-key[data-state=secondary]{opacity:1;background:color-mix(in srgb, var(--finger,#e7ecfc) 62%, var(--key-idle));border-color:var(--finger-mark,#5b7fff);box-shadow:none;color:var(--ink)}.practice-app[data-mode=course] .keyboard-key[data-state=wrong]{opacity:1;background:#fdecec;border:1px solid #ff5959;transform:none;box-shadow:0 0 0 2px #ff595947}.practice-app[data-mode=course] .keyboard-key[data-state=wrong]:active{background:var(--key-wrong);transform:none}.practice-app[data-mode=course] .keyboard-key[data-state=wrong] .keyboard-key__jamo,.practice-app[data-mode=course] .keyboard-key[data-state=wrong] .keyboard-key__latin,.practice-app[data-mode=course] .keyboard-key[data-state=wrong] .keyboard-key__shifted{color:var(--error-ink)}.speech-note{color:var(--ink-soft);margin:8px 0 0;font:600 14px/1.3 Nunito,sans-serif}.practice-app[data-mode=course] .button--speaking{color:var(--action-pressed);border:1px solid var(--action);background:var(--action-wash);border-radius:999px;padding:6px 12px 6px 10px}.practice-app[data-mode=course] .button--speaking:before{content:"";background:var(--action);vertical-align:1px;border-radius:99px;width:8px;height:8px;margin-right:8px;animation:.8s ease-in-out infinite speak-pulse;display:inline-block;box-shadow:0 0 0 4px #2f6fed47}@keyframes speak-pulse{50%{opacity:.35}}.sound-toggle:disabled{opacity:.55;cursor:default}.done-stage{flex:auto;justify-content:center;align-items:center;min-height:0;padding:16px;display:flex;overflow:auto}.results-panel{background:var(--card);border:1px solid var(--line);width:min(520px,100%);box-shadow:var(--pop-shadow);text-align:center;border-radius:24px;flex-direction:column;gap:12px;padding:26px 28px;display:flex}.results-panel__eyebrow{letter-spacing:.08em;text-transform:uppercase;color:var(--jamo-current);margin:0;font:800 12px/1 Nunito,sans-serif}.results-panel__title{color:var(--ink);margin:0;font:800 26px/1.15 Nunito,Nanum Gothic,sans-serif}.results-panel__sub{color:var(--ink-soft);margin:0;font:700 14px/1.4 Nunito,sans-serif}.results-panel__stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;display:grid}.results-panel__stats div{background:var(--paper);border-radius:14px;flex-direction:column;align-items:center;gap:2px;padding:12px 8px;display:flex}.results-panel__stats span{color:var(--ink-soft);font:700 12px/1 Nunito,sans-serif}.results-panel__stats strong{color:var(--ink);font:800 26px/1.1 Nunito,sans-serif}.results-panel__stats small{color:var(--ink-soft);margin-left:3px;font:800 13px/1 Nunito,sans-serif}.results-panel__detail{color:var(--ink-soft);font:700 12px/1.3 Nunito,sans-serif}.done-stage__board{opacity:.38;pointer-events:none;min-width:0}.done-cards{min-width:0}.done-card{background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:18px;margin-bottom:12px;padding:18px 18px 16px}.done-card h2{color:var(--ink);margin:0 0 12px;font:700 22px/1.2 Nunito,Nanum Gothic,sans-serif}.done-card__meta{color:var(--ink-faint);margin:0 0 6px;font:600 14px/1.4 Nunito,sans-serif}.mover-list{flex-direction:column;gap:6px;margin:14px 0 0;padding:0;list-style:none;display:flex}.mover-row{justify-content:space-between;align-items:center;gap:12px;display:flex}.mover-row__jamo{background:var(--deep);width:36px;height:36px;color:var(--ink);border-radius:8px;place-items:center;font:700 18px/1 Nanum Gothic,Nunito,sans-serif;display:grid}.mover-row__delta{color:var(--ink);font:600 15px/1 Nunito,sans-serif}.weak-keys{flex-wrap:wrap;align-items:center;gap:6px;margin:14px 0 0;display:flex}.weak-keys__label{color:var(--ink-faint);margin-right:2px;font:600 13px/1 Nunito,sans-serif}.weak-keys__chip,.all-keys__chip{background:var(--deep);min-height:28px;color:var(--ink);border-radius:8px;place-items:center;padding:0 8px;font:700 14px/1 Nanum Gothic,Nunito,sans-serif;display:inline-grid}.all-keys{margin-top:14px}.all-keys summary{cursor:pointer;color:var(--ink-soft);font:600 14px/1 Nunito,sans-serif}.all-keys__grid{flex-wrap:wrap;gap:6px;margin-top:10px;display:flex}.all-keys__chip[data-band=low]{background:var(--error-wash);color:var(--error-ink)}.all-keys__chip[data-band=high]{background:var(--action-wash);color:var(--action-pressed)}.next-keys{justify-content:space-between;align-items:center;gap:12px;margin:8px 0;display:flex}.next-keys__label{color:var(--ink-soft);font:600 14px/1 Nunito,sans-serif}.next-keys__list{gap:6px;display:flex}.next-keys__chip,.next-keys__empty{background:var(--deep);min-width:28px;height:28px;color:var(--ink);border-radius:7px;place-items:center;padding:0 6px;font:700 15px/1 Nanum Gothic,Nunito,sans-serif;display:grid}.done-card__actions{flex-direction:column;gap:8px;margin-top:16px;display:flex}.done-card .button--primary,.done-card .button--secondary{border-radius:12px;width:100%;padding:12px 16px;font:700 15px/1 Nunito,sans-serif}.button--secondary,a.button--secondary{color:var(--ink);background:var(--deep);border:1px solid var(--line);cursor:pointer;box-sizing:border-box;border-radius:13px;justify-content:center;align-items:center;min-height:46px;padding:12px 16px;font:800 15px/1 Nunito,sans-serif;text-decoration:none;display:inline-flex}.button--secondary:hover{background:#e7dcce}.button--danger{font:inherit;color:var(--error-ink);background:var(--card);border:1.5px solid var(--key-wrong-line);cursor:pointer;border-radius:12px;padding:11px 16px;font-size:14px;font-weight:800}.button--danger:hover{background:var(--error-wash)}.button--fill{background:var(--error);color:var(--on-error);border-color:var(--error)}.button--fill:hover{background:var(--error)}@media (width<=1100px),(height<=860px){.done-stage{padding:8px 16px 20px}.results-panel{padding:18px}}@media (width<=860px){.gloss-row__text{font-size:19px}.stroke-card{width:min(150px,46vw)}}@media (height<=740px){.practice-app[data-mode=course] .practice-footer{padding-bottom:max(4px, env(safe-area-inset-bottom))}.practice-app[data-mode=course] .keyboard-shell{padding-bottom:2px}}@media (width<=520px),(height<=700px){.lesson-bar{grid-template-columns:minmax(max-content,1fr) auto;grid-template-areas:"lead actions""center center";gap:4px 8px;height:auto;min-height:52px;padding:6px 10px}.lesson-bar__lead{grid-area:lead;gap:6px;min-width:max-content}.lesson-bar__actions{grid-area:actions}.lesson-bar__center{grid-area:center;align-items:stretch;width:100%;min-width:0}.lesson-bar__track{width:100%;max-width:none}.lesson-bar__crumb{text-overflow:unset;max-width:none;overflow:visible}.crumb,.pause-chip,.icon-btn{height:36px}.pause-chip{gap:4px;padding:0 8px;font-size:13px}.crumb{flex:none;padding:0 8px}.practice-app[data-mode=course] .practice-main{padding:6px 12px 2px}.practice-app[data-mode=course] .practice-footer{max-height:none;padding-bottom:max(4px, env(safe-area-inset-bottom));flex:none;overflow:visible}.practice-app[data-mode=course] .phrase{font-size:clamp(36px,min(12vw,10dvh),72px)}.practice-app[data-mode=course] .phrase[data-solo=true]{font-size:clamp(52px,min(22vw,14dvh),96px)}.stroke-card{width:min(120px,38vw)}}@media (height<=520px){.practice-app[data-mode=course]{height:auto;min-height:100dvh;max-height:none;overflow:visible}.practice-app[data-mode=course] .practice-main,.passage,.dialogue{flex:none;min-height:0;overflow:visible}.practice-app[data-mode=course] .practice-footer{flex:none;max-height:none;overflow:visible}.stroke-card{position:static}}@media (forced-colors:active){.practice-app[data-mode=course] .keyboard-key[data-state=expected],.practice-app[data-mode=course] .keyboard-key[data-state=held],.syllable-tile[data-state=current]{outline:2px solid highlight}}.key-accuracy{flex-wrap:wrap;justify-content:center;gap:8px;max-width:640px;margin-top:28px;display:flex}.key-accuracy__item{text-align:center;background:#ffffff0d;border-radius:10px;min-width:64px;padding:8px 10px}.key-accuracy__jamo{color:#f4f6fb;font:700 22px/1 Nanum Gothic,Nunito,sans-serif}.key-accuracy__pct{color:#ffffff8c;margin-top:4px;font:600 12px/1 Nunito,sans-serif}.key-accuracy__item[data-accuracy="100"]{background:#4d74ff38}.pause{z-index:5;background:var(--scrim);place-items:center;padding:16px;display:grid;position:fixed;inset:0}.pause__card{background:var(--card);width:min(400px,100%);box-shadow:var(--pop-shadow);color:var(--ink);border-radius:24px;flex-direction:column;align-items:stretch;gap:10px;padding:28px;display:flex}.pause__card h2{color:var(--ink);text-align:center;margin:0;font:800 22px/1.2 Nunito,Nanum Gothic,sans-serif}.pause__card p{color:var(--ink-soft);text-align:center;margin:0 0 6px;font:700 13px/1.4 Nunito,sans-serif}.pause__actions{flex-direction:column;gap:8px;display:flex}.pause__actions .button{border-radius:13px;width:100%;min-height:48px;font-weight:800}.pause__sound{border-top:1px solid var(--line);justify-content:space-between;align-items:center;padding-top:8px;font-weight:800;display:flex}.crumb{border:1px solid var(--line);background:var(--card);height:40px;color:var(--ink);cursor:pointer;border-radius:12px;align-items:center;gap:6px;padding:0 14px 0 10px;font:800 15px/1 Nunito,sans-serif;display:inline-flex}.settings{box-sizing:border-box;flex-direction:column;flex:1;gap:16px;width:min(620px,100%);min-height:0;margin:0 auto;padding:28px 20px 40px;display:flex;overflow:auto}.settings h2{margin:0;font:800 34px/1.1 Nunito,sans-serif}.settings__card{background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:18px;padding:6px 18px}.settings__danger{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:14px 18px;display:flex}.settings__dev{border-style:dashed}.dev-jump{flex-wrap:wrap;align-items:center;gap:8px;padding:4px 0 14px;display:flex}.dev-jump select,.dev-jump input{border:1px solid var(--line);background:var(--card);height:34px;color:var(--ink);border-radius:9px;padding:0 8px;font:700 14px/1 Nunito,sans-serif}.dev-actions{flex-wrap:wrap;gap:8px;padding-bottom:8px;display:flex}.dev-unit{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.setting-row{border-bottom:1px solid var(--line);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:14px 0;display:flex}.setting-row--last,.settings__card .setting-row:last-child{border-bottom:none}.setting-row__name{font:800 16px/1.3 Nunito,sans-serif}.setting-row__sub{max-width:320px;color:var(--ink-soft);margin:2px 0 0;font:600 13px/1.4 Nunito,sans-serif}.segment{background:var(--deep);border-radius:12px;gap:2px;padding:3px;display:flex}.segment__option{height:34px;color:var(--ink-soft);cursor:pointer;background:0 0;border:none;border-radius:9px;padding:0 14px;font:800 14px/1 Nunito,sans-serif}.segment__option[aria-checked=true]{background:var(--card);color:var(--ink);box-shadow:0 1px 2px #46321e26}.switch{background:var(--track);cursor:pointer;border:none;border-radius:99px;flex:none;justify-content:flex-start;width:46px;height:28px;padding:3px;display:flex}.switch[aria-checked=true]{background:var(--action);justify-content:flex-end}.switch__knob{background:var(--card);border-radius:50%;width:22px;height:22px}.switch[aria-checked=true] .switch__knob{background:var(--on-action)}@media (width<=760px){.pause{align-items:end;padding:0}.pause__card{border-radius:26px 26px 0 0;width:100%;padding:20px 20px 32px}}.course-menu{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:12px;padding:32px 24px;display:flex}.course-menu h2{color:var(--ink);margin:0;font:700 32px/1.2 Nunito,Nanum Gothic,sans-serif}.course-menu__meta,.course-menu__status{color:var(--ink-soft);margin:0;font:600 16px/1.4 Nunito,sans-serif}.course-menu__credit{max-width:28rem;color:var(--ink-soft);margin:0;font:500 12.5px/1.45 Nunito,Nanum Gothic,sans-serif}.course-menu .button--primary,.course-menu .button--danger{min-height:44px}.course-menu .button--primary{margin-top:8px}.practice-done__hint{color:var(--ink-faint);margin:18px 0 0;font-size:13px}.practice-app[data-mode=course] .practice-done__title{color:var(--ink);font-family:Nunito,Nanum Gothic,sans-serif}.practice-app[data-mode=course] .practice-done__stats{color:var(--ink-faint)}.practice-app[data-mode=course] .button--ghost{color:var(--ink-soft)}.practice-app[data-mode=course] .button--ghost:hover{color:var(--ink)}.running-text{min-width:0;font-family:Nanum Gothic,sans-serif;font-size:1em;font-weight:700;line-height:inherit;font-synthesis:none;text-align:inherit;margin:0}.running-text__word{white-space:nowrap}.running-text__gap{white-space:pre-wrap}.running-text__syllable,.running-text__plain{font-weight:700;line-height:1;position:relative}.running-text__syllable{vertical-align:baseline;line-height:1;display:inline-block;position:relative}.running-text__ink{line-height:1}.running-text__ink--layout{visibility:hidden}.running-text__jamo{pointer-events:none;position:absolute;overflow:visible}.running-text__ink--over{user-select:none;pointer-events:none;-webkit-box-decoration-break:clone;width:100%;height:100%;line-height:1;display:block;position:absolute;inset:0}.running-text__syllable[data-caret=true]:before,.running-text__plain[data-caret=true]:before{content:"";background:var(--jamo-current);pointer-events:none;border-radius:1px;width:.045em;position:absolute;top:.12em;bottom:0;left:-.06em}.running-text__syllable[data-error=true]:before,.running-text__plain[data-error=true]:before{background:var(--jamo-error)}.running-text__syllable[data-error=true]:after,.running-text__plain[data-error=true]:after{content:"";border-bottom:.06em dashed var(--jamo-error);pointer-events:none;position:absolute;bottom:0;left:.08em;right:.08em}.course-path,.course-results,.course-intro,.course-run{max-width:40rem;margin:0 auto;padding:1.25rem 1.5rem 6rem}.course-path h2,.course-results h2,.course-intro h2{margin:.2rem 0 .4rem;font-size:1.8rem}.course-units{gap:1rem;margin:1rem 0 0;padding:0;list-style:none;display:grid}.course-units ol{gap:.4rem;margin:.4rem 0 0;padding:0;list-style:none;display:grid}.course-units h3{color:var(--ink-soft);margin:0;font-size:.95rem}.course-results__wpm{margin:.4rem 0;font-size:3rem;font-weight:800}.course-results__wpm span{font-size:1rem;font-weight:700}.course-badge,.course-nudge,.course-toast,.course-gloss{color:var(--ink-soft)}.course-timer{font-variant-numeric:tabular-nums;font-size:1.4rem;font-weight:800}.course-skip{flex-wrap:wrap;align-items:center;gap:.5rem;margin:.8rem 0;display:flex}.save-flag{color:var(--ink-faint);margin:0;font-size:.75rem;position:fixed;bottom:.8rem;right:.8rem}.course-intro .button,.course-results .button{margin-top:.8rem}.practice-app[data-mode=course] .course-run{padding-top:1.5rem;padding-bottom:1.25rem}.practice-app[data-mode=course] .course-run .phrase{justify-content:center;max-width:100%;margin:.4rem 0 1.25rem;font-size:clamp(42px,4.8vw,64px);line-height:1.35}.practice-app[data-mode=course] .course-prompt-window{width:min(860px,100%);max-height:4.15em;margin:.2rem auto .8rem;font-size:clamp(42px,4.8vw,64px);line-height:1.35;overflow:hidden auto}.practice-app[data-mode=course] .course-prompt-window .phrase{justify-content:flex-start;margin:0;font-size:1em;line-height:1.35}.home-tiles{grid-template-columns:repeat(4,minmax(0,1fr));gap:.6rem;margin:.8rem 0;display:grid}.home-tiles div{background:var(--deep);border-radius:12px;flex-direction:column;gap:.15rem;padding:.55rem .4rem;display:flex}.home-tiles span{color:var(--ink-soft);font-size:.75rem;font-weight:700}.home-tiles strong{font-size:1.15rem}.course-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.5rem;display:grid}.course-gate{color:var(--ink-soft);margin-top:.25rem;font-size:.75rem;display:block}.course-statgrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem;margin:.8rem 0;display:grid}.course-statgrid div{background:var(--card);border:1px solid var(--line);border-radius:14px;flex-direction:column;padding:.7rem;display:flex}.course-statgrid span{color:var(--ink-soft);font-size:.8rem;font-weight:700}.course-statgrid strong{font-size:1.6rem}.course-screens{flex-wrap:wrap;gap:.4rem .8rem;margin:.4rem 0 .8rem;padding:0;list-style:none;display:flex}.course-results{padding-top:1.5rem}@media (width<=700px){.home-tiles,.course-statgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}.phrase__token{white-space:nowrap;flex-wrap:nowrap;display:inline-flex}.keyboard-shell[data-shift=locked] .keyboard-key[data-kind=shift][data-state=held]{box-shadow:inset 0 0 0 3px var(--on-action), 0 0 0 3px var(--action)}.keyboard-shell[data-shift=locked] .keyboard-key[data-kind=shift][data-state=held]:after{content:"lock";letter-spacing:.04em;text-transform:uppercase;font-size:9px;display:block}.course-unit{border:1px solid var(--line);background:var(--card);border-radius:16px;padding:.8rem .9rem 1rem}.course-unit h3{margin:0 0 .6rem}.course-keys{flex-wrap:wrap;gap:.35rem;margin:0 0 .6rem;display:flex}.course-keycap{border:1px solid var(--line);background:var(--deep);text-align:center;border-radius:8px;min-width:1.8rem;padding:.15rem .4rem;font-family:Nanum Gothic,sans-serif}.course-legend{color:var(--ink-soft);flex-wrap:wrap;gap:.8rem;margin:.8rem 0;font-size:.85rem;display:flex}.course-legend i{border:1.5px solid var(--line);vertical-align:middle;border-radius:4px;width:1.1rem;height:.7rem;margin-right:.3rem;display:inline-block}.course-resume{text-align:left;width:100%;margin:.8rem 0;display:block}.course-hint{background:var(--action-wash);color:var(--ink);border-radius:12px;justify-content:space-between;align-items:center;gap:.6rem;padding:.7rem .8rem;display:flex}.course-hint button{background:var(--action);color:var(--on-action);border:0;border-radius:999px;padding:.35rem .8rem}.course-notice{background:var(--deep);border-radius:12px;margin:.6rem 0;padding:.7rem .8rem}.keyboard-shell[data-dots=true] .keyboard-key[data-home=true]:after{content:"";background:var(--finger-mark,var(--ink-faint));border-radius:50%;width:4px;height:4px;position:absolute;bottom:5px}.practice-app .keyboard-shell[data-layout=mobile] .keyboard-key__shifted{display:none}.practice-app .keyboard-shell[data-layout=mobile][data-dots=true] .keyboard-key[data-home=true]:after{content:none}.practice-app .keyboard-shell[data-layout=mobile] .keyboard-key[data-state=expected]:not([data-kind=shift]){background:var(--action);border-color:var(--action);color:#fff;box-shadow:0 3px 8px color-mix(in srgb, var(--action) 45%, transparent);transform:translateY(-1px)}.practice-app .keyboard-shell[data-layout=mobile] .keyboard-key[data-state=expected]:not([data-kind=shift]) :is(.keyboard-key__jamo,.keyboard-key__latin,.keyboard-key__shifted){color:#fff}.practice-app[data-mode=course] .keyboard.keyboard--fingers .keyboard-key[data-kind=jamo]:not([data-state=expected]):not([data-state=wrong]):not([data-state=held]):not([data-state=correct]):not([data-locked=true]),.practice-app[data-mode=course] .keyboard-key[data-tint=true]:not([data-state=expected]):not([data-state=wrong]):not([data-state=held]):not([data-state=correct]):not([data-locked=true]){background:var(--finger,var(--key-idle));box-shadow:0 1.5px 0 var(--finger-mark,var(--key-edge))}.keys-run{box-sizing:border-box;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:12px;width:min(960px,100%);min-width:0;min-height:0;display:flex}.course-card{box-sizing:border-box;background:var(--card);border:1px solid var(--line);width:min(960px,100%);min-width:0;max-width:100%;min-height:180px;box-shadow:var(--shadow);border-radius:24px;flex-direction:column;justify-content:center;align-items:center;padding:16px 40px 28px;display:flex;position:relative}.course-card__stats{color:var(--ink-soft);font-variant-numeric:tabular-nums;align-self:flex-end;margin:0 0 8px;font:700 13px/1.2 Nunito,sans-serif;position:static}.syllable-tiles{flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;width:100%;min-width:0;max-width:100%;margin:0;padding:2px 0;display:flex}.syllable-tiles__word{white-space:nowrap;flex-wrap:nowrap;flex:none;align-items:stretch;gap:8px;min-width:0;max-width:100%;display:inline-flex}.syllable-tiles__word>.syllable-tile{flex:0 78px;width:78px;min-width:0;max-width:78px;height:70px}.syllable-tiles__word>.syllable-tile[data-mark=punct]{flex-basis:36px;width:36px;max-width:36px}.syllable-tiles__gap{flex:none;align-self:stretch;width:14px;position:relative}.syllable-tiles__gap[data-state=current]:after{content:"";background:var(--jamo-current);border-radius:2px;height:3px;position:absolute;top:50%;left:1px;right:1px;transform:translateY(-50%)}.syllable-tile{--syllable-typed:light-dark(#226e49,var(--ok));--syllable-muted:light-dark(#6e6052,#b7ab9d);box-sizing:border-box;border:1.5px solid var(--key-edge);background:var(--key-idle);width:78px;height:70px;color:var(--syllable-muted);font-synthesis:none;border-bottom-width:4px;border-radius:14px;flex:none;justify-content:center;align-items:center;font-family:Nanum Gothic,sans-serif;font-weight:800;line-height:1;display:flex;overflow:visible}.syllable-tile__glyph{justify-content:center;align-items:center;height:1em;font-size:36px;font-weight:700;line-height:1;display:flex}.syllable-tile__glyph .phrase__jamo{height:1em;display:block;overflow:visible}.syllable-tile[data-state=done]{background:var(--ok-soft);border-color:color-mix(in srgb, var(--ok) 46%, var(--line));color:var(--syllable-typed)}.syllable-tile[data-state=current]{background:light-dark(#fff,var(--key-hint-dark));border-color:var(--action);color:var(--ink);box-shadow:0 0 0 3px color-mix(in srgb, var(--action) 28%, transparent)}.syllable-tiles[data-layout=mobile],.syllable-tiles[data-layout=mobile] .syllable-tiles__word{gap:6px}.syllable-tiles[data-layout=mobile] .syllable-tiles__word>.syllable-tile{flex-basis:58px;width:58px;max-width:58px;height:54px}.syllable-tiles[data-layout=mobile] .syllable-tiles__word>.syllable-tile[data-mark=punct]{flex-basis:32px;width:32px;max-width:32px}.syllable-tiles[data-layout=mobile] .syllable-tiles__gap{width:8px}.syllable-tiles[data-layout=mobile] .syllable-tile{width:58px;height:54px}.syllable-tiles[data-layout=mobile] .syllable-tile__glyph{font-size:28px}.key-lanes{--tile-w:64px;--tile-h:56px;--lane-h:64px;--lane-gap:8px;align-self:stretch;width:100%;min-width:0;max-width:100%;position:relative}.key-lanes__track{width:100%;min-width:0;height:calc(4 * var(--lane-h) + 3 * var(--lane-gap));position:relative}.key-lane{height:var(--lane-h);left:0;right:0;top:calc(var(--i) * (var(--lane-h) + var(--lane-gap)));background:color-mix(in srgb, var(--key-idle) 70%, var(--card));border-radius:14px;transition:top .18s;position:absolute}.key-lane[data-active=true]{z-index:1;background:color-mix(in srgb, var(--action) 12%, var(--card));box-shadow:inset 0 0 0 2px color-mix(in srgb, var(--action) 50%, transparent)}.key-lane[data-active=true][data-error=true]{background:var(--error-wash);box-shadow:inset 0 0 0 2px color-mix(in srgb, var(--error) 70%, transparent)}.key-lane__hint{z-index:3;border:1px solid var(--line);background:light-dark(#fff,var(--key-hint-dark));color:var(--ink);box-shadow:var(--shadow);white-space:nowrap;pointer-events:none;border-radius:8px;margin:0;padding:5px 9px;font:800 13px/1 Nunito,sans-serif;position:absolute;top:50%;left:calc(100% + 8px);transform:translateY(-50%)}.key-lane__hint:before{content:"";background:light-dark(#fff,var(--key-hint-dark));border-left:1px solid var(--line);border-bottom:1px solid var(--line);width:8px;height:8px;position:absolute;top:50%;left:-5px;transform:translateY(-50%)rotate(45deg)}.key-lane__tile[data-bubble=before] .key-lane__hint{left:auto;right:calc(100% + 8px)}.key-lane__tile[data-bubble=before] .key-lane__hint:before{border-bottom:0;border-left:0;border-right:1px solid var(--line);border-top:1px solid var(--line);left:auto;right:-5px}.syllable-tile.key-lane__tile{z-index:2;top:calc(var(--lane) * (var(--lane-h) + var(--lane-gap)) + var(--lane-h) / 2);left:clamp(calc(var(--tile-w) / 2 + 4px), calc(var(--x) * 100%), calc(100% - var(--tile-w) / 2 - 4px));width:var(--tile-w);height:var(--tile-h);margin:0;font-size:32px;transition:top .18s;position:absolute;transform:translate(-50%,-50%)}.syllable-tile.key-lane__tile[data-state=upcoming]{box-shadow:none}.syllable-tile.key-lane__tile[data-state=current][data-error=true]{border-color:var(--error);color:var(--error);background:var(--error-wash);box-shadow:0 0 0 3px color-mix(in srgb, var(--error) 28%, transparent)}.key-lanes[data-layout=mobile]{--tile-w:44px;--tile-h:38px;--lane-h:46px;--lane-gap:5px}.key-lanes[data-layout=mobile] .syllable-tile.key-lane__tile{font-size:22px}.key-lanes[data-layout=mobile] .key-lane__hint{padding:4px 7px;font-size:12px}@media (width<=700px){.key-lanes{--tile-w:44px;--tile-h:38px;--lane-h:46px;--lane-gap:5px}.syllable-tile.key-lane__tile{font-size:22px}.key-lane__hint{padding:4px 7px;font-size:12px}}@media (prefers-reduced-motion:reduce){.key-lane,.syllable-tile.key-lane__tile{transition:none}}@media (width<=700px){.syllable-tiles,.syllable-tiles__word{gap:6px}.syllable-tiles__word>.syllable-tile{flex-basis:58px;width:58px;max-width:58px;height:54px}.syllable-tiles__word>.syllable-tile[data-mark=punct]{flex-basis:32px;width:32px;max-width:32px}.syllable-tiles__gap{width:8px}.syllable-tile{width:58px;height:54px}.syllable-tile__glyph{font-size:28px}}.practice-app[data-mode=course] .course-card .phrase{margin:0;font-size:64px;font-weight:800;line-height:1.2}.practice-app[data-mode=course] .course-card .phrase__char,.practice-app[data-mode=course] .course-card .phrase__syllable{box-shadow:none;background:0 0;border-bottom:3px solid #0000;font-weight:800;animation:none;position:relative}.practice-app[data-mode=course] .course-card .phrase__char[data-state=current],.practice-app[data-mode=course] .course-card .phrase__syllable[data-state=current],.practice-app[data-mode=course] .course-card .phrase__char[data-error=true],.practice-app[data-mode=course] .course-card .phrase__syllable[data-error=true]{border-bottom-color:var(--action);box-shadow:none;background:0 0;border-radius:0;animation:none}.course-miss{background:var(--error-wash);max-width:min(640px,100%);color:var(--error-ink);border:1px solid var(--key-wrong-line);text-align:center;border-radius:99px;margin:0;padding:8px 14px;font:700 14px/1.35 Nunito,sans-serif}.session-done{background:var(--card);border:1px solid var(--line);width:min(560px,100%);box-shadow:var(--pop-shadow);text-align:center;border-radius:24px;flex-direction:column;align-items:stretch;gap:14px;padding:clamp(20px,4vw,32px);display:flex}.session-done h2{color:var(--ink);margin:0;font:800 clamp(36px,6vw,56px)/1.05 Nunito,sans-serif}.session-done__praise{color:var(--ink-soft);margin:0;font:700 18px/1.3 Nunito,sans-serif}.session-done__mastery{text-align:left;flex-direction:column;gap:8px;display:flex}.session-done__mastery-label{color:var(--ink-soft);justify-content:space-between;gap:12px;font:700 14px/1.2 Nunito,sans-serif;display:flex}.session-done__mastery-label strong{color:var(--ink);font-size:16px}.session-done__track{background:var(--track);border-radius:99px;height:10px;overflow:hidden}.session-done__track div{background:var(--action);border-radius:99px;height:100%}.session-done__line{color:var(--ink);font-variant-numeric:tabular-nums;margin:0;font:800 20px/1.2 Nunito,sans-serif}.session-done__keys{flex-direction:column;align-items:center;gap:4px;display:flex}.session-done .next-keys{flex-wrap:wrap;justify-content:center;margin:0}.session-done .next-keys__list{flex-wrap:wrap;justify-content:center}.session-done .next-keys__chip,.session-done .next-keys__empty{border-radius:10px;min-width:40px;height:40px;padding:0 8px;font:800 22px/1 Nanum Gothic,sans-serif}.session-done__actions{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.session-done__actions .button{min-width:min(100%,180px)}.session-done .button--primary{color:var(--on-action);background:var(--action);box-shadow:0 2px 0 var(--action-pressed);border:none;border-radius:12px;min-height:48px;font:800 16px/1 Nunito,sans-serif}.session-done .button--secondary{color:var(--ink-soft);border:1px solid var(--line);box-shadow:none;background:0 0;min-height:48px;font:700 15px/1 Nunito,sans-serif}@media (width<=834px){.course-card{border-radius:20px;padding:14px 24px 22px}.session-done{padding:22px 18px}}@media (width<=720px),(height<=760px){.course-card{min-height:0;padding:12px 16px 16px}.practice-app[data-mode=course] .course-card .phrase{font-size:64px}.keys-run{justify-content:flex-start;gap:8px}}@media (width<=420px){.session-done__actions{flex-direction:column}.session-done__actions .button{width:100%}.course-miss{font-size:13px}}.stroke-viewport{--fade:72px;width:100%;-webkit-mask-image:linear-gradient(to right, transparent 0, #000 var(--fade), #000 calc(100% - var(--fade)), transparent 100%);mask-image:linear-gradient(to right, transparent 0, #000 var(--fade), #000 calc(100% - var(--fade)), transparent 100%);padding:10px 0 8px;position:relative;overflow:hidden}.stroke-viewport[data-layout=mobile]{--fade:40px}.stroke-viewport .stroke-tape{will-change:transform;flex-wrap:nowrap;justify-content:flex-start;align-items:center;gap:2px;width:max-content;max-width:none;margin:0;padding:0;transition:transform .12s ease-out}.stroke-viewport .stroke-tape .syllable-tile{border-radius:7px;flex-direction:column;flex:none;gap:7px;width:58px;height:86px;position:relative}.stroke-viewport .stroke-tape .syllable-tile__glyph{font-weight:400}.stroke-viewport .stroke-tape .stroke-tape__space{width:50px}.stroke-viewport .stroke-tape .syllable-tile[data-edge=start]{border-top-left-radius:12px;border-bottom-left-radius:12px}.stroke-viewport .stroke-tape .syllable-tile[data-edge=end]{border-top-right-radius:12px;border-bottom-right-radius:12px}.stroke-viewport .stroke-tape .syllable-tile[data-state=current]{z-index:2;box-shadow:0 0 0 3px color-mix(in srgb, var(--action) 28%, transparent), 0 6px 12px -6px color-mix(in srgb, var(--action) 45%, transparent);transform:translateY(-3px)}.stroke-viewport .stroke-tape .syllable-tile[data-state=current][data-error=true]{border-color:var(--error);box-shadow:0 0 0 3px color-mix(in srgb, var(--error) 28%, transparent);animation:.18s ease-out stroke-shake}@keyframes stroke-shake{0%,to{transform:translateY(-3px)translate(0)}25%{transform:translateY(-3px)translate(-4px)}50%{transform:translateY(-3px)translate(4px)}75%{transform:translateY(-3px)translate(-2px)}}.stroke-tape__hint{letter-spacing:.04em;background:var(--fc,var(--deep));color:var(--fm,var(--ink));text-align:center;border-radius:999px;min-width:10px;padding:3px 7px 2px;font:800 12px/1 Nunito,sans-serif}.stroke-viewport .syllable-tile[data-finger=pinky]{--fc:var(--finger-pinky);--fm:var(--finger-pinky-mark)}.stroke-viewport .syllable-tile[data-finger=ring]{--fc:var(--finger-ring);--fm:var(--finger-ring-mark)}.stroke-viewport .syllable-tile[data-finger=middle]{--fc:var(--finger-middle);--fm:var(--finger-middle-mark)}.stroke-viewport .syllable-tile[data-finger=index]{--fc:var(--finger-index);--fm:var(--finger-index-mark)}.stroke-viewport .syllable-tile[data-finger=thumb]{--fc:var(--finger-thumb);--fm:var(--finger-thumb-mark)}.stroke-viewport .syllable-tile[data-state=done] .stroke-tape__hint{color:color-mix(in srgb, var(--ok) 80%, var(--ink-soft));background:0 0}.stroke-viewport .syllable-tile[data-state=upcoming] .stroke-tape__hint{opacity:.85}.stroke-tape__sym{border:3px solid;border-top:0;border-radius:0 0 3px 3px;width:24px;height:9px;margin-top:12px;margin-bottom:9px;display:block}.stroke-tape__mark{background:var(--action);opacity:.55;border-radius:2px;width:18px;height:3px;position:absolute;bottom:0;left:50%;transform:translate(-50%)}.stroke-viewport[data-layout=mobile] .stroke-tape .syllable-tile{border-radius:6px;gap:5px;width:56px;height:68px}.stroke-viewport[data-layout=mobile] .stroke-tape .stroke-tape__space{width:46px}.stroke-viewport[data-layout=mobile] .stroke-tape__hint{padding:2px 6px;font-size:11px}.stroke-viewport[data-layout=mobile] .stroke-tape__space .stroke-tape__hint{letter-spacing:.01em;padding:2px 4px;font-size:9.5px}.stroke-viewport[data-layout=mobile] .stroke-tape__sym{border-width:2.5px;width:20px;height:8px;margin-top:8px;margin-bottom:7px}@media (prefers-reduced-motion:reduce){.stroke-viewport .stroke-tape{transition:none}.stroke-viewport .stroke-tape .syllable-tile[data-state=current][data-error=true]{animation:none}}.practice-app[data-drill=stroke] .keyboard-shell[data-layout=mobile] .keyboard-key[data-state=expected]:not([data-kind=shift]){background:var(--finger,var(--finger-thumb));border-color:var(--finger-mark,var(--finger-thumb-mark));color:var(--ink);box-shadow:0 0 0 2px color-mix(in srgb, var(--finger-mark,var(--finger-thumb-mark)) 55%, transparent), 0 3px 8px color-mix(in srgb, var(--finger-mark,var(--finger-thumb-mark)) 40%, transparent)}.practice-app[data-drill=stroke] .keyboard-shell[data-layout=mobile] .keyboard-key[data-state=expected]:not([data-kind=shift]) :is(.keyboard-key__jamo,.keyboard-key__latin,.keyboard-key__shifted){color:var(--ink)}.practice-app[data-drill=stroke] .keyboard-shell[data-layout=desktop] .keyboard-key[data-state=expected]:not([data-kind=shift]){box-shadow:0 2px 0 var(--finger-mark,var(--finger-thumb-mark)), 0 0 0 3px color-mix(in srgb, var(--finger-mark,var(--finger-thumb-mark)) 40%, transparent);transform:translateY(-1px)}
