:root{color:#f7f9fc;background:#07090f;--ink: #f7f9fc;--line: #596273;--line-strong: #aeb7c6;--paper: #fffdf8;--panel: rgba(10, 15, 26, .94);--mint: #b9f5e8;--sky: #bfe9ff;--butter: #fff0a6;--peach: #ffd2c2;--pink: #ffc4dc;--lavender: #d9d1ff;--lime: #d8f8a9;--soft: #111827;--muted: #c6ccd6;--on-light: #17202d;--on-light-muted: #4f5968;--pitch-accurate: #b9f5d0;--pitch-accurate-strong: #15965e;--pitch-high: #ffc7cf;--pitch-high-strong: #d64057;--pitch-low: #c9e4ff;--pitch-low-strong: #287dcc;--pitch-near: #fff0a6;font-family:Avenir Next,Gill Sans,Trebuchet MS,sans-serif;font-synthesis:none;text-rendering:geometricPrecision}.account-watermark{position:fixed;top:0;right:0;bottom:0;left:0;z-index:70;display:grid;grid-template-columns:repeat(3,minmax(260px,1fr));align-content:space-around;justify-items:center;gap:90px 45px;overflow:hidden;pointer-events:none;-webkit-user-select:none;user-select:none}.account-watermark span{color:color-mix(in srgb,var(--ink) 12%,transparent);font-size:12px;font-weight:900;white-space:nowrap;transform:rotate(-23deg)}:root[data-theme=mintCream]{color:#24474a;background:#f2fff8;--ink: #24474a;--line: #8bcfbd;--line-strong: #ffb7d2;--panel: rgba(255, 253, 248, .92);--soft: #f2fff8;--muted: #668084}:root[data-theme=peachStage]{color:#3f3134;background:#fff2ed;--ink: #3f3134;--line: #f3a7a4;--line-strong: #a9d8ff;--panel: rgba(255, 248, 244, .92);--soft: #fff2ed;--muted: #7c6569}:root[data-theme=skyCandy]{color:#263f62;background:#edf8ff;--ink: #263f62;--line: #93c8ff;--line-strong: #ffd2e4;--panel: rgba(250, 253, 255, .92);--soft: #edf8ff;--muted: #5f7694}:root[data-theme=lemonSoda]{color:#3f421f;background:#fff9d9;--ink: #3f421f;--line: #dfc85f;--line-strong: #92d8c8;--panel: rgba(255, 252, 232, .93);--soft: #fff9d9;--muted: #74764e}:root[data-theme=blueberryMilk]{color:#2d3564;background:#eef0ff;--ink: #2d3564;--line: #9ea8f0;--line-strong: #ffc4dc;--panel: rgba(250, 250, 255, .93);--soft: #eef0ff;--muted: #66709a}:root[data-theme=roseMilk]{color:#583040;background:#fff0f7;--ink: #583040;--line: #f0a7c7;--line-strong: #8bded3;--panel: rgba(255, 249, 252, .94);--soft: #fff0f7;--muted: #865d6e}:root[data-theme=matchaCloud]{color:#2f4b34;background:#f3ffe8;--ink: #2f4b34;--line: #a8d889;--line-strong: #ffd2c2;--panel: rgba(250, 255, 244, .93);--soft: #f3ffe8;--muted: #64785f}:root[data-theme=lilacDream]{color:#403663;background:#f5f0ff;--ink: #403663;--line: #b8a8f4;--line-strong: #fff0a6;--panel: rgba(252, 249, 255, .93);--soft: #f5f0ff;--muted: #716894}:root[data-theme=aquaPearl]{color:#214a58;background:#eaffff;--ink: #214a58;--line: #83d7e3;--line-strong: #ffc4dc;--panel: rgba(246, 255, 255, .93);--soft: #eaffff;--muted: #5c7d86}:root[data-theme=sunsetCandy]{color:#56352f;background:#fff3e8;--ink: #56352f;--line: #f1b083;--line-strong: #c0b6ff;--panel: rgba(255, 249, 242, .93);--soft: #fff3e8;--muted: #87665c}:root[data-theme=creamPaper]{color:#3d3b2e;background:#fffbea;--ink: #3d3b2e;--line: #d8c982;--line-strong: #9ed8cb;--panel: rgba(255, 253, 242, .94);--soft: #fffbea;--muted: #706c56}:root:not([data-theme=darkMacaron]){--muted: color-mix(in srgb, var(--ink) 78%, #64748b)}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;font-size:17px;background:radial-gradient(circle at 10% 8%,rgba(255,196,220,.18),transparent 24%),radial-gradient(circle at 88% 12%,rgba(139,222,211,.18),transparent 26%),radial-gradient(circle at 78% 88%,rgba(191,233,255,.16),transparent 30%),linear-gradient(90deg,rgba(139,222,211,.08) 1px,transparent 1px),linear-gradient(rgba(255,196,220,.06) 1px,transparent 1px),#07090f;background-size:auto,auto,auto,28px 28px,28px 28px,auto}:root[data-theme=mintCream] body{background:radial-gradient(circle at 12% 10%,rgba(201,244,229,.7),transparent 26%),radial-gradient(circle at 82% 18%,rgba(255,199,221,.5),transparent 28%),linear-gradient(90deg,rgba(139,207,189,.12) 1px,transparent 1px),linear-gradient(rgba(139,207,189,.1) 1px,transparent 1px),#f2fff8;background-size:auto,auto,28px 28px,28px 28px,auto}:root[data-theme=peachStage] body{background:radial-gradient(circle at 14% 12%,rgba(255,210,194,.7),transparent 26%),radial-gradient(circle at 78% 20%,rgba(217,209,255,.5),transparent 30%),linear-gradient(90deg,rgba(243,167,164,.12) 1px,transparent 1px),linear-gradient(rgba(243,167,164,.1) 1px,transparent 1px),#fff2ed;background-size:auto,auto,28px 28px,28px 28px,auto}:root[data-theme=skyCandy] body{background:radial-gradient(circle at 10% 16%,rgba(191,233,255,.75),transparent 28%),radial-gradient(circle at 85% 10%,rgba(255,240,166,.48),transparent 27%),linear-gradient(90deg,rgba(147,200,255,.13) 1px,transparent 1px),linear-gradient(rgba(147,200,255,.1) 1px,transparent 1px),#edf8ff;background-size:auto,auto,28px 28px,28px 28px,auto}:root[data-theme=lemonSoda] body{background:radial-gradient(circle at 12% 12%,rgba(255,240,166,.72),transparent 28%),radial-gradient(circle at 82% 14%,rgba(185,245,232,.48),transparent 28%),linear-gradient(90deg,rgba(223,200,95,.13) 1px,transparent 1px),linear-gradient(rgba(223,200,95,.1) 1px,transparent 1px),#fff9d9;background-size:auto,auto,28px 28px,28px 28px,auto}:root[data-theme=blueberryMilk] body{background:radial-gradient(circle at 16% 14%,rgba(217,209,255,.72),transparent 30%),radial-gradient(circle at 82% 16%,rgba(191,233,255,.45),transparent 28%),linear-gradient(90deg,rgba(158,168,240,.12) 1px,transparent 1px),linear-gradient(rgba(158,168,240,.1) 1px,transparent 1px),#eef0ff;background-size:auto,auto,28px 28px,28px 28px,auto}:root[data-theme=roseMilk] body{background:radial-gradient(circle at 12% 12%,rgba(255,196,220,.68),transparent 28%),radial-gradient(circle at 86% 18%,rgba(255,240,166,.4),transparent 27%),linear-gradient(90deg,rgba(240,167,199,.12) 1px,transparent 1px),linear-gradient(rgba(240,167,199,.1) 1px,transparent 1px),#fff0f7;background-size:auto,auto,28px 28px,28px 28px,auto}:root[data-theme=matchaCloud] body{background:radial-gradient(circle at 12% 12%,rgba(216,248,169,.72),transparent 28%),radial-gradient(circle at 84% 18%,rgba(201,244,229,.48),transparent 28%),linear-gradient(90deg,rgba(168,216,137,.12) 1px,transparent 1px),linear-gradient(rgba(168,216,137,.1) 1px,transparent 1px),#f3ffe8;background-size:auto,auto,28px 28px,28px 28px,auto}:root[data-theme=lilacDream] body{background:radial-gradient(circle at 14% 12%,rgba(217,209,255,.78),transparent 30%),radial-gradient(circle at 84% 16%,rgba(255,199,221,.44),transparent 28%),linear-gradient(90deg,rgba(184,168,244,.12) 1px,transparent 1px),linear-gradient(rgba(184,168,244,.1) 1px,transparent 1px),#f5f0ff;background-size:auto,auto,28px 28px,28px 28px,auto}:root[data-theme=aquaPearl] body{background:radial-gradient(circle at 12% 12%,rgba(191,233,255,.7),transparent 28%),radial-gradient(circle at 84% 16%,rgba(185,245,232,.56),transparent 28%),linear-gradient(90deg,rgba(131,215,227,.12) 1px,transparent 1px),linear-gradient(rgba(131,215,227,.1) 1px,transparent 1px),#eaffff;background-size:auto,auto,28px 28px,28px 28px,auto}:root[data-theme=sunsetCandy] body{background:radial-gradient(circle at 12% 14%,rgba(255,210,194,.72),transparent 28%),radial-gradient(circle at 86% 18%,rgba(217,209,255,.46),transparent 28%),linear-gradient(90deg,rgba(241,176,131,.12) 1px,transparent 1px),linear-gradient(rgba(241,176,131,.1) 1px,transparent 1px),#fff3e8;background-size:auto,auto,28px 28px,28px 28px,auto}:root[data-theme=creamPaper] body{background:radial-gradient(circle at 12% 12%,rgba(255,240,166,.54),transparent 28%),radial-gradient(circle at 86% 18%,rgba(201,244,229,.42),transparent 28%),linear-gradient(90deg,rgba(216,201,130,.12) 1px,transparent 1px),linear-gradient(rgba(216,201,130,.1) 1px,transparent 1px),#fffbea;background-size:auto,auto,28px 28px,28px 28px,auto}button,input,select{font:inherit}button,select,input{border:1px solid var(--line);border-radius:6px;background:#f4fbff21;color:var(--ink)}:root:not([data-theme=darkMacaron]) button,:root:not([data-theme=darkMacaron]) select,:root:not([data-theme=darkMacaron]) input{background:#ffffffc7}:root:not([data-theme=darkMacaron]) button:hover{background:color-mix(in srgb,var(--line) 22%,white);border-color:var(--line)}button{min-height:42px;padding:0 14px;display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;box-shadow:0 2px 0 var(--line-strong);font-size:16px;font-weight:800}button,select,label,.piano-key,.middle-c-label,.exercise-tabs,.theme-strip,.floating-piano-handle,.sustain-toggle{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}button:disabled{cursor:not-allowed;opacity:.62}button:hover,button.active{background:#fff0a63d}:root[data-theme=darkMacaron] button:hover{background:#ffffff1f;border-color:var(--line-strong)}:root[data-theme=darkMacaron] button.active,:root[data-theme=darkMacaron] .exercise-tabs button.active,:root[data-theme=darkMacaron] .sight-steps button.active{background:linear-gradient(135deg,#fff0a6,#ffc4dc 58%,#b9f5e8);color:#101827;border-color:#fff7c7;box-shadow:0 0 0 3px #fff0a638,0 5px #8bded38c,0 0 24px #ffc4dc5c}:root[data-theme=darkMacaron] nav button.active{transform:translateY(-1px)}:root[data-theme=darkMacaron] :is(.exercise-tabs button.active,.sight-steps button.active,.note-list span,.practice-mic-result.hit,.practice-mic-result.high,.practice-mic-result.low,.practice-mic-result.miss,.pitch-panel.hit,.pitch-panel.near,.pitch-panel.high,.pitch-panel.low,.five-note-step.hit,.five-note-step.near,.five-note-step.high,.five-note-step.low,.live-pitch-target.hit,.live-pitch-target.near,.live-pitch-target.high,.live-pitch-target.low,.realtime-assessment.accurate .realtime-pitch-display,.realtime-assessment.high .realtime-pitch-display,.realtime-assessment.low .realtime-pitch-display,.mic-round,.live-mic-stop,.reward-burst,.tuner-controls button.active,.tuner-direction span.active,.tuner-stop,.sight-stop-button,.sight-review-button,.score-upload-button,.floating-piano-toggle){color:#17202d}:root[data-theme=darkMacaron] :is(.practice-mic-result.hit,.practice-mic-result.high,.practice-mic-result.low,.practice-mic-result.miss,.pitch-panel.hit,.pitch-panel.near,.pitch-panel.high,.pitch-panel.low,.five-note-step.hit,.five-note-step.near,.five-note-step.high,.five-note-step.low,.live-pitch-target.hit,.live-pitch-target.near,.live-pitch-target.high,.live-pitch-target.low,.realtime-assessment.accurate .realtime-pitch-display,.realtime-assessment.high .realtime-pitch-display,.realtime-assessment.low .realtime-pitch-display,.note-list span) :is(strong,span,small,p,h3){color:#17202d}:root[data-theme=darkMacaron] :is(.upload-flow-steps article,.assessment-wechat-card,.wechat-assessment-steps article){color:var(--on-light)}:root[data-theme=darkMacaron] :is(.upload-flow-steps article,.assessment-wechat-card,.wechat-assessment-steps article) :is(span,small,p){color:var(--on-light-muted)}:root[data-theme=darkMacaron] :is(.practice-mic-result.hit,.practice-mic-result.high,.practice-mic-result.low,.practice-mic-result.miss,.pitch-panel.hit,.pitch-panel.near,.pitch-panel.high,.pitch-panel.low){border-color:#17202d57}:root:not([data-theme=darkMacaron]) button.active,:root:not([data-theme=darkMacaron]) .exercise-tabs button.active,:root:not([data-theme=darkMacaron]) .sight-steps button.active{background:linear-gradient(135deg,color-mix(in srgb,var(--line) 42%,white),color-mix(in srgb,var(--line-strong) 42%,white)),#fff;color:var(--ink);border-color:color-mix(in srgb,var(--line) 72%,#111827);box-shadow:0 0 0 3px color-mix(in srgb,var(--line) 22%,transparent),0 5px color-mix(in srgb,var(--line-strong) 68%,#111827),0 12px 24px color-mix(in srgb,var(--line) 22%,transparent);transform:translateY(-1px)}:root:not([data-theme=darkMacaron]) nav button.active{font-weight:950}button.primary{background:linear-gradient(135deg,#8bded3e6,#ffc4dcdb);color:#111827;border-color:#b9f5e8}button.primary:hover{background:linear-gradient(135deg,#b9f5e8,#ffd2c2)}select,input{height:42px;padding:0 10px;width:100%}select{font-size:18px;font-weight:800}select option{background:#fff;color:var(--on-light);font-size:18px;font-weight:700}:root[data-theme=darkMacaron] select{color-scheme:dark}:root[data-theme=darkMacaron] select option{background:#111827;color:#f7f9fc}:root[data-theme=darkMacaron] input[type=checkbox]{color-scheme:dark;accent-color:#8bded3;background-color:#111827;border-color:#aeb7c6}input::placeholder{color:color-mix(in srgb,currentColor 62%,transparent)}main{width:min(1180px,calc(100vw - 28px));margin:0 auto;padding:22px 0 42px}.auth-page{min-height:100vh;width:min(980px,calc(100vw - 28px));display:grid;place-items:center;padding:28px 0}.auth-card{width:min(860px,100%);display:grid;grid-template-columns:minmax(260px,.9fr) minmax(300px,1.1fr);gap:26px;align-items:center;border:2px solid var(--line);background:linear-gradient(135deg,#080e1afa,#162839f5 52%,#2b1f3af2),var(--panel);box-shadow:10px 10px #ffc4dc33,0 0 38px #8bded329;padding:clamp(22px,5vw,44px)}.simple-auth-card{width:min(520px,100%);grid-template-columns:1fr}.simple-auth-card .auth-intro{text-align:center}.simple-auth-card h1{font-size:clamp(34px,7vw,58px)}.code-row{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:end}.code-row button{min-height:52px;white-space:nowrap}.demo-code{margin:0;color:var(--butter);text-align:center;font-weight:900}.usage-summary{display:grid;grid-template-columns:repeat(2,minmax(150px,1fr)) auto;gap:0;align-items:stretch;overflow:hidden;border:2px solid var(--line-strong);background:color-mix(in srgb,var(--panel) 76%,var(--mint))}.usage-summary>div{display:grid;grid-template-columns:1fr auto auto;gap:7px;align-items:baseline;padding:15px 18px}.usage-summary>div+div{border-left:1px solid var(--line)}.usage-summary span{color:var(--text);font-weight:850}.usage-summary strong{color:var(--text);font-size:25px}.usage-summary small{color:var(--muted);font-weight:800}.usage-summary p{display:grid;place-items:center;margin:0;padding:10px 16px;border-left:1px solid var(--line);color:var(--muted);font-size:12px;text-align:center}.simple-auth-card .usage-summary{margin-top:2px}.access-level-guide{display:grid;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.access-level-guide>div{display:grid;grid-template-columns:92px 1fr;gap:12px;padding:10px 2px}.access-level-guide>div+div{border-top:1px solid color-mix(in srgb,var(--line) 65%,transparent)}.access-level-guide strong{color:var(--text)}.access-level-guide span{color:var(--muted);font-size:13px;line-height:1.55}.home-metrics-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(420px,1.1fr);gap:14px;align-items:stretch}.home-metrics-grid .usage-summary{grid-template-columns:1fr 1fr}.home-metrics-grid .usage-summary p{grid-column:1 / -1;border-top:1px solid var(--line);border-left:0}.ranking-panel{display:grid;grid-template-columns:minmax(150px,.65fr) minmax(240px,1.35fr);gap:0 16px;padding:14px 16px;border:2px solid var(--line-strong);background:color-mix(in srgb,var(--panel) 80%,var(--butter))}.ranking-heading{grid-column:1 / -1;display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.ranking-heading h2,.ranking-heading p{margin:0}.ranking-heading h2{font-size:20px}.ranking-current{display:grid;align-content:center;gap:3px;padding-right:14px;border-right:1px solid var(--line)}.ranking-current>span,.ranking-current>small{color:var(--muted);font-size:12px;font-weight:800}.ranking-current>strong{color:var(--text);font-size:29px}.ranking-login-hint>strong{font-size:18px}.ranking-top{display:grid;gap:4px}.ranking-top>div{display:grid;grid-template-columns:70px 1fr auto;gap:8px;align-items:center;padding:3px 0;border-bottom:1px solid color-mix(in srgb,var(--line) 55%,transparent);font-size:12px}.ranking-top span{color:var(--muted)}.ranking-top b{color:var(--text)}.ranking-top p{margin:0;color:var(--muted)}.ranking-update-note{grid-column:1 / -1;margin-top:9px;color:var(--muted);text-align:right}.auth-action-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:10px}.guest-entry-button{min-height:78px;display:grid;place-items:center;align-content:center;gap:4px;border-width:3px;background:color-mix(in srgb,var(--panel) 72%,var(--mint));font-size:20px}.guest-entry-button span{color:var(--muted);font-size:13px;font-weight:800}.auth-divider{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:center;color:var(--muted);font-size:13px;font-weight:850}.auth-divider:before,.auth-divider:after{height:1px;background:var(--line);content:""}.auth-action-grid button{min-width:0}.auth-access-note{margin:0;color:var(--muted);font-size:13px;font-weight:800;line-height:1.55}.legal-consent{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border:1px solid var(--line);background:color-mix(in srgb,var(--panel) 82%,var(--sky));color:var(--text);font-size:14px;font-weight:800;line-height:1.6}.legal-consent input{flex:0 0 auto;width:20px;height:20px;margin-top:1px;accent-color:var(--line-strong)}.legal-consent a,.legal-links a{color:var(--text);font-weight:900;text-decoration:underline;text-underline-offset:3px}.legal-links{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 18px}.access-offer{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,420px);gap:18px;align-items:center;padding:20px;border:2px solid var(--line-strong);background:color-mix(in srgb,var(--panel) 82%,var(--butter));box-shadow:5px 5px color-mix(in srgb,var(--line-strong) 54%,transparent)}.access-offer h2,.access-offer p{margin:0 0 8px}.tier-badge{display:inline-flex;min-height:30px;align-items:center;padding:3px 10px;border:2px solid currentColor;border-radius:999px;font-size:13px;font-weight:900}.tier-badge.free{color:var(--text);background:color-mix(in srgb,var(--butter) 70%,var(--panel))}.tier-badge.paid{color:var(--text);background:color-mix(in srgb,var(--mint) 68%,var(--panel))}.free-access-summary{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:11px 13px;border-left:5px solid var(--line-strong);background:color-mix(in srgb,var(--panel) 84%,var(--mint))}.free-access-summary strong,.free-access-summary span{padding:5px 9px;color:var(--text);font-weight:850}.free-access-summary span+span{border-left:1px solid var(--line)}.training-module-grid article.member-locked{background:color-mix(in srgb,var(--panel) 92%,var(--muted))}.training-module-grid article.member-locked>span{color:var(--text);font-weight:900}.stats-history-note{margin:0 0 14px;padding:11px 13px;border-left:5px solid var(--line-strong);background:color-mix(in srgb,var(--panel) 82%,var(--sky));color:var(--text);font-weight:850}.admin-user-list{display:grid;gap:10px}.admin-audit-list{display:grid;gap:8px}.admin-audit-row{display:grid;grid-template-columns:minmax(210px,1.2fr) repeat(3,minmax(140px,1fr));gap:12px;align-items:center;padding:11px 13px;border:1px solid var(--line);background:color-mix(in srgb,var(--panel) 92%,var(--sky))}.admin-audit-row span{color:var(--muted);font-size:13px}.app-copyright{display:grid;gap:6px;max-width:980px;margin:0 auto;padding:20px 18px 110px;color:var(--muted);font-size:13px;line-height:1.55;text-align:center}.app-copyright strong{font-size:15px;color:var(--text)}.primary-navigation{justify-content:flex-end}.primary-navigation button{min-height:48px;padding:0 15px}.learning-home,.training-hub,.profile-center{display:grid;gap:20px}.assistant-workspace{display:grid;gap:18px}.assistant-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px 22px;border:3px solid var(--line-strong);background:color-mix(in srgb,var(--panel) 80%,var(--mint))}.assistant-heading h2,.assistant-heading p{margin:0}.assistant-heading h2{margin-bottom:5px;font-size:32px}.assistant-quota{min-width:150px;display:grid;grid-template-columns:auto auto;align-items:end;justify-content:center;padding:12px 16px;border-left:2px solid var(--line);text-align:center}.assistant-quota span{grid-column:1 / -1;color:var(--muted);font-weight:800}.assistant-quota strong{font-size:36px;line-height:1}.assistant-quota small{color:var(--muted);font-weight:800}.assistant-layout{min-height:650px;display:grid;grid-template-columns:minmax(250px,.34fr) minmax(0,1fr);gap:18px}.assistant-side{display:grid;grid-template-rows:auto auto minmax(0,1fr);align-content:start;gap:14px}.music-spirit{--voice-level: 0;min-height:290px;position:relative;display:grid;place-items:center;align-content:center;gap:18px;overflow:hidden;border:3px solid var(--line-strong);background:linear-gradient(0deg,color-mix(in srgb,var(--panel) 82%,var(--sky)),color-mix(in srgb,var(--panel) 82%,var(--pink)))}.music-spirit>strong{z-index:3;max-width:210px;text-align:center}.spirit-face{width:150px;height:150px;position:relative;z-index:2;border:4px solid #30445f;border-radius:50% 50% 44% 44%;background:#fff3b6;box-shadow:0 12px color-mix(in srgb,var(--line-strong) 72%,#30445f);transform:translateY(calc(var(--voice-level) * -3px));transition:transform 90ms linear}.spirit-eye{width:15px;height:22px;position:absolute;top:57px;border-radius:50%;background:#30445f;transform-origin:center}.spirit-eye.left{left:42px}.spirit-eye.right{right:42px}.spirit-mouth{width:calc(28px + var(--voice-level) * 16px);height:calc(10px + var(--voice-level) * 22px);position:absolute;left:50%;bottom:35px;border:4px solid #30445f;border-top-width:2px;border-radius:8px 8px 50% 50%;background:#ff9fba;transform:translate(-50%)}.spirit-mark{position:absolute;right:14px;top:17px;color:#d4487f}.spirit-headphones{width:180px;height:115px;position:absolute;z-index:1;top:54px;left:50%;border:12px solid #30445f;border-bottom:0;border-radius:100px 100px 0 0;transform:translate(-50%)}.spirit-headphones span{width:29px;height:65px;position:absolute;top:66px;border:4px solid #30445f;border-radius:8px;background:#8bded3}.spirit-headphones span:first-child{left:-20px}.spirit-headphones span:last-child{right:-20px}.spirit-halo{position:absolute;top:24px;right:24px;bottom:24px;left:24px;z-index:0;border:2px dashed color-mix(in srgb,var(--line) 70%,transparent);border-radius:50%;animation:spiritOrbit 10s linear infinite}.spirit-halo i{width:10px;height:10px;position:absolute;border-radius:50%;background:var(--line-strong)}.spirit-halo i:nth-child(1){left:18%;top:5%}.spirit-halo i:nth-child(2){right:7%;top:40%}.spirit-halo i:nth-child(3){bottom:5%;left:36%}.music-spirit.listening .spirit-face{animation:spiritListen 1s ease-in-out infinite alternate}.music-spirit.thinking .spirit-halo{animation-duration:2.5s}.music-spirit.thinking .spirit-eye{height:8px;top:64px}.music-spirit.speaking .spirit-face{box-shadow:0 12px color-mix(in srgb,var(--line-strong) 72%,#30445f),0 0 0 calc(5px + var(--voice-level) * 9px) #8bded340}.music-spirit.encouraging .spirit-face{animation:spiritCelebrate .7s ease}.music-spirit.error .spirit-face{background:#ffd0d7}.music-spirit.error .spirit-mouth{bottom:25px;border-bottom:0;border-radius:50% 50% 0 0;background:transparent}@keyframes spiritOrbit{to{transform:rotate(360deg)}}@keyframes spiritListen{0%{transform:rotate(-2deg) translateY(0)}to{transform:rotate(2deg) translateY(-3px)}}@keyframes spiritCelebrate{0%,to{transform:translateY(0) rotate(0)}45%{transform:translateY(-13px) rotate(-4deg)}70%{transform:translateY(-5px) rotate(4deg)}}.assistant-voice-controls{display:grid;grid-template-columns:1fr 1fr;gap:10px}.assistant-voice-controls button,.assistant-voice-controls label{min-width:0;display:grid;gap:6px;align-content:center;padding:10px;border:2px solid var(--line);background:var(--panel);font-size:14px;font-weight:850}.assistant-voice-controls button{grid-template-columns:auto 1fr}.assistant-voice-controls select{height:38px;font-size:15px}.assistant-history{min-height:180px;display:grid;align-content:start;gap:7px;padding-top:14px;border-top:2px solid var(--line)}.assistant-history>div{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:5px}.assistant-history>div:first-child{align-items:center;margin-bottom:4px}.assistant-history>div:first-child strong{display:inline-flex;align-items:center;gap:6px}.assistant-history>div>button:first-child{min-width:0;justify-content:flex-start;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.assistant-history>div>button:last-child{width:42px;padding:0}.assistant-history>div.active>button:first-child{border-color:var(--line-strong);background:color-mix(in srgb,var(--panel) 72%,var(--butter))}.assistant-history p{margin:8px 0;color:var(--muted);font-size:14px;line-height:1.6}.assistant-chat{min-width:0;display:grid;grid-template-rows:minmax(0,1fr) auto;border:3px solid var(--line-strong);background:color-mix(in srgb,var(--panel) 94%,var(--sky))}.assistant-messages{height:520px;overflow-y:auto;padding:24px;overscroll-behavior:contain}.assistant-welcome{min-height:440px;display:grid;place-items:center;align-content:center;gap:10px;text-align:center}.assistant-welcome h3,.assistant-welcome p{margin:0}.assistant-welcome h3{font-size:27px}.assistant-welcome p{max-width:520px;color:var(--muted);line-height:1.7}.assistant-welcome>div{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:8px}.assistant-welcome button{min-height:38px;font-size:14px}.assistant-message{max-width:86%;display:grid;grid-template-columns:34px minmax(0,1fr);gap:9px;margin-bottom:20px}.assistant-message.user{margin-left:auto;grid-template-columns:minmax(0,1fr) 34px}.assistant-message>span{width:34px;height:34px;display:grid;place-items:center;border:2px solid var(--line);border-radius:50%;background:var(--panel);font-weight:900}.assistant-message.user>span{grid-column:2;grid-row:1}.assistant-message>div{padding:13px 15px;border:2px solid var(--line);background:var(--panel)}.assistant-message.user>div{grid-column:1;grid-row:1;background:color-mix(in srgb,var(--panel) 65%,var(--mint))}.assistant-message p{margin:0;line-height:1.75;white-space:pre-wrap}.assistant-message footer{display:grid;gap:4px;margin-top:12px;padding-top:10px;border-top:1px solid var(--line);font-size:13px}.assistant-message footer a{color:inherit;text-underline-offset:3px}.assistant-supplement{display:inline-block;margin-bottom:7px;color:#9d4a20;font-size:13px}.assistant-replay{min-height:34px;margin-top:10px;padding:0 9px;font-size:13px;box-shadow:none}.assistant-thinking{display:flex;align-items:center;gap:6px;margin:12px 0;color:var(--muted)}.assistant-thinking i{width:8px;height:8px;border-radius:50%;background:var(--line-strong);animation:assistantDot .9s ease-in-out infinite alternate}.assistant-thinking i:nth-child(2){animation-delay:.15s}.assistant-thinking i:nth-child(3){animation-delay:.3s}@keyframes assistantDot{to{transform:translateY(-6px)}}.assistant-composer{display:grid;gap:8px;padding:14px;border-top:2px solid var(--line);background:var(--panel)}.assistant-composer>p{margin:0;font-size:14px}.assistant-privacy-consent{display:grid;grid-template-columns:22px minmax(0,1fr);align-items:start;gap:8px;color:var(--muted);font-size:13px;line-height:1.55}.assistant-privacy-consent input{width:19px;height:19px;margin:1px 0 0}.assistant-privacy-consent a{margin-left:4px;color:inherit;font-weight:800}.assistant-composer textarea{width:100%;min-height:92px;resize:vertical;padding:12px 14px;border:2px solid var(--line);border-radius:6px;background:color-mix(in srgb,var(--panel) 88%,var(--paper));color:var(--ink);font:inherit;line-height:1.55}.assistant-composer>div{display:flex;align-items:center;justify-content:flex-end;gap:9px}.assistant-composer>div>span{margin-right:auto;color:var(--muted);font-size:13px;font-weight:800}.assistant-composer button.recording{background:var(--pitch-high);color:var(--on-light);border-color:var(--pitch-high-strong)}.quest-hero{display:grid;grid-template-columns:minmax(0,1fr) 230px;gap:22px;align-items:center;padding:24px;border:3px solid var(--line-strong);background:color-mix(in srgb,var(--panel) 76%,var(--butter))}.quest-hero h2,.quest-hero p{margin:0 0 12px}.level-orbit{min-height:190px;display:grid;place-items:center;align-content:center;gap:8px;border:4px solid var(--line-strong);border-radius:50%;background:color-mix(in srgb,var(--panel) 72%,var(--pink));text-align:center}.level-orbit strong{font-size:34px}.level-orbit>div,.daily-quest>div{width:78%;height:9px;overflow:hidden;border:1px solid var(--line-strong);border-radius:999px;background:color-mix(in srgb,var(--paper) 60%,transparent)}.level-orbit i,.daily-quest i{height:100%;display:block;background:linear-gradient(90deg,#64cbbb,#f09abf,#f4bd5f)}.quest-heading,.profile-banner{display:flex;align-items:center;justify-content:space-between;gap:16px}.quest-heading h2,.quest-heading p,.profile-banner h2,.profile-banner p{margin:0}.quest-heading>span{display:inline-flex;align-items:center;gap:7px;font-weight:900}.daily-quest-grid,.training-module-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.daily-quest,.training-module-grid article,.tool-grid>button{min-height:170px;display:grid;align-content:center;justify-items:start;gap:10px;padding:18px;text-align:left}.daily-quest strong,.training-module-grid strong,.tool-grid strong{font-size:23px}.daily-quest>div{width:100%}.quest-number{color:var(--muted);font-size:13px;font-weight:900}.learning-path{display:grid;grid-template-columns:repeat(6,minmax(110px,1fr));gap:10px}.learning-path .quest-heading{grid-column:1 / -1}.learning-path button{min-height:100px;display:grid;gap:5px;align-content:center}.training-module-grid article{border:2px solid var(--line);background:color-mix(in srgb,var(--panel) 88%,var(--sky))}.training-module-grid article .button-row{width:100%;margin-top:5px}.tool-grid>button{color:var(--ink)}.profile-banner{padding:20px;border:3px solid var(--line-strong);background:color-mix(in srgb,var(--panel) 78%,var(--mint))}.profile-privacy-panel{display:grid;grid-template-columns:minmax(220px,.8fr) minmax(320px,1.2fr);gap:18px;padding:18px 20px;border-block:2px solid var(--line);background:color-mix(in srgb,var(--panel) 84%,var(--sky))}.profile-private-phone,.profile-privacy-panel form,.profile-privacy-panel label{display:grid;gap:7px}.profile-private-phone strong{font-size:22px;letter-spacing:0}.profile-private-phone small,.profile-privacy-panel form small{color:var(--muted);line-height:1.5}.profile-privacy-panel form{grid-template-columns:minmax(0,1fr) auto;align-items:end}.profile-privacy-panel form label,.profile-privacy-panel form small,.profile-save-status{grid-column:1 / -1}.profile-privacy-panel form button{grid-column:2;grid-row:1}.profile-save-status{color:var(--pitch-accurate-strong);font-weight:900}.profile-theme{display:grid;grid-template-columns:auto minmax(180px,300px);align-items:center;justify-content:start;gap:12px;font-weight:900}.score-presence-toggle,.voice-feedback-controls{display:flex;align-items:center;gap:9px;flex-wrap:wrap}.score-presence-toggle button.active{background:var(--butter);border-color:var(--line-strong)}.work-comment-history{display:grid;gap:8px}.work-comment-history audio{width:100%}.voice-feedback-controls>span{color:var(--muted);font-weight:800}@media(min-width:1041px){.topbar{padding-right:22px}}@media(max-width:1040px){.home-metrics-grid{grid-template-columns:1fr}.learning-path{grid-template-columns:repeat(3,1fr)}.daily-quest-grid,.training-module-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:620px){.simple-phone-login,.profile-invitation-form,.admin-password-change{grid-template-columns:1fr}.simple-phone-login .auth-access-note,.simple-phone-login .auth-error,.admin-password-change>strong{grid-column:1}.profile-privacy-panel{grid-template-columns:1fr;padding:16px}.profile-privacy-panel form{grid-template-columns:1fr}.profile-privacy-panel form button{grid-column:1;grid-row:auto}.access-level-guide>div{grid-template-columns:1fr;gap:3px}.ranking-panel{grid-template-columns:1fr}.ranking-current{margin-bottom:10px;padding:0 0 10px;border-right:0;border-bottom:1px solid var(--line)}.ranking-update-note{text-align:left}.auth-action-grid{grid-template-columns:1fr}.usage-summary{grid-template-columns:1fr 1fr}.usage-summary>div{grid-template-columns:1fr;gap:3px;padding:12px}.usage-summary strong{font-size:21px}.usage-summary p{grid-column:1 / -1;border-top:1px solid var(--line);border-left:0}.free-access-summary{align-items:stretch}.free-access-summary span{width:100%}.free-access-summary span+span{border-top:1px solid var(--line);border-left:0}main{padding-bottom:82px}.topbar{min-height:auto}.topbar>div:first-child{min-height:0;padding-right:0}.topbar h1{font-size:30px}.primary-navigation{position:fixed;left:0;right:0;bottom:0;z-index:90;display:grid;grid-template-columns:repeat(6,1fr);gap:0;padding:5px max(4px,env(safe-area-inset-right)) max(5px,env(safe-area-inset-bottom)) max(4px,env(safe-area-inset-left));border-top:2px solid var(--line-strong);background:var(--panel);box-shadow:0 -8px 24px #0a192829}.primary-navigation button{min-width:0;min-height:58px;display:grid;justify-items:center;align-content:center;gap:2px;padding:3px;border:0;box-shadow:none;font-size:11px}.quest-hero,.daily-quest-grid,.training-module-grid,.learning-path{grid-template-columns:1fr}.level-orbit{width:210px;justify-self:center}.quest-heading,.profile-banner{align-items:stretch;flex-direction:column}.learning-path .quest-heading{grid-column:1}.assistant-heading{align-items:stretch;flex-direction:column}.assistant-quota{min-width:0;border-top:2px solid var(--line);border-left:0}.assistant-layout{grid-template-columns:1fr}.assistant-side{grid-template-columns:1fr;grid-template-rows:auto}.music-spirit{min-height:260px}.assistant-history{max-height:240px;overflow-y:auto}.assistant-messages{height:460px;padding:16px 12px}.assistant-message{max-width:96%}.assistant-composer>div{flex-wrap:wrap}.assistant-composer>div>span{width:100%}.compact-range-panel .practice-range-options{grid-template-columns:repeat(2,minmax(0,1fr))}}.admin-dashboard{display:grid;gap:20px}.admin-dashboard-banner{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px;border:3px solid var(--line-strong);background:color-mix(in srgb,var(--panel) 82%,var(--mint))}.admin-dashboard-banner h2,.admin-dashboard-banner p{margin:0}.admin-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(120px,1fr));gap:12px}.admin-activation-panel{display:grid;gap:14px;padding:16px;border:1px solid var(--line);background:#fffdf814}.activation-create-row{display:grid;grid-template-columns:minmax(210px,.55fr) minmax(150px,.35fr) minmax(320px,1fr);gap:12px;align-items:end}.activation-create-row label{display:grid;gap:7px;color:var(--muted);font-weight:900}.activation-create-row input{height:42px;font-size:16px}.activation-code-list{display:grid;gap:9px;max-height:320px;overflow:auto;padding-right:4px}.activation-code-row{display:flex;justify-content:space-between;gap:14px;padding:12px;border:1px solid color-mix(in srgb,var(--line) 80%,transparent);background:#ffffff14}.activation-code-row>div:first-child{display:grid;gap:4px}.activation-code-row strong{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,monospace;font-size:17px;letter-spacing:.03em}.activation-code-row span{color:var(--muted);font-size:13px}.admin-user-row{display:flex;justify-content:space-between;gap:18px;padding:14px;border:1px solid var(--line);background:#fffdf814}.admin-user-row>div:first-child{display:grid;gap:5px}.admin-user-row span{color:var(--muted);font-size:13px}.admin-account-badge{align-self:center;padding:8px 11px;border:1px solid #79cfc5;border-radius:999px;background:#e9fbf7;color:#184c4b!important;font-size:14px!important;font-weight:900}.danger-button{border-color:#d76579;background:color-mix(in srgb,var(--pitch-high) 70%,var(--panel));color:color-mix(in srgb,var(--pitch-high-strong) 78%,var(--ink))}.danger-button:hover{border-color:var(--pitch-high-strong);background:var(--pitch-high);color:#671829}:root:not([data-theme=darkMacaron]) .auth-card{background:linear-gradient(135deg,var(--panel),rgba(255,255,255,.78))}.auth-loading-card{grid-template-columns:1fr;text-align:center}.auth-card h1{margin:0;font-family:Georgia,Times New Roman,serif;font-size:clamp(38px,8vw,76px);line-height:.98;letter-spacing:0}.auth-copy{margin:18px 0 0;color:var(--muted);font-size:17px;line-height:1.6;font-weight:800}.auth-form{display:grid;gap:14px;padding:18px;border:1px solid color-mix(in srgb,var(--line) 72%,transparent);background:#f4fbff14}:root:not([data-theme=darkMacaron]) .auth-form{background:#ffffff94}.auth-form label{display:grid;gap:8px;color:var(--muted);font-weight:900}.auth-form input,.auth-form select{height:52px;font-size:18px}.simple-phone-login{grid-template-columns:minmax(0,1fr) minmax(150px,.34fr);align-items:end}.simple-phone-login .auth-access-note,.simple-phone-login .auth-error{grid-column:1 / -1}.auth-submit{min-height:52px;font-size:18px}.auth-error{margin:0}.teacher-login-entry{display:flex;justify-content:flex-end}.teacher-entry-button{min-height:38px;padding:0 12px;border-color:color-mix(in srgb,var(--line) 60%,transparent);background:color-mix(in srgb,var(--panel) 84%,transparent);box-shadow:none;color:var(--muted);font-size:14px}.teacher-login-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;display:grid;place-items:center;padding:20px;background:#060c16b8;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.teacher-login-dialog{position:relative;width:min(560px,100%);max-height:min(760px,calc(100dvh - 32px));overflow:auto;padding:28px;border:2px solid var(--line);border-radius:8px;background:var(--panel);color:var(--ink);box-shadow:10px 10px color-mix(in srgb,var(--accent) 24%,transparent)}.teacher-login-dialog h2{margin:4px 42px 8px 0;font-size:30px}.teacher-dialog-close{position:absolute;top:16px;right:16px}.teacher-login-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:20px 0}.teacher-auth-status,.teacher-browser-warning{margin:14px 0 0;padding:11px 12px;border-left:4px solid var(--accent);background:color-mix(in srgb,var(--accent) 12%,var(--panel));color:var(--ink);font-weight:800;line-height:1.55}.teacher-auth-status.success{border-left-color:var(--pitch-accurate-strong)}.teacher-browser-warning{border-left-color:#cf8b2f;background:color-mix(in srgb,#ffd88a 24%,var(--panel))}.teacher-login-tabs button{min-height:42px;padding:0 8px;box-shadow:none}.teacher-login-tabs button.active{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 20%,var(--panel));color:var(--ink)}.teacher-auth-method{display:grid;justify-items:center;gap:12px;padding:24px;border:1px solid var(--line);text-align:center}.teacher-auth-method>svg{color:var(--accent)}.teacher-auth-method span{color:var(--muted);line-height:1.55}.teacher-security-form{display:grid;gap:14px}.teacher-security-form label{display:grid;gap:7px;color:var(--muted);font-weight:900}.teacher-security-form input{min-height:50px;font-size:17px}.password-input-wrap{position:relative;display:block}.password-input-wrap input{width:100%;padding-right:52px}.password-visibility-button{position:absolute;top:50%;right:7px;width:38px;min-height:38px;padding:0;border:0;background:transparent;box-shadow:none;color:var(--muted)}.password-visibility-button:hover{background:color-mix(in srgb,var(--accent) 14%,transparent)}.admin-security-panel{display:grid;gap:14px;margin:20px 0;padding:20px;border:2px solid color-mix(in srgb,var(--line) 78%,transparent);background:color-mix(in srgb,var(--panel) 82%,var(--accent) 5%)}.admin-password-change{display:grid;grid-template-columns:repeat(2,minmax(200px,1fr)) auto;align-items:end;gap:12px;padding-top:15px;border-top:1px solid var(--line)}.admin-password-change>strong{grid-column:1 / -1}.admin-password-change label{display:grid;gap:6px;color:var(--muted);font-weight:850}.profile-invitation-form{display:grid;grid-template-columns:minmax(220px,1fr) minmax(220px,.7fr) auto;align-items:end;gap:16px;padding:18px 20px;border:3px solid var(--line-strong);background:color-mix(in srgb,var(--panel) 80%,var(--butter))}.profile-invitation-form h2,.profile-invitation-form p{margin:0}.profile-invitation-form label{display:grid;gap:7px;color:var(--muted);font-weight:850}.profile-access-status{margin:0;padding:10px 12px;border-left:4px solid currentColor;background:color-mix(in srgb,var(--panel) 88%,var(--mint));font-weight:850}.passkey-status-grid{display:grid;grid-template-columns:repeat(2,minmax(0,180px));gap:10px}.passkey-status-grid>div{display:grid;gap:4px;padding:12px;border-left:4px solid var(--accent);background:color-mix(in srgb,var(--panel) 78%,transparent)}.passkey-status-grid span,.passkey-device-row span{color:var(--muted);font-size:13px}.passkey-status-grid strong{font-size:28px}.passkey-device-row{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid color-mix(in srgb,var(--line) 55%,transparent)}.passkey-device-row>div{display:grid;gap:3px}.recovery-code-panel{display:grid;gap:12px;padding:16px;border:2px solid #c99a35;background:color-mix(in srgb,#fff2b8 86%,var(--panel));color:#36280d}.recovery-code-panel>div:first-child{display:flex;justify-content:space-between;align-items:center;gap:12px}.recovery-code-panel button{min-height:34px;padding:0 10px;box-shadow:none;color:#36280d}.recovery-code-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.recovery-code-grid code{padding:9px;border:1px solid rgba(54,40,13,.35);background:#fffdf3;color:#36280d;text-align:center;font-size:14px}.recovery-code-panel p{margin:0;font-size:13px;line-height:1.5}.success-text{color:var(--pitch-accurate-strong);font-weight:900}@media(max-width:640px){.teacher-login-dialog{padding:22px 16px}.teacher-login-tabs,.recovery-code-grid{grid-template-columns:1fr}.passkey-status-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}.topbar,.account-strip,.theme-strip,.workspace{border:2px solid var(--line);background:var(--panel);box-shadow:7px 7px #ffc4dc29,0 0 34px #8bded31a}.topbar{background:linear-gradient(135deg,#080e1afa,#162839f5 48%,#2b1f3af2)}:root:not([data-theme=darkMacaron]) .topbar{background:linear-gradient(135deg,var(--panel),rgba(255,255,255,.68))}.topbar{min-height:108px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 182px 18px 22px}.topbar h1,.workspace h2,.control-panel h2{margin:0;letter-spacing:0}.topbar h1{font-family:Georgia,Times New Roman,serif;font-size:clamp(30px,4vw,56px);line-height:1}.user-badge{margin-top:12px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;color:var(--muted);font-size:13px;font-weight:900}.user-badge button{min-height:30px;padding:0 10px;box-shadow:none}.customer-service{position:fixed;top:max(70px,calc(env(safe-area-inset-top) + 70px));right:max(14px,env(safe-area-inset-right));z-index:80;display:grid;justify-items:end;gap:10px}.total-score-badge{position:fixed;top:max(14px,env(safe-area-inset-top));right:max(14px,env(safe-area-inset-right));z-index:81;min-height:46px;display:inline-flex;align-items:center;gap:8px;padding:0 14px;border:2px solid #e4b54c;border-radius:7px;background:linear-gradient(135deg,#fff0a6,#ffd2c2);color:#422c17;box-shadow:4px 4px #e4b54c57;font-size:16px;font-weight:900}.total-score-badge strong{min-width:28px;color:#9b3f17;font-size:23px;line-height:1;text-align:center}.customer-service-trigger{min-height:44px;display:inline-flex;align-items:center;gap:7px;padding:0 15px;border:2px solid var(--line-strong);background:linear-gradient(135deg,var(--mint),var(--pink));color:#17202d;box-shadow:4px 4px color-mix(in srgb,var(--line-strong) 52%,transparent);font-size:15px;font-weight:900}.customer-service-panel{width:min(310px,calc(100vw - 28px));display:grid;gap:13px;padding:16px;border:2px solid var(--line);border-radius:7px;background:var(--paper);color:var(--on-light);box-shadow:7px 7px color-mix(in srgb,var(--line-strong) 42%,transparent),0 14px 34px #10182838}.customer-service-panel header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.customer-service-panel header>div{display:grid;gap:2px}.customer-service-panel strong{font-size:21px}.customer-service-panel p{margin:0;color:var(--on-light-muted);line-height:1.6;font-weight:700}.customer-service-kicker{color:#b53d70;font-size:12px;font-weight:900}.customer-service-close{width:32px;min-height:32px;padding:0;box-shadow:none;color:var(--on-light)}.customer-service-xiaohongshu{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 12px;border:1px solid #8bcf96;border-radius:6px;background:#effbf0;color:#234c2a;font-size:13px;font-weight:900;line-height:1.45}.customer-service-xiaohongshu span{display:grid;gap:2px}.customer-service-xiaohongshu small{color:#45734d;font-size:12px}.customer-service-xiaohongshu button{flex:0 0 auto;min-height:34px;display:inline-flex;align-items:center;gap:5px;padding:0 9px;border-color:#72b37e;background:#fff;color:#234c2a;box-shadow:none;font-size:12px}.eyebrow{margin:0 0 6px;color:var(--pink);font-weight:800;text-transform:uppercase;font-size:13px}:root:not([data-theme=darkMacaron]) .eyebrow{color:var(--ink)}.range-note{margin:-8px 0 2px;color:var(--muted);font-size:15px;font-weight:800}nav,.button-row,.account-strip form,.account-strip,.theme-strip,.header-tools,.exercise-tabs,.sight-steps{display:flex;align-items:center;gap:10px;flex-wrap:wrap}nav button{font-size:17px}.exercise-tabs{align-items:stretch}.exercise-tabs button{flex:1 1 138px;min-height:46px;box-shadow:0 2px 0 var(--line-strong);font-weight:900}.exercise-tabs button.active{background:var(--butter)}.header-tools{gap:10px;margin-left:0}.theme-tool{min-height:42px;display:inline-flex;grid-template-columns:none;align-items:center;justify-content:center;gap:8px;padding:0 14px;border:1px solid var(--line);border-radius:6px;background:#f4fbff21;box-shadow:0 2px 0 var(--line-strong);font-size:16px;font-weight:800;line-height:1}.theme-tool select{width:138px;height:34px;padding:0 8px;font-size:16px;font-weight:800}.theme-tool input[type=file]{width:112px;height:auto;min-height:30px;padding:4px 6px;font-size:13px;font-weight:800}.tool-clear-button{min-height:42px;padding:0 14px;font-size:14px}.sight-steps button{flex:1 1 118px}.rhythm-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(104px,1fr));gap:10px}.rhythm-cell{border:2px solid var(--line);background:#fff0a621;padding:10px;text-align:center}.rhythm-cell strong,.rhythm-cell span{display:block}.rhythm-cell strong{font-size:18px}.rhythm-cell span{margin-top:4px;color:#d86f8f;font-weight:900}.sight-evaluator{display:grid;gap:12px;padding:14px;border:2px solid var(--line);background:#bfe9ff1a}.sight-evaluator-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.sight-record-button{min-height:58px;padding:0 26px;font-size:clamp(18px,2.4vw,28px);border-radius:10px;box-shadow:0 5px #8bded39e,0 0 22px #b9f5e83d}.sight-stop-button{min-height:52px;background:linear-gradient(135deg,#ffc4dc,#fff0a6);color:#111827;border-color:#d86f8f}.sight-record-button:disabled,.sight-stop-button:disabled,.sight-review-button:disabled{opacity:.42;cursor:not-allowed;box-shadow:none}.sight-audio-upload-button{display:inline-flex;align-items:center;gap:7px;min-height:52px;padding:0 18px;border:2px solid var(--line);background:color-mix(in srgb,var(--sky) 22%,var(--panel));color:var(--ink);font-weight:850;cursor:pointer}.sight-audio-upload-button input{display:none}.sight-review-button{min-height:52px;border-color:#f1a05a;background:#ffd2a6;color:#17202d}.assessment-limit{padding:10px 12px;border-left:4px solid var(--line);background:color-mix(in srgb,var(--sky) 14%,transparent);color:var(--muted)}.sight-recording-upload{display:grid;grid-template-columns:minmax(190px,auto) minmax(240px,1fr);gap:12px;align-items:center;padding:11px 13px;border:1px solid var(--line);background:color-mix(in srgb,var(--panel) 84%,transparent)}.sight-recording-upload>div{display:flex;align-items:center;gap:8px}.sight-recording-upload.uploaded{border-color:#55d9af}.sight-recording-upload.failed{border-color:#d86f8f}.sight-recording-upload audio{width:100%;min-width:0}.sight-recording-hint{margin:0;color:var(--muted);font-weight:700}.result-modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:90;display:grid;place-items:center;padding:18px;background:#07090f9e}.result-modal{width:min(860px,calc(100vw - 28px));max-height:min(82vh,760px);overflow:auto;display:grid;gap:14px;padding:22px;border:3px solid var(--line);background:var(--paper);color:#111827;box-shadow:10px 10px #8bded37a,0 22px 48px #00000057}.result-modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.result-modal h3,.result-modal p{margin:0}.result-modal button{background:#17202d14;color:var(--on-light);border-color:#17202d52;box-shadow:0 2px #17202d33}.result-modal button:hover{background:#17202d26;border-color:#17202d7a}.result-modal .sight-results{max-height:46vh;overflow:auto;padding-right:4px}.sight-results{display:grid;gap:8px}.sight-results p{margin:0}.sight-result-row{display:grid;grid-template-columns:minmax(92px,.75fr) minmax(160px,1fr) minmax(160px,1fr) minmax(150px,.9fr);gap:8px;align-items:center;padding:9px;border:1px solid #a9c8ce;background:#ffc4dc1a}.expression-feedback{display:grid;gap:6px;padding:12px;border:2px solid #9bd8cf;background:#9bd8cf2e}.expression-feedback ul{display:grid;gap:6px;margin:0;padding-left:20px}.expression-feedback li{line-height:1.55}.practice-mic-panel{display:grid;grid-template-columns:56px minmax(0,1fr);gap:12px;align-items:center;padding:12px;border:2px solid var(--line);background:#ffc4dc1a}.practice-mic-panel p{margin:4px 0 0;color:var(--muted);font-weight:800}.mic-round{width:52px;height:52px;padding:0;border-radius:999px;display:grid;place-items:center;background:var(--butter)}.mic-round.recording{background:#ff9fb4}.practice-mic-results{grid-column:1 / -1;display:grid;gap:8px}.practice-mic-result{display:grid;grid-template-columns:minmax(110px,.9fr) minmax(70px,.5fr) minmax(90px,.6fr);gap:8px;padding:8px 10px;border:1px solid #a9c8ce;background:#bfe9ff1a}.practice-mic-result.hit{border-color:var(--pitch-accurate-strong);background:var(--pitch-accurate)}.practice-mic-result.high{border-color:var(--pitch-high-strong);background:var(--pitch-high)}.practice-mic-result.low{border-color:var(--pitch-low-strong);background:var(--pitch-low)}.practice-mic-result.miss{background:#e2e8f0}.answer-placeholder{min-height:320px;display:grid;place-content:center;gap:8px;text-align:center;border:2px dashed #a9c8ce;background:#ffc4dc17;color:var(--muted)}.answer-placeholder strong{color:var(--ink);font-size:18px}.theory-search{margin:14px 0 18px}.theory-search input{max-width:620px}.theory-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}.theory-card{border:2px solid var(--line);background:#fffdf814;padding:16px;box-shadow:3px 3px #6e9ca357}.theory-card span{color:#d86f8f;font-size:12px;font-weight:900}.theory-card h3{margin:8px 0}.theory-card p{margin:0;line-height:1.55}.account-strip{margin-top:0;padding:8px 12px;justify-content:flex-end}.theme-strip{margin-top:10px;padding:8px 12px;align-items:center;justify-content:flex-end;gap:8px}.theme-strip label{min-width:132px;max-width:190px;font-size:12px;gap:3px}.theme-strip input[type=file]{height:auto;min-height:28px;max-width:118px;padding:4px 6px;font-size:11px}.account-strip form{width:100%;justify-content:flex-end}.account-strip input,.account-strip select{max-width:210px;height:34px}.account-strip button,.theme-strip button{min-height:34px;padding:0 10px}.workspace{margin-top:18px;padding:22px}.two-column{display:grid;grid-template-columns:minmax(300px,.75fr) minmax(620px,1.25fr);gap:20px;align-items:start}.chord-workspace{grid-template-columns:minmax(480px,1.05fr) minmax(380px,.95fr);grid-template-areas:"playbar playbar" "score controls" "keyboard keyboard";gap:14px 18px;align-items:stretch}.chord-practice-grid{grid-template-columns:minmax(480px,1.05fr) minmax(380px,.95fr);grid-template-areas:"score controls" "keyboard keyboard";gap:14px 18px;align-items:stretch}.chord-workspace .chord-playbar,.chord-practice-workspace .chord-playbar{grid-area:playbar}.chord-workspace .control-panel,.chord-practice-grid .control-panel{grid-area:controls}.chord-workspace .score-panel,.chord-practice-grid .score-panel{grid-area:score}.chord-workspace .wide-chord-keyboard,.chord-practice-grid .wide-chord-keyboard{grid-area:keyboard}.chord-playbar{display:grid;grid-template-columns:minmax(220px,1fr) auto;align-items:center;gap:8px 14px}.chord-playbar .eyebrow,.chord-playbar h2,.chord-playbar .range-note{margin:0}.chord-playbar .range-note{grid-column:1}.chord-playbar button{grid-row:1 / span 3;grid-column:2}.chord-workspace .control-panel,.chord-practice-grid .control-panel,.chord-workspace .score-panel,.chord-practice-grid .score-panel{gap:12px;overflow-x:visible;padding-bottom:0}.chord-workspace .control-panel,.chord-practice-grid .control-panel{align-content:start}.chord-workspace .exercise-tabs,.chord-practice-grid .exercise-tabs{display:flex;align-items:stretch;gap:7px;flex-wrap:wrap;overflow:visible;padding-bottom:0}.chord-workspace .exercise-tabs button,.chord-practice-grid .exercise-tabs button{flex:1 1 112px;min-width:112px;min-height:40px;padding:7px 11px;font-size:clamp(16px,1.35vw,18px);white-space:nowrap;overflow:visible}.chord-workspace .field-grid,.chord-practice-grid .field-grid{grid-template-columns:repeat(auto-fit,minmax(104px,1fr));gap:8px}.chord-workspace label,.chord-practice-grid label{gap:4px;font-size:clamp(16px,1.25vw,18px)}.chord-workspace select,.chord-practice-grid select{height:46px;font-size:clamp(17px,1.35vw,19px)}.chord-workspace button.primary,.chord-practice-grid button.primary{min-height:40px}.chord-workspace .note-list{gap:6px}.chord-workspace .note-list span{min-width:44px;padding:6px 8px;font-size:16px}.chord-workspace .score-panel,.chord-practice-grid .score-panel{justify-items:stretch}.chord-workspace .staff-interpretation,.chord-practice-grid .staff-interpretation{width:min(100%,940px);justify-self:center;gap:6px}.chord-workspace .staff-interpretation svg,.chord-practice-grid .staff-interpretation svg{max-height:250px}.chord-workspace .wide-chord-keyboard,.chord-practice-grid .wide-chord-keyboard{margin-top:0}.control-panel,.score-panel{display:grid;gap:18px;align-content:start;overflow-x:auto;padding-bottom:4px}.wide-chord-keyboard{grid-column:1 / -1;width:100%;min-width:0}.wide-chord-keyboard .keyboard-shell{padding:clamp(10px,1.2vw,16px) clamp(10px,1.4vw,18px) clamp(14px,1.8vw,24px)}.wide-chord-keyboard .keyboard{height:clamp(168px,18vw,230px)}.wide-chord-keyboard .piano-key.white{padding-bottom:clamp(15px,1.6vw,24px);font-size:clamp(9px,1vw,13px)}.wide-chord-keyboard .piano-key.black{height:63%}.staff-interpretation{display:grid;gap:8px}.interpretation-label{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:8px 12px;border:1px solid var(--line);border-radius:8px;background:color-mix(in srgb,var(--panel) 78%,var(--paper));color:var(--ink);font-size:17px;font-weight:900}.interpretation-label span{flex:0 0 auto;padding:4px 9px;border-radius:999px;background:linear-gradient(135deg,#fff0a6,#b9f5e8);color:#111827;font-size:12px}.enharmonic-interpretation{padding:10px 12px 12px;border:2px dashed color-mix(in srgb,var(--line-strong) 76%,var(--line));border-radius:10px;background:color-mix(in srgb,var(--panel) 86%,transparent)}.sight-workspace{display:grid;gap:12px}.five-note-workspace{display:grid;gap:14px}.five-note-toolbar,.five-note-monitor{border:2px solid var(--line);background:var(--panel);padding:16px}.five-note-toolbar{display:grid;gap:14px}.five-note-toolbar h2,.five-note-toolbar p{margin:0}.five-note-levels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.five-note-levels button{min-height:64px;display:grid;align-content:center;gap:2px;text-align:left}.five-note-levels button span{color:var(--muted);font-size:12px;font-weight:800}.five-note-levels button.active span{color:var(--on-light-muted)}.five-note-actions{justify-content:flex-start}.five-note-monitor{display:grid;gap:14px;background:color-mix(in srgb,var(--panel) 90%,var(--sky))}.five-note-monitor-head{display:flex;align-items:center;justify-content:space-between;gap:16px}.five-note-monitor-head>div:first-child{display:grid;gap:3px}.five-note-monitor-head p,.five-note-monitor-head strong,.five-note-monitor-head span{margin:0}.five-note-monitor-head span{color:var(--muted);font-size:13px}.five-note-progress{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.five-note-step{min-height:82px;display:grid;place-items:center;align-content:center;gap:3px;padding:8px;border:2px solid var(--line);background:color-mix(in srgb,var(--paper) 7%,transparent);text-align:center;transition:transform .12s ease,background .12s ease,border-color .12s ease}.five-note-step>span{display:grid;place-items:center;width:24px;height:24px;border:1px solid var(--line);border-radius:50%;font-weight:950}.five-note-step small{color:var(--muted);font-weight:800}.five-note-step.active{transform:translateY(-3px);border-color:#f1a05a;box-shadow:0 5px color-mix(in srgb,#f1a05a 40%,transparent)}.five-note-step.hit{border-color:var(--pitch-accurate-strong);background:var(--pitch-accurate)}.five-note-step.near{background:var(--pitch-near)}.five-note-step.high{border-color:var(--pitch-high-strong);background:var(--pitch-high)}.five-note-step.low{border-color:var(--pitch-low-strong);background:var(--pitch-low)}.five-note-score{min-height:250px}.five-note-answer-placeholder{min-height:230px;display:grid;place-items:center;align-content:center;gap:8px;border:2px dashed var(--line);color:var(--muted);text-align:center}.five-note-answer-placeholder strong{color:var(--ink);font-size:20px}.five-note-keyboard .keyboard{height:clamp(160px,18vw,220px)}.familiar-sight-workspace{display:grid;gap:16px}.sight-submission-panel,.sight-submission-step{display:grid;gap:12px}.sight-submission-panel{padding:16px;border:2px solid var(--line);background:color-mix(in srgb,var(--panel) 88%,var(--sky))}.submission-media-preview{display:grid;gap:9px;padding:12px;border:1px solid var(--line);background:color-mix(in srgb,var(--paper) 7%,transparent)}.submission-media-preview video,.submission-file-links video{width:min(100%,680px);max-height:420px;background:#111}.submission-media-preview audio,.submission-file-links audio{width:min(100%,680px)}.submission-note{display:grid;gap:7px;font-weight:900}.submission-note textarea{width:100%;min-height:92px;resize:vertical;padding:10px;border:1px solid var(--line);background:color-mix(in srgb,var(--paper) 88%,transparent);color:var(--on-light);font:inherit}.sight-submit-button{width:fit-content}.upload-limit-note,.upload-flow-steps{display:grid;gap:10px}.upload-limit-note{grid-template-columns:repeat(3,minmax(0,1fr))}.upload-limit-note span{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:6px 9px;border:1px solid var(--line);background:color-mix(in srgb,var(--paper) 78%,var(--mint));color:var(--on-light);font-size:13px;font-weight:900}.upload-flow-steps{grid-template-columns:repeat(3,minmax(0,1fr))}.upload-flow-steps article{display:grid;gap:7px;min-height:104px;padding:13px;border:1px solid var(--line);background:color-mix(in srgb,var(--paper) 82%,transparent)}.upload-flow-steps article.active{border-color:color-mix(in srgb,var(--accent) 55%,var(--line));background:color-mix(in srgb,var(--mint) 22%,var(--paper))}.upload-flow-steps strong{color:var(--on-light)}.upload-flow-steps span{color:var(--muted);font-weight:750;line-height:1.5}.submission-upload-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.wechat-assessment-panel{gap:16px}.assessment-wechat-card{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px;border:2px solid color-mix(in srgb,var(--accent) 35%,var(--line));background:color-mix(in srgb,var(--paper) 92%,var(--mint))}.assessment-wechat-card>div{display:grid;gap:5px}.assessment-wechat-card span,.assessment-wechat-card small{color:var(--muted);font-weight:800}.assessment-wechat-card strong{color:var(--on-light);font-size:clamp(1.25rem,4vw,1.85rem);font-weight:950}.assessment-wechat-card button{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border:2px solid var(--line);background:var(--accent);color:var(--accent-ink);font-weight:950}.wechat-assessment-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.wechat-assessment-steps article{display:grid;gap:8px;padding:14px;border:1px solid var(--line);background:color-mix(in srgb,var(--paper) 84%,transparent)}.wechat-assessment-steps strong{color:var(--on-light);font-size:1rem}.wechat-assessment-steps span{color:var(--muted);font-weight:750;line-height:1.55}.wechat-assessment-preview{min-height:210px}.submission-status{margin:0;color:var(--ink);font-weight:900}.admin-submission-heading{margin-top:28px;padding-top:20px;border-top:2px solid var(--line)}.admin-submission-list{display:grid;gap:12px}.admin-submission-card{display:grid;grid-template-columns:minmax(190px,.4fr) minmax(280px,1fr);gap:16px;padding:14px;border:2px solid var(--line);background:color-mix(in srgb,var(--panel) 88%,var(--sky))}.admin-submission-card>div:first-child,.submission-file-links{display:grid;gap:8px;align-content:start}.admin-submission-card span{color:var(--muted)}.assessment-type-badge{width:fit-content;display:inline-flex;align-items:center;min-height:26px;padding:3px 9px;border:1px solid #79cfc5;border-radius:999px;background:#e9fbf7;color:#184c4b!important;font-size:12px;font-weight:900}.assessment-type-badge.vocal{border-color:#e09abb;background:#fff0f7;color:#7c3154!important}.admin-comment-editor{display:grid;gap:7px;margin-top:8px;font-weight:900}.admin-comment-editor textarea{width:100%;min-height:110px;resize:vertical;padding:10px;border:1px solid var(--line);background:color-mix(in srgb,var(--paper) 90%,transparent);color:var(--on-light);font:inherit}.student-feedback-panel{display:grid;gap:14px;padding:16px;border:2px solid var(--line);background:color-mix(in srgb,var(--panel) 88%,var(--lavender))}.admin-work-actions{justify-content:start;margin-top:4px}.student-feedback-list{display:grid;gap:10px}.student-feedback-card{display:grid;gap:10px;padding:13px;border:1px solid var(--line);background:color-mix(in srgb,var(--panel) 92%,transparent)}.student-feedback-card>div:first-child{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}.student-feedback-card span{color:var(--muted)}.student-feedback-card.reviewed{border-color:var(--pitch-accurate-strong)}.admin-comment{padding:12px;border-left:5px solid var(--pitch-accurate-strong);background:color-mix(in srgb,var(--pitch-accurate) 42%,var(--panel))}.admin-comment p{margin:6px 0;white-space:pre-wrap}.submission-file-links a{color:var(--ink);font-weight:900;overflow-wrap:anywhere}.realtime-assessment{display:grid;gap:16px;padding:16px;border:2px solid var(--line);background:color-mix(in srgb,var(--panel) 88%,var(--sky))}.realtime-assessment-head{display:flex;align-items:center;justify-content:space-between;gap:16px}.realtime-assessment-head h2,.realtime-assessment-head p{margin:0}.realtime-pitch-display{display:grid;grid-template-columns:minmax(130px,.4fr) minmax(240px,1fr) minmax(120px,.35fr);gap:16px;align-items:center;min-height:170px;padding:18px;border:2px solid var(--line);background:color-mix(in srgb,var(--paper) 8%,transparent)}.realtime-note,.realtime-status{display:grid;gap:4px;text-align:center}.realtime-note span{color:var(--muted);font-weight:900}.realtime-note strong{font-size:clamp(34px,7vw,70px);line-height:1}.realtime-note small,.realtime-status span{color:var(--muted);font-variant-numeric:tabular-nums}.realtime-status strong{font-size:clamp(24px,4vw,38px)}.realtime-meter{position:relative;height:72px;border:1px solid var(--line);background:linear-gradient(90deg,color-mix(in srgb,var(--pink) 34%,transparent),color-mix(in srgb,var(--mint) 34%,transparent) 50%,color-mix(in srgb,var(--pink) 34%,transparent))}.realtime-meter-center,.realtime-meter-needle{position:absolute;top:8px;bottom:8px;width:3px;transform:translate(-50%)}.realtime-meter-center{left:50%;background:var(--line-strong)}.realtime-meter-needle{background:#f1a05a;box-shadow:0 0 0 3px color-mix(in srgb,#f1a05a 24%,transparent);transition:left .1s linear}.realtime-target-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(76px,1fr));gap:7px}.realtime-target-list>div{min-height:48px;display:flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--line);background:color-mix(in srgb,var(--paper) 7%,transparent)}.realtime-target-list>div.active{border:2px solid #f1a05a;transform:translateY(-2px)}.realtime-target-list>div.complete{background:color-mix(in srgb,var(--mint) 46%,var(--panel))}.realtime-assessment.accurate .realtime-pitch-display{border-color:var(--pitch-accurate-strong);background:var(--pitch-accurate)}.realtime-assessment.accurate .realtime-meter-needle{background:var(--pitch-accurate-strong)}.realtime-assessment.accurate .realtime-status strong{color:var(--pitch-accurate-strong)}.realtime-assessment.high .realtime-pitch-display{border-color:var(--pitch-high-strong);background:var(--pitch-high)}.realtime-assessment.high .realtime-meter-needle{background:var(--pitch-high-strong)}.realtime-assessment.high .realtime-status strong{color:var(--pitch-high-strong)}.realtime-assessment.low .realtime-pitch-display{border-color:var(--pitch-low-strong);background:var(--pitch-low)}.realtime-assessment.low .realtime-meter-needle{background:var(--pitch-low-strong)}.realtime-assessment.low .realtime-status strong{color:var(--pitch-low-strong)}.sight-score-top{gap:14px}.sight-score-middle{gap:10px}.familiar-upload-panel{display:grid;gap:12px;padding:16px;border:2px solid var(--line);background:#bfe9ff1a}.score-upload-button{width:fit-content;min-height:46px;display:inline-flex;align-items:center;justify-content:center;padding:0 18px;border:1px solid var(--line);border-radius:8px;background:linear-gradient(135deg,#8bded3e6,#ffc4dcdb);color:#111827;font-weight:900;cursor:pointer;box-shadow:0 4px 0 var(--line-strong)}.score-upload-button input{display:none}.score-midi-button{justify-self:start}.score-midi-button:disabled{opacity:.48;cursor:not-allowed}.upload-status{display:grid;gap:4px;padding:10px 12px;border:1px solid var(--line);background:#fffdf81a}.upload-status.ready{background:#b9f5e838}.upload-status.previewOnly{background:#fff0a633}.upload-status.error{background:#ff9fb433}.score-preview-panel{min-height:420px;display:grid;gap:12px}.score-preview-panel img,.score-preview-panel object{width:100%;min-height:420px;max-height:72vh;object-fit:contain;border:2px solid var(--line);background:var(--paper)}.sight-control-panel{grid-template-columns:minmax(220px,.9fr) minmax(260px,1.1fr) auto;align-items:end}.sight-control-top{display:grid;grid-template-columns:minmax(260px,1.2fr) minmax(320px,1fr) auto;gap:12px;align-items:end;overflow-x:visible}.sight-title-block{display:grid;gap:4px}.sight-title-block h2,.sight-title-block p{margin:0}.sight-select-row{display:grid;grid-template-columns:repeat(2,minmax(150px,1fr));gap:10px}.sight-button-row{align-self:stretch;align-items:end}.sight-control-top .sight-evaluator{grid-column:1 / span 2;padding:10px 12px}.sight-keyboard-bottom .keyboard{height:clamp(150px,14vw,190px)}.sight-control-panel .eyebrow,.sight-control-panel h2,.sight-control-panel .range-note{grid-column:1 / -1}.sight-control-top .eyebrow,.sight-control-top h2,.sight-control-top .range-note{grid-column:auto}.field-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.root-stepper{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;align-self:end}.root-stepper button{min-height:46px;padding:8px 12px;font-size:clamp(16px,1.25vw,18px)}.root-stepper button:disabled{cursor:not-allowed;opacity:.45}label{display:grid;gap:6px;font-size:16px;font-weight:800}.note-list{display:flex;flex-wrap:wrap;gap:8px}.note-list span{min-width:54px;padding:8px 10px;border:1px solid var(--line);background:var(--lime);text-align:center;font-weight:800;font-size:18px}.staff{width:100%;height:auto;aspect-ratio:1120 / 260;min-height:0;display:block;background:#ffc4dc1a}.chord-staff{width:min(100%,940px);justify-self:center;aspect-ratio:1120 / 260}.sight-staff{aspect-ratio:1840 / 530}.sight-staff.three-voice{aspect-ratio:1840 / 1010}.grand-staff{width:min(100%,980px);justify-self:center;aspect-ratio:1120 / 340}.staff .paper{fill:#fffef8;stroke:#c9c1b1;stroke-width:1}.staff .staff-line,.staff .ledger,.staff .barline{stroke:#151515;stroke-linecap:square}.staff .staff-line{stroke-width:1.35}.staff .ledger,.staff .barline{stroke-width:1.55}.staff .heavy-barline{stroke-width:3.6}.staff .margin-line{stroke:#d4b0a4;stroke-width:1}.clef{fill:#111;font-family:Georgia,serif;font-size:116px}.chord-clef{font-family:Bravura,Noto Music,Apple Symbols,Segoe UI Symbol,Georgia,serif;font-size:114px}.sight-clef{font-size:114px}.printed-treble-clef{fill:#111;font-family:Bravura,Noto Music,Apple Symbols,Segoe UI Symbol,Times New Roman,serif;font-size:114px;font-weight:400}.grand-clef{font-size:114px}.bass-clef-vector,.bass-clef-curve{fill:#111}.grand-brace{fill:none;stroke:#111;stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}.grand-staff-join{stroke-width:2.2}.grand-staff-placeholder{fill:#6a625a;font-size:22px;font-weight:900;text-anchor:middle}.time-signature text{fill:#111;font-family:Georgia,serif;font-size:42px;font-weight:800;text-anchor:middle}.key-signature-label{fill:#303030;font-size:24px;font-weight:900}.key-signature-glyph{fill:#111;font-family:Georgia,serif;font-size:34px;font-weight:900}.staff-brace{fill:#111;font-family:Georgia,Times New Roman,serif;font-size:235px;font-weight:400}.sight-note.voice-2,.note-beam.voice-2{opacity:.72}.sight-note.voice-3,.note-beam.voice-3{opacity:.55}.note-head{fill:#111;stroke:#111;stroke-width:1}.whole-note-head{fill:none;stroke:#111;stroke-width:3}.staff .chord-solfege-label{font-size:24px;text-anchor:middle}.grand-note-label{font-size:16px;text-anchor:middle}.note-stem,.note-flag,.note-beam,.phrase-slur,.tie-slur,.syncopation-mark{fill:none;stroke:#111;stroke-linecap:round}.note-stem{stroke-width:2.4}.note-flag{stroke-width:3}.note-beam{stroke-width:7;stroke-linecap:butt}.phrase-slur{stroke-width:2.2}.tie-slur{stroke-width:2}.rhythm-dot{fill:#111}.syncopation-mark{stroke-width:2}.sight-staff .note-label{font-size:12px;font-weight:900}.accidental,.note-label{fill:#111;font-weight:900}.accidental{font-family:Bravura,Noto Music,Apple Symbols,Segoe UI Symbol,Georgia,serif;font-size:32px;text-anchor:end}.accidental.sharp{font-size:34px}.accidental.flat{font-size:38px}.accidental.double-flat{font-family:Bravura,Noto Music,Apple Symbols,Segoe UI Symbol,Georgia,serif;font-size:38px;font-weight:900}.accidental-vector{fill:#111}.double-sharp-vector{shape-rendering:geometricPrecision}.score-library{position:relative}.score-library-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:18px}.score-library-head h2{margin:2px 0 5px}.score-library-head p:last-child,.score-library-summary{color:var(--muted)}.score-library-actions,.score-card-buttons,.score-view-toggle{display:flex;align-items:center;gap:8px}.score-library-actions button,.score-dialog footer button,.score-book-create button,.score-backup-action{min-height:42px;display:inline-flex;align-items:center;justify-content:center;gap:7px;border-color:color-mix(in srgb,var(--line) 72%,transparent)}.score-category-nav{display:flex;gap:5px;overflow-x:auto;padding:5px 0 11px;border-bottom:1px solid color-mix(in srgb,var(--line) 52%,transparent);scrollbar-width:thin}.score-category-nav button{flex:0 0 auto;min-height:38px;padding:7px 13px;border:1px solid transparent;background:transparent;color:var(--muted);box-shadow:none}.score-category-nav button.active{border-color:var(--line-strong);background:color-mix(in srgb,var(--panel) 70%,var(--mint));color:var(--ink)}.score-library-toolbar{display:grid;grid-template-columns:minmax(240px,1fr) repeat(4,minmax(118px,auto));gap:9px;margin:15px 0 10px}.score-library-toolbar select,.score-search{min-height:44px;border:1px solid color-mix(in srgb,var(--line) 70%,transparent);background:color-mix(in srgb,var(--panel) 92%,transparent);color:var(--ink)}.score-search{display:flex;align-items:center;gap:9px;padding:0 13px;border-radius:7px}.score-search input{width:100%;min-width:0;padding:0;border:0;background:transparent;color:var(--ink);box-shadow:none}.score-library-toolbar select{padding:0 28px 0 11px}.score-library-summary{min-height:38px;display:flex;align-items:center;gap:18px;font-size:13px}.score-library-summary strong{color:var(--ink)}.score-view-toggle{margin-left:auto}.score-view-toggle button,.score-card-buttons button{width:36px;height:34px;padding:0;display:grid;place-items:center;background:color-mix(in srgb,var(--panel) 88%,transparent);color:var(--muted)}.score-view-toggle button.active{color:var(--ink);border-color:var(--line-strong);background:color-mix(in srgb,var(--sky) 34%,var(--panel))}.score-card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(218px,1fr));gap:14px}.score-card-grid.list{grid-template-columns:1fr}.score-card{min-width:0;overflow:hidden;border:1px solid color-mix(in srgb,var(--line) 64%,transparent);border-radius:7px;background:color-mix(in srgb,var(--panel) 94%,transparent);box-shadow:0 9px 20px color-mix(in srgb,#000 12%,transparent)}.score-card-grid.list .score-card{display:grid;grid-template-columns:170px 1fr}.score-thumbnail{position:relative;aspect-ratio:4 / 3;display:grid;place-items:center;gap:6px;overflow:hidden;border-bottom:1px solid color-mix(in srgb,var(--line) 55%,transparent);background:linear-gradient(color-mix(in srgb,var(--line) 18%,transparent) 1px,transparent 1px) 0 30% / 100% 16px,color-mix(in srgb,var(--paper) 90%,var(--panel));color:var(--on-light)}.score-thumbnail img{width:100%;height:100%;object-fit:cover}.score-thumbnail span{font-size:12px;font-weight:800}.score-card-grid.list .score-thumbnail{height:100%;aspect-ratio:auto;border-right:1px solid color-mix(in srgb,var(--line) 55%,transparent);border-bottom:0}.score-card-body{padding:13px}.score-card-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:9px}.score-card-heading h3{min-width:0;margin:0;font-size:17px;line-height:1.35;overflow-wrap:anywhere}.score-card-heading>span,.score-card-tags span{flex:0 0 auto;padding:3px 7px;border:1px solid color-mix(in srgb,var(--line) 72%,transparent);border-radius:999px;color:var(--muted);font-size:11px;font-weight:800}.score-card-body>p{min-height:34px;margin:7px 0;color:var(--muted);font-size:13px}.score-card-tags{display:flex;gap:5px;flex-wrap:wrap}.score-card-buttons{justify-content:flex-end;margin-top:13px;padding-top:10px;border-top:1px solid color-mix(in srgb,var(--line) 40%,transparent)}.score-card-buttons button:hover{color:var(--ink);border-color:var(--line-strong)}.score-library-empty{min-height:310px;display:grid;place-items:center;align-content:center;gap:8px;text-align:center;border:1px dashed color-mix(in srgb,var(--line) 78%,transparent);background:color-mix(in srgb,var(--panel) 82%,transparent)}.score-library-empty h3,.score-library-empty p{margin:0}.score-library-empty p{color:var(--muted)}.score-library-empty button{margin-top:9px}.score-dialog-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:180;display:grid;place-items:center;padding:18px;background:#04070cad;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.score-dialog{width:min(760px,100%);max-height:min(820px,calc(100dvh - 36px));display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--line-strong);border-radius:8px;background:color-mix(in srgb,var(--panel) 97%,var(--soft));color:var(--ink);box-shadow:0 25px 80px #00000059}.score-dialog>header,.score-dialog>footer{position:sticky;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 17px;background:color-mix(in srgb,var(--panel) 98%,transparent)}.score-dialog>header{top:0;border-bottom:1px solid color-mix(in srgb,var(--line) 58%,transparent)}.score-dialog>footer{bottom:0;justify-content:flex-end;border-top:1px solid color-mix(in srgb,var(--line) 58%,transparent)}.score-dialog header span{color:var(--muted);font-size:11px;font-weight:900}.score-dialog header h3{margin:2px 0 0}.score-dialog header>button{width:38px;height:38px;padding:0;display:grid;place-items:center}.score-dialog-body{min-height:0;overflow-y:auto;padding:17px}.score-file-picker{width:100%;min-height:112px;display:grid;place-items:center;align-content:center;gap:5px;border:1px dashed var(--line-strong);background:color-mix(in srgb,var(--panel) 78%,var(--sky));color:var(--ink)}.score-file-picker span{color:var(--muted);font-size:12px}.score-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:15px}.score-form-grid label{min-width:0;display:grid;gap:6px;color:var(--muted);font-size:12px;font-weight:900}.score-form-grid .wide{grid-column:1 / -1}.score-form-grid input,.score-form-grid select,.score-book-create input{width:100%;min-width:0;min-height:42px;border:1px solid color-mix(in srgb,var(--line) 72%,transparent);background:color-mix(in srgb,var(--panel) 88%,var(--soft));color:var(--ink)}.score-detail-dialog{width:min(820px,100%)}.score-detail-layout{min-height:0;overflow-y:auto}.score-detail-layout{display:grid;grid-template-columns:minmax(250px,.95fr) minmax(260px,1.05fr);gap:18px;padding:18px}.score-thumbnail.detail{aspect-ratio:4 / 3;border:1px solid color-mix(in srgb,var(--line) 60%,transparent)}.score-detail-layout dl{margin:0}.score-detail-layout dl div{display:grid;grid-template-columns:92px 1fr;gap:10px;padding:10px 0;border-bottom:1px solid color-mix(in srgb,var(--line) 42%,transparent)}.score-detail-layout dt{color:var(--muted);font-size:12px;font-weight:900}.score-detail-layout dd{margin:0;overflow-wrap:anywhere}.score-dialog footer .danger{margin-right:auto;color:var(--pitch-high-strong)}.score-book-create{display:grid;grid-template-columns:1fr auto;gap:9px}.score-book-list{display:grid;gap:8px;margin-top:15px}.score-book-list article{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;border:1px solid color-mix(in srgb,var(--line) 60%,transparent);background:color-mix(in srgb,var(--panel) 86%,var(--butter))}.score-book-list article div{display:grid;gap:3px}.score-book-list article span,.score-book-list>p{color:var(--muted);font-size:12px}.score-book-list article button{width:36px;height:36px;padding:0;display:grid;place-items:center}.score-backup-dialog{width:min(500px,100%)}.score-backup-dialog p{margin-top:0;color:var(--muted)}.score-backup-action{width:100%;margin:6px 0}.score-backup-check{display:flex;align-items:center;gap:8px;margin:12px 0}.score-backup-check input{width:20px;height:20px}.score-library-toast{position:fixed;left:50%;bottom:28px;z-index:220;transform:translate(-50%);max-width:min(420px,calc(100vw - 28px));padding:11px 16px;border:1px solid var(--line-strong);border-radius:7px;background:var(--panel);color:var(--ink);box-shadow:0 14px 38px #00000047;font-weight:800;text-align:center}@media(max-width:900px){.score-library-toolbar{grid-template-columns:repeat(2,minmax(0,1fr))}.score-search{grid-column:1 / -1}}@media(max-width:640px){.score-library-head{align-items:stretch;flex-direction:column}.score-library-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.score-library-actions button{padding-inline:7px;font-size:12px}.score-library-toolbar{grid-template-columns:repeat(2,minmax(0,1fr))}.score-library-summary{align-items:flex-start;flex-wrap:wrap;gap:6px 12px}.score-view-toggle{margin-left:auto}.score-card-grid,.score-card-grid.list{grid-template-columns:1fr}.score-card-grid.list .score-card{grid-template-columns:118px 1fr}.score-form-grid,.score-detail-layout{grid-template-columns:1fr}.score-form-grid .wide{grid-column:auto}.score-dialog-backdrop{align-items:end;padding:0}.score-dialog{max-height:92dvh;border-radius:8px 8px 0 0}}.note-label{font-size:15px}.keyboard-shell{padding:11px 12px 14px;border:1px solid #8fb9c1;background:linear-gradient(180deg,#f5fbfc,#dcebed 72%,#c7d9dc);box-shadow:inset 0 1px #ffffffe6,inset 0 -4px 6px #42636a1f,0 6px 14px #1a363e33}.chord-keyboard-scroll{width:100%;overflow:visible;padding:0}.keyboard-shell.chord-range{width:100%;min-width:0}.keyboard-shell.full{min-width:2780px;padding:12px 14px 16px}.full-keyboard-scroll{width:100%;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;padding-bottom:10px}.keyboard{position:relative;height:clamp(128px,15vw,168px);border:1px solid #0f1418;background:linear-gradient(180deg,#252b30,#111518);overflow:visible;box-shadow:inset 0 4px 5px #ffffff12,inset 0 -4px 5px #0000006b,0 6px 9px #0000003d;-webkit-touch-callout:none!important;-webkit-user-select:none!important;user-select:none!important}.keyboard *{-webkit-touch-callout:none!important;-webkit-user-select:none!important;user-select:none!important}.keyboard:before{content:none}.keyboard.full-size{height:clamp(180px,26vw,260px)}.white-keys{display:grid;grid-template-columns:repeat(var(--white-count),minmax(0,1fr));height:100%;gap:1px;background:#191919}.black-keys{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.piano-key{position:relative;display:flex;align-items:flex-end;justify-content:center;min-width:0;cursor:pointer;touch-action:manipulation;transition:transform 90ms ease,background .12s ease,color .12s ease,box-shadow .12s ease}.piano-key.white{height:100%;background:linear-gradient(180deg,#fff,#fff 69%,#edf1f4 88%,#d7dee4),linear-gradient(90deg,#e8edf1,#fff 16%,#fff 80%,#e1e7eb);color:#333;padding-bottom:17px;font-size:11px;border:1px solid #aeb7c0;border-top:0;box-shadow:inset 0 -11px 10px #5c6c7926,inset 1px 0 #fffffff2,inset -1px 0 #5f6c7833,1px 4px 4px #0000002e}.piano-key.white:before{content:none}.piano-key.white:after{content:none}.full-size .piano-key.white{font-size:12px;padding-bottom:20px}.middle-c-label{color:#d86f8f;font-weight:900;line-height:1.1;max-width:100%;text-align:center}.piano-key.black{position:absolute;left:calc((var(--white-before) / var(--white-count)) * 100% - (100% / var(--white-count)) * .32);width:calc((100% / var(--white-count)) * .64);height:62%;background:linear-gradient(180deg,#3b3f43,#24272a 18%,#101214 72%,#050606),linear-gradient(90deg,#070809,#34383b 30%,#17191b 70%,#050606);z-index:2;border:1px solid #050505;border-radius:0 0 3px 3px;box-shadow:inset 0 -10px 7px #000000b8,inset 0 3px 2px #ffffff21,inset 2px 0 2px #ffffff1f,2px 6px 6px #0006;pointer-events:auto}.piano-key.black:before{content:none}.piano-key.black:after{content:none}.piano-workspace{display:grid;gap:14px}.piano-option-row{display:flex;align-items:end;justify-content:flex-end;flex-wrap:wrap;gap:10px}.piano-sound-control{display:grid;gap:4px;color:var(--ink);font-size:16px;font-weight:900}.piano-sound-control select{min-height:36px;padding:6px 32px 6px 10px;border-color:var(--line);background-color:color-mix(in srgb,var(--paper) 88%,transparent);color:var(--on-light);font-size:17px}.inline-instrument-control{min-width:150px;align-self:center}.inline-instrument-control span{font-size:13px;line-height:1}.inline-instrument-control select{min-height:40px;font-size:15px}.sustain-toggle{display:inline-flex;align-items:center;gap:7px;min-height:30px;padding:4px 10px;border:1px solid rgba(17,24,39,.18);border-radius:999px;background:#ffffff8f;color:#111827;font-size:13px;font-weight:900;line-height:1;cursor:pointer;-webkit-user-select:none;user-select:none;box-shadow:inset 0 1px #ffffff94}.sustain-toggle input{width:16px;height:16px;margin:0;accent-color:#53bfb2}.sustain-toggle-page{color:var(--on-light);background:color-mix(in srgb,var(--paper) 78%,transparent);border-color:var(--line)}.practice-arpeggio-toggle{min-height:42px;color:var(--on-light);background:color-mix(in srgb,var(--paper) 78%,transparent);border-color:var(--line)}.practice-range-panel{display:grid;gap:9px;padding:12px;border:1px solid var(--line);background:color-mix(in srgb,var(--panel) 84%,transparent)}.practice-range-title{display:flex;justify-content:space-between;gap:12px;color:var(--ink)}.practice-range-title span{color:var(--muted);font-size:14px;font-weight:900}.compact-range-panel{padding:9px 11px}.compact-range-panel summary{align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none}.compact-range-panel summary::marker{color:var(--line-strong)}.compact-range-panel:not([open]){gap:0}.compact-range-panel:not([open]) .range-selection-summary,.compact-range-panel:not([open]) .practice-range-options{display:none}.range-selection-summary{margin:2px 0 0;color:var(--muted);font-size:13px;font-weight:800;line-height:1.45}.compact-range-panel .practice-range-options{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.compact-range-panel .practice-range-options label{min-height:31px;padding:4px 6px;font-size:14px}.practice-range-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.practice-range-options label{min-height:36px;display:flex;align-items:center;gap:7px;padding:6px 8px;border:1px solid color-mix(in srgb,var(--line) 68%,transparent);background:color-mix(in srgb,var(--paper) 58%,transparent);color:var(--on-light);font-size:16px;font-weight:900}.practice-range-options input{width:17px;height:17px;margin:0;accent-color:#53bfb2}.floating-piano{position:fixed;left:0;top:0;z-index:60;width:min(1180px,calc(100vw - 18px));border:2px solid var(--line);background:#111824f5;box-shadow:7px 7px #6e9ca36b;touch-action:none}.floating-piano-handle{min-height:38px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 12px;background:linear-gradient(90deg,#8bded3,#ffc7dd);color:#111827;font-weight:900;cursor:grab;-webkit-user-select:none;user-select:none;touch-action:none}.floating-piano-handle:active{cursor:grabbing}.floating-piano .full-keyboard-scroll{padding-bottom:0;touch-action:pan-x}.floating-piano .keyboard-shell.full{padding:12px 14px 16px}.floating-piano .keyboard.full-size{height:clamp(180px,26vw,260px)}.drag-hint{font-size:12px;opacity:.78}.floating-piano-actions{display:inline-flex;align-items:center;gap:10px}.floating-piano-actions button{min-height:28px;padding:0 10px;box-shadow:none;border-color:var(--paper)}.floating-piano-toggle{position:fixed;right:18px;bottom:18px;z-index:61;min-height:44px;background:linear-gradient(135deg,#8bded3,#ffc7dd);color:#111827;border-color:#5daea4}.piano-key.white.active{background:linear-gradient(180deg,#e9f7ff,#bfe5ff 76%,#9ccff4);color:#174e79;outline:2px solid rgba(75,166,229,.72);outline-offset:-5px}.piano-key.white.sounding{transform:translateY(5px);background:linear-gradient(180deg,#8dc8ff,#3b91e8 72%,#1764ad);color:#f7fbff;box-shadow:inset 0 6px 8px #0f498433,inset 0 -5px 7px #09366947,0 1px 2px #0000002e}.piano-key.black.active{background:linear-gradient(180deg,#bfe5ff,#77bee9 70%,#4d99cb);border-color:#3b83b5;color:#0e3c61;outline:none}.piano-key.black.sounding{transform:translateY(4px);background:linear-gradient(180deg,#69b6ff,#287dcc 55%,#0f4f91);border-color:#0b477f;box-shadow:inset 0 5px 7px #0835634d,inset 0 -5px 5px #04284e47,0 -1px #0b477f,1px 2px 3px #0000003d}.piano-key.target{outline:3px solid #82b7ff;outline-offset:-4px}.piano-key:focus-visible{outline:3px solid rgba(243,154,63,.72);outline-offset:-4px}.piano-key:focus:not(:focus-visible){outline:none}.draggable-play-control{position:relative;z-index:55;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;will-change:transform}.draggable-play-control:active{cursor:grabbing}.practice-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:18px}.pitch-panel{display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center;padding:14px;border:2px solid var(--line);background:#fffdf814}.pitch-panel h3,.pitch-panel p{margin:0}.pitch-readout{min-width:116px;text-align:right}.pitch-readout strong,.pitch-readout span{display:block}.pitch-panel.hit{border-color:var(--pitch-accurate-strong);background:var(--pitch-accurate)}.pitch-panel.near{background:var(--pitch-near)}.pitch-panel.high{border-color:var(--pitch-high-strong);background:var(--pitch-high)}.pitch-panel.low{border-color:var(--pitch-low-strong);background:var(--pitch-low)}.icon-button{width:44px;padding:0}.feedback{margin:0;padding:12px;border-left:5px solid #d86f8f;background:#ffc4dc24;font-weight:800}.enharmonic-interval-summary{margin:0;padding:10px 12px;border-left:4px solid var(--line-strong);background:color-mix(in srgb,var(--sky) 14%,transparent);line-height:1.5}.live-pitch-monitor{display:grid;gap:12px;padding:13px;border:1px solid var(--line);background:color-mix(in srgb,var(--panel) 88%,transparent)}.live-pitch-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.live-pitch-head>div:first-child{display:grid;gap:3px}.live-pitch-head p,.live-pitch-head strong,.live-pitch-head span{margin:0}.live-pitch-head span{color:var(--muted);font-size:13px}.live-mic-stop{border-color:#d86f8f;background:var(--pink);color:#17202d}.live-pitch-targets{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px}.live-pitch-target{display:grid;gap:3px;min-height:78px;padding:9px;border:2px solid color-mix(in srgb,var(--line) 62%,transparent);background:color-mix(in srgb,var(--paper) 7%,transparent);transition:transform .1s ease,border-color .1s ease,background .1s ease}.live-pitch-target.active{transform:translateY(-3px);border-color:#f1a05a}.live-pitch-target span{font-size:18px;font-weight:900}.live-pitch-target small{color:var(--muted);font-variant-numeric:tabular-nums}.live-pitch-target.hit{border-color:var(--pitch-accurate-strong);background:var(--pitch-accurate)}.live-pitch-target.near{background:var(--pitch-near)}.live-pitch-target.high{border-color:var(--pitch-high-strong);background:var(--pitch-high)}.live-pitch-target.low{border-color:var(--pitch-low-strong);background:var(--pitch-low)}.practice-points{display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:8px 12px;border:2px solid var(--line-strong);background:color-mix(in srgb,var(--butter) 22%,var(--panel));font-weight:800;white-space:nowrap}.practice-points strong{min-width:30px;color:var(--ink);font-size:24px;line-height:1;text-align:center}.practice-reward{position:relative;display:grid;gap:14px;margin-top:14px;padding:18px;overflow:hidden;border:2px solid var(--line);border-left:7px solid #f1a05a;background:color-mix(in srgb,var(--peach) 18%,var(--panel));animation:reward-arrive .36s ease-out both}.practice-reward.perfect{border-color:#55d9af;border-left-width:7px;background:color-mix(in srgb,var(--mint) 24%,var(--panel))}.reward-burst{position:absolute;top:12px;right:14px;display:grid;place-items:center;width:66px;height:66px;border:2px solid #f1a05a;border-radius:50%;background:var(--butter);color:#63340f;animation:reward-pop .52s cubic-bezier(.2,1.45,.45,1) both}.reward-burst span{position:relative;font-size:25px;font-weight:950}.reward-heading{display:flex;align-items:flex-start;padding-right:82px}.reward-heading h3,.reward-heading p,.reward-answer{margin:0}.reward-heading h3{margin-top:4px;font-size:22px}.reward-answer{padding-top:12px;border-top:1px solid color-mix(in srgb,var(--line) 48%,transparent);line-height:1.55;font-weight:750}.reward-notes{display:grid;grid-template-columns:1fr 1fr;gap:10px}.reward-strength,.reward-improve{display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:start;padding:11px;border:1px solid var(--line)}.reward-strength{background:color-mix(in srgb,var(--mint) 18%,transparent)}.reward-improve{background:color-mix(in srgb,var(--butter) 16%,transparent)}.reward-strength strong,.reward-strength span,.reward-improve strong,.reward-improve span{display:block}.reward-strength span,.reward-improve span{margin-top:3px;color:var(--muted);line-height:1.45}.reward-rays{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.reward-rays i{position:absolute;top:4px;right:76px;width:3px;height:18px;background:#f1a05a;transform-origin:50% 52px;animation:reward-ray .9s ease-out both}.reward-rays i:nth-child(2){transform:rotate(45deg)}.reward-rays i:nth-child(3){transform:rotate(90deg)}.reward-rays i:nth-child(4){transform:rotate(-45deg)}.reward-rays i:nth-child(5){transform:rotate(-90deg)}@keyframes reward-arrive{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes reward-pop{0%{opacity:0;transform:scale(.45) rotate(-12deg)}70%{opacity:1;transform:scale(1.08) rotate(3deg)}to{opacity:1;transform:scale(1) rotate(0)}}@keyframes reward-ray{0%{opacity:.9;transform:translateY(18px) scaleY(.4)}to{opacity:0;transform:translateY(-12px) scaleY(1.1)}}.error-text{color:#a32626;font-weight:800}:root[data-theme=darkMacaron] .error-text{color:#ffb3c1}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:12px}.tuner-workspace{display:grid;gap:20px}.tuner-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:18px}.tuner-heading h2,.tuner-heading p{margin-bottom:0}.tuner-layout{display:grid;grid-template-columns:minmax(240px,.42fr) minmax(460px,1fr);gap:18px}.tuner-controls,.tuner-display{border:2px solid var(--line);background:var(--panel);padding:18px}.tuner-controls{display:grid;align-content:start;gap:14px}.tuner-controls label{display:grid;gap:7px;font-weight:800}.tuner-controls p{margin:0;color:var(--muted);line-height:1.55}.tuner-auto{width:100%}.tuner-string-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(92px,1fr));gap:8px;max-height:275px;overflow:auto}.tuner-string-grid button{min-height:42px;padding:7px 9px}.tuner-controls button.active{color:#17202d;border-color:#f1a05a;background:#ffd2a6;box-shadow:inset 0 -3px #9b4a1038}.tuner-display{min-height:430px;display:grid;align-content:center;gap:24px;overflow:hidden}.tuner-note{display:grid;justify-items:center;gap:4px;text-align:center}.tuner-note>span{min-height:26px;color:var(--muted);font-weight:800}.tuner-note strong{font-size:clamp(70px,12vw,132px);line-height:.95;color:var(--ink);letter-spacing:0}.tuner-note small{font-size:17px;color:var(--muted)}.tuner-meter{position:relative;height:86px;margin:0 34px;border-bottom:5px solid var(--line);background:repeating-linear-gradient(90deg,transparent 0 calc(10% - 1px),color-mix(in srgb,var(--line) 55%,transparent) calc(10% - 1px) 10%)}.tuner-scale span{position:absolute;bottom:-29px;transform:translate(-50%);color:var(--muted);font-size:12px}.tuner-center-line{position:absolute;left:50%;bottom:0;width:4px;height:100%;transform:translate(-50%);background:var(--mint)}.tuner-needle{position:absolute;bottom:-4px;width:8px;height:72px;transform:translate(-50%);border-radius:4px 4px 0 0;background:#f19a50;box-shadow:0 0 16px #f19a508c;transition:left 90ms linear}.tuner-display.accurate .tuner-needle{background:var(--pitch-accurate-strong);box-shadow:0 0 20px #55d9afb3}.tuner-display.accurate .tuner-status strong{color:var(--pitch-accurate-strong)}.tuner-display.high .tuner-needle{background:var(--pitch-high-strong);box-shadow:0 0 20px #d640579e}.tuner-display.high .tuner-status strong{color:var(--pitch-high-strong)}.tuner-display.low .tuner-needle{background:var(--pitch-low-strong);box-shadow:0 0 20px #287dcc9e}.tuner-display.low .tuner-status strong{color:var(--pitch-low-strong)}.tuner-status,.tuner-direction{display:flex;justify-content:center;gap:18px;text-align:center}.tuner-status strong{font-size:30px}.tuner-status span{align-self:center;color:var(--muted);font-variant-numeric:tabular-nums}.tuner-lock-note{margin:-4px 0 0;text-align:center;color:var(--pitch-hit-strong);font-size:15px;font-weight:900}.tuner-direction span{min-width:110px;padding:8px 10px;border:1px solid var(--line);color:var(--muted)}.tuner-direction span.active{color:#17202d;border-color:var(--pitch-low-strong);background:var(--pitch-low);font-weight:900}.tuner-direction span:nth-child(2).active{border-color:var(--pitch-accurate-strong);background:var(--pitch-accurate)}.tuner-direction span:nth-child(3).active{border-color:var(--pitch-high-strong);background:var(--pitch-high)}.tuner-stop{border-color:#f1a05a;background:#ffd2a6;color:#17202d}.stat-card{padding:14px;border:2px solid var(--line);background:#bfe9ff1a}.stat-card span,.stat-card strong{display:block}.stat-card strong{margin-top:10px;font-size:28px}.history{display:grid;gap:10px;margin-top:18px}.history-row{display:grid;grid-template-columns:minmax(200px,1.4fr) minmax(160px,1fr) repeat(3,minmax(72px,.4fr));gap:10px;align-items:center;padding:12px;border:1px solid var(--line);background:#fffdf814}@media(max-width:1040px){.access-offer{grid-template-columns:1fr;padding:15px}.topbar,.practice-head{display:grid}.topbar{padding:18px}.topbar>div:first-child{min-height:104px;padding-right:135px}.two-column,.field-grid,.stats-grid,.history-row,.sight-control-panel,.sight-result-row,.practice-mic-result{grid-template-columns:1fr}.chord-workspace{grid-template-columns:1fr;grid-template-areas:"playbar" "score" "controls" "keyboard"}.chord-practice-grid{grid-template-columns:1fr;grid-template-areas:"score" "controls" "keyboard"}.pitch-panel{grid-template-columns:1fr auto}.sight-control-top,.sight-select-row{grid-template-columns:1fr}.sight-control-top .sight-evaluator{grid-column:1}.pitch-readout{text-align:left}.admin-user-row{display:grid}.activation-create-row,.activation-code-row{display:grid;grid-template-columns:1fr}.tuner-layout{grid-template-columns:1fr}}@media(max-width:560px){.customer-service{top:max(62px,calc(env(safe-area-inset-top) + 62px));right:max(8px,env(safe-area-inset-right))}.total-score-badge{top:max(8px,env(safe-area-inset-top));right:max(8px,env(safe-area-inset-right));min-height:42px;padding:0 10px;font-size:14px}.total-score-badge strong{font-size:20px}.customer-service-trigger{min-height:40px;padding:0 11px;box-shadow:3px 3px color-mix(in srgb,var(--line-strong) 52%,transparent)}.code-row,.practice-range-options{grid-template-columns:1fr}.code-row button{min-height:46px}.reward-heading{display:grid;gap:10px;padding-right:66px}.reward-notes,.sight-recording-upload{grid-template-columns:1fr}.live-pitch-head{align-items:stretch;flex-direction:column}.five-note-levels,.five-note-progress{grid-template-columns:1fr}.five-note-monitor-head,.realtime-assessment-head{align-items:stretch;flex-direction:column}.realtime-pitch-display,.admin-submission-card{grid-template-columns:1fr}.admin-dashboard-banner{align-items:stretch;flex-direction:column}.admin-summary-grid{grid-template-columns:repeat(2,1fr)}.five-note-step{min-height:58px;grid-template-columns:auto 1fr auto;place-items:center start;text-align:left}.assessment-wechat-card{align-items:stretch;flex-direction:column}.assessment-wechat-card button{justify-content:center;width:100%}.upload-limit-note,.upload-flow-steps,.submission-upload-grid,.wechat-assessment-steps{grid-template-columns:1fr}}@media(min-width:721px)and (max-width:1040px){.chord-workspace{grid-template-columns:minmax(430px,1.32fr) minmax(260px,.68fr);grid-template-areas:"playbar playbar" "score controls" "keyboard keyboard"}.chord-practice-grid{grid-template-columns:minmax(430px,1.32fr) minmax(260px,.68fr);grid-template-areas:"score controls" "keyboard keyboard"}}@media(max-width:520px){main{width:min(1180px,calc(100vw - 12px))}.auth-page{width:min(100vw - 12px,980px);padding:12px 0}.auth-card{grid-template-columns:1fr;gap:20px;padding:20px}.workspace{padding:12px}.score-panel{gap:12px}.tuner-heading{align-items:stretch;flex-direction:column}.tuner-display{min-height:360px;padding:14px 8px}.tuner-meter{margin:0 20px}.tuner-direction{gap:5px}.tuner-direction span{min-width:0;flex:1;padding:7px 4px;font-size:12px}}