:root{--paper: #f7f4ec;--paper-2: #fffdf8;--ink: #221f1a;--ink-2: #4a453c;--ink-3: #7d766a;--line: #ded6c4;--accent: #8c3b2e;--accent-soft: #f0e2dc;--seal: #b4453a;--ok: #2f6b4f;--radius: 14px;--serif: "Noto Serif KR", "Nanum Myeongjo", "Batang", "SimSun", serif;--sans: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", "Malgun Gothic", sans-serif}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--paper);color:var(--ink);font-family:var(--sans);line-height:1.65;-webkit-text-size-adjust:100%}.hanja{font-family:var(--serif)}.wrap{max-width:760px;margin:0 auto;padding:0 18px 96px}header.site{padding:28px 0 18px;text-align:center}header.site h1{margin:0;font-family:var(--serif);font-size:30px;letter-spacing:.04em}header.site h1 a{color:var(--ink);text-decoration:none}header.site .tagline{margin:6px 0 0;color:var(--ink-3);font-size:14px}header.site nav{margin-top:12px;font-size:13px}header.site nav a{color:var(--ink-3);text-decoration:none;border-bottom:1px solid var(--line);padding-bottom:2px}header.site nav a:hover{color:var(--accent)}header.site nav a[aria-current=page]{color:var(--accent);border-bottom-color:var(--accent);font-weight:600}.composer{background:var(--paper-2);border:1px solid var(--line);border-radius:var(--radius);padding:16px;box-shadow:0 1px #00000005}.composer textarea{width:100%;min-height:92px;resize:vertical;border:none;outline:none;background:transparent;font-family:var(--serif);font-size:26px;line-height:1.55;color:var(--ink)}.composer textarea::placeholder{color:#b8b0a1;font-size:20px}.composer .row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:12px;padding-top:12px;border-top:1px dashed var(--line)}.composer .count{font-size:12px;color:var(--ink-3);margin-right:auto}button.primary{background:var(--accent);color:#fff;border:none;border-radius:10px;padding:11px 22px;font-size:15px;font-weight:600;cursor:pointer}button.primary:disabled{background:#c4b8ae;cursor:not-allowed}button.primary:not(:disabled):hover{background:#76301f}.toggle{display:inline-flex;align-items:center;gap:7px;font-size:13px;color:var(--ink-2);cursor:pointer;user-select:none}.toggle input{accent-color:var(--accent);width:15px;height:15px}.chips{margin-top:14px;display:flex;gap:8px;flex-wrap:wrap}.chip{background:var(--paper-2);border:1px solid var(--line);border-radius:999px;padding:6px 13px;font-family:var(--serif);font-size:15px;color:var(--ink-2);cursor:pointer}.chip:hover{border-color:var(--accent);color:var(--accent)}.chips-label{font-size:12px;color:var(--ink-3);margin:18px 0 0}.loading{text-align:center;padding:54px 0}.loading .brush{font-family:var(--serif);font-size:38px;color:var(--accent);animation:pulse 1.4s ease-in-out infinite}.loading p{color:var(--ink-3);font-size:14px;margin:12px 0 0}@keyframes pulse{0%,to{opacity:.25}50%{opacity:1}}.alert{margin-top:18px;border:1px solid #e3c4bd;background:#fdf1ee;color:#8a2d1e;border-radius:10px;padding:13px 15px;font-size:14px}.result-head{margin-top:26px;padding:22px;background:var(--paper-2);border:1px solid var(--line);border-radius:var(--radius);text-align:center}.result-head .original{font-family:var(--serif);font-size:clamp(26px,6.4vw,38px);line-height:1.5;letter-spacing:.05em;word-break:keep-all}.result-head .eum{margin-top:8px;color:var(--ink-3);font-size:14px;letter-spacing:.02em}.result-head .source{margin-top:12px;display:inline-block;font-size:12px;color:var(--seal);border:1px solid #e0c8c3;background:#fbf2f0;border-radius:999px;padding:3px 11px}.tabs{display:flex;gap:4px;margin-top:20px;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}.tabs::-webkit-scrollbar{display:none}.tabs button{flex:0 0 auto;background:none;border:none;border-bottom:2px solid transparent;padding:11px 14px;font-size:14px;font-weight:600;color:var(--ink-3);cursor:pointer;white-space:nowrap}.tabs button[aria-selected=true]{color:var(--accent);border-bottom-color:var(--accent)}.panel{padding-top:20px}.panel[hidden]{display:none}.step{margin-bottom:22px}.step>h3{display:flex;align-items:center;gap:8px;margin:0 0 10px;font-size:13px;font-weight:700;color:var(--ink-3);letter-spacing:.06em}.step>h3 .no{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--accent-soft);color:var(--accent);font-size:11px}.card{background:var(--paper-2);border:1px solid var(--line);border-radius:12px;padding:15px 17px}.card+.card{margin-top:10px}.card h4{margin:0 0 6px;font-size:15px}.card p{margin:0;font-size:14px;color:var(--ink-2)}.card .meta{font-size:12px;color:var(--ink-3);margin-top:6px}.card h4 .ptype{display:inline-block;margin-left:8px;font-size:11.5px;font-weight:600;color:var(--accent);background:var(--accent-soft);border-radius:999px;padding:2px 9px;vertical-align:3px}.card .link{margin-top:10px;font-size:12px;color:var(--accent);background:none;border:none;padding:0;cursor:pointer;text-decoration:underline}.render-line{font-family:var(--serif);font-size:18px;line-height:2;word-break:keep-all}.trans{font-size:17px;line-height:1.8}.trans.en{font-family:var(--serif);font-size:16px;color:var(--ink-2)}.breakdown{display:flex;flex-wrap:wrap;gap:8px}.unit{flex:1 1 122px;min-width:112px;background:var(--paper-2);border:1px solid var(--line);border-radius:12px;padding:11px 10px 10px;text-align:center;cursor:pointer;transition:border-color .12s,transform .12s}.unit:hover{border-color:var(--accent);transform:translateY(-1px)}.unit .ch{font-family:var(--serif);font-size:30px;line-height:1.2}.unit .eum{font-size:12px;color:var(--ink-3)}.unit .hun{font-size:13px;margin-top:3px}.unit .role{margin-top:7px;display:inline-block;font-size:10.5px;color:var(--accent);background:var(--accent-soft);border-radius:999px;padding:2px 8px}.unit .gloss{margin-top:6px;font-size:12px;color:var(--ink-2);line-height:1.45}.unit .role.none{color:var(--ink-3);background:#eee9dd}.unit .amb{margin-top:6px;padding-top:5px;border-top:1px dashed var(--line);font-size:10.5px;line-height:1.5;color:var(--seal)}.flash{perspective:1200px}.flash-inner{position:relative;min-height:400px;border-radius:var(--radius);border:1px solid var(--line);background:var(--paper-2);padding:26px;cursor:pointer}.flash-front{text-align:center;padding:18px 0 8px}.flash-front .big{font-family:var(--serif);font-size:clamp(120px,34vw,190px);line-height:1;letter-spacing:.02em}.flash-front .reading{margin-top:14px;font-size:20px;font-weight:600;color:var(--ink)}.flash-front .rad{margin-top:22px;font-size:18px;color:var(--ink-2)}.flash-front .rad b{font-family:var(--serif);font-size:34px;color:var(--accent);vertical-align:-4px;margin:0 3px}.flash-front .rad .var{display:inline-block;margin-left:8px;font-size:12px;color:var(--ink-3);border:1px solid var(--line);border-radius:999px;padding:2px 9px;vertical-align:3px}.flash-front .rad-sub{margin-top:6px;font-size:15px;color:var(--ink-2)}.flash-front .strokes{margin-top:12px;font-size:13px;color:var(--ink-3)}.flash-front .hint{margin-top:24px;font-size:13px;color:var(--ink-3)}.flash-back .back-head{display:flex;align-items:center;gap:14px;padding-bottom:14px;border-bottom:1px solid var(--line)}.flash-back .back-head .bh-ch{font-family:var(--serif);font-size:60px;line-height:1}.flash-back .back-head .bh-rad{font-size:16px;color:var(--ink-2)}.flash-back .back-head .bh-rad b{font-family:var(--serif);font-size:28px;color:var(--accent);vertical-align:-3px;margin:0 2px}.flash-back .net-label{margin:16px 0 4px;font-size:12px;letter-spacing:.06em;color:var(--ink-3)}.flash-back .net{margin:0;padding:0;list-style:none}.flash-back .net li{display:flex;gap:14px;align-items:center;padding:11px 0;border-top:1px dashed var(--line);font-size:16px}.flash-back .net li .k{font-family:var(--serif);font-size:38px;min-width:50px;text-align:center;line-height:1.1}.flash-back .net li .t{color:var(--ink-2)}.flash-back .net li .t b{font-weight:600;color:var(--ink);margin-right:5px}.flash-back .net li .t .s{margin-left:7px;font-size:12px;color:var(--ink-3)}.warn{margin-top:8px;border:1px solid #e6d5ae;background:#fdf8ec;color:#7a5c1e;border-radius:10px;padding:10px 13px;font-size:12.5px;line-height:1.6}.warn[hidden]{display:none}.render-line .tap{font-weight:inherit;cursor:pointer;border-bottom:1px dotted var(--line)}.render-line .tap:hover{color:var(--accent);border-bottom-color:var(--accent)}.flash-nav{display:flex;align-items:center;gap:12px;margin-top:12px}.flash-nav button{background:var(--paper-2);border:1px solid var(--line);border-radius:8px;padding:7px 14px;font-size:13px;cursor:pointer;color:var(--ink-2)}.flash-nav button:disabled{opacity:.4;cursor:not-allowed}.flash-nav .pos{margin-left:auto;font-size:12px;color:var(--ink-3)}.tip{margin-top:12px;background:#fbf6ea;border:1px solid #eadfc4;border-radius:10px;padding:11px 13px;font-size:13px;color:#6b5a2c}.usage{margin-top:26px;padding-top:14px;border-top:1px dashed var(--line);display:flex;gap:10px;flex-wrap:wrap;font-size:11.5px;color:var(--ink-3)}.usage .pill{border:1px solid var(--line);border-radius:999px;padding:2px 9px;background:var(--paper-2)}.usage .pill.free{color:var(--ok);border-color:#c3ddcd;background:#f1f8f3}.debug{margin-top:30px;border:1px solid var(--line);border-radius:8px;background:var(--paper-2);font-size:12px;color:var(--ink-2)}.debug summary{cursor:pointer;padding:10px 14px;font-weight:600;color:var(--ink)}.debug .d-layer{border-top:1px solid var(--line);padding:12px 14px}.debug .d-layer h4{margin:0 0 8px;font-size:12.5px;color:var(--accent)}.debug .d-row{display:flex;gap:10px;padding:2px 0;align-items:baseline}.debug .d-key{flex:0 0 170px;color:var(--ink-3)}.debug .d-val{flex:1 1 auto;word-break:break-all}.debug .d-block{margin:6px 0}.debug pre{margin:4px 0 0;padding:8px 10px;max-height:260px;overflow:auto;white-space:pre-wrap;word-break:break-word;border:1px solid var(--line);border-radius:6px;background:var(--paper);font-size:11.5px;line-height:1.55}@media(max-width:600px){.debug .d-row,.debug .d-key{display:block}}.recent{margin-top:30px}.recent h2{font-size:12px;color:var(--ink-3);letter-spacing:.06em;margin:0 0 10px}.recent ul{list-style:none;margin:0;padding:0}.recent li{border-bottom:1px solid var(--line)}.recent li button{width:100%;text-align:left;background:none;border:none;padding:11px 2px;cursor:pointer;font-family:var(--serif);font-size:17px;color:var(--ink-2)}.recent li button:hover{color:var(--accent)}.overlay{position:fixed;inset:0;background:#221f1a73;display:grid;place-items:center;padding:18px;z-index:50}.overlay[hidden]{display:none}.modal{background:var(--paper-2);border-radius:var(--radius);border:1px solid var(--line);max-width:420px;width:100%;max-height:80vh;overflow:auto;padding:22px}.modal .close{float:right;background:none;border:none;font-size:20px;color:var(--ink-3);cursor:pointer;line-height:1}.modal .big{font-family:var(--serif);font-size:64px;text-align:center;line-height:1.1}.modal dl{display:grid;grid-template-columns:60px 1fr;gap:7px 12px;margin:16px 0 0;font-size:14px}.modal dt{color:var(--ink-3);font-size:12.5px;padding-top:2px}.modal dd{margin:0}.sib{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.sib span{border:1px solid var(--line);border-radius:8px;padding:4px 8px;font-size:13px}.sib span b{font-family:var(--serif);font-size:17px}.empty{color:var(--ink-3);font-size:14px;padding:8px 0}footer.site{margin-top:44px;padding-top:18px;border-top:1px solid var(--line);font-size:12px;color:var(--ink-3);line-height:1.8}.rad-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:8px;margin-top:16px}.rad-cell{background:var(--paper-2);border:1px solid var(--line);border-radius:10px;padding:10px 6px;text-align:center;cursor:pointer}.rad-cell:hover{border-color:var(--accent)}.rad-cell .r{font-family:var(--serif);font-size:26px}.rad-cell .n{font-size:11.5px;color:var(--ink-2);margin-top:2px}.rad-cell .s{font-size:10.5px;color:var(--ink-3)}.stroke-head{margin:24px 0 0;font-size:12px;color:var(--accent);letter-spacing:.06em;font-weight:700}.search-bar{margin-top:16px}.search-bar input{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:var(--paper-2);font-size:15px;outline:none;color:var(--ink)}.search-bar input:focus{border-color:var(--accent)}.cur-summary[hidden]{display:none}.cur-summary{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px;padding:10px 14px;border:1px solid var(--line);border-radius:10px;background:var(--paper-2);font-size:13px;color:var(--ink-2)}.cur-summary .link{font-size:12px;color:var(--ink-3);background:none;border:none;padding:0;cursor:pointer;text-decoration:underline;white-space:nowrap}.cur-summary .link:hover{color:var(--accent)}.cur-level{margin-top:28px}.cur-head{display:flex;align-items:baseline;gap:8px}.cur-badge{font-size:12px;font-weight:700;letter-spacing:.06em;color:var(--paper-2);background:var(--accent);border-radius:999px;padding:3px 9px}.cur-name{font-family:var(--serif);font-size:16px;color:var(--ink)}.cur-count{margin-left:auto;font-size:12px;color:var(--ink-3)}.cur-hint{margin:6px 0 0;font-size:12px;color:var(--ink-3)}.cur-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px;margin-top:12px}.cur-cell{position:relative;display:block;background:var(--paper-2);border:1px solid var(--line);border-radius:10px;padding:12px 12px 10px;text-decoration:none;color:inherit;cursor:pointer}.cur-cell:hover{border-color:var(--accent)}.cur-passage{font-family:var(--serif);font-size:17px;line-height:1.5;color:var(--ink);word-break:keep-all}.cur-eum{margin-top:3px;font-size:12px;color:var(--ink-2)}.cur-meta{margin-top:4px;font-size:11px;color:var(--ink-3)}.cur-cell.done{border-color:var(--ok);background:color-mix(in srgb,var(--ok) 6%,var(--paper-2))}.cur-check{display:none}.cur-cell.done .cur-check{display:block;position:absolute;top:8px;right:10px;font-size:12px;color:var(--ok)}.cur-cell.done .cur-check:before{content:"✓ 완료"}.practice-box{background:var(--paper-2);border:1px solid var(--line);border-radius:var(--radius);padding:14px;margin-top:10px}.practice-box textarea{width:100%;min-height:76px;resize:vertical;border:none;outline:none;background:transparent;font-family:var(--sans);font-size:16px;line-height:1.7;color:var(--ink)}.practice-box textarea::placeholder{color:#b8b0a1}.practice-box .row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:12px;padding-top:12px;border-top:1px dashed var(--line)}.practice-box .link{margin-right:auto;font-size:12px;color:var(--ink-3);background:none;border:none;padding:0;cursor:pointer;text-decoration:underline}.practice-box .link:hover{color:var(--accent)}.grade-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:10px}.grade-row .chip{padding:10px 18px;font-family:var(--sans);font-size:14px}#practice .step h3 .no{background:var(--ink-3)}