@font-face{font-family:ZCOOL KuaiLe;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/zcool-kuaile-chinese-simplified-400-normal-BKaOBC6q.woff2) format("woff2"),url(/assets/zcool-kuaile-chinese-simplified-400-normal-BwdP9UQQ.woff) format("woff")}@font-face{font-family:ZCOOL KuaiLe;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/zcool-kuaile-latin-400-normal-CVXjA4UX.woff2) format("woff2"),url(/assets/zcool-kuaile-latin-400-normal-5msQejPr.woff) format("woff")}@font-face{font-family:"Baloo 2";font-style:normal;font-display:swap;font-weight:600;src:url(/assets/baloo-2-latin-600-normal-tIfxVoAe.woff2) format("woff2"),url(/assets/baloo-2-latin-600-normal-B4tNaogw.woff) format("woff")}@font-face{font-family:"Baloo 2";font-style:normal;font-display:swap;font-weight:700;src:url(/assets/baloo-2-latin-700-normal-CqTg7A15.woff2) format("woff2"),url(/assets/baloo-2-latin-700-normal-Ld3Zm3l2.woff) format("woff")}@font-face{font-family:"Baloo 2";font-style:normal;font-display:swap;font-weight:800;src:url(/assets/baloo-2-latin-800-normal-BbF3Etk1.woff2) format("woff2"),url(/assets/baloo-2-latin-800-normal-B8BXfZF7.woff) format("woff")}@font-face{font-family:Noto Sans SC;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/noto-sans-sc-chinese-simplified-400-normal-Ba7eOkfT.woff2) format("woff2"),url(/assets/noto-sans-sc-chinese-simplified-400-normal-DUWMQbbw.woff) format("woff")}@font-face{font-family:Noto Sans SC;font-style:normal;font-display:swap;font-weight:500;src:url(/assets/noto-sans-sc-chinese-simplified-500-normal-z_irmif2.woff2) format("woff2"),url(/assets/noto-sans-sc-chinese-simplified-500-normal-Du6iXQtI.woff) format("woff")}@font-face{font-family:Noto Sans SC;font-style:normal;font-display:swap;font-weight:700;src:url(/assets/noto-sans-sc-chinese-simplified-700-normal-DoUziBww.woff2) format("woff2"),url(/assets/noto-sans-sc-chinese-simplified-700-normal-DdQ4H5Ol.woff) format("woff")}@font-face{font-family:Noto Sans SC;font-style:normal;font-display:swap;font-weight:900;src:url(/assets/noto-sans-sc-chinese-simplified-900-normal-Di-dyiBb.woff2) format("woff2"),url(/assets/noto-sans-sc-chinese-simplified-900-normal-CX2eC8dM.woff) format("woff")}@font-face{font-family:Noto Sans SC;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/noto-sans-sc-latin-400-normal-C8q2FS1w.woff2) format("woff2"),url(/assets/noto-sans-sc-latin-400-normal-ned8RRXO.woff) format("woff")}@font-face{font-family:Noto Sans SC;font-style:normal;font-display:swap;font-weight:500;src:url(/assets/noto-sans-sc-latin-500-normal-JVPArRf3.woff2) format("woff2"),url(/assets/noto-sans-sc-latin-500-normal-c5FVqAg8.woff) format("woff")}@font-face{font-family:Noto Sans SC;font-style:normal;font-display:swap;font-weight:700;src:url(/assets/noto-sans-sc-latin-700-normal-BzR54Sjf.woff2) format("woff2"),url(/assets/noto-sans-sc-latin-700-normal-B17hb4LK.woff) format("woff")}@font-face{font-family:Noto Sans SC;font-style:normal;font-display:swap;font-weight:900;src:url(/assets/noto-sans-sc-latin-900-normal-DBVNDsAU.woff2) format("woff2"),url(/assets/noto-sans-sc-latin-900-normal-C3mhQGYC.woff) format("woff")}:root{--canvas: #ECE7F6;--surface: #FFFFFF;--text-strong: #3A2E5C;--text-sub: #6B5B94;--text-muted: #8778AD;--text-faint: #A99CC9;--text-label: #B0A3CF;--text-on-dark: #FFFFFF;--current: #FF6FA5;--correct: #3ED598;--playing: #8B8397;--warn: #FF9F43;--error: #FF5D5D;--key-white: #FFFFFF;--key-white-line: #F0ECF8;--key-black: #2B2B2B;--key-inset: #EEE7FB;--disabled-bg: #EFECF5;--disabled-text: #A99CC9;--font-display: "ZCOOL KuaiLe", cursive;--font-numeric: "Baloo 2", system-ui, sans-serif;--font-body: "Noto Sans SC", system-ui, sans-serif;--fs-caption: 12px;--fs-small: 13px;--fs-body: 15px;--fs-body-lg: 17px;--fs-h3: 20px;--fs-h2: 26px;--fs-h1: 34px;--fs-display-xl: 56px;--fs-metric: 58px;--fs-display-hero: 76px;--lh-tight: 1;--lh-heading: 1.2;--lh-body: 1.6;--lh-relaxed: 1.7;--ls-caption: .08em;--ls-label: .06em;--r-chip: 999px;--r-sm: 10px;--r-md: 14px;--r-lg: 18px;--r-xl: 20px;--r-cell: 20px;--r-card: 24px;--r-card-lg: 28px;--r-screen: 34px;--sp-1: 4px;--sp-2: 8px;--sp-3: 12px;--sp-4: 16px;--sp-5: 20px;--sp-6: 24px;--sp-7: 30px;--sp-8: 40px;--gutter-h: 56px;--gutter-v: 52px;--shadow-soft: 0 4px 14px rgba(124,92,252,.08);--shadow-card: 0 10px 30px rgba(124,92,252,.1);--shadow-screen: 0 18px 50px rgba(74,44,135,.16);--ring-recording: 0 0 0 4px rgba(255,111,165,.25);--z-sticky: 100;--z-scrim: 900;--z-modal: 1000;--z-toast: 1100;--tap-min: 44px;--tap-primary: 56px;--xinxin-blush: #FF9ECD;--xinxin-skin: #FFE3C7;--bg: #F6F1FF;--primary: #7C5CFC;--sub: #B79CFF;--accent: #FF9ECD;--star: #FFCB57;--ink: #4A2C87;--primary-gradient: linear-gradient(180deg,#8B6BFF,#7C5CFC);--progress-track: #E6DCFF;--progress-fill: linear-gradient(90deg,#B79CFF,#7C5CFC);--surface-tint: #F0EAFF;--button-shadow: 0 8px 20px rgba(124,92,252,.35)}[data-skin=dreamy]{--bg:#F6F1FF;--primary:#7C5CFC;--sub:#B79CFF;--accent:#FF9ECD;--star:#FFCB57;--ink:#4A2C87;--primary-gradient:linear-gradient(180deg,#8B6BFF,#7C5CFC);--progress-track:#E6DCFF;--progress-fill:linear-gradient(90deg,#B79CFF,#7C5CFC);--surface-tint:#F0EAFF;--button-shadow:0 8px 20px rgba(124,92,252,.35)}[data-skin=fresh]{--bg:#EEFBF3;--primary:#2FB98E;--sub:#7ED957;--accent:#6EC8F2;--star:#FFD84D;--ink:#23503F;--primary-gradient:linear-gradient(180deg,#3ED598,#2FB98E);--progress-track:#D6F2E4;--progress-fill:linear-gradient(90deg,#7ED957,#2FB98E);--surface-tint:#E4F7EE;--button-shadow:0 8px 20px rgba(47,185,142,.35)}[data-skin=candy]{--bg:#FFF1F6;--primary:#FF6FA5;--sub:#FFB1CF;--accent:#7EE0C4;--star:#FFC93C;--ink:#7A2E4E;--primary-gradient:linear-gradient(180deg,#FF8AB6,#FF6FA5);--progress-track:#FFD9E6;--progress-fill:linear-gradient(90deg,#FFB1CF,#FF6FA5);--surface-tint:#FFE4EF;--button-shadow:0 8px 20px rgba(255,111,165,.35)}[data-skin=playful]{--bg:#FFF8EA;--primary:#4D96FF;--sub:#A66CFF;--accent:#FF9F43;--star:#FF9F43;--ink:#2A3550;--primary-gradient:linear-gradient(180deg,#6BA8FF,#4D96FF);--progress-track:#FCEBC8;--progress-fill:linear-gradient(90deg,#3ED598,#4D96FF);--surface-tint:#E9F1FF;--button-shadow:0 8px 20px rgba(77,150,255,.35);--rainbow:linear-gradient(90deg,#FF5D5D,#FF9F43,#FFD84D,#3ED598,#4D96FF,#A66CFF)}@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}:root{--cream: #fff3d6;--pink: #ffb6c8;--blue: #a8d8ff;--mint: #b8ebcf;--ink: #3b2f2f;--accent: #ff7a9a;--violet: #d8c3ff;--paper: #fffaf0;--white: #ffffff;--shadow: 0 14px 34px rgba(59, 47, 47, .12);color:var(--ink);background:var(--cream);font-family:var(--font-body);font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{min-width:320px;margin:0;min-height:100vh;background:#f7f6f2}button,select,textarea{font:inherit}button{border:0;cursor:pointer}button:disabled{cursor:not-allowed;opacity:.5}.app{min-height:100vh}.app-main{width:min(100%,920px);margin:0 auto;padding:18px 16px 96px}.page{display:grid;gap:16px}.home-top,.progress-band,.today-task,.practice-panel,.recorder-panel,.score-card,.detail-panel,.trend-panel{border:1px solid rgba(59,47,47,.08);border-radius:8px;background:#ffffffd1;box-shadow:var(--shadow)}.home-top{position:relative;overflow:hidden;padding:28px 22px 20px;min-height:230px;display:grid;align-content:center;gap:10px}.home-top h1,.page-header h1{margin:0;font-size:2.4rem;line-height:1.05;letter-spacing:0}.home-top p,.today-task p,.section-note span,.encourage{margin:0;color:#3b2f2fb8;line-height:1.65}.sticker-row{display:flex;gap:12px;font-size:1.7rem;color:var(--accent)}.piano-strip{display:grid;grid-template-columns:repeat(12,1fr);width:min(100%,420px);height:60px;margin-top:8px;border:3px solid var(--ink);border-radius:8px;overflow:hidden;background:var(--white)}.piano-strip span{border-right:1px solid rgba(59,47,47,.2)}.piano-strip .black{width:62%;height:62%;justify-self:center;background:var(--ink);border-radius:0 0 5px 5px}.progress-band{padding:18px;display:grid;gap:12px}.progress-band div:first-child,.detail-title{display:flex;align-items:center;justify-content:space-between;gap:12px}.progress-band span,.eyebrow,.stat-card span,.metric span,.timer span,.report-stat span{font-size:.82rem;font-weight:700;color:#3b2f2f9e}.progress-band strong{font-size:1.45rem}.progress-track{height:14px;background:#f3e3c2;border-radius:999px;overflow:hidden}.progress-track span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--accent),#ffc65f,var(--mint))}.quick-stats,.action-grid,.report-stats,.metric-grid,.control-grid{display:grid;gap:12px}.quick-stats{grid-template-columns:repeat(3,1fr)}.stat-card,.report-stat,.metric{min-width:0;border-radius:8px;padding:14px 12px;display:grid;gap:7px;border:1px solid rgba(59,47,47,.08)}.stat-card strong,.report-stat strong{font-size:1.35rem}.mint{background:#b8ebcfc7}.pink{background:#ffb6c8c7}.blue{background:#a8d8ffc7}.today-task{padding:18px;display:grid;gap:16px}.today-task h2,.detail-title h2,.trend-panel h2{margin:4px 0 6px;font-size:1.28rem;letter-spacing:0}.primary-button,.secondary-button,.action-grid button,.control-grid button,.play-shortcut{min-height:48px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:800;text-decoration:none}.primary-button{color:var(--white);background:linear-gradient(135deg,var(--accent),#ff9d67);box-shadow:0 12px 24px #ff7a9a47}.primary-button.full{width:100%}.secondary-button{color:var(--ink);background:#b8ebcfd1;border:1px solid rgba(59,47,47,.08)}.secondary-button.full{width:100%}.action-grid{grid-template-columns:repeat(2,1fr)}.action-grid button,.control-grid button,.play-shortcut{color:var(--ink);background:#ffffffc7;border:1px solid rgba(59,47,47,.08)}.bottom-nav{position:fixed;left:50%;bottom:14px;z-index:10;width:min(calc(100% - 24px),560px);transform:translate(-50%);display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:8px;border-radius:8px;background:#ffffffe6;border:1px solid rgba(59,47,47,.1);box-shadow:0 16px 40px #3b2f2f29;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.nav-item{min-height:54px;border-radius:8px;display:grid;justify-items:center;align-content:center;gap:3px;color:#3b2f2f94;background:transparent;font-weight:800}.nav-item span{font-size:.76rem}.nav-item.active{color:var(--ink);background:var(--cream)}.page-header.compact{padding:12px 2px 0}.page-header.compact h1{font-size:2rem}.realtime-practice-page{grid-template-columns:minmax(0,1fr)}.realtime-header{display:flex;align-items:flex-end;justify-content:space-between;gap:16px}.header-stars{flex:0 0 auto;padding:9px 12px;border-radius:8px;color:#6f4f00;background:#ffe6a4;font-weight:900}.realtime-setup{gap:12px}.score-gate{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;padding:13px;border:1px solid #e6b858;border-radius:8px;background:#fff4d2}.score-gate div{min-width:0;display:grid;gap:3px}.score-gate span{color:#3b2f2fb3;line-height:1.45}.score-gate button{min-height:40px;padding:0 12px;border-radius:8px;color:var(--ink);background:var(--white);border:1px solid rgba(59,47,47,.12);font-weight:800}.mode-control{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));min-height:44px;padding:4px;border-radius:8px;background:#ecebe7}.mode-control button{min-width:0;border-radius:6px;color:#3b2f2fa3;background:transparent;font-weight:800}.mode-control button.active{color:var(--ink);background:var(--white);box-shadow:0 2px 8px #3b2f2f1f}.task-brief{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px;border-radius:8px;background:#e7f5ed}.task-brief span{color:#3b2f2fb3;line-height:1.45;text-align:right}.task-steps{display:grid;gap:7px;padding:12px;border-radius:8px;background:#f8f4ed}.task-steps>strong{color:#6d3450}.task-step{display:grid;grid-template-columns:26px minmax(0,1fr) auto;align-items:center;gap:8px;min-height:42px;padding:7px;border-radius:7px;background:#fff}.task-step>span{width:24px;height:24px;display:grid;place-items:center;border-radius:50%;color:#765e4e;background:#eee5da;font-weight:900}.task-step div{display:grid;gap:2px}.task-step small{color:#3b2f2f99;font-size:.72rem}.task-step.passed>span{color:#fff;background:#44a56d}.task-step.locked{opacity:.55}.task-step button{padding:6px 8px;border-radius:6px;background:#e7f1ff;color:#315e8b;font-size:.74rem;font-weight:800}.live-stage,.session-result{border:1px solid rgba(59,47,47,.1);border-radius:8px;background:var(--white);box-shadow:var(--shadow)}.live-stage{min-width:0;display:grid;gap:16px;padding:16px;overflow:hidden}.live-status{position:relative;min-height:46px;display:flex;align-items:center;gap:9px;overflow:hidden;padding:0 13px;border-radius:8px;color:#6b511c;background:#fff2c6;font-weight:850}.live-status.listening{color:#16563a;background:#dff5e8}.live-status.unavailable,.live-status.permission_denied,.live-status.insecure,.live-status.unsupported{color:#7f2945;background:#ffe1e9}.live-status i{position:absolute;left:0;bottom:0;height:4px;max-width:100%;background:#24a268;transition:width 80ms linear}.calibration-panel{display:grid;gap:10px;padding:14px;border-radius:8px;background:#eef5ff}.calibration-progress{height:8px;overflow:hidden;border-radius:8px;background:#d9e1ec}.calibration-progress span{display:block;height:100%;background:#4d8fcc;transition:width .18s ease}.note-rail{min-width:0;min-height:126px;display:grid;grid-auto-flow:column;grid-auto-columns:104px;gap:8px;align-items:stretch;overflow-x:auto;padding:4px 2px 10px;scroll-snap-type:x proximity}.note-rail.empty{grid-auto-columns:minmax(0,1fr)}.note-event{min-width:0;height:112px;display:grid;grid-template-rows:20px 1fr 20px;align-items:center;justify-items:center;gap:4px;padding:9px 6px;border:2px solid transparent;border-radius:8px;color:var(--ink);background:#f1f1ee;scroll-snap-align:center;transition:background .16s ease,border-color .16s ease,transform .16s ease}.note-event strong{max-width:100%;overflow-wrap:anywhere;text-align:center;font-size:1.08rem}.note-event small,.note-event span{font-size:.72rem;color:#3b2f2f9e}.note-event.current,.note-event.provisional{border-color:#dcaa28;background:#fff0ba;transform:translateY(-2px)}.note-event.correct{border-color:#57af7d;background:#d9f3e4}.note-event.nearly_correct{border-color:#d59b3d;background:#fff0c7}.note-event.retry{border-color:#dd8ca7;background:#ffe3ec}.empty-event{grid-auto-columns:minmax(180px,1fr);width:min(260px,100%)}.practice-keyboard{display:grid;gap:10px;padding:12px;border:1px solid rgba(59,47,47,.09);border-radius:8px;background:#f7f3ec}.keyboard-heading{display:flex;align-items:baseline;justify-content:space-between;gap:12px}.keyboard-heading span,.keyboard-legend{color:#3b2f2fa3;font-size:.76rem;font-weight:800}.keyboard-heading strong{color:#6d3450;font-size:.92rem}.keyboard-keys{position:relative;display:grid;grid-template-columns:repeat(15,minmax(0,1fr));height:118px;overflow:hidden;border:2px solid #4a3d37;border-radius:6px;background:#fff}.keyboard-key.white{position:relative;display:flex;align-items:end;justify-content:center;padding:0 1px 6px;border-right:1px solid rgba(59,47,47,.32);color:#3b2f2f9e;background:#fff;transition:background .16s ease,box-shadow .16s ease}.keyboard-key.white:last-of-type{border-right:0}.keyboard-key.black{position:absolute;z-index:2;top:0;width:5.5%;height:65%;display:flex;align-items:end;justify-content:center;padding-bottom:5px;border-radius:0 0 5px 5px;color:#fff;background:#413936;box-shadow:0 3px 5px #3b2f2f3d;transition:background .16s ease,box-shadow .16s ease}.keyboard-key small{font-size:.64rem;font-weight:850}.keyboard-key.target{color:#6d3450;background:#ffb6c8;box-shadow:inset 0 -5px #e76f91}.keyboard-key.black.target{color:#fff;background:#bd5277;box-shadow:0 3px 5px #79274157}.keyboard-key.heard{color:#245a41;background:#a9e6be;box-shadow:inset 0 -5px #4baa72}.keyboard-key.black.heard{color:#173d2a;background:#83cc9e}.keyboard-key.target.heard{color:#25465f;background:#b9d9ff;box-shadow:inset 0 -5px #5494cf}.keyboard-legend span{display:inline-flex;align-items:center;gap:5px}.keyboard-legend span:before{width:10px;height:10px;border-radius:3px;content:""}.keyboard-legend .target:before{background:#ff9cb6}.keyboard-legend .heard:before{background:#82d4a1}.live-metrics{display:grid;grid-template-columns:1.35fr repeat(5,minmax(0,1fr));gap:8px}.live-metrics>div{min-width:0;min-height:74px;display:grid;align-content:center;gap:5px;padding:10px;border-radius:8px;background:#eff4f8}.live-metrics span{color:#3b2f2f9e;font-size:.76rem;font-weight:800}.live-metrics strong{font-size:1.35rem;font-variant-numeric:tabular-nums}.live-metrics .live-score{color:#743049;background:#ffe3ec}.live-metrics .live-score strong{font-size:2rem}.teacher-strip{display:grid;grid-template-columns:auto minmax(0,1fr) 40px;align-items:center;gap:11px;min-height:64px;padding:10px;border-radius:8px;background:#f7efe1}.teacher-mark{width:42px;height:42px;display:grid;place-items:center;border-radius:50%;color:#493a2d;background:#ffd48b;font-size:.76rem;font-weight:900}.teacher-strip p{margin:0;line-height:1.5}.teacher-strip button{width:40px;height:40px;display:grid;place-items:center;border-radius:50%;color:var(--ink);background:var(--white)}.realtime-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.realtime-controls button{min-width:0;min-height:48px;display:inline-flex;align-items:center;justify-content:center;gap:7px;border-radius:8px;color:var(--ink);background:#f0f0ed;font-weight:850}.realtime-controls .primary-button{grid-column:1 / -1;color:var(--white);background:linear-gradient(135deg,var(--accent),#ff9d67);box-shadow:0 12px 24px #ff7a9a47}.session-result{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:12px;padding:16px;color:#16563a;background:#e2f6ea}.session-result div{display:grid;gap:4px}.session-result span{color:#3b2f2fad;line-height:1.45}.realtime-debug{padding-bottom:12px}.diagnostic-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:0 12px 12px}.diagnostic-grid span{min-width:0;padding:8px;border-radius:6px;background:#eff1f3;overflow-wrap:anywhere;font-size:.78rem}.realtime-debug .secondary-button{margin-left:12px;padding:0 12px}.debug-live-panel{display:grid;gap:14px;padding:16px;border:1px solid rgba(59,47,47,.1);border-radius:8px;background:var(--white);box-shadow:var(--shadow)}.debug-meter{height:12px;overflow:hidden;border-radius:8px;background:#e3e5e7}.debug-meter span{display:block;height:100%;max-width:100%;background:#24a268}.debug-page-grid{padding:0}.debug-note-list{display:grid;gap:6px}.debug-note-list span{padding:8px 10px;border-radius:6px;background:#f1f1ee;font-variant-numeric:tabular-nums}.debug-actions{display:flex;flex-wrap:wrap;gap:9px}.debug-actions button{padding:0 14px}.practice-panel,.recorder-panel,.score-card,.detail-panel,.trend-panel{padding:16px}.practice-panel{display:grid;gap:10px}.practice-panel label{font-weight:800}select,textarea{width:100%;border:1px solid rgba(59,47,47,.14);border-radius:8px;color:var(--ink);background:var(--paper)}select{min-height:46px;padding:0 12px}textarea{resize:vertical;padding:12px;line-height:1.5}.section-note{display:grid;gap:4px;padding:12px;border-radius:8px;background:#b8ebcf6b}.recorder-panel{display:grid;gap:14px}.status-pill,.reward-pill,.detail-title span{width:fit-content;display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:7px 10px;font-weight:800}.status-pill{color:#594218;background:#fff0be}.status-pill.recording{color:#8b1b3d;background:#ffd5df}.status-pill.scored{color:#12623a;background:#c9f4d7}.status-pill.score_failed{color:#8b3a1f;background:#ffe0cf}.spin{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.timer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px;border-radius:8px;background:#a8d8ff61}.timer strong{font-size:1.7rem;font-variant-numeric:tabular-nums}.audio-player{width:100%}.control-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.play-shortcut{width:100%}.notice{margin:0;padding:10px 12px;border-radius:8px;background:#b8ebcf80;color:#29593a;line-height:1.5}.notice.error{background:#ffb6c85c;color:#87314c}.notice.soft{background:#fff3d6b8;color:#3b2f2fb8}.notice p{margin:0}.score-card{display:grid;gap:14px}.score-main{display:flex;align-items:baseline;justify-content:center;gap:8px;min-height:86px;border-radius:8px;color:var(--ink);background:linear-gradient(135deg,#fff1a8,#ffd0dc)}.score-main strong{font-size:3.8rem;line-height:1}.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.metric{background:#ffffffc2}.metric strong{font-size:1.2rem}.reward-pill{background:#ffc65f42}.engine-banner{width:fit-content;max-width:100%;display:inline-flex;align-items:center;gap:7px;border-radius:999px;padding:8px 11px;font-weight:850;line-height:1.35}.engine-banner.mock{color:#7d4a11;background:#fff0be}.engine-banner.real{color:#12623a;background:#c9f4d7}.encourage{padding:12px;border-left:5px solid var(--accent);background:#fffaf0db;border-radius:8px}.score-details{display:grid;gap:8px;padding:12px;border-radius:8px;background:#a8d8ff38;color:#3b2f2fc7;line-height:1.5}.debug-details{border-radius:8px;background:#ffffffb8;border:1px solid rgba(59,47,47,.08);overflow:hidden}.debug-details summary{min-height:42px;padding:0 12px;display:flex;align-items:center;gap:8px;cursor:pointer;font-weight:800}.debug-details pre{max-height:260px;overflow:auto;margin:0;padding:12px;font-size:.78rem;line-height:1.45;white-space:pre-wrap;background:#2d2730;color:#fff8e8}.attempt-panel{border:1px solid rgba(59,47,47,.08);border-radius:8px;background:#ffffffd1;box-shadow:var(--shadow);padding:16px;display:grid;gap:12px}.attempt-panel h2{margin:0;font-size:1.12rem}.attempt-list{display:grid;gap:8px}.attempt-item{display:grid;gap:4px;padding:10px 12px;border-radius:8px;background:#fffaf0e0}.attempt-item span,.muted-text{color:#3b2f2fa8;line-height:1.5}.muted-text{margin:0}.today-page,.me-page,.parent-page{gap:16px}.child-welcome{padding:22px 20px;border-radius:24px;color:#fff;background:linear-gradient(135deg,#ff8a64,#ffb34f);box-shadow:0 14px 30px #dc6c3b33}.child-welcome h1,.child-welcome p{margin:0}.child-welcome h1{margin-top:5px;font-size:clamp(1.8rem,7vw,2.5rem)}.next-action-card{display:grid;gap:12px;padding:20px;border:3px solid rgba(255,174,67,.45);border-radius:24px;background:#fffdf5}.next-action-topline,.profile-row,.parent-status-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.next-action-topline span{padding:5px 10px;border-radius:999px;color:#9b4c21;background:#fff0ce;font-weight:800;font-size:.82rem}.next-action-card h2,.next-action-card p,.recent-week h2,.me-page h2,.parent-page h2{margin:0}.next-action-card .primary-button{min-height:54px;justify-content:center;border-radius:18px;font-size:1.08rem}.child-task-timeline{display:grid;gap:9px}.child-task-step{display:grid;grid-template-columns:34px 28px minmax(0,1fr) auto;align-items:center;gap:10px;min-height:58px;padding:10px 12px;border-radius:17px;background:#ffffffd1}.child-task-step>span{display:grid;width:32px;height:32px;place-items:center;border-radius:50%;background:#eee9e3;font-weight:900}.child-task-step.passed>span{color:#fff;background:#55bd7c}.child-task-step.current{outline:3px solid rgba(255,158,73,.3);background:#fff9ec}.child-task-step small{display:block;color:#3b2f2f9e}.child-task-step em{font-size:.75rem;font-style:normal}.today-result-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.today-result-strip div{display:grid;gap:3px;padding:13px 8px;text-align:center;border-radius:16px;background:#ffffffc2}.today-result-strip strong{font-size:1.2rem}.recent-week{display:grid;gap:12px}.week-dots{display:grid;grid-template-columns:repeat(7,1fr);gap:8px}.week-dots div{display:grid;justify-items:center;gap:7px;font-size:.75rem}.week-dots i{width:18px;height:18px;border-radius:50%;background:#e7e2db}.week-dots .done i{background:#63c987;box-shadow:0 0 0 4px #63c98729}.profile-card,.badge-section,.mini-trend-card,.parent-entry,.parent-status-card,.parent-tools{padding:18px;border-radius:21px;background:#fffc}.profile-card{display:flex;align-items:center;gap:14px}.profile-card h1,.profile-card p{margin:2px 0}.child-avatar{display:grid;flex:0 0 64px;height:64px;place-items:center;border-radius:50%;color:#9d5328;font-size:1.7rem;font-weight:900;background:#fff0c9}.me-highlights,.parent-status-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.me-highlights>div,.parent-status-grid>div{display:grid;gap:5px;padding:14px 8px;text-align:center;justify-items:center;border-radius:17px;background:#ffffffc7}.child-section,.practice-preview{display:grid;gap:13px;padding:18px;border-radius:21px;background:#ffffffc7}.child-section-title{display:flex;align-items:center;justify-content:space-between;gap:10px}.child-section-title h2{margin:0}.parent-entry{display:flex;align-items:center;gap:10px;width:100%}.parent-entry span{flex:1;text-align:left}.parent-actions{display:grid;gap:10px}.parent-actions button{display:grid;grid-template-columns:28px 1fr;gap:3px 10px;text-align:left}.parent-actions button span{grid-column:2;font-size:.8rem;opacity:.65}.practice-preview{margin-bottom:14px}.preview-caption{min-height:25px;text-align:center;font-weight:800}.preview-controls{display:grid;grid-template-columns:1fr 1fr;gap:10px}.preview-controls button,.child-primary-action{display:inline-flex;align-items:center;justify-content:center;gap:8px}.away-prompt{position:fixed;z-index:20;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;padding:22px;background:#32262285}.away-prompt>div{display:grid;width:min(100%,390px);gap:11px;padding:24px;border-radius:25px;background:#fffaf2;box-shadow:0 18px 55px #00000038}.away-prompt strong{font-size:1.5rem}.away-prompt p{margin:0 0 5px}.challenge-map{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;padding:16px;border-radius:22px;background:#ffffffb8}.challenge-day{position:relative;display:grid;min-height:58px;place-items:center;gap:2px;padding:6px;border:2px solid transparent;border-radius:16px;color:var(--ink);background:#eeeae4}.challenge-day small{position:absolute;right:5px;bottom:3px;font-size:.65rem}.challenge-day.today{background:#dff2ff;border-color:#5ea9da}.challenge-day.practiced{background:#fff0bd}.challenge-day.complete{color:#fff;background:#5dbd7d}.challenge-day.future{color:#aaa39c;background:#f5f2ee}.challenge-day.selected{outline:3px solid rgba(255,163,68,.38)}.calendar-day-detail{display:grid;gap:14px;padding:19px;border-radius:23px;background:#ffffffc7}.calendar-day-detail h3{margin:-5px 0 0}.day-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.day-summary div{display:grid;gap:4px;padding:10px 6px;text-align:center;border-radius:14px;background:#fff9ec}.day-summary span{font-size:.72rem;color:#3b2f2fa3}.teacher-note,.saved-reflection{margin:0;padding:12px;border-radius:14px;background:#edf8f1}.reflection-recorder{display:grid;gap:11px;padding-top:8px;border-top:1px solid rgba(61,45,40,.1)}.speech-button{min-height:54px;display:inline-flex;align-items:center;justify-content:center;gap:9px;color:#24516f;border:2px solid #85c5e7;border-radius:18px;background:#eaf8ff;font-weight:800}.speech-button.recording{color:#fff;border-color:#e66d67;background:#e66d67}.reflection-recorder textarea{width:100%;box-sizing:border-box;border-radius:15px;padding:12px;border:1px solid rgba(59,47,47,.18);font:inherit}.quick-tags{display:flex;flex-wrap:wrap;gap:7px}.quick-tags button{padding:8px 10px;border-radius:999px;background:#f6eee3;font-size:.8rem}.preview-extra-controls{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.preview-extra-controls label{display:inline-flex;align-items:center;gap:6px;font-size:.85rem;font-weight:800}.preview-extra-controls select{padding:7px;border-radius:9px;border:1px solid #d6c8b8}.listening-room-card,.dynamic-task-picker,.coach-action-card,.parent-ai-card,.reward-progress{margin:14px 0;padding:16px;border-radius:18px;background:#fffcf6f5;border:1px solid rgba(151,119,82,.18);box-shadow:0 8px 24px #4b36260f}.dynamic-task-picker{display:grid;gap:8px}.dynamic-task-picker button{display:flex;justify-content:space-between;gap:12px;text-align:left}.dynamic-task-picker button small{display:block;opacity:.7}.dynamic-task-picker button.active{outline:2px solid #ef9b70;background:#fff4e9}.coach-action-card{background:#fff3d8}.coach-action-card span{display:block;margin:6px 0 12px}.coach-action-card button+button{margin-left:8px}.reward-progress{display:grid;gap:6px;font-size:.9rem;color:#6f5b4f}.practice-preview progress{width:100%;height:8px}.migration-banner{position:fixed;z-index:100;inset:20% 16px auto;max-width:520px;margin:auto;padding:24px;border-radius:22px;background:#fff;box-shadow:0 20px 80px #30221847}.ask-teacher-dialog textarea{width:100%;box-sizing:border-box;margin:10px 0;padding:10px;border-radius:12px;border:1px solid #d8c8b8}.child-practice-setup{padding:18px;border-radius:22px;background:#ffffffc7}.child-gate-notice{display:grid;gap:5px;padding:14px;border-radius:16px;color:#765322;background:#fff2cf}.child-gate-notice strong{font-size:1.1rem}.profile-avatar{display:grid;width:58px;height:58px;place-items:center;border-radius:50%;font-size:1.7rem;background:#fff0c9}.badge-wall{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:13px}.badge-wall div{display:grid;min-height:82px;place-items:center;text-align:center;border-radius:16px;background:#fff7dd}.mini-trend{display:flex;height:110px;align-items:flex-end;gap:8px;margin-top:14px}.mini-trend span{flex:1;max-height:100%;border-radius:8px 8px 3px 3px;background:linear-gradient(#ffae55,#6bc7bd)}.parent-entry button,.parent-tools button{width:100%;justify-content:center}.parent-status-row{padding:10px 0;border-bottom:1px solid rgba(70,52,44,.1)}.parent-status-row:last-child{border-bottom:0}.calendar-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}.day-cell{min-width:0;min-height:112px;padding:9px 7px;border-radius:8px;display:grid;gap:4px;justify-items:start;text-align:left;color:var(--ink);border:2px solid transparent;background:#ffffffc2}.day-cell span{font-weight:900}.day-cell small,.day-cell em{font-size:.72rem;color:#3b2f2f9e;font-style:normal}.day-cell strong{font-size:1.2rem}.day-cell.selected{border-color:var(--accent)}.day-cell.checked{background:#e8f9ef}.day-cell.scored{background:#e8f5ff}.day-cell.great{background:#fff1ba}.detail-panel{display:grid;gap:14px}.detail-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.detail-list p{margin:0;padding:12px;border-radius:8px;background:#ffffffb3;display:grid;gap:6px}.detail-list strong{display:inline-flex;align-items:center;gap:4px}.report-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.report-stat{background:#ffffffc2}.trend-panel{display:grid;gap:18px}.bar-chart{height:190px;display:grid;grid-template-columns:repeat(7,minmax(28px,1fr));align-items:end;gap:10px;padding-top:8px}.bar-item{height:170px;display:grid;grid-template-rows:24px 1fr 22px;align-items:end;justify-items:center;gap:6px}.bar-item strong,.bar-item small{font-size:.78rem}.bar-item span{width:100%;max-width:34px;border-radius:8px 8px 4px 4px;background:linear-gradient(180deg,var(--accent),var(--blue))}@media(min-width:720px){.app-main{padding-top:28px}.home-page,.practice-page,.calendar-page,.report-page{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}.realtime-practice-page{grid-template-columns:minmax(0,1fr)}.home-top,.progress-band,.calendar-grid,.report-stats,.trend-panel,.page-header{grid-column:1 / -1}.quick-stats{grid-template-columns:repeat(3,1fr);grid-column:1 / -1}.calendar-grid{grid-template-columns:repeat(6,minmax(0,1fr))}}@media(max-width:430px){.app-main{padding-inline:12px}.quick-stats{grid-template-columns:1fr}.home-top h1{font-size:1.9rem}.page-header.compact h1{font-size:1.65rem}.score-gate{grid-template-columns:auto minmax(0,1fr)}.score-gate button{grid-column:1 / -1}.task-brief{display:grid}.task-brief span{text-align:left}.live-metrics,.diagnostic-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.calendar-grid{gap:7px}.day-cell{min-height:104px;padding:8px 6px}.metric-grid,.control-grid,.detail-list,.report-stats{grid-template-columns:1fr}}:root{--theme-page-background:#fff9f2;--theme-surface:#fff;--theme-surface-soft:#fff1dc;--theme-primary:#ff914d;--theme-primary-strong:#e96f26;--theme-secondary:#55ae9c;--theme-accent:#ffd166;--theme-text-primary:#353136;--theme-text-secondary:#716a68;--theme-success:#55ad68;--theme-danger:#e76565;--theme-card-radius:24px;--theme-button-radius:18px;--theme-shadow:0 12px 32px rgba(98,71,48,.12)}body{background-color:var(--theme-page-background);background-image:var(--theme-note-pattern);color:var(--theme-text-primary);transition:background-color .25s,color .25s}.page section,.practice-panel,.live-stage{border-radius:var(--theme-card-radius)}button{border-radius:var(--theme-button-radius)}.child-section,.profile-card,.next-action-card,.practice-panel,.live-stage{background-color:var(--theme-surface);box-shadow:var(--theme-shadow);color:var(--theme-text-primary)}.child-primary-action,.primary-button{background:var(--theme-primary)!important}.me-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:14px 0 18px}.me-tabs button{min-height:48px;border:1px solid var(--theme-primary);background:var(--theme-surface);color:var(--theme-text-primary)}.me-tabs button.active{background:var(--theme-primary);color:#fff}.settings-panel{display:grid;gap:18px}.settings-panel label{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:44px}.settings-panel select,.settings-panel input[type=range]{min-height:44px}.theme-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.theme-grid button{min-height:84px;background:var(--theme-surface-soft);color:var(--theme-text-primary);border:2px solid transparent;display:grid;place-items:center;gap:5px}.theme-grid button.active{border-color:var(--theme-primary)}.theme-swatch{width:36px;height:36px;border-radius:50%;background:#ff914d}.theme-swatch.star-concert{background:#242650}.theme-swatch.forest-etude{background:#4f936d}.listening-room-entry{width:100%;min-height:64px;margin:12px 0;display:flex;align-items:center;justify-content:center;gap:12px;background:var(--theme-surface-soft);color:var(--theme-text-primary);border:1px solid var(--theme-primary)}.listening-room-entry span{color:var(--theme-text-secondary);font-size:.85rem}.listening-room-space{position:fixed;top:0;right:0;bottom:0;left:0;z-index:80;overflow:auto;background:var(--theme-page-background);padding:max(18px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left))}.listening-room-space>header{max-width:1100px;margin:auto;display:flex;align-items:center;gap:18px}.listening-room-space>header button{min-height:48px}.listening-room-space h1,.listening-room-space p{margin:3px}.listening-options{max-width:1100px;margin:18px auto;display:grid;grid-template-columns:1fr 1fr;gap:14px}.listening-options fieldset{border:1px solid var(--theme-secondary);border-radius:18px;padding:12px}.listening-options button{min-height:44px;margin:4px;background:var(--theme-surface);color:var(--theme-text-primary)}.listening-options button.active{background:var(--theme-primary);color:#fff}.listening-room-space .practice-preview{max-width:1100px;margin:auto;background:var(--theme-surface);padding:18px;border-radius:var(--theme-card-radius)}.keyboard-row{margin:9px 0;transition:opacity .2s}.keyboard-row.inactive{opacity:.35}.keyboard-row-label{display:block;margin-bottom:5px;color:var(--theme-text-secondary)}.keyboard-keys{min-width:0;width:100%;height:clamp(82px,12vw,128px)}.keyboard-key.white{width:calc(100% / var(--white-count))!important}.keyboard-key.middle-c{box-shadow:inset 0 -5px 0 var(--theme-accent)}.keyboard-key.next{background:#dcd7ff!important}.keyboard-key.playing{transform:translateY(3px);background:var(--theme-accent)!important}.keyboard-row.right .keyboard-key.target{background:#9ddaf1!important}.keyboard-row.left .keyboard-key.target{background:#f5ba9a!important}.keyboard-legend{display:flex;flex-wrap:wrap;gap:12px}.keyboard-legend span:before{content:"";display:inline-block;width:10px;height:10px;border-radius:50%;background:currentColor;margin-right:4px}@media(max-width:700px){.listening-options,.theme-grid{grid-template-columns:1fr}.listening-room-entry{flex-wrap:wrap}.keyboard-key small{font-size:9px}.realtime-practice-page{padding-bottom:84px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.realtime-practice-page[data-practice-view=active] .realtime-controls,.realtime-practice-page[data-practice-view=paused] .realtime-controls{position:sticky;bottom:10px;z-index:20;grid-template-columns:repeat(5,minmax(0,1fr));padding:9px;background:color-mix(in srgb,var(--theme-surface) 92%,transparent);box-shadow:var(--theme-shadow);border-radius:18px}.practice-paused-panel{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;padding:18px;background:var(--theme-surface-soft);border:2px solid var(--theme-secondary)}.practice-paused-panel button{min-height:48px}.live-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.more-performance{padding:10px 14px;background:var(--theme-surface-soft);border-radius:14px}.more-performance summary{cursor:pointer;font-weight:800}.more-performance div{display:flex;flex-wrap:wrap;gap:12px;margin-top:10px}.summary-actions{display:flex!important;flex-wrap:wrap;gap:8px!important}.summary-actions button{min-height:48px}.teacher-strip{grid-template-columns:auto minmax(0,1fr) 44px 44px}.next-action-card{background-image:var(--theme-home-hero);background-repeat:no-repeat;background-position:right center;background-size:auto 90%}.teacher-mark{background-image:var(--theme-teacher-avatar);background-size:cover;font-size:0}.badge-wall>div{background-image:var(--theme-badge-frame);background-repeat:no-repeat;background-position:center;background-size:contain}.reflection-dot{width:7px;height:7px;border-radius:50%;background:var(--theme-secondary)}.history-performance{display:flex;flex-wrap:wrap;gap:10px;padding:14px;background:var(--theme-surface-soft);border-radius:16px}.history-performance h3,.history-performance p{width:100%;margin:4px 0}.bottom-nav{grid-template-columns:repeat(3,1fr)}.today-overview{display:grid;grid-template-columns:minmax(0,35fr) minmax(0,65fr);overflow:hidden;background:var(--theme-surface);box-shadow:var(--theme-shadow)}.today-greeting{display:grid;align-content:center;gap:8px;padding:24px;color:#fff;background:var(--theme-primary)}.today-greeting h1,.today-greeting p{margin:0}.today-greeting h1{font-size:clamp(2rem,4vw,3rem)}.today-greeting p{display:flex;align-items:center;gap:7px}.today-focus{display:grid;align-content:center;gap:10px;min-height:290px;padding:22px 28px;background:var(--theme-surface-soft)}.today-focus h2,.today-focus p{max-width:68%;margin:0}.today-focus>span{font-weight:900;color:var(--theme-primary-strong)}.today-minutes{display:flex;align-items:center;gap:14px}.today-minutes strong{font-size:1.25rem}.today-minutes span{color:var(--theme-text-secondary)}.today-focus .progress-track{max-width:68%}.today-focus .child-primary-action{width:min(100%,360px);min-height:56px;justify-content:center}.today-segments{padding:16px 18px;background:var(--theme-surface);box-shadow:var(--theme-shadow)}.segment-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.segment-strip button{min-height:64px;display:grid;gap:4px;padding:10px;border:1px solid rgba(0,0,0,.08);background:var(--theme-surface-soft);color:var(--theme-text-primary);text-align:left}.segment-strip button.active{outline:2px solid var(--theme-primary)}.segment-strip button.done{background:color-mix(in srgb,var(--theme-success) 18%,var(--theme-surface))}.segment-strip span{font-size:.78rem;color:var(--theme-text-secondary)}.today-result-strip{grid-template-columns:repeat(4,minmax(0,1fr))}.today-reflection{padding:14px 18px;background:var(--theme-surface);box-shadow:var(--theme-shadow)}.today-reflection>summary{min-height:44px;display:flex;align-items:center;font-weight:900;cursor:pointer}.reflection-locked{padding:16px 18px;background:var(--theme-surface-soft);color:var(--theme-text-secondary)}.calendar-light-link{min-height:48px;display:flex;align-items:center;justify-content:center;gap:8px;background:transparent;color:var(--theme-text-secondary)}@media(max-width:900px){.today-overview{grid-template-columns:1fr}.today-greeting{padding:16px 20px}.today-greeting h1{font-size:2rem}.today-focus{min-height:300px;padding:18px 20px}.today-focus h2,.today-focus p,.today-focus .progress-track{max-width:72%}.today-result-strip{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:560px){.today-focus{background-size:auto 56%;background-position:right top}.today-focus h2,.today-focus p,.today-focus .progress-track{max-width:100%}.segment-strip{grid-template-columns:1fr}.today-result-strip{grid-template-columns:repeat(2,minmax(0,1fr))}}.practice-preparation{max-width:820px;margin:0 auto}.preparation-card{display:grid;gap:10px;padding:22px;background:var(--theme-surface);box-shadow:var(--theme-shadow)}.preparation-card>span{font-weight:900;color:var(--theme-primary-strong)}.preparation-card h2,.preparation-card p{margin:0}.preparation-start{width:min(100%,420px);min-height:64px;margin:12px auto 0;justify-content:center;font-size:1.18rem}.preparation-tools{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:min(100%,420px);margin:0 auto}.preparation-tools button{min-height:50px;display:flex;align-items:center;justify-content:center;gap:7px;background:var(--theme-surface-soft);color:var(--theme-text-primary)}.preparation-segments{padding:12px 16px;background:var(--theme-surface);box-shadow:var(--theme-shadow)}.preparation-segments>summary{min-height:44px;display:flex;align-items:center;font-weight:900;cursor:pointer}.preparation-segments>div{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.preparation-segments button{min-height:62px;display:grid;gap:4px;padding:9px;background:var(--theme-surface-soft);color:var(--theme-text-primary);text-align:left}.preparation-segments button.active{outline:2px solid var(--theme-primary)}.preparation-segments span{font-size:.76rem;color:var(--theme-text-secondary)}.practice-starting{min-height:360px;display:grid;place-items:center;align-content:center;gap:12px;text-align:center;background:var(--theme-surface);box-shadow:var(--theme-shadow)}.practice-starting strong{font-size:clamp(5rem,18vw,9rem);color:var(--theme-primary)}.practice-starting h2,.practice-starting p{margin:0}.child-engine-wait{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;padding:12px;background:var(--theme-surface-soft);border-radius:14px}.child-engine-wait strong{width:100%;text-align:center}.child-engine-wait button{min-height:44px;padding:0 14px}.preparation-demo{position:fixed;top:12px;right:12px;bottom:12px;left:12px;z-index:75;overflow:auto;padding:18px;background:var(--theme-page-background);box-shadow:var(--theme-shadow)}.realtime-practice-page[data-practice-view=active]>.realtime-header,.realtime-practice-page[data-practice-view=paused]>.realtime-header,.realtime-practice-page[data-practice-view=summary]>.realtime-header,.realtime-practice-page[data-practice-view=active]>.child-practice-setup,.realtime-practice-page[data-practice-view=paused]>.child-practice-setup,.realtime-practice-page[data-practice-view=summary]>.child-practice-setup{display:none}.active-segment-bar{display:flex;align-items:center;gap:12px;min-height:46px;padding:8px 14px;background:var(--theme-surface);box-shadow:var(--theme-shadow);border-radius:14px}.active-segment-bar span{color:var(--theme-text-secondary)}.active-segment-bar span:last-child{margin-left:auto}.realtime-practice-page[data-practice-view=paused] .realtime-controls{display:none}.realtime-practice-page[data-practice-view=paused] .live-stage>:not(.practice-paused-panel){display:none}.practice-tools-sheet{position:fixed;left:50%;bottom:0;z-index:70;width:min(100%,560px);transform:translate(-50%);display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:18px max(18px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom));background:var(--theme-surface);box-shadow:0 -14px 40px #0003;border-radius:24px 24px 0 0}.practice-tools-sheet>strong{grid-column:1/-1}.practice-tools-sheet button{min-height:52px;display:flex;align-items:center;justify-content:center;gap:6px;background:var(--theme-surface-soft);color:var(--theme-text-primary)}.practice-tools-sheet button:last-child{grid-column:1/-1}.note-event.current{transform:translateY(-4px) scale(1.05);box-shadow:0 8px 20px #0000001f}.realtime-practice-page[data-practice-view=summary]>:not(.session-result){display:none}.realtime-practice-page[data-practice-view=summary] .session-result{grid-template-columns:auto minmax(0,1fr);padding:24px}.summary-details p{margin:6px 0}.calendar-segments{padding:10px 12px;background:var(--theme-surface-soft);border-radius:12px}@media(max-width:700px){.preparation-segments>div{grid-template-columns:1fr}.realtime-practice-page[data-practice-view=active] .realtime-controls{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.realtime-controls button{font-size:.78rem;padding:4px}.practice-paused-panel{grid-template-columns:1fr 1fr}.active-segment-bar{font-size:.82rem}.active-segment-bar span:last-child{margin-left:0}.practice-tools-sheet{grid-template-columns:1fr}}.realtime-practice-page[data-practice-view=active] .live-stage{padding-bottom:82px}.realtime-practice-page[data-practice-view=active] .realtime-controls{position:fixed;left:50%;bottom:12px;width:min(calc(100% - 32px),880px);transform:translate(-50%);z-index:60}.realtime-practice-page[data-layout-preview=active] .coach-action-card{display:none}@media(max-width:700px){.practice-paused-panel{grid-template-columns:1fr 1fr}.live-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}}.practice-preparation{display:grid!important;grid-template-columns:minmax(0,1fr)!important}.practice-connecting{min-height:360px;display:grid;place-items:center;align-content:center;gap:12px;padding:32px;text-align:center;background:var(--theme-surface);box-shadow:var(--theme-shadow)}.practice-connecting h2,.practice-connecting p{margin:0}.practice-connecting p{color:var(--theme-text-secondary)}.practice-connecting small{max-width:420px;color:var(--theme-text-secondary)}.child-practice-setup.connection-pending{display:none}.connecting-pulse{display:flex;gap:9px}.connecting-pulse span{width:16px;height:16px;border-radius:50%;background:var(--theme-primary);animation:connecting-bounce 1s ease-in-out infinite}.connecting-pulse span:nth-child(2){animation-delay:.14s}.connecting-pulse span:nth-child(3){animation-delay:.28s}@keyframes connecting-bounce{0%,to{transform:translateY(0);opacity:.45}50%{transform:translateY(-10px);opacity:1}}.practice-starting-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:90;border-radius:0!important;background:var(--theme-page-background)}.realtime-practice-page[data-practice-view=active] .live-stage{gap:8px;padding:10px}.realtime-practice-page[data-practice-view=active] .note-rail{min-height:80px;grid-auto-columns:94px;padding-bottom:4px}.realtime-practice-page[data-practice-view=active] .note-event{height:74px;grid-template-rows:16px 1fr 16px;padding:4px}.realtime-practice-page[data-practice-view=active] .practice-keyboard{gap:4px;padding:8px}.realtime-practice-page[data-practice-view=active] .keyboard-row{margin:2px 0}.realtime-practice-page[data-practice-view=active] .keyboard-keys{height:78px}.realtime-practice-page[data-practice-view=active] .live-metrics>div{min-height:58px}.realtime-practice-page[data-practice-view=active] .teacher-strip{min-height:52px;padding:6px}.realtime-practice-page[data-practice-view=active] .realtime-controls{grid-template-columns:repeat(4,minmax(0,1fr))}:root{--font-display:"ZCOOL KuaiLe","Noto Sans SC",sans-serif;--font-body:"Noto Sans SC",system-ui,sans-serif;--font-num:"Baloo 2",system-ui,sans-serif;--shadow-pop:0 8px 20px color-mix(in srgb,var(--theme-primary) 40%,transparent)}body{font-family:var(--font-body);background-image:radial-gradient(circle at 12% 8%,color-mix(in srgb,var(--theme-secondary) 16%,transparent) 0 2px,transparent 3px),radial-gradient(circle at 84% 18%,color-mix(in srgb,var(--theme-accent) 14%,transparent) 0 2px,transparent 3px);background-size:58px 58px,74px 74px}h1,h2,.child-primary-action,.nav-item span,.me-tabs button{font-family:var(--font-display)}.header-stars,.today-minutes strong,.today-result-strip strong,.live-metrics strong,.challenge-day strong,.day-summary strong{font-family:var(--font-num)}.app-main{width:min(100%,1080px);padding:24px 26px 108px}.page{gap:18px}.page section,.profile-card,.bottom-nav{border-color:color-mix(in srgb,var(--theme-primary) 10%,transparent)}.bottom-nav{position:fixed;left:50%;bottom:0;z-index:50;width:min(calc(100% - 32px),960px);transform:translate(-50%);padding:9px 54px max(9px,env(safe-area-inset-bottom));border-radius:24px 24px 0 0;background:color-mix(in srgb,var(--theme-surface) 94%,transparent);box-shadow:0 -4px 16px color-mix(in srgb,var(--theme-primary) 10%,transparent);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.nav-item{min-height:58px;color:var(--theme-text-secondary);background:transparent;border-radius:16px;gap:3px}.nav-item.active{color:var(--theme-primary);background:var(--theme-surface-soft)}.child-primary-action,.primary-button{background:linear-gradient(180deg,color-mix(in srgb,var(--theme-primary) 84%,white),var(--theme-primary))!important;box-shadow:var(--shadow-pop);font-weight:900}.xinxin-mascot{display:block;object-fit:contain;object-position:center;pointer-events:none;-webkit-user-select:none;user-select:none;image-rendering:auto}.today-overview{grid-template-columns:minmax(0,42fr) minmax(0,58fr);border-radius:26px}.today-greeting{position:relative;grid-template-columns:minmax(0,1fr) 150px;align-items:center;overflow:hidden;padding:24px 20px 16px 26px;background:linear-gradient(145deg,color-mix(in srgb,var(--theme-primary) 88%,white),var(--theme-secondary))}.today-greeting>div{z-index:1}.today-greeting h1{font-family:var(--font-num);font-size:2.6rem}.today-greeting .today-mascot{width:174px;height:174px;align-self:end}.today-greeting em{position:absolute;right:16px;bottom:12px;padding:7px 12px;border-radius:13px 13px 4px;background:#fff;color:var(--theme-primary-strong);font-size:.76rem;font-style:normal;font-weight:900;box-shadow:0 6px 16px #00000024}.today-focus{background:linear-gradient(150deg,var(--theme-surface),var(--theme-surface-soft))}.today-focus>span{color:var(--theme-accent);font-family:var(--font-display);font-size:1.15rem}.today-focus h2{font-size:1.8rem;color:var(--theme-text-primary)}.progress-track{height:12px;background:color-mix(in srgb,var(--theme-secondary) 25%,white)}.progress-track span{background:linear-gradient(90deg,var(--theme-secondary),var(--theme-primary))}.today-segments,.today-result-strip>div,.profile-card,.child-section,.challenge-map,.calendar-day-detail{border-radius:22px;background:var(--theme-surface);box-shadow:var(--theme-shadow)}.segment-strip button{position:relative;min-height:76px;padding:14px 16px;border:0;border-radius:16px}.segment-strip button:before{content:"○";position:absolute;right:14px;top:12px;color:var(--theme-secondary);font-size:1.25rem}.segment-strip button.active{outline:2px solid var(--theme-primary);background:var(--theme-surface-soft)}.segment-strip button.active:before{content:"▶";color:var(--theme-primary);font-size:.9rem}.segment-strip button.done:before{content:"✓";display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--theme-success);color:#fff}.today-result-strip>div{min-height:96px;align-content:center}.today-result-strip svg{margin:auto;color:var(--theme-primary)}.profile-card{position:relative;overflow:hidden;min-height:104px;padding:18px 150px 18px 22px}.child-avatar{border-radius:20px;color:#fff;background:linear-gradient(145deg,var(--theme-warning),var(--theme-accent));box-shadow:var(--shadow-pop)}.profile-mascot{position:absolute;right:20px;bottom:-34px;width:148px;height:148px}.me-tabs{display:flex}.me-tabs button{padding:0 28px;border:0;box-shadow:var(--theme-shadow)}.me-tabs button.active{box-shadow:var(--shadow-pop)}.challenge-map{padding:20px;grid-template-columns:repeat(6,1fr)}.challenge-day{min-height:66px;border-radius:14px}.challenge-day.selected{outline:2px solid var(--theme-primary);background:var(--theme-surface-soft)}.calendar-day-detail{padding:22px}.preparation-card{position:relative;overflow:hidden;min-height:390px;padding:34px 240px 28px 34px;align-content:center}.preparation-card:after{content:"";position:absolute;right:12px;bottom:-36px;width:260px;height:260px;background:url(/characters/xinxin-main.png) center/contain no-repeat;filter:drop-shadow(0 12px 18px rgba(74,44,135,.16))}.preparation-card>span,.preparation-card h2,.preparation-card p,.preparation-card button,.preparation-card>div{position:relative;z-index:1}.preparation-card h2{font-size:2rem}.preparation-start{margin:18px 0 0}.practice-starting{position:fixed;top:0;right:0;bottom:0;left:0;z-index:90;border-radius:0!important;color:#fff;background:linear-gradient(165deg,color-mix(in srgb,var(--theme-primary) 84%,white),var(--theme-primary))!important}.practice-starting:before{content:"";width:150px;height:150px;background:url(/characters/xinxin-happy.png) center/contain no-repeat}.practice-starting strong{display:grid;place-items:center;width:260px;height:260px;border:8px solid rgba(255,255,255,.26);border-radius:50%;color:#fff!important;font-family:var(--font-num);font-size:11rem!important;box-shadow:0 20px 50px #00000026}.active-segment-bar{border-radius:16px}.live-stage{border:0!important;border-radius:24px!important}.live-status,.note-event{border-radius:14px}.practice-keyboard{border-radius:18px;background:linear-gradient(180deg,#fff,var(--theme-surface-soft))}.keyboard-key.target{box-shadow:inset 0 -5px 0 var(--theme-accent)!important}.keyboard-key.playing{background:var(--theme-accent)!important}.live-metrics>div{border-radius:16px;background:var(--theme-surface-soft)}.teacher-strip{position:relative;min-height:66px!important;padding-left:72px!important;border-radius:18px;background:var(--theme-surface-soft)}.teacher-strip:before{content:"";position:absolute;left:8px;bottom:0;width:62px;height:62px;background:url(/characters/xinxin-think.png) center/contain no-repeat}.teacher-mark{display:none}.teacher-strip p:before{content:"心心一号：";font-weight:900;color:var(--theme-primary-strong)}.realtime-controls{border:1px solid color-mix(in srgb,var(--theme-primary) 12%,transparent)}.realtime-controls button{min-height:54px;border-radius:16px;background:var(--theme-surface-soft);color:var(--theme-primary-strong);font-weight:900}.realtime-controls button:last-child{color:var(--theme-danger)}.practice-paused-panel{position:fixed;left:50%;top:50%;z-index:80;width:min(calc(100% - 32px),440px);transform:translate(-50%,-50%);grid-template-columns:1fr 1fr;padding:190px 28px 28px;border:0;border-radius:28px;background:var(--theme-surface);box-shadow:0 24px 60px #4a2c873d;text-align:center}.practice-paused-panel:before{content:"";position:absolute;top:22px;left:50%;width:160px;height:160px;transform:translate(-50%);background:url(/characters/xinxin-shy.png) center/contain no-repeat}.practice-paused-panel strong,.practice-paused-panel p{grid-column:1/-1}.practice-paused-panel strong{font-family:var(--font-display);font-size:2rem;color:var(--theme-primary-strong)}.practice-paused-panel button:first-of-type{grid-column:1/-1;background:var(--theme-primary);color:#fff;box-shadow:var(--shadow-pop)}.session-result{position:relative;overflow:hidden;border:0!important;border-radius:30px!important;padding:28px 30px 28px 210px!important;background:linear-gradient(135deg,var(--theme-surface),var(--theme-surface-soft));box-shadow:0 24px 60px #4a2c872e}.session-result:before{content:"";position:absolute;left:24px;bottom:-20px;width:170px;height:170px;background:url(/characters/xinxin-happy.png) center/contain no-repeat}.session-result>svg{display:none}.session-result strong{font-family:var(--font-display);font-size:2rem!important;color:var(--theme-primary-strong)}.summary-actions button{border-radius:18px}.theme-grid{grid-template-columns:repeat(4,1fr)}.theme-swatch.sunshine-piano{background:#7c5cfc}.theme-swatch.star-concert{background:#4d96ff}.theme-swatch.forest-etude{background:#2fb98e}.theme-swatch.candy-sweet{background:#ff6fa5}@media(max-width:900px){.app-main{padding:18px 18px 106px}.today-overview{grid-template-columns:1fr}.today-greeting{grid-template-columns:1fr 130px;min-height:170px}.today-greeting .today-mascot{width:145px;height:145px}.today-focus{min-height:285px}.profile-card{padding-right:125px}.profile-mascot{right:0}.challenge-map{grid-template-columns:repeat(5,1fr)}.preparation-card{padding-right:200px}.preparation-card:after{width:220px;height:220px}.session-result{padding-left:170px!important}.session-result:before{width:145px;height:145px}}@media(max-width:600px){.bottom-nav{width:100%;padding-inline:18px}.today-greeting{grid-template-columns:1fr 110px}.today-greeting .today-mascot{width:120px;height:120px}.today-greeting em{font-size:.68rem}.today-focus h2,.today-focus p,.today-focus .progress-track{max-width:100%}.segment-strip{grid-template-columns:1fr}.preparation-card{padding:24px 20px 210px}.preparation-card:after{right:50%;transform:translate(50%);width:210px;height:210px}.preparation-start{margin-inline:auto}.challenge-map{grid-template-columns:repeat(5,1fr);padding:12px}.challenge-day{min-height:54px}.profile-card{padding-right:104px}.profile-mascot{width:120px;height:120px}.theme-grid{grid-template-columns:1fr 1fr}.session-result{padding:190px 20px 24px!important}.session-result:before{top:10px;bottom:auto;left:50%;transform:translate(-50%)}}.preparation-card:after{filter:none}html[data-skin]{background:var(--canvas)}body{background-color:var(--canvas);background-image:none;color:var(--text-strong);font-family:var(--font-body)}button{transition:transform .12s ease,box-shadow .12s ease,background-color .12s ease}button:not(:disabled):active{transform:scale(.97)}.app-main{width:100%;max-width:none;margin:0;padding:var(--gutter-v) var(--gutter-h) 112px}.page{width:min(100%,1180px);margin:0 auto;gap:22px}.page-header .eyebrow,.eyebrow{color:var(--text-label);font-size:var(--fs-caption);font-weight:700;letter-spacing:var(--ls-label)}.page-header h1,.today-focus h2,.child-section-title h2{color:var(--text-strong)}.bottom-nav{width:min(calc(100% - 112px),1180px);padding:12px;border-radius:20px 20px 0 0;background:var(--surface);box-shadow:var(--shadow-soft);border:0;-webkit-backdrop-filter:none;backdrop-filter:none}.nav-item{min-height:52px;border-radius:14px;color:var(--text-muted);font-size:var(--fs-small);font-weight:700}.nav-item.active{background:var(--surface-tint);color:var(--primary);font-family:var(--font-display)}.nav-item img{width:24px;height:24px;opacity:.78}.nav-item.active img{filter:brightness(0) saturate(100%) invert(39%) sepia(94%) saturate(2926%) hue-rotate(238deg) brightness(98%) contrast(102%)}.child-primary-action,.primary-button{min-height:var(--tap-primary);border-radius:var(--r-lg);background:var(--primary-gradient)!important;box-shadow:var(--button-shadow);font-family:var(--font-body);font-size:20px;font-weight:800;color:var(--text-on-dark)!important}.today-overview{min-height:286px;border-radius:var(--r-card-lg);background:transparent;box-shadow:none;gap:22px;grid-template-columns:minmax(310px,.83fr) minmax(0,1.17fr);overflow:visible}.today-greeting{min-height:286px;border-radius:var(--r-card-lg);padding:30px 24px;background:var(--primary-gradient);box-shadow:var(--shadow-card);grid-template-columns:minmax(0,1fr) 150px}.today-greeting h1{font-family:var(--font-numeric);font-size:48px;letter-spacing:0;white-space:nowrap}.today-greeting>div>span{font-size:var(--fs-body-lg);font-weight:700}.today-greeting .today-mascot{width:150px;height:150px}.today-greeting em{right:14px;bottom:18px;border-radius:14px 14px 14px 4px;color:var(--primary);font-size:var(--fs-small)}.today-focus{min-height:286px;border-radius:var(--r-card-lg);padding:28px 34px;background:var(--surface);box-shadow:var(--shadow-card);gap:12px}.today-focus>span{font-size:var(--fs-caption);letter-spacing:var(--ls-label);color:var(--accent);font-family:var(--font-display)}.today-focus h2{font-size:var(--fs-h2);line-height:var(--lh-heading)}.today-focus h2,.today-focus p,.today-focus .progress-track{max-width:72%}.today-focus p{font-size:var(--fs-body);color:var(--text-sub)}.today-minutes strong{font-family:var(--font-numeric);font-size:28px;color:var(--ink)}.today-minutes span{font-size:var(--fs-small);color:var(--text-muted)}.progress-track{height:12px;background:var(--progress-track)}.progress-track span{background:var(--progress-fill)}.today-segments{padding:24px;border-radius:var(--r-card)!important;background:var(--surface);box-shadow:var(--shadow-card)}.child-section-title h2{font-size:var(--fs-h3);font-family:var(--font-body);font-weight:900}.child-section-title span{color:var(--text-muted);font-size:var(--fs-small)}.segment-strip{gap:12px}.segment-strip button{min-height:86px;padding:14px;border-radius:var(--r-md);border:0;background:#f5f3fa;color:var(--text-muted);box-shadow:none}.segment-strip button strong{font-size:var(--fs-body-lg);color:var(--text-strong)}.segment-strip button span{font-size:var(--fs-small);color:var(--text-muted)}.segment-strip button.ready:before{content:"▶";color:var(--playing)}.segment-strip button.active{background:var(--surface-tint);outline:2px solid var(--primary)}.segment-strip button.active:before{background:var(--primary);color:#fff}.segment-strip button.done{background:#effaf4}.today-result-strip{gap:22px}.today-result-strip>div{min-height:124px;padding:22px 16px;border-radius:var(--r-card);background:var(--surface);box-shadow:var(--shadow-soft);text-align:left;grid-template-columns:40px 1fr;grid-template-rows:auto auto}.today-result-strip svg{grid-row:span 2;margin:0;color:var(--primary)}.today-result-strip span{font-size:var(--fs-caption);color:var(--text-muted)}.today-result-strip strong{font-family:var(--font-numeric);font-size:28px;color:var(--text-strong)}.reflection-locked,.today-reflection{border-radius:var(--r-card);background:var(--surface-tint);box-shadow:none;color:var(--text-sub)}.calendar-light-link{font-size:var(--fs-body);color:var(--primary);font-weight:700}.profile-card{min-height:112px;padding:20px 170px 20px 24px;border-radius:var(--r-card);background:var(--surface);box-shadow:var(--shadow-card)}.child-avatar{width:64px;height:64px;border-radius:20px;background:linear-gradient(150deg,var(--star),var(--accent));font-family:var(--font-display)}.profile-card>div:nth-child(2)>span{font-size:var(--fs-caption);color:var(--text-label);font-weight:700}.profile-card h1{font-family:var(--font-display);font-size:30px;color:var(--ink)}.profile-card p{color:var(--text-sub)}.profile-mascot{width:150px;height:150px;right:16px;bottom:-38px}.me-tabs{display:flex;gap:12px;margin:0}.me-tabs button{min-height:48px;padding:0 28px;border:0;border-radius:var(--r-md);background:var(--surface);box-shadow:var(--shadow-soft);font-size:var(--fs-body);font-weight:700;color:var(--text-muted)}.me-tabs button.active{background:var(--primary);box-shadow:var(--button-shadow);color:#fff;font-family:var(--font-display)}.child-calendar-page{display:grid;gap:22px}.child-calendar-page .page-header{padding:0;background:transparent;box-shadow:none}.child-calendar-page .page-header h1{font-family:var(--font-display);font-size:var(--fs-h2)}.challenge-map{padding:22px;border-radius:var(--r-card);background:var(--surface);box-shadow:var(--shadow-card);gap:10px}.challenge-day{min-height:80px;border-radius:var(--r-cell);background:#f5f3fa;color:var(--text-faint)}.challenge-day.complete{background:var(--surface-tint);color:var(--primary)}.challenge-day.today,.challenge-day.selected{background:var(--surface-tint);outline:2px solid var(--primary);color:var(--primary)}.challenge-day.future{border:2px dashed var(--sub);background:var(--surface);color:var(--text-faint)}.challenge-day strong{font-family:var(--font-numeric);font-size:20px}.calendar-day-detail{padding:24px;border-radius:var(--r-card);background:var(--surface);box-shadow:var(--shadow-card)}.calendar-day-detail h2{font-family:var(--font-display);font-size:28px}.calendar-segments{border-radius:var(--r-md);background:var(--surface-tint)}.day-summary>div{border-radius:var(--r-md);background:#fff9ed}.day-summary strong{font-family:var(--font-numeric)}.practice-preparation{max-width:920px}.practice-preparation .page-header{padding:0 4px;background:transparent;box-shadow:none}.preparation-card{min-height:380px;padding:34px 330px 34px 40px;border-radius:var(--r-card-lg);background:var(--surface);box-shadow:var(--shadow-card)}.preparation-card:after{right:38px;bottom:8px;width:260px;height:260px;background-size:contain}.preparation-card>span{font-size:var(--fs-caption);letter-spacing:var(--ls-label);color:var(--accent)}.preparation-card h2{font-family:var(--font-display);font-size:var(--fs-h1);color:var(--ink)}.preparation-card p{font-size:var(--fs-body);line-height:var(--lh-body);color:var(--text-sub)}.preparation-start{width:100%;max-width:430px;margin-top:18px}.preparation-tools{width:100%;max-width:430px;gap:12px}.preparation-tools button{min-height:48px;border-radius:var(--r-md);background:var(--surface-tint);color:var(--primary);font-weight:700}.preparation-segments{padding:20px 24px;border-radius:var(--r-card);background:var(--surface);box-shadow:var(--shadow-card)}.preparation-segments button{border-radius:var(--r-md);background:#f5f3fa}.preparation-segments button.active{background:var(--surface-tint);outline:2px solid var(--primary)}.practice-starting{background:var(--primary-gradient)!important}.practice-starting:before{width:150px;height:150px}.practice-starting strong{width:280px;height:280px;border-radius:50%;font-size:200px!important}.practice-starting h2{font-family:var(--font-display);font-size:var(--fs-h2)}.realtime-practice-page{gap:16px}.active-segment-bar{min-height:62px;padding:12px 18px;border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--shadow-soft)}.active-segment-bar strong{font-family:var(--font-display);font-size:var(--fs-h3);color:var(--ink)}.live-stage{border-radius:var(--r-card-lg)!important;padding:22px!important;background:var(--surface);box-shadow:var(--shadow-card)}.live-status{min-height:48px;border-radius:var(--r-md);background:#fff6d9}.note-rail{gap:12px}.note-event{height:96px!important;border-radius:var(--r-md);background:#f5f3fa}.note-event.current{background:#ffedf4;outline:2px solid var(--current);box-shadow:none}.note-event.current strong{color:var(--current)}.practice-keyboard{padding:16px!important;border-radius:var(--r-xl);background:var(--surface);box-shadow:inset 0 0 0 2px var(--key-inset)}.keyboard-key.white{border-color:var(--key-white-line)}.keyboard-key.black{background:var(--key-black)}.keyboard-key.playing{background:var(--current)!important}.keyboard-key.next{background:var(--surface-tint)!important}.live-metrics>div{min-height:98px!important;border:0;border-radius:var(--r-card);background:var(--surface-tint)}.live-metrics span{font-size:var(--fs-caption);color:var(--text-muted)}.live-metrics strong{font-family:var(--font-numeric);font-size:32px;color:var(--ink)}.more-performance{border-radius:var(--r-md);background:#f5f3fa}.teacher-strip{min-height:76px!important;padding:12px 92px 12px 76px!important;border-radius:var(--r-md);background:var(--surface-tint)}.teacher-strip:before{left:12px;width:58px;height:58px}.teacher-strip p{font-size:var(--fs-body);color:var(--text-strong)}.teacher-strip p:before{color:var(--primary)}.realtime-practice-page[data-practice-view=active] .live-stage{padding-bottom:104px!important}.realtime-practice-page[data-practice-view=active] .realtime-controls{bottom:16px;width:min(calc(100% - 112px),920px);padding:10px;border:0;border-radius:var(--r-xl);background:var(--surface);box-shadow:var(--shadow-screen)}.realtime-controls button{min-height:56px;border-radius:var(--r-md);background:var(--surface-tint);font-size:var(--fs-small);color:var(--text-strong)}.realtime-controls button:last-child{color:var(--error)}.practice-tools-sheet{border-radius:28px 28px 0 0;background:var(--surface);box-shadow:var(--shadow-screen)}.practice-tools-sheet button{border-radius:var(--r-md);background:var(--surface-tint);color:var(--primary)}.practice-paused-panel{padding:184px 28px 28px;border-radius:var(--r-card-lg);background:var(--surface);box-shadow:var(--shadow-screen)}.practice-paused-panel strong{font-family:var(--font-display);color:var(--ink)}.practice-paused-panel button:first-of-type{background:var(--primary-gradient);box-shadow:var(--button-shadow)}.session-result{border-radius:var(--r-card-lg)!important;background:var(--surface);box-shadow:var(--shadow-screen)}.session-result:before{background-image:url(/characters/xinxin-happy.png)}.session-result strong{font-family:var(--font-display);color:var(--ink)!important}.summary-actions button:first-child{background:var(--primary-gradient)!important;box-shadow:var(--button-shadow)}@media(min-width:1024px){.child-calendar-page{grid-template-columns:1.35fr 1fr;align-items:start}.child-calendar-page .page-header{grid-column:1/-1}.child-calendar-page .challenge-map,.child-calendar-page .calendar-day-detail{min-height:500px}.realtime-practice-page[data-practice-view=active] .live-stage{grid-template-columns:minmax(0,1.35fr) minmax(250px,.65fr);grid-template-rows:auto auto auto auto}.realtime-practice-page[data-practice-view=active] .live-status{grid-column:1/-1}.realtime-practice-page[data-practice-view=active] .note-rail,.realtime-practice-page[data-practice-view=active] .practice-keyboard{grid-column:1}.realtime-practice-page[data-practice-view=active] .live-metrics{grid-column:2;grid-row:2}.realtime-practice-page[data-practice-view=active] .more-performance{grid-column:2;grid-row:3}.realtime-practice-page[data-practice-view=active] .teacher-strip{grid-column:2;grid-row:4}}@media(min-width:1024px){.realtime-practice-page[data-practice-view=active] .teacher-strip{grid-column:1/-1;grid-row:4}}@media(max-width:1023px){.app-main{padding:28px 28px 104px}.page{gap:14px}.today-overview{grid-template-columns:1fr;gap:14px}.today-greeting,.today-focus{min-height:200px}.today-greeting h1{font-size:44px}.today-focus h2,.today-focus p,.today-focus .progress-track{max-width:100%}.today-segments{padding:16px}.segment-strip{grid-template-columns:1fr}.today-result-strip{gap:12px}.today-result-strip>div{min-height:100px;padding:16px}.profile-card{padding-right:128px}.profile-mascot{width:130px;height:130px}.child-calendar-page{gap:14px}.challenge-map{gap:7px}.challenge-day{min-height:62px}.preparation-card{padding:30px 250px 30px 28px}.preparation-card:after{right:8px;width:230px;height:230px}.realtime-practice-page[data-practice-view=active] .realtime-controls{width:min(calc(100% - 56px),760px)}}@media(max-width:600px){.app-main{padding:20px 18px 96px}.bottom-nav{width:100%;padding:8px 12px}.today-greeting{padding:22px 18px;grid-template-columns:1fr 106px}.today-greeting .today-mascot{width:112px;height:112px}.today-greeting em{right:10px;bottom:10px}.today-focus{padding:22px}.today-result-strip{grid-template-columns:1fr 1fr}.today-result-strip>div{grid-template-columns:1fr;text-align:center}.today-result-strip svg{margin:auto}.me-tabs button{padding:0 15px}.profile-card{padding-right:110px}.profile-mascot{width:120px;height:120px}.challenge-map{grid-template-columns:repeat(5,1fr);padding:14px}.challenge-day{min-height:54px}.preparation-card{padding:24px 20px 214px}.preparation-card:after{right:50%;bottom:-10px;transform:translate(50%);width:210px;height:210px}.realtime-practice-page[data-practice-view=active] .realtime-controls{width:calc(100% - 24px);bottom:10px;gap:6px}.realtime-controls button{padding:6px 2px;font-size:11px}.practice-paused-panel{width:calc(100% - 32px)}.session-result{padding:190px 20px 24px!important}}.site-footer{display:flex;justify-content:center;gap:12px;padding:0 16px calc(88px + env(safe-area-inset-bottom));color:var(--text-faint);font-size:12px}.site-footer a{color:inherit;text-decoration:none}.site-footer a:hover,.site-footer a:focus-visible{color:var(--primary);text-decoration:underline}.family-unlock{width:min(100%,440px);min-height:calc(100vh - 90px);margin:0 auto;display:grid;align-content:center;gap:14px;text-align:center}.family-unlock-mark{width:72px;height:72px;margin:0 auto 4px;display:grid;place-items:center;border-radius:24px;background:var(--surface-tint);box-shadow:var(--shadow-card);font-size:2.2rem}.family-unlock h1{margin:0;font-size:clamp(1.7rem,7vw,2.25rem);color:var(--text-strong)}.family-unlock>p{margin:0;color:var(--text-sub);line-height:1.7}.family-unlock form{display:grid;gap:10px;margin-top:10px;padding:22px;border-radius:var(--r-card);background:var(--surface);box-shadow:var(--shadow-card);text-align:left}.family-unlock label{font-weight:700;color:var(--text-strong)}.family-unlock input{min-height:52px;width:100%;padding:0 14px;border:2px solid var(--progress-track);border-radius:var(--r-md);color:var(--text-strong);background:#fff;outline:none}.family-unlock input:focus{border-color:var(--primary);box-shadow:0 0 0 4px #7c5cfc24}.family-unlock .child-primary-action{width:100%;margin-top:4px}.family-unlock-error{margin:0;color:var(--error);font-size:.9rem;line-height:1.5}.today-greeting{display:block;isolation:isolate;overflow:hidden;background:linear-gradient(150deg,#9B7DFF,var(--primary) 55%,color-mix(in srgb,var(--primary) 82%,#372060))}.today-greeting:before{content:"";position:absolute;z-index:-1;top:-48px;left:-34px;width:150px;height:150px;border-radius:50%;background:radial-gradient(circle at 42% 38%,#ffffff4d,#fff0 70%)}.today-greeting:after{content:"";position:absolute;z-index:-1;top:-14px;right:54px;width:72px;height:72px;border:2px dashed rgba(255,255,255,.38);border-radius:50%;background:#ffcb5738;box-shadow:0 0 24px #ffcb574d;transform:rotate(18deg)}.today-greeting>div{position:relative;z-index:2;max-width:62%}.today-greeting .today-mascot{position:absolute;z-index:1;right:4px;bottom:-6px;width:160px;height:160px}.today-greeting h1{margin-top:6px;font-family:var(--font-display);font-size:52px}.today-greeting h1:first-letter{letter-spacing:.01em}.today-greeting p{display:inline-flex;margin-top:16px;padding:7px 14px;border-radius:var(--r-chip);background:#fff3;font-size:15px;font-weight:700;white-space:nowrap}.today-greeting em{z-index:3;left:28px;right:auto;bottom:22px;padding:8px 13px;border-radius:14px 14px 14px 4px;font-size:13px;box-shadow:0 6px 16px #00000024}.today-focus{display:flex;flex-direction:column;align-content:initial}.today-focus h2,.today-focus p{max-width:100%}.today-progress-row{display:flex;align-items:center;gap:12px;margin-top:12px}.today-progress-row strong{flex:0 0 auto;font-family:var(--font-numeric);font-size:20px;color:var(--primary)}.today-progress-row .progress-track{flex:1;max-width:none;height:12px}.today-progress-row>span{flex:0 0 auto;color:var(--text-faint);font-size:14px}.today-focus .child-primary-action{width:100%;max-width:none;margin-top:auto;justify-content:center;border-radius:18px;padding:18px;font-family:var(--font-display);font-size:22px;letter-spacing:.01em}.today-segments{padding:20px 24px}.today-segments .child-section-title{margin-bottom:14px}.today-segments .child-section-title h2{font-size:18px}.segment-strip{gap:14px}.segment-strip button{min-height:84px;padding:16px 18px 14px 50px;border:2px solid #EAE4F4;border-radius:16px}.segment-strip button:before{left:16px;right:auto;top:16px;width:22px;height:22px;display:grid;place-items:center;border-radius:50%;background:#d9ceee;color:#fff;font-size:12px}.segment-strip button.ready:before{content:"▶";color:#fff}.segment-strip button.active{border-color:var(--primary)}.segment-strip button.active:before{background:var(--primary)}.segment-strip button.done{border-color:var(--correct)}.segment-strip button.done:before{background:var(--correct)}.segment-strip button strong{font-size:16px}.segment-strip button span{margin-top:6px;font-size:13px}.today-result-strip{gap:14px}.today-result-strip>div{min-height:92px;padding:16px 18px;border-radius:18px;grid-template-columns:44px 1fr;column-gap:12px}.today-result-strip svg{width:24px;height:24px;align-self:center}.today-result-strip strong{font-size:24px}.today-result-strip>div:nth-child(1) svg{color:var(--primary)}.today-result-strip>div:nth-child(2) svg{color:#4d96ff}.today-result-strip>div:nth-child(3) svg{color:#ffb020}.today-result-strip>div:nth-child(4) svg{color:var(--current)}@media(max-width:1023px){.today-greeting{min-height:190px}.today-greeting>div{max-width:70%}.today-greeting h1{font-size:40px}.today-greeting .today-mascot{width:132px;height:132px}.today-greeting em{left:auto;right:12px;bottom:12px}.today-focus{min-height:250px}.today-progress-row{flex-wrap:wrap}.today-progress-row .progress-track{order:3;flex-basis:100%}.segment-strip button{padding-left:50px}.today-result-strip>div{min-height:92px}}@media(max-width:1023px){.segment-strip{grid-template-columns:repeat(3,minmax(0,1fr))}.segment-strip button{padding:12px 10px 10px 42px}.segment-strip button:before{left:12px;top:13px}.segment-strip button strong{font-size:14px}.segment-strip button span{font-size:11px}}@media(max-width:600px){.today-greeting{padding:18px;min-height:170px}.today-greeting h1{font-size:34px}.today-greeting p{margin-top:10px;padding:4px 10px;font-size:12px}.today-greeting .today-mascot{width:108px;height:108px}.today-greeting em{right:8px;bottom:8px;font-size:11px}.today-focus{min-height:270px;padding:18px 16px}.today-focus h2{font-size:20px}.today-progress-row strong{font-size:16px}.today-progress-row>span{font-size:12px}.today-focus .child-primary-action{font-size:17px;padding:14px}.today-segments{padding:16px}.segment-strip{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.segment-strip button{min-height:74px;padding:10px 6px;text-align:center}.segment-strip button:before{position:static;margin:0 auto}.segment-strip button strong{font-size:12px}.segment-strip button span{font-size:10px}.today-result-strip{gap:8px}.today-result-strip>div{padding:12px 8px;grid-template-columns:1fr;text-align:center}.today-result-strip svg{margin:auto}.today-result-strip strong{font-size:20px}}