:root{--bg:#f4efe3;--panel:#fffdf7;--surface:#fff;--ink:#1e2f2c;--muted:#53655f;--border:#d7cec0;--accent:#0f766e;--accent-soft:#d9f0ed;--accent-ghost-border:#a8d8d2;--shadow-color:#1e2f2c14;--button-text:#fff;--bg-grad-1:#f8f4ea;--bg-grad-2:#f4efe3;--bg-grad-3:#ece4d5}:root[data-theme=dark]{--bg:#151c1c;--panel:#1d2626;--surface:#222d2d;--ink:#e9efee;--muted:#9db0ab;--border:#324040;--accent:#2ec4b6;--accent-soft:#133431;--accent-ghost-border:#295851;--shadow-color:#00000047;--button-text:#0c1514;--bg-grad-1:#1b2524;--bg-grad-2:#151c1c;--bg-grad-3:#111716}*{box-sizing:border-box}body{background:radial-gradient(circle at 10% 10%, var(--bg-grad-1) 0%, var(--bg-grad-2) 40%, var(--bg-grad-3) 100%);color:var(--ink);margin:0;font-family:Segoe UI,Tahoma,sans-serif}#root{min-height:100vh}.app-shell{max-width:920px;margin:0 auto;padding:24px}.topbar h1{margin:0;font-size:2rem}.topbar-main{justify-content:space-between;align-items:start;gap:12px;display:flex}.theme-toggle{background:var(--accent-soft);color:var(--accent);border-color:var(--accent-ghost-border);white-space:nowrap}.theme-controls{border:1px solid var(--accent-ghost-border);border-radius:12px;display:inline-flex;overflow:hidden}.theme-controls .theme-toggle{border:0;border-radius:0}.theme-controls .theme-toggle+.theme-toggle{border-left:1px solid var(--accent-ghost-border)}.theme-controls .theme-toggle.active{background:var(--accent);color:var(--button-text)}.theme-status{color:var(--muted);text-align:right;margin:8px 0 0;font-size:.85rem}.topbar p{color:var(--muted);margin:6px 0 0}.stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:20px;display:grid}.stats div{background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:12px}.stats span{color:var(--muted);font-size:.9rem;display:block}.stats strong{font-size:1.4rem}.group-panel{background:var(--panel);border:1px solid var(--border);border-radius:14px;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:14px;padding:12px;display:grid}.group-field{gap:6px;display:grid}.group-field label{color:var(--muted);font-size:.9rem}.unit-progress-panel{background:var(--panel);border:1px solid var(--border);border-radius:14px;margin-top:14px;padding:12px}.unit-progress-head{justify-content:space-between;align-items:baseline;margin-bottom:8px;display:flex}.unit-progress-head h3{margin:0}.unit-progress-head p{color:var(--muted);margin:0;font-size:.85rem}.unit-progress-list{gap:8px;display:grid}.unit-progress-item{text-align:left;background:var(--surface);border:1px solid var(--border);width:100%;color:var(--ink);grid-template-columns:1.3fr repeat(3,.7fr);align-items:center;gap:8px;display:grid}.unit-progress-item.active{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}.card-wrap{margin-top:18px}.flashcard{cursor:pointer;background:var(--panel);border:1px solid var(--border);min-height:190px;box-shadow:0 14px 30px var(--shadow-color);border-radius:20px;flex-direction:column;justify-content:center;gap:10px;padding:22px;display:flex}.face-label{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:0;font-size:.75rem}.flashcard h2{margin:0;font-size:1.9rem}.phonetic-row{justify-content:space-between;align-items:center;gap:10px;display:flex}.phonetic-main{align-items:baseline;gap:10px;min-width:0;display:inline-flex}.answer-word-inline{color:var(--ink);font-size:1rem;font-weight:600}.phonetic-text{color:var(--muted);font-size:.9rem}.tts-button{background:var(--accent-soft);color:var(--accent);border-color:var(--accent-ghost-border);border-radius:999px;min-width:58px;padding:6px 10px;font-size:.82rem}.tts-button.active{background:var(--accent);color:var(--button-text)}.tts-controls{align-items:center;gap:8px;display:inline-flex}.accent-toggle{border:1px solid var(--accent-ghost-border);border-radius:999px;display:inline-flex;overflow:hidden}.accent-button{background:var(--surface);color:var(--muted);border:0;border-radius:0;min-width:34px;padding:5px 8px;font-size:.75rem}.accent-button+.accent-button{border-left:1px solid var(--accent-ghost-border)}.accent-button.active{background:var(--accent-soft);color:var(--accent)}.tts-hint{color:var(--muted);opacity:.85;margin:-4px 0 0;font-size:.66rem;line-height:1.25}.flashcard small,.example,.empty{color:var(--muted)}.card-meta{opacity:.62;font-size:.82rem}.actions{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:12px;display:grid}button,input,select{font:inherit}button{background:var(--accent);color:var(--button-text);cursor:pointer;border:1px solid #0000;border-radius:12px;padding:10px 12px}button:hover{filter:brightness(1.05)}button:disabled{opacity:.55;cursor:not-allowed;filter:none}button.ghost{background:var(--accent-soft);color:var(--accent);border-color:var(--accent-ghost-border)}.add-form{background:var(--panel);border:1px solid var(--border);border-radius:16px;margin-top:22px;padding:16px}.add-form h3{margin:0 0 10px}.add-form form{gap:10px;display:grid}input,select{border:1px solid var(--border);background:var(--surface);color:var(--ink);border-radius:10px;padding:10px}.group-hint{color:var(--muted);margin:0 0 10px;font-size:.9rem}.form-actions{gap:10px;display:flex}@media (width<=760px){.topbar-main{flex-direction:column;align-items:stretch}.theme-controls{width:100%}.theme-controls .theme-toggle{flex:1}.theme-status{text-align:left}.stats,.group-panel{grid-template-columns:1fr}.actions{grid-template-columns:repeat(2,minmax(0,1fr))}}