:root{color-scheme:light;--bg: #f7f5ef;--surface: #ffffff;--surface-strong: #f0fbf9;--ink: #22302f;--muted: #64706f;--line: #dfe5e2;--teal: #2b9b90;--teal-dark: #19736b;--amber: #f0b23d;--coral: #e36d5b;--blue: #5076c8;--shadow: 0 16px 45px rgba(30, 56, 52, .12)}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:var(--bg);color:var(--ink);font-family:Inter,PingFang SC,Microsoft YaHei,Arial,sans-serif}button{border:0;border-radius:8px;cursor:pointer;font:inherit;font-weight:700;min-height:44px;padding:0 18px}button:disabled{cursor:not-allowed;opacity:.62}.app-shell{min-height:100vh;padding:24px}.practice-panel{max-width:1180px;margin:0 auto}.topbar{align-items:center;display:flex;gap:20px;justify-content:space-between;margin-bottom:18px}.eyebrow{color:var(--teal-dark);font-size:13px;font-weight:800;letter-spacing:0;margin:0 0 6px;text-transform:uppercase}h1,h2,p{margin:0}h1{font-size:32px;line-height:1.15}h2{font-size:18px;line-height:1.25;margin-bottom:12px}.score-chip{align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow);display:flex;gap:14px;min-height:44px;padding:0 14px;white-space:nowrap}.content-grid{display:grid;gap:16px;grid-template-columns:minmax(210px,260px) minmax(360px,1fr) minmax(250px,320px)}.task-column,.drill-column,.pet-column,.result-panel,.parent-note{background:var(--surface);border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow)}.task-column,.drill-column,.pet-column{padding:16px}.task-list{display:grid;gap:10px}.task-card{background:#fbfcfb;border:1px solid var(--line);border-radius:8px;color:var(--ink);display:grid;gap:4px;justify-items:start;min-height:78px;padding:12px;text-align:left;width:100%}.task-card.active{background:var(--surface-strong);border-color:var(--teal)}.task-card strong{font-size:18px}.task-card span,.target-strip span,.parent-note span,.pet-dialog span{color:var(--muted);font-size:13px;font-weight:800}.task-card small{color:var(--muted);line-height:1.35}.drill-column{display:grid;gap:14px}.target-strip{background:#fff8e8;border:1px solid #f3d99a;border-radius:8px;display:grid;gap:6px;min-height:116px;padding:16px}.target-strip strong{font-size:40px;line-height:1.05;overflow-wrap:anywhere}.target-strip small{color:#6e5c2e;font-size:15px;line-height:1.45}.controls-row{display:flex;flex-wrap:wrap;gap:10px}.primary-button{background:var(--teal);color:#fff}.primary-button.recording{background:var(--coral)}.secondary-button{background:#eaf0ff;color:#274f9f}.meter-row{align-items:center;color:var(--muted);display:flex;font-weight:700;gap:8px;min-height:24px}.state-dot{border-radius:999px;display:inline-block;height:10px;width:10px}.state-dot.idle{background:var(--muted)}.state-dot.recording{background:var(--coral);box-shadow:0 0 0 5px #e36d5b24}.state-dot.uploading{background:var(--blue)}.state-dot.done{background:var(--teal)}.recording-playback{align-items:center;background:#f9fafc;border:1px solid var(--line);border-radius:8px;display:grid;gap:10px;grid-template-columns:72px 1fr 64px;min-height:62px;padding:10px 12px}.recording-playback span,.recording-playback small{color:var(--muted);font-size:13px;font-weight:800}.recording-playback audio{height:38px;width:100%}.recording-playback.is-empty audio{opacity:.5;pointer-events:none}.result-panel{padding:16px}.result-head{align-items:baseline;display:flex;justify-content:space-between;margin-bottom:14px}.result-head span{color:var(--muted);font-weight:800}.result-head strong{color:var(--teal-dark);font-size:44px;line-height:1}.score-bars{display:grid;gap:10px}.bar-item{align-items:center;display:grid;gap:10px;grid-template-columns:64px 1fr 34px}.bar-item span{color:var(--muted);font-weight:800}.bar-track{background:#eef1ef;border-radius:999px;height:10px;overflow:hidden}.bar-fill{background:var(--amber);border-radius:inherit;height:100%;transition:width .18s ease;width:0}.feedback-text{background:#f7faf9;border-left:4px solid var(--teal);border-radius:6px;line-height:1.55;margin-top:14px;padding:12px}.problem-list{display:grid;gap:8px;margin-top:12px}.problem-item{background:#fff7f4;border:1px solid #f3c5bd;border-radius:8px;color:#73372f;line-height:1.45;padding:10px 12px}.pet-column{display:grid;gap:12px}.pet-stage{align-items:center;background:linear-gradient(180deg,#e9f7f4,#fffaf0);border:1px solid #cbe8e3;border-radius:8px;display:flex;justify-content:center;min-height:260px;overflow:hidden;position:relative}.live2d-canvas{height:100%;top:0;right:0;bottom:0;left:0;opacity:0;position:absolute;transition:opacity .18s ease;width:100%}.pet-image{height:auto;image-rendering:auto;max-width:78%;position:relative;transform-origin:50% 82%;transition:transform .22s ease;z-index:1}.pet-stage.live2d-ready .live2d-canvas{opacity:1}.pet-stage.live2d-ready .pet-image{opacity:0;pointer-events:none}.pet-stage.motion-happy_jump .pet-image{animation:happyJump .76s ease-in-out 1}.pet-stage.motion-encourage_wave .pet-image{animation:encourageWave .9s ease-in-out 1}.pet-stage.motion-nod_yes .pet-image{animation:nodYes .68s ease-in-out 1}.pet-dialog{background:var(--surface-strong);border:1px solid #cbe8e3;border-radius:8px;display:grid;gap:6px;line-height:1.5;padding:12px}.reward-row{display:grid;gap:8px;grid-template-columns:1fr 1fr}.reward-row span{background:#fff8e8;border:1px solid #f3d99a;border-radius:8px;color:#6d5420;font-weight:800;padding:10px;text-align:center}.parent-note{background:#f9fafc;box-shadow:none;line-height:1.5;padding:12px}.parent-note p{margin-top:6px}@keyframes happyJump{0%,to{transform:translateY(0) scale(1)}45%{transform:translateY(-30px) scale(1.04)}}@keyframes encourageWave{0%,to{transform:rotate(0)}25%{transform:rotate(-5deg)}60%{transform:rotate(6deg)}}@keyframes nodYes{0%,to{transform:scaleY(1)}45%{transform:scaleY(.94) translateY(7px)}}@media(max-width:920px){.content-grid{grid-template-columns:1fr}.topbar{align-items:flex-start;flex-direction:column}.score-chip{width:100%}.target-strip strong{font-size:34px}}@media(max-width:540px){.app-shell{padding:12px}h1{font-size:26px}.controls-row button{width:100%}.recording-playback{grid-template-columns:1fr}.bar-item{grid-template-columns:58px 1fr 30px}}