:root{--bg:#f2f4f7;--surface:#fff;--surface-2:#eef1f5;--text:#141c27;--muted:#5b6676;--border:#e1e6ed;--accent:#1f5f99;--accent-strong:#174a78;--accent-soft:#e2edf8;--on-accent:#fff;--ok:#1a7f37;--ok-soft:#e6f4ea;--warn:#b54708;--down:#b42318;--down-soft:#fdecea;--note:#fff7e0;--on-note:#4a3800;--r-lg:20px;--r-md:14px;--r-sm:10px;--shadow:0 1px 2px #1018280d, 0 2px 8px #1018280f;--shadow-float:0 8px 30px #10182824, 0 1px 3px #10182814;--ease:cubic-bezier(.2, .8, .2, 1);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;font-family:-apple-system,BlinkMacSystemFont,system-ui,Segoe UI,Roboto,Apple SD Gothic Neo,Noto Sans KR,sans-serif;font-size:16px;line-height:1.5}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--bg:#0d1117;--surface:#161c25;--surface-2:#1e2531;--text:#e8ecf1;--muted:#98a2b3;--border:#273141;--accent:#6aa8e0;--accent-strong:#8dbdea;--accent-soft:#1b2a3b;--on-accent:#0d1117;--ok:#4ac26b;--ok-soft:#15291c;--warn:#fdb022;--down:#f97066;--down-soft:#3a1714;--note:#2f2610;--on-note:#f5dfa3;--shadow:0 1px 2px #0006;--shadow-float:0 10px 30px #00000080, 0 1px 3px #0006}}*{box-sizing:border-box}html{background:var(--bg)}body{-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;overscroll-behavior-y:none;min-height:100dvh;margin:0}button,input,textarea{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}.app{--nav-h:62px;--nav-side:max(12px, env(safe-area-inset-left), env(safe-area-inset-right));--nav-bottom:max(10px, calc(env(safe-area-inset-bottom) - 6px));--nav-space:calc(var(--nav-h) + var(--nav-bottom) + 12px);--header-h:52px;flex-direction:column;min-height:100dvh;display:flex}.topbar{z-index:20;color:#fff;padding:env(safe-area-inset-top) env(safe-area-inset-right) 0 env(safe-area-inset-left);background:linear-gradient(160deg,#2a6aa3,#1f4e79 70%);position:sticky;top:0;box-shadow:0 1px #00000014}@media (prefers-color-scheme:dark){.topbar{background:linear-gradient(160deg,#1d4a73,#142f4b 70%)}}.topbar-inner{height:var(--header-h);align-items:center;gap:12px;max-width:1040px;margin:0 auto;padding:0 16px;display:flex}.brand{color:inherit;align-items:center;gap:8px;text-decoration:none;display:flex}.brand-mark{color:#fff8f0;letter-spacing:.04em;background:#c0272d;border-radius:6px;align-items:center;padding:2px 9px 3px;font-family:AppleMyungjo,Nanum Myeongjo,Noto Serif KR,Batang,serif;font-size:1.15rem;font-weight:700;display:inline-flex;position:relative;transform:rotate(-3deg);box-shadow:0 1px 3px #00000040}.brand-mark:after{content:"";pointer-events:none;border:1px solid #fff5ebbf;border-radius:4px;position:absolute;inset:2px}.brand-name{opacity:.75;font-size:.85rem}.page-title{display:none}.tabs{z-index:30;grid-template-columns:repeat(5,1fr);display:grid}.tabs a{min-width:0;color:var(--muted);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;transition:color .2s var(--ease);flex-direction:column;justify-content:center;align-items:center;gap:2px;text-decoration:none;display:flex}.tab-icon{box-sizing:content-box;width:24px;height:24px;transition:background .25s var(--ease), transform .25s var(--ease);border-radius:999px;flex:none;padding:3px 14px}.tab-label{white-space:nowrap;text-overflow:ellipsis;max-width:100%;font-size:.7rem;font-weight:500;overflow:hidden}.tabs a.active{color:var(--accent)}.tabs a.active .tab-icon{background:var(--accent-soft)}.tabs a.active .tab-label{font-weight:600}.tabs a:active .tab-icon{transform:scale(.92)}@media (width<=719px){.brand-name{display:none}.page-title{margin-left:auto;margin-right:auto;padding-right:2.6rem;font-size:1.05rem;font-weight:600;display:block}.tabs{left:var(--nav-side);right:var(--nav-side);bottom:var(--nav-bottom);height:var(--nav-h);border-radius:calc(var(--nav-h) / 2);background:color-mix(in srgb, var(--surface) 82%, transparent);-webkit-backdrop-filter:blur(20px)saturate(1.6);backdrop-filter:blur(20px)saturate(1.6);border:1px solid color-mix(in srgb, var(--border) 80%, transparent);box-shadow:var(--shadow-float);padding:0 4px;position:fixed}.app:has(.composer :focus) .tabs{display:none}}@media (width>=720px){.tabs{top:env(safe-area-inset-top);height:var(--header-h);align-items:center;gap:4px;display:flex;position:fixed;right:max(16px,50vw - 504px)}.tabs a{color:#ffffffc7;border-radius:999px;flex-direction:row;gap:6px;padding:6px 12px}.tabs a:hover{color:#fff;background:#ffffff1a}.tab-icon{width:20px;height:20px;padding:0}.tab-label{font-size:.9rem}.tabs a.active{color:#1f4e79;background:#fff}.tabs a.active .tab-icon{background:0 0}}.page{width:100%;max-width:760px;padding:20px max(16px, env(safe-area-inset-right)) 32px max(16px, env(safe-area-inset-left));flex:1;margin:0 auto}@media (width<=719px){.page{padding:14px max(12px, env(safe-area-inset-right)) calc(var(--nav-space) + 8px) max(12px, env(safe-area-inset-left))}}h1,h2{letter-spacing:-.01em;line-height:1.25}h1{margin:0 0 6px;font-size:1.3rem}h2{margin:18px 0 8px;font-size:1.08rem}.card>h1:first-child,.card>h2:first-child{margin-top:0}p{margin:6px 0}a{color:var(--accent)}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow);margin-bottom:14px;padding:18px}@media (width<=719px){.card{margin-bottom:12px;padding:16px}}.muted{color:var(--muted)}.small{font-size:.875rem}.ok{color:var(--ok)}.warn{color:var(--warn)}.error{color:var(--down)}.notice{background:var(--note);color:var(--on-note);border-radius:var(--r-md);margin:0 0 14px;padding:10px 14px;font-size:.95rem}.notice a{color:inherit;font-weight:600}.pre{white-space:pre-wrap}.ko{font-size:1.15rem}.big{margin:8px 0;font-size:1.9rem;font-weight:600}input,textarea{border:1px solid var(--border);border-radius:var(--r-sm);background:var(--surface-2);width:100%;min-width:0;min-height:44px;padding:10px 14px;font-size:16px;transition:border-color .15s,background .15s}input:focus,textarea:focus{border-color:var(--accent);background:var(--surface);outline:none}textarea{resize:vertical;line-height:1.5}button{cursor:pointer;border-radius:var(--r-sm);white-space:nowrap;background:0 0;border:1px solid #0000;min-height:44px;padding:0 16px;font-weight:600;transition:background .15s,transform .1s,opacity .15s}button:active:not(:disabled){transform:scale(.97)}button:disabled{opacity:.45;cursor:default}.primary{background:var(--accent);color:var(--on-accent)}.primary:hover:not(:disabled){background:var(--accent-strong)}.secondary{background:var(--accent-soft);color:var(--accent)}.danger{background:var(--down-soft);color:var(--down)}.link{min-height:36px;color:var(--accent);padding:0;font-weight:500}.icon{min-width:40px;min-height:40px;color:var(--muted);border-radius:999px;padding:0;font-size:1.1rem}.icon:hover{background:var(--surface-2)}.icon.small{min-width:32px;min-height:32px;font-size:.9rem}.row{align-items:center;gap:8px;margin:10px 0;display:flex}.row.wrap{flex-wrap:wrap}.row.wrap input{flex:140px}.stack{flex-direction:column;gap:8px;margin-top:8px;display:flex}.stack button{align-self:flex-start}.center{flex-direction:column;align-items:center;display:flex}.chips{flex-wrap:wrap;gap:8px;margin:14px 0;display:flex}.chip{border:1px solid var(--border);background:var(--surface-2);border-radius:999px;min-height:38px;padding:0 14px;font-weight:500}.chip.selected{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}.segmented{background:var(--surface-2);border-radius:12px;grid-auto-columns:1fr;grid-auto-flow:column;margin:6px 0 8px;padding:3px;display:inline-grid}.segmented button{min-height:38px;color:var(--muted);border-radius:9px;font-weight:500}.segmented button.selected{background:var(--surface);color:var(--text);box-shadow:var(--shadow);font-weight:600}.list{margin:0;padding:0;list-style:none}.list li{border-bottom:1px solid var(--border);align-items:center;gap:10px;min-height:52px;display:flex}.list li:last-child{border-bottom:none}.list li .link{text-align:left;white-space:normal}.list li .muted{white-space:nowrap;margin-left:auto}.talk{flex-direction:column;display:flex}.talk-head{grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;display:grid}.talk-head>:first-child{justify-self:start}.talk-head>:last-child:not(strong){justify-self:end}.talk-head strong{text-align:center;text-overflow:ellipsis;white-space:nowrap;grid-column:2;max-width:50vw;overflow:hidden}.talk-head .secondary{border-radius:999px;min-height:36px;padding:0 14px}.toggles{flex-wrap:wrap;gap:6px;margin:10px 0 4px;display:flex}.toggles label{border:1px solid var(--border);background:var(--surface);min-height:32px;color:var(--muted);cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:999px;align-items:center;padding:0 12px;font-size:.85rem;font-weight:500;display:inline-flex;position:relative}.toggles input{opacity:0;cursor:pointer;min-height:0;margin:0;position:absolute;inset:0}.toggles label:has(input:checked){background:var(--accent-soft);color:var(--accent);border-color:#0000}.toggles label:has(input:checked):before{content:"✓";margin-right:5px}.toggles label:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}.messages{flex-direction:column;flex:1;gap:10px;padding:12px 0 16px;display:flex}.bubble{max-width:85%;animation:pop-in .25s var(--ease);border-radius:20px;padding:10px 14px}@keyframes pop-in{0%{opacity:0;transform:translateY(6px)scale(.98)}}.bubble p{margin:2px 0}.bubble.tutor{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow);border-bottom-left-radius:6px;align-self:flex-start}.bubble.user{background:var(--accent);color:var(--on-accent);border-bottom-right-radius:6px;align-self:flex-end}.bubble.user .correction{background:var(--note);color:var(--on-note);border-radius:12px;margin-top:8px;padding:8px 10px}.bubble.user .correction .muted{color:inherit;opacity:.8;font-size:.9rem}.bubble.user .correction .icon{color:inherit}.translation{color:var(--muted);font-style:italic}.bubble-actions{flex-wrap:wrap;align-items:center;gap:2px;margin:2px -8px -4px;display:flex}.bubble-actions .link{margin-left:6px;font-size:.85rem}.thinking{align-self:flex-start;font-style:italic;animation:1.4s ease-in-out infinite breathe}@keyframes breathe{50%{opacity:.45}}.new-words{background:var(--ok-soft);color:var(--ok);border-radius:var(--r-md);padding:10px 14px;font-size:.9rem}.new-words>span+span:before{content:" · "}.summary{margin-top:8px}.composer{z-index:10;padding:10px 0 calc(10px + env(safe-area-inset-bottom));background:linear-gradient(to top, var(--bg) 75%, transparent);position:sticky;bottom:0}.composer p{margin:4px 4px 6px}.composer .row{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow-float);border-radius:999px;margin:0;padding:6px}.composer input{background:0 0;border:none;padding:0 6px}.composer .primary{border-radius:999px}@media (width<=719px){.composer{left:var(--nav-side);right:var(--nav-side);bottom:calc(var(--nav-space) - 4px);background:0 0;padding:0;position:fixed}.composer:focus-within{bottom:max(8px, env(safe-area-inset-bottom))}.composer p{border-radius:var(--r-md);background:color-mix(in srgb, var(--surface) 92%, transparent);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);padding:6px 12px}.composer .row{background:color-mix(in srgb, var(--surface) 88%, transparent);-webkit-backdrop-filter:blur(20px)saturate(1.6);backdrop-filter:blur(20px)saturate(1.6)}.page-sprechen:has(.composer){padding-bottom:calc(var(--nav-space) + 84px)}}.interim{color:var(--accent);font-size:1.1rem}.mic{background:var(--accent);width:44px;height:44px;min-height:44px;color:var(--on-accent);border-radius:50%;flex:none;padding:0;font-size:1.2rem}.mic.big{width:84px;height:84px;box-shadow:var(--shadow-float);margin:8px 0;font-size:2rem}.mic.on{background:var(--down);animation:1.4s infinite pulse}@keyframes pulse{0%,to{box-shadow:0 0 0 0 color-mix(in srgb, var(--down) 45%, transparent)}50%{box-shadow:0 0 0 10px #0000}}.practice .segmented{width:100%;max-width:320px;display:grid}.flashcard{text-align:center;flex-direction:column;align-items:center;gap:8px;padding:18px 0 4px;display:flex}.prompt{justify-content:center;align-items:center;min-height:110px;display:flex}.big-speak{background:var(--accent-soft);width:104px;height:104px;box-shadow:var(--shadow);border-radius:50%;font-size:2.4rem}.answer{width:100%;animation:pop-in .25s var(--ease)}.answer p{margin:4px 0}.grade{justify-content:center}.grade button{flex:1;max-width:200px}.empty-state{text-align:center;padding:18px 0 6px}.search{margin:4px 0 8px}.words{margin:8px 0 0;padding:0;list-style:none}.words li{border-bottom:1px solid var(--border);align-items:center;gap:10px;padding:10px 0;display:flex}.words li:last-child{border-bottom:none}.word-main{flex-direction:column;flex:1;min-width:0;display:flex}.word-meta{flex-direction:column;align-items:flex-end;gap:4px;display:flex}.word-actions{display:flex}.level{gap:3px;display:inline-flex}.dot{background:var(--border);border-radius:50%;width:7px;height:7px}.dot.on{background:var(--accent)}.tag{color:var(--muted);background:var(--surface-2);border-radius:999px;padding:1px 8px;font-size:.72rem}.overview{background:var(--surface-2);border-radius:var(--r-md);margin-top:12px;padding:10px 14px}.overview summary{cursor:pointer;font-weight:600}.install{background:var(--accent-soft);border-color:#0000}.install ol{margin:4px 0 0;padding-left:1.25rem}.install li{margin:4px 0}.tiles{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin-bottom:14px;display:grid}@media (width<=719px){.tiles{grid-template-columns:repeat(2,1fr)}.tiles .tile:last-child:nth-child(odd){grid-column:span 2}}.tile{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow);flex-direction:column;padding:14px 16px;display:flex}.tile-value{font-variant-numeric:tabular-nums;font-size:1.9rem;font-weight:700;line-height:1.1}.tile-label{color:var(--muted);font-size:.85rem}.levels{border-collapse:collapse;width:100%}.levels th{text-align:left;color:var(--muted);width:6.5rem;padding:5px 0;font-weight:400}.levels .bar-cell{padding:5px 8px}.levels .count{text-align:right;font-variant-numeric:tabular-nums;width:3rem}.bar{border-radius:0 4px 4px 0;min-width:3px;height:12px;display:block}.bar.l0{background:#c6dbef}.bar.l1{background:#9ecae1}.bar.l2{background:#6baed6}.bar.l3{background:#4292c6}.bar.l4{background:#2171b5}.bar.l5{background:#08519c}