*{box-sizing:border-box}:root{color:#172033;font-synthesis:none;text-rendering:optimizelegibility;background:#f3f5f8;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif}html,body,#root{width:100%;min-height:100%;margin:0}body{overscroll-behavior-y:none;background:#f3f5f8}button,input,textarea,select{font:inherit}button{cursor:pointer;-webkit-tap-highlight-color:transparent}button:disabled{cursor:not-allowed;opacity:.55}.app{width:100%;max-width:600px;min-height:100dvh;padding-bottom:calc(92px + env(safe-area-inset-bottom));background:#f3f5f8;margin:0 auto}.header{padding:calc(26px + env(safe-area-inset-top)) 20px 24px;color:#fff;background:linear-gradient(135deg,#132347,#2563eb)}.header-compact{padding-top:calc(12px + env(safe-area-inset-top));justify-content:space-between;align-items:center;gap:16px;padding-bottom:12px;display:flex}.header-compact .brand{font-size:21px}.header-compact .subtitle{margin-top:2px;font-size:12px}.header-compact .header-stats{flex:1;gap:6px;max-width:245px;margin-top:0}.header-compact .header-stat{text-align:center;border-radius:12px;padding:7px 6px}.header-compact .header-stat strong{font-size:16px}.header-compact .header-stat span{margin-top:0;font-size:10px}.brand{letter-spacing:-.5px;font-size:29px;font-weight:800;line-height:1.2}.subtitle{opacity:.78;margin-top:8px;font-size:16px}.header-stats{grid-template-columns:repeat(3,1fr);gap:10px;margin-top:24px;display:grid}.header-stat{background:#ffffff21;border:1px solid #ffffff1a;border-radius:16px;padding:12px 10px}.header-stat strong{font-size:21px;display:block}.header-stat span{opacity:.74;margin-top:3px;font-size:12px;display:block}.main{padding:16px}h2{margin:4px 0 16px;font-size:23px}.card{background:#fff;border-radius:22px;margin-bottom:14px;padding:20px;box-shadow:0 6px 25px #0f172a0b}.section-title{margin-bottom:10px;font-weight:700}.label{color:#8993a5;font-size:12px}.select,input,textarea{color:#172033;background:#fff;border:1px solid #d9dee7;border-radius:14px;width:100%}.select{min-height:48px;padding:0 13px}input{min-height:48px;margin-top:10px;padding:0 13px}textarea{resize:vertical;min-height:128px;padding:15px;font-size:17px;line-height:1.55;display:block}.select:focus,input:focus,textarea:focus{border-color:#3b82f6;outline:none;box-shadow:0 0 0 3px #3b82f621}.training-mode-switch{background:#e7ebf1;border-radius:14px;grid-template-columns:repeat(3,1fr);gap:4px;margin-bottom:10px;padding:4px;display:grid}.training-mode-switch button{color:#788395;background:0 0;border:none;border-radius:11px;min-height:38px;font-size:13px;font-weight:700}.training-mode-switch button.active{color:#2454a6;background:#fff;box-shadow:0 2px 8px #0f172a14}.training-card{padding-bottom:16px}.training-toolbar{background:#fff;border-radius:16px;grid-template-columns:minmax(118px,.8fr) minmax(0,2fr);align-items:end;gap:12px;margin-bottom:10px;padding:10px 12px;display:grid;box-shadow:0 4px 18px #0f172a0a}.category-control{min-width:0}.training-switches{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;display:grid}.category-control>span{color:#8993a5;margin:0 0 4px 2px;font-size:11px;display:block}.training-toolbar .select{border-radius:11px;min-height:38px}.switch-control{color:#526074;white-space:nowrap;cursor:pointer;flex:none;justify-content:center;align-items:center;gap:5px;min-height:38px;font-size:11px;display:flex}.switch-control input{opacity:0;width:1px;height:1px;margin:-1px;position:absolute}.switch-track{background:#cbd2dc;border-radius:999px;width:32px;height:20px;transition:background .2s;position:relative}.switch-track:after{content:"";background:#fff;border-radius:50%;width:14px;height:14px;transition:transform .2s;position:absolute;top:3px;left:3px;box-shadow:0 1px 4px #0f172a38}.switch-control input:checked+.switch-track{background:#2563eb}.switch-control input:checked+.switch-track:after{transform:translate(12px)}.switch-control input:focus-visible+.switch-track{outline:3px solid #3b82f633}.tag{color:#3154a1;background:#eef3ff;border-radius:999px;margin-bottom:10px;padding:5px 10px;font-size:12px;font-weight:650;display:inline-block}.chinese{margin:7px 0 12px;font-size:21px;font-weight:760;line-height:1.4}.sentence-prompt{display:inline}.sentence-prompt+.english{margin-top:12px}.inline-speak-button{color:#2563eb;vertical-align:3px;background:#eef3ff;border:none;border-radius:9px;place-items:center;width:28px;height:28px;margin:0 0 0 6px;padding:0;display:inline-grid}.inline-speak-button svg{width:14px;height:14px}.reference-row{justify-content:space-between;align-items:center;gap:12px;display:flex}.text-button{color:#2563eb;background:#eef3ff;border:none;border-radius:10px;padding:8px 11px}.english{color:#172033;margin:4px 0 10px;font-size:17px;line-height:1.4}.english-blurred{filter:blur(6px);-webkit-user-select:none;user-select:none;opacity:.62;transition:filter .16s,opacity .16s}.speak-button{color:#2454a6;background:#eef3ff;border:none;border-radius:14px;place-items:center;width:38px;min-height:38px;margin:0 0 12px;padding:0;font-weight:650;display:inline-grid}.speak-button svg{display:block}.training-card>input[type=text]{min-height:46px;margin-top:12px;font-size:16px}.answer-correct{background:#f1fff6;border-color:#22c55e;box-shadow:0 0 0 3px #22c55e1f}.score-box{color:#667085;background:#f5f7fa;border-radius:12px;align-items:center;gap:10px;margin-top:10px;padding:10px 12px;font-size:13px;display:flex}.score-box strong{color:#2563eb;font-size:16px}.score-good{color:#15803d;background:#ecfdf3}.score-good strong{color:#15803d}.action-grid{grid-template-columns:1fr 1fr;gap:10px;margin-top:12px;display:grid}.training-card:focus-within .action-grid{z-index:2;-webkit-backdrop-filter:blur(12px);background:#fffffff5;border-radius:14px;margin-bottom:-6px;margin-left:-6px;margin-right:-6px;padding:8px 6px 6px;position:sticky;bottom:0;box-shadow:0 -8px 20px #0f172a0d}body:has(.training-card input:focus) .bottom-nav{display:none}body:has(.training-card input:focus) .app{padding-bottom:env(safe-area-inset-bottom)}.full{grid-column:1/-1}.primary-button,.secondary-button{border:none;border-radius:14px;min-height:48px;padding:12px 14px;font-weight:650}.primary-button{color:#fff;background:#2563eb}.primary-button:active{background:#1d4ed8}.secondary-button{color:#2953a2;background:#eef1f5}.secondary-button:active{background:#e1e6ed}.secondary-button.review-active{color:#8a5a08;opacity:1;background:#fff7df}.phrase-card{line-height:1.55}.phrase-zh{margin-bottom:8px;font-size:17px;font-weight:700}.phrase-en{color:#5d6879;margin-bottom:16px;font-size:15px;line-height:1.55}.search{min-height:50px;margin:0 0 8px}.library-count{color:#7b8495;margin-bottom:12px;padding-left:3px;font-size:13px}.library-add{width:100%;margin-top:12px}.delete-button{color:#c62828;background:#fff0f0;border:none;border-radius:11px;padding:9px 13px}.phrase-actions{flex-wrap:wrap;gap:10px;display:flex}.phrase-actions button{flex:1}.word-progress-badge{color:#2563eb;background:#eaf1ff;border-radius:999px;padding:8px 11px;font-size:12px;font-weight:700}.word-card-top{justify-content:space-between;align-items:center;gap:10px;display:flex}.word-training-card{text-align:left}.word-card-top .tag{margin-bottom:0}.word-chinese{margin-bottom:12px;font-size:26px}.secondary-button.word-mastered{color:#15803d;background:#ecfdf3}.word-reference{color:#172033;align-items:center;gap:8px;margin:22px 0 14px;display:flex}.word-reference>span{letter-spacing:-.7px;overflow-wrap:anywhere;font-size:clamp(34px,10vw,52px);font-weight:820;line-height:1.08}.word-inline-speak{vertical-align:0;flex:none;width:32px;height:32px;margin-left:2px}.word-details{background:#f6f8fb;border-radius:15px;margin-bottom:4px;padding:14px}.word-part{color:#2563eb;background:#e8f0ff;border-radius:999px;margin-bottom:9px;padding:3px 8px;font-size:11px;font-weight:700;display:inline-block}.word-meanings{flex-wrap:wrap;gap:7px;display:flex}.word-meanings span{color:#334155;background:#fff;border:1px solid #dfe5ee;border-radius:10px;padding:6px 9px;font-size:15px}.word-context{color:#8a93a2;margin-top:10px;font-size:12px}.shadowing-panel{background:#fbfdff;border:1px solid #dfe7f3;border-radius:15px;margin-top:12px;padding:13px}.shadowing-heading{justify-content:space-between;align-items:center;gap:12px;display:flex}.shadowing-heading strong,.shadowing-heading span{display:block}.shadowing-heading strong{font-size:14px}.shadowing-heading span{color:#8a93a2;margin-top:3px;font-size:11px}.record-button{color:#fff;background:#2563eb;border:none;border-radius:12px;flex:none;align-items:center;gap:6px;min-height:38px;padding:0 11px;font-size:12px;font-weight:700;display:flex}.record-button.recording{opacity:1;background:#dc2626;animation:1.2s ease-in-out infinite recording-pulse}.speech-feedback{color:#526074;background:#eef3fa;border-radius:12px;margin-top:11px;padding:11px}.speech-feedback>div{align-items:baseline;gap:4px;display:flex}.speech-feedback span,.speech-feedback small{font-size:12px}.speech-feedback strong{color:#2563eb;margin-left:auto;font-size:27px}.speech-feedback p{overflow-wrap:anywhere;margin:6px 0 3px;font-size:13px}.speech-feedback em{font-size:11px;font-style:normal}.speech-good{color:#166534;background:#ecfdf3}.speech-good strong{color:#15803d}.speech-error{color:#b42318;background:#fff1f0;font-size:12px}@keyframes recording-pulse{50%{box-shadow:0 0 0 5px #dc262624}}.word-audio-only{margin:10px 0 0}.word-training-card .word-progress-badge{font-size:11px}.stats-grid{grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px;display:grid}.big-stat{text-align:center;background:#fff;border-radius:20px;padding:22px;box-shadow:0 5px 20px #0f172a0a}.big-stat strong{color:#2563eb;font-size:31px;display:block}.big-stat span{color:#7d8798;margin-top:5px;font-size:13px;display:block}.progress-card{margin-top:14px}.progress-line{background:#e8ecf2;border-radius:999px;width:100%;height:10px;overflow:hidden}.progress-fill{background:linear-gradient(90deg,#2563eb,#22c55e);border-radius:999px;height:100%;transition:width .25s}.progress-text{color:#6d7787;text-align:right;margin-top:9px;font-size:13px}.empty{color:#7b8494;text-align:center;line-height:1.8}.bottom-nav{z-index:1000;width:min(600px,100%);padding:9px 8px calc(10px + env(safe-area-inset-bottom));-webkit-backdrop-filter:blur(18px);background:#fffffff5;border-top:1px solid #e4e8ee;grid-template-columns:repeat(4,1fr);gap:4px;display:grid;position:fixed;bottom:0;left:50%;transform:translate(-50%)}.nav-button{color:#8a93a2;background:0 0;border:none;border-radius:15px;min-height:54px}.nav-button span,.nav-button small{display:block}.nav-button span{font-size:19px}.nav-button span:first-child{font-weight:700}.nav-button small{margin-top:4px;font-size:11px}.nav-button.active{color:#2563eb;background:#eef4ff}@media (width<=480px){.main{padding:14px 14px 18px}.header{padding-left:18px;padding-right:18px}.header-compact{padding-left:14px;padding-right:14px}.brand{font-size:27px}.card{border-radius:20px;padding:18px}.train-page .training-card{padding:14px}.training-toolbar{grid-template-columns:108px minmax(0,1fr);gap:8px;padding-left:9px;padding-right:9px}.switch-control{flex-direction:column;gap:2px;font-size:10px}.chinese{font-size:19px}.english{font-size:16px}.header-stats{gap:8px}.header-stat{padding:10px 8px}}@media (height<=750px) and (width<=480px){.app{padding-bottom:calc(74px + env(safe-area-inset-bottom))}.main{padding-top:10px}.header-compact .subtitle{display:none}.training-toolbar{padding-top:7px;padding-bottom:7px}.train-page .tag{margin-bottom:6px}.train-page .chinese{margin-bottom:8px;font-size:18px}.train-page .speak-button{min-height:34px;margin-bottom:8px}.train-page .action-grid{gap:7px;margin-top:8px}.train-page .primary-button,.train-page .secondary-button{min-height:40px;padding:8px}.bottom-nav{padding-top:5px;padding-bottom:calc(5px + env(safe-area-inset-bottom))}.nav-button{min-height:47px}}