.text-selector{text-align:center}.text-selector h1{font-size:2rem;margin-bottom:2rem;color:var(--color-text)}.text-selector.loading,.text-selector.empty{padding:4rem 2rem;color:var(--color-text-secondary)}.text-list{display:flex;flex-direction:column;gap:1rem}.text-card-wrap{display:flex;flex-direction:column;gap:.5rem}.text-card-vocab{align-self:flex-start;background:var(--color-surface);color:var(--color-text);border:1px solid var(--color-border);border-radius:var(--radius);padding:.45rem 1rem;cursor:pointer;font:inherit;font-size:.95rem}.text-card-vocab:hover{box-shadow:var(--shadow)}.invite-section{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);padding:1rem 1.25rem;margin-bottom:2rem;text-align:left}.invite-section h2{font-size:1rem;margin-bottom:.6rem;color:var(--color-text-secondary)}.invite-row{display:flex;gap:.6rem}.invite-row input{flex:1;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius);color:var(--color-text);padding:.5rem .75rem;font:inherit;font-size:.95rem}.invite-row button{background:var(--color-active);color:#fff;border:none;border-radius:var(--radius);padding:.5rem 1.25rem;cursor:pointer;font:inherit;font-size:.95rem}.invite-row button:disabled{opacity:.5;cursor:not-allowed}.invite-msg{margin-top:.6rem;font-size:.85rem;color:var(--color-good);word-break:break-all}.invite-msg.error{color:var(--color-poor)}.text-card{display:block;width:100%;text-align:left;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);padding:1.5rem;cursor:pointer;transition:box-shadow .2s,transform .15s;font:inherit;color:var(--color-text)}.text-card:hover{box-shadow:var(--shadow);transform:translateY(-1px)}.text-card h2{font-size:1.4rem;margin-bottom:.5rem}.text-card .preview{color:var(--color-text-secondary);font-size:1rem;margin-bottom:.75rem}.text-card .meta{font-size:.85rem;color:var(--color-text-secondary);background:var(--color-border);padding:.2rem .5rem;border-radius:4px}.sentence-block{display:flex;gap:.75rem;align-items:flex-start;padding:1rem;border-radius:var(--radius);cursor:pointer;transition:background .2s,box-shadow .3s;border:2px solid transparent}.sentence-block:hover{background:#ffffff08}.sentence-block.recording{background:#e5393526;border-color:#e53935;box-shadow:0 0 12px #e5393566;animation:pulse-recording 1s ease-in-out infinite}@keyframes pulse-recording{0%,to{box-shadow:0 0 8px #e539354d}50%{box-shadow:0 0 20px #e5393599}}.sentence-block.active{background:#42a5f51f;border-color:var(--color-active);box-shadow:0 0 12px #2196f34d}.sentence-block.good{background:#66bb6a1f;border-color:var(--color-good);box-shadow:0 0 16px #4caf5066;animation:glow-green 1.5s ease-in-out infinite alternate}.sentence-block.partial{background:#ffa7261f;border-color:var(--color-partial)}.sentence-block.poor{background:#ef53501f;border-color:var(--color-poor)}@keyframes glow-green{0%{box-shadow:0 0 8px #4caf504d}to{box-shadow:0 0 20px #4caf5099}}.sentence-number{font-size:.85rem;color:var(--color-text-secondary);background:var(--color-border);width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}.sentence-text{font-size:1.35rem;line-height:1.9}.word{transition:background .3s,color .3s;border-radius:3px;padding:0 2px}.word-good{color:#2e7d32;background:#4caf5026}.word-partial{color:#e65100;background:#ff980026;text-decoration:underline wavy var(--color-partial)}.word-poor{color:#c62828;background:#f4433626;text-decoration:underline wavy var(--color-poor)}.skill-sidebar{width:280px;flex-shrink:0;background:var(--color-surface);border-left:1px solid var(--color-border);padding:1.5rem;overflow-y:auto;max-height:calc(100vh - 80px);position:sticky;top:80px}.sidebar-section{margin-bottom:1.5rem}.sidebar-section h3{font-size:.9rem;text-transform:uppercase;letter-spacing:.5px;color:var(--color-text-secondary);margin-bottom:.75rem}.score-bar{height:8px;background:var(--color-border);border-radius:4px;overflow:hidden;margin-bottom:.5rem}.score-fill{height:100%;border-radius:4px;transition:width .5s ease}.score-fill[data-score=good]{background:var(--color-good)}.score-fill[data-score=partial]{background:var(--color-partial)}.score-fill[data-score=poor]{background:var(--color-poor)}.score-label{font-size:1.5rem;font-weight:700}.stats-list{list-style:none;font-size:.9rem;color:var(--color-text-secondary)}.stats-list li{padding:.25rem 0}.problem-words{list-style:none}.problem-word{padding:.75rem;margin-bottom:.5rem;background:#fff8e11a;border-radius:var(--radius);border-left:3px solid var(--color-partial);cursor:pointer;transition:background .2s}.problem-word:hover{background:#fff8e126}.pw-header{display:flex;justify-content:space-between;align-items:baseline;gap:.5rem}.pw-header strong{font-size:1rem}.pw-tip{font-size:.8rem;color:var(--color-text-secondary);font-style:italic}.pw-miss-count{font-size:.8rem;color:var(--color-poor);display:block;margin-top:.25rem}.pw-sentences{margin-top:.5rem;padding-top:.5rem;border-top:1px solid var(--color-border);overflow:hidden}.pw-sentence{font-size:.85rem;color:var(--color-text-secondary);line-height:1.4;margin-bottom:.4rem;overflow-wrap:break-word}.pw-sentence mark{background:#ffc1074d;color:var(--color-text);border-radius:2px;padding:0 2px}.pw-more{font-size:.75rem;color:var(--color-text-secondary);font-style:italic}.encouragement{color:var(--color-good);font-weight:500}@media(max-width:768px){.skill-sidebar{width:100%;max-height:none;position:static;border-left:none;border-top:1px solid var(--color-border);padding:1rem}.pw-miss-count{display:none}.pw-header{flex-wrap:nowrap}.pw-header strong{flex-shrink:0}.pw-tip{text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}@media(max-width:768px){.skill-sidebar{width:100%;position:static;max-height:none;border-left:none;border-top:1px solid #e0e0e0}}.essay-header{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem 1rem;padding:1rem 2rem;background:var(--color-surface);border-bottom:1px solid var(--color-border);position:sticky;top:0;z-index:10}.essay-header h1{flex:1;min-width:0;font-size:1.5rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.essay-header .back-btn{background:none;border:1px solid var(--color-border);border-radius:var(--radius);padding:.4rem .8rem;cursor:pointer;font-size:1rem;color:var(--color-text);white-space:nowrap}.essay-header .back-btn:hover{background:#ffffff0d}.essay-tabs{display:flex;gap:.5rem;max-width:100%;overflow-x:auto;padding-bottom:.15rem}.essay-tab{background:none;border:1px solid var(--color-border);border-radius:var(--radius);padding:.4rem .9rem;cursor:pointer;font-size:.9rem;color:var(--color-text-secondary);white-space:nowrap}.essay-tab:hover{color:var(--color-text)}.essay-tab.active{background:var(--color-active);border-color:var(--color-active);color:#fff}.essay-header-tools{display:flex;align-items:center;gap:1rem}.essay-header-action{display:none}@media(max-width:768px){.essay-header{gap:.5rem .75rem;padding:.75rem 1rem}.essay-header h1{font-size:1.15rem}.essay-header-action{display:inline-flex;margin-left:auto}.essay-tabs{order:3;flex-basis:100%}.essay-header-tools{order:4;width:100%;overflow-x:auto;padding-bottom:.25rem}}.tts-sheet-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:60;background:#00000080;display:flex;align-items:flex-end;justify-content:center}.tts-sheet{width:100%;max-width:480px;background:var(--color-surface);border-radius:16px 16px 0 0;padding:.5rem 1.25rem calc(1.25rem + env(safe-area-inset-bottom,0px));animation:tts-sheet-up .2s ease-out}@keyframes tts-sheet-up{0%{transform:translateY(100%)}to{transform:translateY(0)}}.tts-sheet-handle{width:40px;height:4px;border-radius:2px;background:var(--color-border);margin:0 auto .75rem}.tts-sheet-header{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:1rem}.tts-sheet-header h2{font-size:1.2rem}.tts-field{margin-bottom:1.25rem}.tts-field label,.tts-label{display:block;font-size:.9rem;color:var(--color-text-secondary);margin-bottom:.4rem}.tts-field select{width:100%;background:var(--color-bg);color:var(--color-text);border:1px solid var(--color-border);border-radius:var(--radius);padding:.8rem 1rem;font:inherit;font-size:1rem}.tts-warning{margin-top:.5rem;font-size:.85rem;color:var(--color-partial)}.tts-speeds{display:flex;gap:.5rem;flex-wrap:wrap}.tts-speed{flex:1;min-width:3.2rem;background:var(--color-bg);color:var(--color-text);border:1px solid var(--color-border);border-radius:var(--radius);padding:.7rem 0;cursor:pointer;font:inherit;font-size:.95rem;text-align:center}.tts-speed.active{background:var(--color-active);border-color:var(--color-active);color:#fff}.tts-done{width:100%;background:var(--color-active);color:#fff;border:none;border-radius:var(--radius);padding:.85rem;cursor:pointer;font:inherit;font-weight:600;font-size:1.05rem}.reading-page{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}.essay-header-tools label{font-size:.95rem;display:flex;align-items:center;gap:.4rem;color:var(--color-text-secondary);white-space:nowrap}.essay-header-tools select{padding:.3rem .6rem;border-radius:4px;border:1px solid var(--color-border);font-size:.95rem;max-width:220px;background:var(--color-bg);color:var(--color-text)}.voice-warning{font-size:.8rem;color:var(--color-partial);white-space:nowrap}.tts-inline{display:flex;align-items:center;gap:1rem}.tts-gear-btn{display:none}.tts-badge{font-size:.7rem;font-weight:600;letter-spacing:.03em;text-transform:uppercase;padding:.25rem .55rem;border-radius:999px;white-space:nowrap;cursor:default}.tts-badge-google{background:#e8f5e9;color:#2e7d32;border:1px solid #a5d6a7}.tts-badge-browser{background:#fff3e0;color:#e65100;border:1px solid #ffcc80}.reading-body{display:flex;flex:1}.reading-area{flex:1;padding:2rem;max-width:calc(100% - 280px)}.sentences{display:flex;flex-direction:column;gap:.5rem;margin-bottom:2rem}.controls{display:flex;gap:.75rem;flex-wrap:wrap;padding:.75rem 0 .5rem}.bottom-sticky{position:sticky;bottom:0;z-index:5;margin-top:1rem;padding:.75rem 0 calc(.25rem + env(safe-area-inset-bottom,0px));border-top:1px solid var(--color-border);background:var(--color-bg)}.recording-line{font-size:.9rem;color:var(--color-text-secondary);margin-bottom:.6rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.recording-line em{color:var(--color-active)}.score-separator-row{display:flex;align-items:center;gap:.75rem}.score-separator{flex:1;height:8px;border-radius:999px;background:var(--color-border);overflow:hidden}.score-separator-fill{height:100%;border-radius:999px;background:var(--color-active);transition:width .3s ease}.bottom-sticky.recording .score-separator-fill{animation:recording-pulse 1.2s ease-in-out infinite}@keyframes recording-pulse{0%,to{opacity:1}50%{opacity:.35}}.score-label{font-size:.95rem;font-weight:600;white-space:nowrap}.score-label.good{color:var(--color-good)}.score-label.partial{color:var(--color-partial)}.score-label.poor{color:var(--color-poor)}.ctrl-btn{padding:.6rem 1.2rem;border:none;border-radius:var(--radius);cursor:pointer;font-size:1.05rem;font-weight:500;transition:background .2s,transform .1s}.ctrl-btn:active{transform:scale(.97)}.ctrl-btn.play{background:var(--color-active);color:#fff}.ctrl-btn.play:disabled{opacity:.5;cursor:not-allowed}.ctrl-btn.pause{background:#607d8b;color:#fff}.ctrl-btn.record{background:#e91e63;color:#fff}.ctrl-btn.record[data-active=true]{animation:pulse-record 1s ease-in-out infinite}.ctrl-btn.stop{background:#757575;color:#fff}@keyframes pulse-record{0%,to{box-shadow:0 0 #e91e6366}50%{box-shadow:0 0 0 8px #e91e6300}}.error-bar{margin-top:1rem;padding:.75rem 1rem;background:#ef53501a;border-radius:var(--radius);color:var(--color-poor);font-size:1rem}@media(max-width:768px){.tts-inline,.essay-header-tools{display:none}.tts-gear-btn{display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;font-size:1.1rem;background:none;border:1px solid var(--color-border);border-radius:var(--radius);color:var(--color-text);cursor:pointer}.tts-gear-btn:hover{background:#ffffff0d}.reading-body{flex-direction:column}.reading-area{max-width:100%;padding:1rem}}.vocab-page{max-width:900px;margin:0 auto;padding:2rem}.vocab-loading,.vocab-error{padding:3rem 1rem;text-align:center;color:var(--color-text-secondary)}.vocab-note{margin-bottom:1rem;color:var(--color-text-secondary);font-size:.95rem}.vocab-note strong{color:var(--color-text)}.vocab-error{color:var(--color-poor)}.vocab-stats{display:flex;align-items:center;gap:1.25rem;margin-bottom:1.5rem;color:var(--color-text-secondary);font-size:.95rem}.vocab-stats .due{color:var(--color-partial);font-weight:700}.practice-btn{margin-left:auto;background:var(--color-active);color:#fff;border:none;border-radius:var(--radius);padding:.55rem 1.25rem;cursor:pointer;font:inherit;font-weight:600}.practice-btn:disabled{opacity:.5;cursor:not-allowed}.vocab-list{list-style:none;display:flex;flex-direction:column;gap:.5rem}.vocab-item{display:flex;flex-direction:column;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);padding:.75rem 1rem;cursor:pointer;transition:background .2s}.vocab-item:hover{background:#ffffff08}.vocab-row{display:flex;align-items:center;gap:1rem}.vocab-sentences{margin-top:.5rem;padding-top:.5rem;border-top:1px solid var(--color-border)}.vocab-sentence{font-size:.85rem;color:var(--color-text-secondary);line-height:1.5;margin-bottom:.4rem;overflow-wrap:break-word}.vocab-sentence mark{background:#ffc1074d;color:var(--color-text);border-radius:2px;padding:0 2px}.vocab-more{font-size:.75rem;color:var(--color-text-secondary);font-style:italic}.vocab-es{font-weight:600;min-width:12rem}.vocab-count{font-style:normal;font-size:.8rem;color:var(--color-text-secondary);margin-left:.4rem}.vocab-new{font-style:normal;font-size:.75rem;color:var(--color-good);margin-left:.4rem;text-transform:uppercase}.vocab-essays{font-size:.8rem;color:var(--color-text-secondary);background:var(--color-bg);border:1px solid var(--color-border);border-radius:4px;padding:.15rem .5rem;white-space:nowrap}.vocab-zh{flex:1;color:var(--color-text-secondary)}.vocab-stage{font-size:.8rem;padding:.2rem .6rem;border-radius:4px;background:var(--color-border);color:var(--color-text);white-space:nowrap}.vocab-stage.stage-4{background:var(--color-good);color:#fff}@media(max-width:768px){.vocab-page{padding:1rem}.vocab-stats{flex-wrap:wrap;gap:.5rem;font-size:.85rem}.practice-btn{width:100%;margin-left:0;text-align:center}.vocab-row{flex-wrap:wrap;gap:.25rem .75rem}.vocab-es{min-width:auto;font-size:1rem}.vocab-zh{flex:none}.vocab-essays,.vocab-stage{display:none}.vocab-item.expanded .vocab-essays,.vocab-item.expanded .vocab-stage{display:inline-block;margin-top:.25rem}}.practice-page{max-width:720px;margin:0 auto;padding:2rem}.practice-loading,.practice-error,.practice-empty{padding:3rem 1rem;text-align:center;color:var(--color-text-secondary)}.practice-error{color:var(--color-poor)}.practice-progress{color:var(--color-text-secondary);white-space:nowrap}.practice-modes{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.5rem;justify-content:center}.mode-tab{background:var(--color-surface);color:var(--color-text);border:1px solid var(--color-border);border-radius:var(--radius);padding:.4rem .9rem;cursor:pointer;font:inherit;font-size:.9rem}.mode-tab.active{background:var(--color-active);border-color:var(--color-active);color:#fff}.practice-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);padding:2rem;display:flex;flex-direction:column;gap:1.5rem;text-align:center}.practice-mode-label{color:var(--color-text-secondary);font-size:.9rem;text-transform:uppercase;letter-spacing:.05em}.practice-prompt{font-size:2.2rem;font-weight:700;line-height:1.3;word-break:break-word}.practice-options{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.option{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius);color:var(--color-text);padding:.9rem 1rem;cursor:pointer;font:inherit;transition:border-color .15s,transform .1s}.option:not(:disabled):hover{border-color:var(--color-active);transform:translateY(-1px)}.option.correct{background:var(--color-good);border-color:var(--color-good);color:#fff}.option.wrong{background:var(--color-poor);border-color:var(--color-poor);color:#fff}.option:disabled{cursor:default}.practice-input{display:flex;gap:.75rem;justify-content:center}.practice-input input{flex:1;max-width:24rem;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius);color:var(--color-text);padding:.8rem 1rem;font:inherit}.practice-input button{background:var(--color-active);color:#fff;border:none;border-radius:var(--radius);padding:.8rem 1.5rem;cursor:pointer;font:inherit}.practice-input button:disabled{opacity:.5;cursor:not-allowed}.practice-feedback{font-size:1.1rem;font-weight:600}.practice-feedback.ok{color:var(--color-good)}.practice-feedback.no{color:var(--color-poor)}.next-btn{align-self:center;background:var(--color-active);color:#fff;border:none;border-radius:var(--radius);padding:.6rem 2rem;cursor:pointer;font:inherit;font-weight:600}.next-btn:disabled{opacity:.5;cursor:not-allowed}.practice-summary{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);padding:3rem;text-align:center;display:flex;flex-direction:column;gap:1rem;align-items:center}.summary-score{font-size:3rem;font-weight:700;color:var(--color-active)}.summary-label{font-size:1.2rem}.summary-note{color:var(--color-text-secondary);font-size:.9rem}@media(max-width:768px){.practice-page{padding:1rem}.practice-modes{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;padding-bottom:.25rem}.practice-options{grid-template-columns:1fr}.practice-summary{padding:1.5rem 1rem}}.app{max-width:900px;margin:0 auto;padding:2rem}.pin-gate{min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:1rem;background:linear-gradient(160deg,#1a237e,#283593 60%,#3949ab)}.pin-card{width:100%;max-width:320px;background:#fff;border-radius:16px;padding:2rem 1.75rem;display:flex;flex-direction:column;align-items:center;gap:.9rem;box-shadow:0 12px 32px #00000040}.pin-lock{font-size:2.5rem;line-height:1}.pin-title{font-size:1.1rem;color:#333;margin:0;font-weight:600}.pin-input{width:100%;padding:.7rem;font-size:1.4rem;text-align:center;letter-spacing:.6em;border:1.5px solid #ccc;border-radius:8px;outline:none;transition:border-color .2s}.pin-input:focus{border-color:var(--color-active, #3949ab)}.pin-error{color:var(--color-poor, #c62828);font-size:.85rem;margin:0}.pin-submit{width:100%;padding:.65rem;border:none;border-radius:8px;background:var(--color-active, #3949ab);color:#fff;font-size:.95rem;font-weight:600;cursor:pointer;transition:background .2s,transform .1s}.pin-submit:hover:not(:disabled){background:#283593}.pin-submit:active:not(:disabled){transform:scale(.98)}.pin-submit:disabled{opacity:.5;cursor:not-allowed}:root{--color-good: #66bb6a;--color-partial: #ffa726;--color-poor: #ef5350;--color-active: #42a5f5;--color-bg: #1a1a2e;--color-surface: #16213e;--color-text: #e0e0e0;--color-text-secondary: #9e9e9e;--color-border: #2a2a4a;--radius: 8px;--shadow: 0 2px 12px rgba(0, 0, 0, .3)}*{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;overflow-x:hidden;overflow-x:clip}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--color-bg);color:var(--color-text);line-height:1.7;font-size:18px}#root{min-height:100vh;min-height:100dvh;overflow-x:hidden;overflow-x:clip}