:root{--bg:#262624;--bg-header:#1f1e1d;--bg-input:#30302e;--bg-user-bubble:#3a3a37;--bg-card:#2e2e2b;--border:#3e3e3a;--text:#f0eee6;--text-dim:#a8a49c;--accent:#d97757;--accent-hover:#e08a6d;--ok:#7fbf7f;--error:#e5735c}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{background:var(--bg);color:var(--text);font-family:-apple-system,Segoe UI,Malgun Gothic,sans-serif;font-size:15px}.app{height:100%;display:flex;position:relative}.sidebar{background:var(--bg-header);border-right:1px solid var(--border);flex-direction:column;flex-shrink:0;gap:8px;width:250px;padding:12px 10px;transition:width .18s,padding .18s;display:flex;overflow:hidden}.sidebar.closed{border-right-width:0;width:0;padding-left:0;padding-right:0}.new-chat{border:1px solid var(--border);color:var(--text);text-align:left;white-space:nowrap;cursor:pointer;background:0 0;border-radius:10px;flex-shrink:0;padding:9px 12px;font-family:inherit;font-size:13px}.new-chat:hover:not(:disabled){background:var(--bg-input);border-color:#57544e}.new-chat:disabled{opacity:.45;cursor:default}.conv-list{flex-direction:column;flex:1;gap:2px;display:flex;overflow-y:auto}.conv-empty{color:var(--text-dim);padding:10px 6px;font-size:12.5px}.conv{cursor:pointer;border-radius:8px;outline:none;align-items:center;gap:6px;padding:8px 8px 8px 10px;display:flex}.conv:hover{background:var(--bg-input)}.conv:focus-visible{box-shadow:inset 0 0 0 1px #57544e}.conv.active{background:var(--bg-user-bubble)}.conv-main{flex:1;min-width:0}.conv-title{white-space:nowrap;text-overflow:ellipsis;font-size:13px;overflow:hidden}.conv-date{color:var(--text-dim);margin-top:2px;font-size:11px}.conv-del{width:22px;height:22px;color:var(--text-dim);cursor:pointer;opacity:0;background:0 0;border:none;border-radius:6px;flex-shrink:0;font-size:17px;line-height:1}.conv:hover .conv-del,.conv-del:focus-visible{opacity:1}.conv-del:hover{color:var(--error);background:#e5735c1f}@media (width<=720px){.sidebar{z-index:10;position:absolute;top:0;bottom:0;left:0;box-shadow:0 0 24px #00000073}}.chat-pane{flex-direction:column;flex:1;min-width:0;display:flex}header{background:var(--bg-header);border-bottom:1px solid var(--border);-webkit-user-select:none;user-select:none;flex-shrink:0;align-items:center;gap:10px;padding:12px 18px;display:flex}.logo-dot{background:var(--accent);border-radius:3px;width:10px;height:10px;transform:rotate(45deg)}header h1{letter-spacing:.2px;font-size:14px;font-weight:600}header .status{color:var(--text-dim);margin-left:auto;font-size:12px}header .status.ok{color:var(--ok)}header .status.down{color:var(--error)}header .ghost-btn{border:1px solid var(--border);color:var(--text-dim);cursor:pointer;white-space:nowrap;background:0 0;border-radius:8px;padding:4px 10px;font-family:inherit;font-size:12px}header .ghost-btn:hover{color:var(--text);border-color:#57544e}header .ghost-btn.on{color:var(--text);background:var(--bg-input);border-color:#57544e}header .icon-btn{color:var(--text-dim);cursor:pointer;background:0 0;border:none;border-radius:6px;padding:4px 6px;font-size:15px;line-height:1}header .icon-btn:hover{color:var(--text);background:var(--bg-input)}.token-bar{border-bottom:1px solid var(--border);color:var(--text-dim);background:#33302c;flex-wrap:wrap;align-items:center;gap:10px;padding:10px 18px;font-size:13px;display:flex}.token-bar input{background:var(--bg-input);border:1px solid var(--border);min-width:180px;color:var(--text);border-radius:8px;outline:none;flex:1;padding:6px 10px;font-family:inherit;font-size:13px}.token-bar input:focus{border-color:#57544e}.token-bar button{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:8px;padding:6px 14px;font-family:inherit;font-size:13px}.token-bar button:hover{background:var(--accent-hover)}.token-bar b{color:var(--text);font-weight:600}.token-bar.auth input{flex:0 200px;min-width:140px}.token-bar button.link{color:var(--text-dim);background:0 0;padding:6px 4px;text-decoration:underline}.token-bar button.link:hover{color:var(--text);background:0 0}.auth-msg{color:var(--accent);flex-basis:100%;font-size:12.5px}.token-bar button.google{border:1px solid var(--border);color:var(--text);background:0 0}.token-bar button.google:hover:not(:disabled){background:var(--bg-input);border-color:#57544e}#chat{flex:1;overflow-y:auto}#chat-inner{flex-direction:column;gap:18px;max-width:760px;margin:0 auto;padding:24px 20px 12px;display:flex}.welcome{text-align:center;color:var(--text-dim);padding:60px 20px 40px}.welcome .big-dot{background:var(--accent);border-radius:9px;width:34px;height:34px;margin:0 auto 22px;transform:rotate(45deg)}.welcome h2{color:var(--text);margin-bottom:8px;font-size:20px;font-weight:600}.welcome p{font-size:14px}.msg{flex-direction:column;animation:.25s fadeIn;display:flex}@keyframes fadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.msg.user{align-items:flex-end}.msg.user .bubble{background:var(--bg-user-bubble);border:1px solid var(--border);white-space:pre-wrap;word-break:break-word;border-radius:14px 14px 4px;max-width:80%;padding:10px 14px;line-height:1.55}.msg.bot{align-items:flex-start}.msg.bot .row{gap:12px;max-width:92%;display:flex}.msg.bot .marker{background:var(--accent);border-radius:3px;flex-shrink:0;width:10px;height:10px;margin-top:7px;transform:rotate(45deg)}.msg.bot .bot-body{min-width:0}.msg.bot .bubble{white-space:pre-wrap;word-break:break-word;padding-top:1px;line-height:1.6}.msg.bot.error .bubble{color:var(--error)}.msg.bot.error .marker{background:var(--error)}.typing{align-items:center;gap:5px;padding:8px 0;display:inline-flex}.typing em{color:var(--text-dim);margin-left:4px;font-size:13px;font-style:normal}.typing span{background:var(--text-dim);border-radius:50%;width:7px;height:7px;animation:1.2s infinite blink}.typing span:nth-child(2){animation-delay:.2s}.typing span:nth-child(3){animation-delay:.4s}@keyframes blink{0%,60%,to{opacity:.25}30%{opacity:1}}.cards{flex-direction:column;gap:10px;margin-top:12px;display:flex}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;padding:12px 14px}.card-head{align-items:center;gap:8px;margin-bottom:6px;display:flex}.card-source{color:var(--text-dim);word-break:break-word;font-size:12.5px}.badge{letter-spacing:.3px;text-transform:uppercase;color:var(--text-dim);border:1px solid var(--border);border-radius:999px;flex-shrink:0;margin-left:auto;padding:2px 8px;font-size:10.5px}.card-ko{word-break:keep-all;font-size:19px;font-weight:600;line-height:1.45}.card-romaja{color:var(--accent);word-break:break-word;margin-top:3px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:14px}.card-rules{border-top:1px solid var(--border);margin-top:10px;padding-top:8px}.card-rules summary{cursor:pointer;color:var(--text-dim);font-size:12.5px;list-style:none}.card-rules summary::-webkit-details-marker{display:none}.card-rules summary:before{content:"▸ "}.card-rules[open] summary:before{content:"▾ "}.card-rules summary:hover{color:var(--text)}.rule-body{flex-direction:column;gap:10px;padding:10px 2px 2px;display:flex}.rule-forms{flex-wrap:wrap;align-items:center;gap:6px;font-size:14px;display:flex}.rule-label{color:var(--text-dim);font-size:11px}.diff-mark{border-radius:3px;padding:0 2px}.rule-forms .from .diff-mark{background:#d9775729}.rule-forms .to .diff-mark{color:var(--accent);background:#d9775738}.rule-arrow{color:var(--text-dim)}.rule-title{font-size:13px;font-weight:600}.rule-title-ko{color:var(--text-dim);margin-left:6px;font-size:12px;font-weight:400}.rule-cond{color:var(--text-dim);margin-top:3px;font-size:12.5px;line-height:1.55}.rule-ex{color:var(--text-dim);margin-top:4px;font-size:12.5px}.card-actions{gap:8px;margin-top:10px;display:flex}.card-actions button{border:1px solid var(--border);color:var(--text-dim);cursor:pointer;background:0 0;border-radius:8px;padding:5px 10px;font-family:inherit;font-size:12px}.card-actions button:disabled{opacity:.45;cursor:not-allowed}.card-actions button:not(:disabled):hover{color:var(--text);border-color:#57544e}.card-actions button.done{color:var(--ok);opacity:1;border-color:#7fbf7f66}.card-actions button.danger:hover{color:var(--error);border-color:#e5735c80}.card-ko .tok{font:inherit;color:inherit;cursor:pointer;background:0 0;border:none;border-bottom:1px dotted #5b5852;border-radius:3px;margin:0;padding:0 1px}.card-ko .tok:hover{background:var(--bg-input)}.card-ko .tok.active{color:var(--accent);background:#d9775738;border-bottom-color:#0000}.tok-hint{color:var(--text-dim);margin-top:8px;font-size:11.5px}.tok-hint.error{color:var(--error)}.word-panel{background:var(--bg-header);border:1px solid var(--border);border-radius:10px;margin-top:10px;padding:10px 12px}.word-head{align-items:center;gap:8px;display:flex}.word-lemma{font-size:16px;font-weight:600}.word-close{color:var(--text-dim);cursor:pointer;background:0 0;border:none;margin-left:auto;font-size:17px;line-height:1}.word-close:hover{color:var(--text)}.word-meaning{margin-top:5px;font-size:13.5px;line-height:1.5}.word-romaja{color:var(--accent);margin-top:3px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px}.word-actions{align-items:center;gap:10px;margin-top:10px;display:flex}.word-from{color:var(--text-dim);font-size:11.5px}.word-actions button{border:1px solid var(--border);color:var(--text-dim);cursor:pointer;background:0 0;border-radius:8px;margin-left:auto;padding:5px 10px;font-family:inherit;font-size:12px}.word-actions button:hover:not(:disabled){color:var(--text);border-color:#57544e}.word-actions button.done{color:var(--ok);border-color:#7fbf7f66}.word-list{flex-direction:column;gap:8px;margin-top:14px;display:flex}.word-row{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;gap:8px;padding:12px 14px;display:flex}.word-row-main{flex:1;min-width:0}.word-row-top{align-items:center;gap:8px;display:flex}.word-context{color:var(--text-dim);border-top:1px solid var(--border);margin-top:7px;padding-top:7px;font-size:12px}.word-remove{width:24px;height:24px;color:var(--text-dim);cursor:pointer;background:0 0;border:none;border-radius:6px;flex-shrink:0;align-self:flex-start;font-size:17px;line-height:1}.word-remove:hover{color:var(--error);background:#e5735c1f}.dict-head{align-items:baseline;gap:10px;margin-bottom:4px;display:flex}.dict-head h2{font-size:17px;font-weight:600}.dict-count{color:var(--text-dim);font-size:12.5px}.dict-empty{color:var(--text-dim);padding:18px 2px;font-size:13.5px;line-height:1.6}#input-area{flex-shrink:0;padding:12px 20px 18px}#input-box{background:var(--bg-input);border:1px solid var(--border);border-radius:16px;align-items:flex-end;gap:10px;max-width:760px;margin:0 auto;padding:10px 10px 10px 16px;transition:border-color .15s;display:flex}#input-box:focus-within{border-color:#57544e}#input-box textarea{resize:none;color:var(--text);background:0 0;border:none;outline:none;flex:1;max-height:160px;padding:4px 0;font-family:inherit;font-size:15px;line-height:1.5}#input-box textarea::placeholder{color:var(--text-dim)}#send{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:34px;height:34px;transition:background .15s,opacity .15s;display:flex}#send:hover:not(:disabled){background:var(--accent-hover)}#send:disabled{opacity:.4;cursor:default}#send svg{width:18px;height:18px}.hint{text-align:center;max-width:760px;color:var(--text-dim);-webkit-user-select:none;user-select:none;margin:8px auto 0;font-size:11.5px}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#45433f;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#57544e}