:root{color:#1f2937;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;background-color:#f8fafc;font-family:Noto Sans TC,PingFang TC,Microsoft JhengHei,system-ui,-apple-system,sans-serif;font-weight:400;line-height:1.4}*{box-sizing:border-box}body{min-height:100vh;margin:0}#root{min-height:100vh}.flashcard-shell{justify-content:center;align-items:center;min-height:100vh;padding:1rem;display:flex}.flashcard{text-align:center;background:#fff;border-radius:1rem;width:100%;max-width:30rem;padding:1.25rem;box-shadow:0 10px 30px #0f172a14}.label{color:#64748b;margin:0;font-size:.95rem}.chinese{margin:.9rem 0 1.2rem;font-size:clamp(2rem,9vw,3rem)}.answer-block{gap:.85rem;display:grid}.pinyin{margin:0;font-size:1.3rem}.english{color:#0f172a;margin:0;font-size:1.2rem}.actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;display:grid}.speech-message{color:#b91c1c;margin:.2rem 0 0;font-size:.98rem}button{cursor:pointer;border:0;border-radius:.75rem;min-height:3.2rem;font-size:1.1rem;font-weight:600}.primary-button{color:#fff;background:#2563eb;width:100%}.secondary-button{color:#0f172a;background:#e2e8f0}.flashcard-view{flex-direction:column;gap:.75rem;width:100%;max-width:30rem;display:flex}.nav-bar{justify-content:flex-end;gap:.5rem;display:flex}.nav-browse-btn{min-height:2.4rem;padding:0 1rem;font-size:.95rem}.browse-shell{flex-direction:column;gap:.75rem;min-height:100vh;padding:1rem;display:flex}.browse-header{align-items:center;gap:1rem;display:flex}.browse-back-btn{flex-shrink:0;min-height:2.4rem;padding:0 1rem;font-size:.95rem}.browse-title{margin:0;font-size:1.3rem;font-weight:700}.browse-speech-message{margin:0}.browse-controls{gap:1.25rem;display:flex}.browse-control-label{cursor:pointer;align-items:center;gap:.4rem;font-size:.95rem;display:flex}.browse-grid{grid-template-columns:repeat(auto-fill,minmax(7rem,1fr));gap:.6rem;display:grid}.browse-card{cursor:pointer;background:#fff;border-radius:.75rem;flex-direction:column;justify-content:center;align-items:center;gap:.25rem;min-height:auto;padding:.75rem .5rem;font-weight:400;transition:background .15s;display:flex;box-shadow:0 2px 8px #0f172a12}.browse-card:active{background:#dbeafe}.browse-chinese{font-size:2rem;line-height:1.2}.browse-pinyin{color:#64748b;font-size:.75rem}.browse-english{color:#374151;font-size:.75rem}.browse-category-section{flex-direction:column;gap:.6rem;display:flex}.browse-category-heading{color:#1e3a5f;border-bottom:1px solid #e2e8f0;margin:0;padding:.25rem 0;font-size:1rem;font-weight:600}.matching-mode-toggle{grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem;display:grid}.matching-mode-btn{min-height:2.6rem}.matching-mode-btn.is-active{color:#fff;background:#2563eb}.matching-progress{margin:0;font-weight:600}.matching-note{color:#475569;margin:0;font-size:.92rem}.matching-columns{grid-template-columns:1fr;gap:.75rem;display:grid}.matching-column{gap:.5rem;display:grid}.matching-column-title{color:#1e3a5f;margin:0;font-size:1rem}.matching-card{color:#0f172a;background:#fff;border:2px solid #dbe4ef;border-radius:.7rem;width:100%;min-height:2.9rem;font-size:2rem;font-weight:500}.matching-card.is-selected{background:#dbeafe;border-color:#2563eb}.matching-card.is-matched{color:#14532d;background:#dcfce7;border-color:#16a34a}.matching-feedback{margin:0;font-size:1rem;font-weight:600}.matching-feedback.is-correct{color:#15803d}.matching-feedback.is-incorrect{color:#b91c1c}.matching-complete{color:#166534;margin:0;font-weight:600}.matching-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;display:grid}@media (width>=700px){.matching-columns{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}}