:root{--bg-primary:#fff;--bg-secondary:#f5f4ef;--bg-tertiary:#faf9f5;--bg-success:#e1f5ee;--bg-danger:#fcebeb;--bg-info:#e6f1fb;--bg-warning:#faeeda;--text-primary:#1a1a1a;--text-secondary:#5f5e5a;--text-tertiary:#888780;--text-success:#0f6e56;--text-danger:#a32d2d;--text-info:#185fa5;--text-warning:#854f0b;--border-tertiary:rgba(0,0,0,.12);--border-secondary:rgba(0,0,0,.25);--border-success:#5dcaa5;--border-danger:#f09595;--radius-md:8px;--radius-lg:12px;--font-sans:-apple-system,BlinkMacSystemFont,"Segoe UI","Helvetica Neue",Arial,"Noto Sans Thai",sans-serif}@media (prefers-color-scheme:dark){:root{--bg-primary:#1f1f1d;--bg-secondary:#2a2a27;--bg-tertiary:#181816;--bg-success:#04342c;--bg-danger:#501313;--bg-info:#042c53;--bg-warning:#412402;--text-primary:#f5f4ef;--text-secondary:#b4b2a9;--text-tertiary:#888780;--text-success:#9fe1cb;--text-danger:#f7c1c1;--text-info:#b5d4f4;--text-warning:#fac775;--border-tertiary:hsla(0,0%,100%,.15);--border-secondary:hsla(0,0%,100%,.3);--border-success:#0f6e56;--border-danger:#a32d2d}}*{box-sizing:border-box}body{margin:0;font-family:var(--font-sans);color:var(--text-primary);background:var(--bg-tertiary);-webkit-font-smoothing:antialiased;line-height:1.5}.app{max-width:720px;margin:0 auto;padding:2rem 1.5rem;min-height:100vh;display:flex;flex-direction:column}.app-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem}.app-title{font-size:18px;font-weight:500;margin:0;color:var(--text-primary);text-decoration:none}.tabs{display:flex;gap:4px}.tab{padding:6px 12px;font-size:13px;border:.5px solid var(--border-tertiary);background:transparent;border-radius:var(--radius-md);cursor:pointer;color:var(--text-secondary);font-family:inherit;text-decoration:none;display:inline-block}.tab.active{color:var(--text-primary);border-color:var(--border-secondary)}.menu-item:hover,.tab.active{background:var(--bg-secondary)}.card{background:var(--bg-primary);border:.5px solid var(--border-tertiary);border-radius:var(--radius-lg);padding:2.5rem 1.5rem;min-height:280px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.direction{font-size:12px;color:var(--text-secondary);margin-bottom:1rem;letter-spacing:.04em}.prompt{font-size:32px;font-weight:500;margin:0 0 .25rem}.prompt-thai{font-size:44px}.input-row{display:flex;gap:8px;width:100%;max-width:380px;margin-top:1.25rem}.input{flex:1 1;height:36px;padding:0 12px;font-size:14px;border:.5px solid var(--border-tertiary);border-radius:var(--radius-md);background:var(--bg-primary);color:var(--text-primary);font-family:inherit;transition:border-color .15s,background .15s}.input:focus{outline:none;border-color:var(--border-secondary);box-shadow:0 0 0 2px var(--border-tertiary)}.input.correct{background:var(--bg-success);color:var(--text-success);border-color:var(--border-success)}.input.incorrect{background:var(--bg-danger);color:var(--text-danger);border-color:var(--border-danger)}.btn{height:36px;padding:0 16px;font-size:14px;border:.5px solid var(--border-secondary);background:var(--bg-primary);color:var(--text-primary);border-radius:var(--radius-md);cursor:pointer;font-family:inherit}.btn:hover{background:var(--bg-secondary)}.btn:active{transform:scale(.98)}@keyframes input-shake{0%{transform:translateX(0)}15%{transform:translateX(-5px)}35%{transform:translateX(5px)}55%{transform:translateX(-5px)}75%{transform:translateX(5px)}90%{transform:translateX(-2px)}to{transform:translateX(0)}}.input-shake{animation:input-shake .35s ease-in-out}.mic-btn{height:36px;padding:0 10px;background:none;border:.5px solid var(--border-secondary);border-radius:6px;cursor:pointer;font-size:16px;color:var(--text-secondary);transition:background .15s,color .15s;flex-shrink:0}.mic-btn:hover{background:var(--bg-secondary);color:var(--text-primary)}.mic-btn.mic-active{background:var(--bg-secondary);color:var(--text-danger,#e53935);border-color:var(--text-danger,#e53935);animation:pulse 1s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}.answer-line{margin-top:1rem;font-size:14px;color:var(--text-secondary);width:100%;max-width:380px;min-height:1.5em}.answer-line strong{color:var(--text-primary);font-weight:500}.action-row{display:flex;gap:8px;width:100%;max-width:380px;margin-top:1rem;justify-content:space-between;align-items:stretch}.continue{flex:1 1;padding:10px 16px;font-size:14px;border:.5px solid var(--border-secondary);border-radius:var(--radius-md);background:var(--bg-primary);color:var(--text-primary);cursor:pointer;font-family:inherit}.continue:hover{background:var(--bg-secondary)}.override{padding:8px 12px;font-size:12px;border:.5px solid var(--border-tertiary);background:transparent;border-radius:var(--radius-md);color:var(--text-secondary);cursor:pointer;font-family:inherit}.override:hover{color:var(--text-primary);border-color:var(--border-secondary)}.skip-row{display:flex;justify-content:flex-end;width:100%;max-width:380px;margin-top:.75rem}.skip-btn{padding:6px 10px;border:.5px solid var(--border-tertiary);background:transparent;border-radius:var(--radius-md);color:var(--text-secondary);cursor:pointer;font-size:12px;font-family:inherit}.skip-btn:hover{color:var(--text-primary)}.hint{font-size:11px;color:var(--text-tertiary);margin-top:.75rem}.status-bar{display:flex;gap:8px;justify-content:center;margin-top:1.5rem;font-size:12px;color:var(--text-secondary);flex-wrap:wrap}.status-bar strong{color:var(--text-primary);font-weight:500}.empty{padding:2rem 1rem;font-size:14px}.empty,.loading{text-align:center;color:var(--text-secondary)}.loading{padding:2rem;font-size:13px}.stats-wrap{background:var(--bg-primary);border:.5px solid var(--border-tertiary);border-radius:var(--radius-lg);overflow:hidden}.stats-table{width:100%;font-size:13px;border-collapse:collapse}.stats-table th{text-align:left;font-weight:500;color:var(--text-secondary);font-size:12px}.stats-table td,.stats-table th{padding:10px 12px;border-bottom:.5px solid var(--border-tertiary)}.stats-table tr:last-child td{border-bottom:none}.pill{display:inline-block;font-size:11px;padding:2px 8px;border-radius:999px}.pill-new{background:var(--bg-info);color:var(--text-info)}.pill-learning,.pill-relearning{background:var(--bg-warning);color:var(--text-warning)}.pill-review{background:var(--bg-success);color:var(--text-success)}.pill-due{background:var(--bg-danger);color:var(--text-danger)}.actions{display:flex;gap:8px;justify-content:flex-end;margin-top:1rem;font-size:12px}.action-btn{padding:6px 10px;border:.5px solid var(--border-tertiary);background:transparent;border-radius:var(--radius-md);color:var(--text-secondary);cursor:pointer;font-size:12px;font-family:inherit}.action-btn:hover{color:var(--text-primary)}