@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap";:root{--bg: #05080e;--accent: #38bdf8;--accent-dim: rgba(56, 189, 248, .1);--accent-glow: rgba(56, 189, 248, .22);--danger: #f87171;--danger-dim: rgba(248, 113, 113, .1);--danger-glow: rgba(248, 113, 113, .22);--success: #34d399;--text: #e8eef4;--text-muted: #4e6070;--surface: rgba(255, 255, 255, .04);--border: rgba(255, 255, 255, .08);--border-accent: rgba(56, 189, 248, .22);--radius: 14px;--radius-sm: 8px;--radius-pill: 999px;--blur: blur(20px);--shadow: 0 4px 24px rgba(0, 0, 0, .4)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,system-ui,sans-serif;background:var(--bg);min-height:100vh;color:var(--text);overflow-x:hidden}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse 80% 40% at 15% 10%,rgba(56,189,248,.06) 0%,transparent 60%),radial-gradient(ellipse 60% 30% at 85% 85%,rgba(99,102,241,.05) 0%,transparent 60%);pointer-events:none;z-index:0}button{cursor:pointer;font:inherit;border:none;outline:none}button:disabled{opacity:.4;cursor:not-allowed}.screen{position:relative;z-index:1;max-width:480px;margin:0 auto;padding:0 1rem 3rem;min-height:100vh}.app-header{text-align:center;padding:3rem 0 2rem}.app-logo{display:block;font-size:1.5rem;font-weight:900;letter-spacing:-.5px;color:var(--accent);text-shadow:0 0 18px var(--accent-glow);margin-bottom:.4rem}.app-subtitle{font-size:.85rem;color:var(--text-muted);font-weight:500}.loading-state{text-align:center;padding:4rem 0;color:var(--text-muted);font-size:.9rem}.loading-ring{width:36px;height:36px;border:2px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .9s linear infinite;margin:0 auto 1rem}@keyframes spin{to{transform:rotate(360deg)}}.passage-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.passage-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.25rem 1rem;text-align:left;width:100%;backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);transition:border-color .15s ease,box-shadow .15s ease,transform .15s ease}.passage-card:hover{border-color:var(--border-accent);box-shadow:0 0 18px var(--accent-glow);transform:translateY(-2px)}.passage-card-title{font-size:.9rem;font-weight:700;color:var(--text);margin-bottom:.6rem;line-height:1.35}.passage-card-meta{display:flex;gap:.35rem;flex-wrap:wrap;margin-bottom:.4rem}.grade-badge{background:var(--accent-dim);border:1px solid var(--border-accent);border-radius:var(--radius-pill);padding:.18rem .55rem;font-size:.72rem;font-weight:600;color:var(--accent)}.lang-badge{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-pill);padding:.18rem .55rem;font-size:.72rem;font-weight:600;color:var(--text-muted)}.passage-card-words{font-size:.75rem;color:var(--text-muted);font-weight:500}.read-topbar{display:flex;align-items:center;gap:.75rem;padding:1.25rem 0 1rem}.back-btn{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.5rem .9rem;font-weight:600;font-size:.82rem;color:var(--text-muted);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);white-space:nowrap;transition:border-color .15s,color .15s}.back-btn:hover{border-color:var(--border-accent);color:var(--accent)}.read-topbar-title{flex:1;font-weight:700;font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text)}.passage-text-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.5rem;backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);margin-bottom:1.25rem;max-height:42vh;overflow-y:auto}.passage-text{font-size:1.3rem;line-height:1.9;color:var(--text);font-weight:400}.passage-text-card::-webkit-scrollbar{width:4px}.passage-text-card::-webkit-scrollbar-track{background:transparent}.passage-text-card::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}.record-area{display:flex;flex-direction:column;align-items:center;gap:1rem;padding-bottom:1rem}.record-hint{font-size:.85rem;color:var(--text-muted);font-weight:500;text-align:center}.soundwave-wrap{width:100%;display:flex;justify-content:center;height:64px}.soundwave-canvas{opacity:0;transition:opacity .3s ease}.soundwave-canvas.soundwave-active{opacity:1}.mic-btn{width:84px;height:84px;border-radius:50%;background:var(--danger-dim);border:1.5px solid var(--danger);color:var(--danger);font-size:1.9rem;display:flex;align-items:center;justify-content:center;transition:box-shadow .15s ease,transform .15s ease}.mic-btn:hover:not(:disabled){box-shadow:0 0 18px var(--danger-glow);transform:scale(1.05)}.mic-btn--recording{background:#f8717126;animation:pulse-mic 1.2s ease-in-out infinite}@keyframes pulse-mic{0%,to{box-shadow:0 0 10px var(--danger-glow)}50%{box-shadow:0 0 28px #f8717180,0 0 0 10px #f871710f}}.or-divider{display:flex;align-items:center;width:100%;gap:.75rem;color:var(--text-muted);font-size:.78rem;font-weight:500}.or-divider:before,.or-divider:after{content:"";flex:1;height:1px;background:var(--border)}.upload-btn{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.7rem 1.5rem;font-weight:600;font-size:.88rem;color:var(--text-muted);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);transition:border-color .15s,color .15s}.upload-btn:hover:not(:disabled){border-color:var(--border-accent);color:var(--accent)}.submit-btn{width:100%;background:var(--accent);color:#05080e;border-radius:var(--radius-sm);padding:.9rem;font-size:.95rem;font-weight:700;transition:box-shadow .15s ease,transform .15s ease}.submit-btn:hover:not(:disabled){box-shadow:0 0 18px var(--accent-glow);transform:translateY(-1px)}.error-bubble{width:100%;background:var(--danger-dim);border:1px solid rgba(248,113,113,.28);border-radius:var(--radius-sm);padding:.8rem 1rem;color:var(--danger);font-weight:600;font-size:.85rem;text-align:center}.result-hero{text-align:center;padding:2.5rem 0 1.5rem}.stars-row{display:flex;justify-content:center;gap:.3rem;margin:.75rem 0}.star{font-size:2.25rem;line-height:1}.star-filled{color:#fbbf24;filter:drop-shadow(0 0 6px rgba(251,191,36,.45))}.star-empty{color:var(--text-muted);opacity:.25}.level-message{font-size:1rem;font-weight:500;color:var(--text-muted);margin:.4rem 0 .75rem}.reading-level-badge{display:inline-block;background:var(--accent-dim);border:1px solid var(--border-accent);color:var(--accent);border-radius:var(--radius-pill);padding:.32rem 1rem;font-weight:700;font-size:.82rem;text-shadow:0 0 10px var(--accent-glow)}.metrics-row{display:flex;gap:.75rem;margin-bottom:1rem}.metric-bubble{flex:1;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1rem .5rem;text-align:center;backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);display:flex;flex-direction:column;align-items:center;gap:.25rem}.metric-value{font-size:1.5rem;font-weight:800;color:var(--accent);line-height:1}.metric-label{font-size:.65rem;color:var(--text-muted);font-weight:600;text-transform:uppercase;letter-spacing:.07em}.recognition-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.25rem;backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);margin-bottom:1rem}.recognition-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem;font-size:.85rem;font-weight:600;color:var(--text-muted)}.recognition-header strong{color:var(--text);font-size:.95rem}.progress-track{height:6px;background:var(--border);border-radius:var(--radius-pill);overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,var(--accent),#7dd3fc);border-radius:var(--radius-pill);transition:width 1.2s ease;box-shadow:0 0 8px var(--accent-glow)}.miscue-section{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.25rem;backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);margin-bottom:1rem}.miscue-title{font-size:.72rem;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:.75rem}.miscue-stream{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:.75rem}.word-chip{display:inline-block;padding:.25rem .6rem;border-radius:var(--radius-sm);font-size:.85rem;font-weight:500;border:1px solid transparent}.word-chip--correct{background:#34d39914;border-color:#34d39938;color:#34d399}.word-chip--mispronunciation,.word-chip--substitution,.word-chip--dialectal_variation{background:#fbbf2414;border-color:#fbbf2438;color:#fbbf24}.word-chip--omission,.word-chip--refusal{background:var(--danger-dim);border-color:#f8717138;color:var(--danger)}.word-chip--insertion,.word-chip--repetition{background:#6366f114;border-color:#6366f138;color:#818cf8}.miscue-legend{display:flex;flex-wrap:wrap;gap:.75rem}.legend-item{display:flex;align-items:center;gap:.35rem;font-size:.72rem;color:var(--text-muted);font-weight:500}.chip-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}.chip-dot--correct{background:#34d399}.chip-dot--mispronunciation{background:#fbbf24}.chip-dot--omission{background:var(--danger)}.chip-dot--insertion{background:#818cf8}.result-actions{display:flex;gap:.75rem;margin-bottom:2rem}.action-btn{flex:1;border-radius:var(--radius-sm);padding:.875rem;font-size:.88rem;font-weight:700;transition:box-shadow .15s ease,transform .15s ease,border-color .15s,color .15s}.action-btn:hover:not(:disabled){transform:translateY(-1px)}.action-btn--secondary{background:var(--surface);color:var(--text-muted);border:1px solid var(--border);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur)}.action-btn--secondary:hover:not(:disabled){border-color:var(--border-accent);color:var(--accent)}.action-btn--primary{background:var(--accent);color:#05080e;font-weight:800;border:none}.action-btn--primary:hover:not(:disabled){box-shadow:0 0 18px var(--accent-glow)}