/* Banpai Studio 0.3 — a quiet place to practise and see progress. */
:root{--bg:#f5f4ef;--ink:#253d35;--green:#285746;--dark:#203e33;--muted:#718077;--line:#e0e5dd;--pale:#edf2e9;--copper:#b57c48;--cream:#f3ebd8}
body{font-size:14px;line-height:1.5}button,input,select,textarea{font-family:inherit}input[type=checkbox]{accent-color:var(--green)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible,textarea:focus-visible{outline:3px solid #ad8145}.sidebar{width:216px;background:#203e33;color:#f5f6ee;border:0;padding:34px 18px 22px}.brand strong{font-weight:600;letter-spacing:3px}.brand strong>span{color:#d6bb82}.brand small{font-size:10px;color:#becbbf;letter-spacing:2px}.brand-icon i{background:#decba0}.nav-label{color:#b0c0b4;margin-top:45px;font-size:12px}.nav-link{font-size:14px;color:#c2d0c6;height:49px;gap:10px;border-radius:9px;padding:0 12px;margin-bottom:7px}.nav-link:hover{background:#2a4b3d}.nav-link.active{background:#e9eddb;color:#294b39}.nav-count{background:#ffffff12;color:inherit;min-width:26px;text-align:center;font-size:11px}.active .nav-count{background:#ced8be}.sidebar-note{border-color:#52705b66;margin-top:35px;padding-top:25px}.sidebar-note>span{color:#d6ba81}.sidebar-note h3{font-size:14px;font-weight:400;color:#ebeddf}.sidebar-note p{font-size:12px;color:#b0c2b4}.tiny-staff{color:#74937c}.sidebar-bottom{border-color:#52705b66}.sidebar-bottom b{color:#e3eade}.sidebar-bottom small{font-size:10px;color:#abbcac}.sidebar-bottom svg{color:#a3b8a7;width:15px}.avatar{background:#3e604b;color:#e8dec7}.workspace{margin-left:216px}.workspace main{padding:32px 36px 0;max-width:1530px;margin:0 auto}.topbar{height:72px;padding:0 36px;background:#ffffff70;border-color:#e3e6dd;font-size:13px}.topbar .muted{font-size:12px;color:#899387}.private-label{font-size:11px;color:#657966}.today-summary{font-size:12px;color:#496953;padding:7px 12px;border-radius:20px;background:#edf0e6}.today-summary:hover{background:#e2e9d7}.page-heading{margin-bottom:25px}.page-heading h1{font-size:29px;letter-spacing:.3px;line-height:1.5}.page-heading .intro{font-size:14px;margin-top:7px;color:#768276}.eyebrow{font-size:10px;letter-spacing:2px;color:#778572;line-height:1.7;margin-bottom:6px}.button{font-size:13px;min-height:40px;border-radius:8px;color:#42664d;border-color:#d6dfd2;padding:9px 14px}.text-button{font-size:13px;color:#466b53}.icon-button{width:34px;height:34px;color:#668067;border-radius:8px}.card{border-radius:13px;box-shadow:0 4px 15px #253f3104;border-color:#e2e6dd}.muted,.micro,.intro,#piece-byline,#device-description,#keyboard-help,.tile-byline,.library-footer,.sheet-caption,.help-step p,.help-box p{color:#6c7a69}.studio-layout{gap:22px;grid-template-columns:minmax(0,1fr) 245px}.piece-header{background:#fdfcf7;padding:24px 27px;border-radius:13px 13px 0 0}.piece-header h2{font-size:25px;color:#284839}.piece-header .eyebrow{font-size:10px}.piece-header .muted{font-size:12px;margin-top:6px}.sheet-toolbar{background:#fdfcf7;border-bottom:1px solid #eaeade;padding:10px 24px}.sheet-label,.check-label{font-size:12px;color:#596d57}.notation-scroll{background:#fffefb;min-height:300px}.sheet-caption{font-size:12px;line-height:1.7;background:#fffefb}.practice-options>label,.range-options,.tempo-setting{color:#5e725a;font-size:12px}.practice-options select{font-size:13px}.play-console{background:#f1f4e9;border-radius:0 0 13px 13px;box-shadow:0 7px 18px #23442b10}.console-actions>span{color:#758569;line-height:1.7;font-size:12px}.connection-card{padding:22px 19px}.connection-card h3{font-size:15px}.connection-card h4{font-size:14px;color:#496547}.connection-card>p{font-size:12px;line-height:1.9}.connection-card>.micro{font-size:11px;color:#7a8b71}.connection-illustration{height:88px;margin:21px auto}.coach-note p{font-size:12px;line-height:1.9;color:#78876a}.source-card summary{font-size:13px}.source-card p{font-size:12px;line-height:1.9;color:#748269}.score-file-actions{gap:5px}.tile-body h3{font-size:15px}.tile-byline{line-height:1.8}.library-banner{background:#e6edde;border-color:#dce4d2}.library-banner h2{font-size:24px;color:#365335}.library-banner p:not(.eyebrow){font-size:13px;color:#708066}.filter-tabs button{font-size:13px}.help-step p,.help-box p,.confirm-dialog p{font-size:13px;color:#667663}.help-step h3,.help-box h3{font-size:14px}.editor-meta label,.note-properties label,.editor-instruction{color:#66785d}.history-title small,.history-source,.history-date{color:#738168}.history-row:hover{background:#f5f8ef}footer{font-size:11px;color:#7c8873}.footer-brand{color:#77856a}
/* Progress overview */
.journey-heading>.row{flex-shrink:0}.journey-intro-grid{display:grid;grid-template-columns:minmax(0,1fr) 275px;gap:20px}.journey-hero{display:grid;grid-template-columns:minmax(0,1fr) 210px;background:#254b3c;border-radius:16px;overflow:hidden;position:relative;color:#f5f4e8;padding:30px 32px 0;isolation:isolate}.journey-hero:before{content:'';position:absolute;right:-130px;top:-170px;border:1px solid #ffffff10;border-radius:50%;width:540px;height:540px;z-index:-1}.journey-hero:after{content:'';position:absolute;right:-100px;top:-140px;border:1px solid #ffffff0b;border-radius:50%;width:480px;height:480px;z-index:-1}.hero-main .eyebrow{color:#bfd0b6}.hero-main h2{font-size:31px;font-weight:400;line-height:1.55;letter-spacing:1px;margin:8px 0 12px}.hero-main>p:not(.eyebrow){color:#b9cbb4;font-size:12px;line-height:1.9}.hero-edit{display:flex;align-items:center;gap:7px;color:#e8d5a7;font-size:12px;padding:8px 0;margin-top:8px}.hero-edit svg{width:15px}.hero-meter{display:flex;flex-direction:column;align-items:center;justify-content:center;padding-top:2px}.progress-ring{width:148px;height:148px;padding:7px;border-radius:50%;background:conic-gradient(#e3c58b var(--progress),#5c785c55 0);transform:rotate(-.001deg)}.progress-ring>div{height:100%;width:100%;background:#254b3c;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center}.progress-ring strong{font-size:40px;font-weight:400;font-variant-numeric:tabular-nums;line-height:1.3}.progress-ring small{font-size:17px;margin-left:3px}.progress-ring span{font-size:10px;color:#b5c8ae;margin-top:2px}.hero-meter>p{font-size:11px;color:#ced6bd;margin-top:14px}.week-goal{grid-column:1/-1;border-top:1px solid #8ca88133;padding:19px 0 22px;margin-top:22px}.week-goal>div:first-child{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:12px;color:#d5dec9}.week-goal b{font-size:17px;font-weight:400;color:#f1e5c7}.week-goal small{font-size:11px;color:#bccab0}.week-track{height:4px;background:#ffffff14;border-radius:3px;margin:10px 0}.week-track i{display:block;height:100%;background:#d7be87;border-radius:3px}.week-goal>p{font-size:10px;color:#b2c4a8}.next-step-card{border:1px solid #e4dfcf;background:#f0ecdf;border-radius:16px;padding:26px 24px;display:flex;flex-direction:column;align-items:flex-start}.next-icon{height:39px;width:39px;border:1px solid #dcd4bd;background:#f7f4e9;border-radius:50%;color:#a48b54;display:grid;place-items:center;margin-bottom:24px}.next-step-card .eyebrow{color:#8b886c;font-size:9px;letter-spacing:1.5px}.next-step-card h3{font-size:18px;line-height:1.6;color:#535b40;margin:6px 0 10px}.next-step-card>p:not(.eyebrow){font-size:12px;color:#787d66;line-height:1.9;margin-bottom:14px}.next-step-card .text-button{color:#697649;margin-top:auto}.next-step-foot{font-size:10px;color:#8f9177;border-top:1px solid #dbd8c7;padding-top:14px;margin-top:16px;width:100%;line-height:1.9}.journey-tabs{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #dce2d6;margin:29px 0 24px;gap:12px}.journey-tabs [role=tablist]{display:flex;gap:24px}.journey-tabs [role=tab]{font-size:14px;color:#7c8b71;padding:12px 0 15px;border-bottom:2px solid transparent;white-space:nowrap}.journey-tabs [role=tab].active{color:#315b40;border-bottom-color:#315b40}.journey-tabs [role=tab]>span{display:inline-block;background:#e7ecdc;color:#7b8e68;border-radius:5px;padding:1px 6px;font-size:10px;margin-left:7px}.period-switch{display:flex;border:1px solid #dce3d2;padding:3px;background:#efF1e9;border-radius:7px;gap:2px}.period-switch button{font-size:11px;padding:5px 8px;border-radius:4px;color:#788969;white-space:nowrap}.period-switch button.active{background:white;color:#395f3c;box-shadow:0 1px 4px #4258320c}.progress-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin-bottom:21px}.progress-metrics article{border:1px solid #e0e5d9;border-radius:11px;padding:20px 22px;background:#fbfcf8}.progress-metrics article>span{font-size:12px;color:#738267}.progress-metrics strong{display:block;font-size:33px;font-weight:400;color:#33583e;line-height:1.5;margin-top:7px;font-variant-numeric:tabular-nums}.progress-metrics strong small{font-size:11px;color:#7b8c6c;margin-left:8px}.progress-metrics p{font-size:10px;color:#87937a;margin-top:7px;line-height:1.7}.progress-chart-grid{display:grid;grid-template-columns:minmax(0,1fr) 275px;gap:20px}.activity-card{padding:24px 25px 18px}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:21px}.section-heading h2,.calendar-card h2,.journal-card h2{font-size:18px;color:#3f5d40;letter-spacing:.4px;font-weight:400;line-height:1.6}.section-heading p:not(.eyebrow){font-size:12px;line-height:1.8;color:#7e8d71;margin-top:5px}.chart-legend{display:flex;gap:12px;font-size:10px;color:#849575}.chart-legend span{display:flex;align-items:center;gap:5px;white-space:nowrap}.chart-legend i{width:7px;height:7px;background:#819b62;border-radius:2px}.chart-legend i.manual{background:#d3be93}.bar-chart{height:163px;position:relative;margin:30px 0 15px;padding-left:38px}.chart-gridlines{position:absolute;inset:0 0 22px;display:flex;flex-direction:column;justify-content:space-between;pointer-events:none}.chart-gridlines span{font-size:9px;color:#9ca891;border-bottom:1px dashed #e8ece1;padding-bottom:1px}.chart-columns{display:flex;align-items:stretch;gap:5px;height:100%;padding-bottom:22px}.day-column{position:relative;display:flex;align-items:flex-end;justify-content:center;padding:0;flex:1;min-width:0;height:100%;background:transparent;border-radius:3px}.day-column:hover{background:#edf1e466}.day-column.selected{outline:1px solid #b79656;outline-offset:2px}.column-stack{width:100%;max-width:23px;min-height:2px;display:flex;flex-direction:column;border-radius:3px 3px 0 0;overflow:hidden}.column-stack i{display:block;width:100%}.column-auto{background:#859e69}.column-manual{background:#d3bd91}.column-label{position:absolute;bottom:-23px;font-size:9px;color:#97a486;white-space:nowrap}.chart-empty-note{position:absolute;left:38px;right:0;top:50px;text-align:center;font-size:12px;color:#94a080;background:#ffffffdd;padding:10px;pointer-events:none}.accuracy-section{border-top:1px solid #edf0e7;margin-top:26px;padding-top:16px}.accuracy-section>.row{font-size:11px;color:#718361;gap:12px}.accuracy-section small{font-size:9px;color:#9aa68a;text-align:right}.accuracy-chart{width:100%;height:85px;margin-top:17px;overflow:visible}.accuracy-chart text{font:9px system-ui;fill:#98a18d}.empty-accuracy{padding:22px 0 8px;font-size:11px;color:#96a488}.calendar-card{padding:24px}.calendar-card>p:not(.eyebrow){font-size:10px;color:#899879;margin-top:7px}.practice-calendar{display:grid;grid-template-rows:repeat(7,1fr);grid-auto-flow:column;grid-auto-columns:1fr;gap:4px;margin-top:22px}.calendar-day,.calendar-legend i{display:block;aspect-ratio:1;border-radius:3px;background:#edf1e6;min-width:0;padding:0}.calendar-day:hover{outline:1px solid #bca475;outline-offset:1px}.calendar-day.selected{outline:2px solid #a18b59;outline-offset:1px}.intensity-0{background:#edf1e6}.intensity-1,.calendar-legend i.intensity-1{background:#d7e2c8}.intensity-2,.calendar-legend i.intensity-2{background:#b4c799}.intensity-3,.calendar-legend i.intensity-3{background:#8da771}.intensity-4,.calendar-legend i.intensity-4{background:#53784b}.calendar-legend{display:flex;justify-content:flex-end;align-items:center;gap:4px;margin-top:12px;color:#98a58b;font-size:9px}.calendar-legend i{width:9px;height:9px}.calendar-total{padding:22px 0 16px;margin-top:12px;border-top:1px solid #e9eee1}.calendar-total strong{font-size:32px;font-weight:400;color:#436440}.calendar-total>span{font-size:11px;color:#879976;margin-left:6px}.calendar-total p{font-size:11px;color:#8d9b7d;margin-top:4px}.calendar-card>.text-button{font-size:11px}.journal-card{padding:23px 26px;margin-top:21px}.journal-card .section-heading{margin-bottom:8px}.section-subtitle{font-size:11px;color:#8f9e7f}.journal-row{display:flex;align-items:center;gap:14px;padding:17px 0;border-top:1px solid #edf0e6}.journal-row:first-of-type{border-top:0}.journal-symbol{width:36px;height:36px;flex:0 0 36px;background:#f0f4e9;color:#8a9d75;display:grid;place-items:center;border-radius:9px}.journal-symbol svg{width:17px}.journal-main{flex:1;min-width:0}.journal-main b{font-size:13px;font-weight:400;color:#4d6a43;display:block;overflow-wrap:anywhere}.journal-main>span{font-size:10px;color:#94a182;margin-top:4px;display:block}.journal-main>p{font-size:11px;line-height:1.8;color:#839373;margin-top:6px;white-space:pre-wrap;overflow-wrap:anywhere}.journal-row>strong{font-size:17px;font-weight:400;white-space:nowrap;color:#55774a}.journal-row>strong small{font-size:10px;color:#99a58c}.journal-row>.icon-button{border-color:transparent;color:#90a17b;width:28px;height:28px}.journey-empty{padding:37px 24px;text-align:center;width:100%;grid-column:1/-1}.journey-empty>span{display:grid;place-items:center;height:42px;width:42px;background:#edf3e6;border-radius:50%;margin:0 auto 16px;color:#91aa77}.journey-empty h3{font-size:16px;color:#72875e;font-weight:400}.journey-empty p{font-size:12px;color:#98a787;line-height:1.9;margin:10px 0 18px}.journey-empty.compact{border:1px dashed #d3dfc3;background:#f9fbf4;border-radius:12px;padding:45px 20px}.progress-method{margin-top:17px;font-size:11px;color:#8a9b79;line-height:1.9}.progress-method summary{cursor:pointer;width:fit-content}.progress-method p{max-width:930px;margin-top:10px;color:#7c8d6b}.progress-method a{display:inline-block;color:#587748;margin-top:8px;text-decoration:underline;text-underline-offset:3px}.progress-footer{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #dfe6d4;gap:16px;padding-top:20px;margin-top:31px;font-size:11px;color:#92a080}.progress-footer .text-button{font-size:11px}.progress-footnote{font-size:10px;color:#99a58c;line-height:1.9;margin-top:9px;max-width:950px}.demo-banner,.storage-warning{display:flex;gap:16px;align-items:center;background:#f4e9cf;border:1px solid #e6d9b4;color:#8b754c;border-radius:10px;padding:13px 17px;font-size:12px;margin-bottom:18px}.demo-banner button{margin-left:auto;color:#7c683e;white-space:nowrap}.storage-warning{background:#f9e7df;color:#975d48}
/* Five level learning path */
.grade-route{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:11px;margin-bottom:27px}.grade-stop{border:1px solid #dee5d5;border-radius:11px;background:#fbfcf8;text-align:left;padding:17px 18px;color:#839672;position:relative;min-width:0}.grade-stop.selected{border-color:#81965f;background:#eef3e4;box-shadow:0 0 0 1px #81965f}.grade-stop-number{font:30px/1.2 Georgia,serif;color:#a8b78f;display:block;margin-bottom:13px}.grade-stop.selected .grade-stop-number{color:#65824c}.grade-stop b{font-size:13px;color:#617b4f;display:block;font-weight:400}.grade-stop>div>span{font-size:11px;display:block;margin-top:5px;color:#889a75}.grade-stop-track{height:3px;background:#e3e9d9;margin-top:16px;border-radius:2px;overflow:hidden}.grade-stop-track i{display:block;background:#8ba766;height:100%}.grade-stop small{font-size:9px;color:#8d9d7b;display:block;margin-top:7px}.level-heading{display:flex;justify-content:space-between;gap:25px;align-items:center}.level-heading h2{font-size:25px;font-weight:400;color:#42653c}.level-heading p:not(.eyebrow){font-size:12px;color:#849674;line-height:1.9;margin-top:7px;max-width:700px}.level-total{flex-shrink:0;text-align:right}.level-total strong{display:block;font-size:34px;font-weight:400;color:#688650}.level-total small{font-size:14px}.level-total>span{font-size:10px;color:#8d9d7b}.curriculum-notice{padding:11px 15px;border:1px solid #e1e5d4;background:#f0f2e7;font-size:11px;line-height:1.9;border-radius:7px;color:#879476;margin:19px 0}.skill-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px}.skill-card{border:1px solid #e1e7d7;border-radius:12px;background:#fdfef9;overflow:hidden}.skill-card-head{display:flex;gap:11px;align-items:center;padding:19px 21px;border-bottom:1px solid #e9eedd;background:#f8faf2}.skill-index{font:19px Georgia,serif;color:#a4b98b}.skill-card h3{font-size:14px;color:#607b49;font-weight:400}.skill-card-head>span:last-child{margin-left:auto;font-size:10px;color:#99aa83}.skill-task{display:flex;gap:12px;padding:18px 21px;text-align:left;width:100%;align-items:flex-start;border-bottom:1px solid #edf1e4;min-height:137px}.skill-task:last-child{border-bottom:0}.skill-task:not(:disabled):hover{background:#f3f7eb}.skill-task:disabled{opacity:1}.skill-task>div{flex:1;min-width:0}.task-mark{border:1px solid #cedcbd;border-radius:50%;width:19px;height:19px;display:grid;place-items:center;flex:0 0 19px;margin-top:1px;font-size:12px;color:#638048}.state-done .task-mark{background:#8fa875;border-color:#8fa875;color:#fff}.state-review .task-mark{border-color:#c9b68c;color:#a28b59;background:#f7f0df}.state-practicing .task-mark{border-color:#9fb585;background:#e8f0dc;font-size:21px}.skill-task b{font-size:13px;line-height:1.6;font-weight:400;color:#638049}.skill-task p{font-size:11px;line-height:1.9;color:#8c9e79;margin-top:6px}.skill-task .task-state{display:block;font-size:10px;color:#9aac87;margin-top:9px}.skill-task.state-done .task-state{color:#789358}.skill-task>svg{width:13px;height:13px;color:#a0b38c;flex-shrink:0;margin-top:3px}.skill-task .task-note{background:#f0f5e6;border-left:2px solid #bacb9e;padding:7px 10px;white-space:pre-wrap;overflow-wrap:anywhere;color:#728d52}.level-materials{border:1px solid #e0e7d3;background:#edf3e4;border-radius:11px;padding:23px 25px;margin-top:22px}.level-materials h3{font-size:15px;color:#638049;font-weight:400}.level-materials p{font-size:11px;color:#8d9e78;line-height:1.9;margin-top:6px}.level-materials>.row{margin-top:16px;flex-wrap:wrap}.level-materials .button{font-size:11px;min-height:35px}.plan-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}.plan-card{padding:21px;border:1px solid #e0e7d4;background:#fbfdf6;border-radius:12px;min-width:0}.plan-card-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:16px}.grade-chip{font-size:10px;color:#7e965f;background:#edf3e4;padding:5px 8px;border-radius:5px}.plan-card-top .icon-button{border:0;background:transparent;width:27px;height:27px}.plan-card h3{font-size:16px;font-weight:400;color:#5d7d45;line-height:1.7;overflow-wrap:anywhere}.plan-card>p{font-size:11px;color:#9aad86;margin-top:7px}.plan-evidence{background:#f0f4e8;border-radius:7px;padding:12px 13px;margin:17px 0}.plan-evidence>span{display:block;font-size:12px;color:#7a975d}.plan-evidence>small{display:block;font-size:10px;color:#a2b18d;margin-top:4px}.plan-evidence.ready{background:#e0ecd1}.plan-card .plan-note{color:#829c65;font-size:11px;line-height:1.9;margin:0 0 16px;white-space:pre-wrap;overflow-wrap:anywhere}.plan-card .text-button{font-size:11px}.subtle{color:#a2b38c}.progress-dialog{max-width:565px;padding:27px}.progress-dialog-head{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:24px}.progress-dialog-head h2{font-size:22px;margin:0;font-weight:400;color:#47643d}.progress-dialog-head .icon-button{flex-shrink:0}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px}.form-grid label,.form-wide{display:flex;flex-direction:column;gap:8px;min-width:0;font-size:12px;color:#768b62}.progress-dialog input,.progress-dialog select,.progress-dialog textarea{padding:10px 12px;border:1px solid #dbe5cb;border-radius:7px;background:#fafcf5;color:#486c34;font-size:13px;width:100%;min-width:0}.progress-dialog textarea{resize:vertical;line-height:1.8}.form-wide{margin:18px 0}.form-hint{font-size:11px;color:#8ca375;line-height:1.9;margin-top:17px}.check-detail{font-size:13px;color:#7f9668;line-height:1.9;margin-bottom:20px}.progress-dialog .dialog-actions{border-top:1px solid #e8eedd;padding-top:19px}.progress-dialog .error-message{font-size:12px}
/* Responsive workspace and a readable phone fallback. */
@media(min-width:1600px){.workspace main{padding-top:38px}.journey-hero{grid-template-columns:minmax(0,1fr) 240px}.journey-intro-grid,.progress-chart-grid{grid-template-columns:minmax(0,1fr) 310px}.hero-main h2{font-size:36px}.progress-ring{width:163px;height:163px}}
@media(max-width:1230px){.workspace main{padding:26px 25px 0}.topbar{padding:0 25px}.sidebar{width:190px;padding-left:12px;padding-right:12px}.workspace{margin-left:190px}.nav-link{font-size:13px}.journey-intro-grid,.progress-chart-grid{grid-template-columns:minmax(0,1fr) 238px;gap:16px}.journey-hero{padding:24px 24px 0;grid-template-columns:minmax(0,1fr) 160px}.hero-main h2{font-size:28px}.progress-ring{width:127px;height:127px}.hero-meter>p{font-size:10px}.next-step-card{padding:23px 20px}.progress-metrics{gap:12px}.progress-metrics article{padding:17px}.progress-metrics strong{font-size:30px}.activity-card,.calendar-card{padding:21px}.section-heading{flex-wrap:wrap;gap:10px}.grade-stop{padding:15px}.plan-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.studio-layout{grid-template-columns:minmax(0,1fr) 220px;gap:16px}.topbar .muted{display:none}.slash{display:none}.journey-tabs [role=tablist]{gap:20px}.journey-tabs [role=tab]{font-size:13px}}
@media(max-width:1020px){.sidebar{width:76px;padding:28px 9px}.workspace{margin-left:76px}.nav-link{font-size:0;padding:0}.nav-link .nav-count{display:none}.brand>div,.sidebar-note{display:none}.brand-icon{gap:3px}.topbar{height:61px}.today-summary{font-size:11px}.journey-heading>.row{gap:8px}.journey-heading .button{font-size:12px;padding:8px 11px}.page-heading h1{font-size:25px}.progress-metrics article{padding:15px}.progress-metrics article>span{font-size:11px}.grade-route{gap:9px}.grade-stop{padding:14px 11px}.grade-stop small{font-size:8px}.skill-task{padding:17px}.skill-card-head{padding:17px}.level-heading h2{font-size:23px}.journey-tabs [role=tablist]{gap:16px}.period-switch button{font-size:10px;padding:5px 6px}}
@media(max-width:780px){.sidebar{width:100%;position:static;height:65px;padding:12px 18px}.workspace{margin:0}.brand>div{display:block}.brand strong{font-size:22px}.brand-icon{height:29px}.brand small{display:none}.nav-link{font-size:0;height:36px;width:36px;padding:0;border-radius:7px;margin:0}.topbar{padding:0 18px;height:44px;font-size:11px;background:#f8f9f2}.topbar .row{gap:8px}.today-summary{font-size:10px;padding:5px 9px}.topbar .icon-button{width:27px;height:27px;background:transparent;border:0}.workspace main{padding:23px 18px 0}.page-heading h1{font-size:23px}.page-heading .intro{font-size:12px;line-height:1.8}.page-heading{margin-bottom:20px}.journey-heading>.row{flex-direction:row;flex-wrap:wrap;width:auto}.journey-intro-grid{grid-template-columns:1fr;gap:14px}.journey-hero{padding:25px 24px 0;grid-template-columns:minmax(0,1fr) 135px}.hero-main h2{font-size:27px;margin-top:8px}.hero-main .eyebrow{font-size:8px;letter-spacing:1.5px}.hero-main>p:not(.eyebrow){font-size:10px}.hero-edit{font-size:11px}.progress-ring{width:116px;height:116px;padding:6px}.progress-ring strong{font-size:33px}.progress-ring span{font-size:9px}.hero-meter>p{font-size:8px}.week-goal{margin-top:19px;padding:17px 0 20px}.week-goal>div:first-child{font-size:11px}.next-step-card{padding:20px 22px;display:block}.next-icon{float:left;margin:0 14px 10px 0;width:34px;height:34px}.next-step-card .eyebrow{font-size:8px;letter-spacing:1px}.next-step-card h3{font-size:15px;margin:4px 0 10px}.next-step-card>p:not(.eyebrow){font-size:11px;clear:both;margin-bottom:8px}.next-step-card .text-button{font-size:11px}.next-step-foot{display:none}.journey-tabs{flex-direction:column;align-items:stretch;margin:21px 0 17px;gap:10px;padding-bottom:10px}.journey-tabs [role=tablist]{justify-content:space-between;gap:9px}.journey-tabs [role=tab]{font-size:12px;padding:9px 0 11px}.journey-tabs [role=tab]>span{font-size:9px;margin-left:4px;padding:1px 4px}.period-switch{align-self:flex-end}.progress-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:15px}.progress-metrics article{padding:16px 17px}.progress-metrics strong{font-size:29px;margin-top:4px}.progress-metrics strong small{font-size:10px;margin-left:6px}.progress-metrics p{font-size:9px}.progress-chart-grid{grid-template-columns:1fr;gap:15px}.activity-card{padding:21px 19px 17px}.section-heading h2,.calendar-card h2,.journal-card h2{font-size:17px}.section-heading .eyebrow,.calendar-card .eyebrow{font-size:8px;letter-spacing:1.5px}.chart-legend{font-size:9px}.bar-chart{height:143px;margin-top:22px}.chart-columns{gap:3px}.accuracy-section>.row{font-size:10px;align-items:flex-start}.accuracy-section small{font-size:8px;max-width:150px}.calendar-card{padding:22px}.practice-calendar{gap:5px;max-width:380px}.calendar-total{padding:15px 0 8px;margin-top:9px}.calendar-card>.text-button{font-size:11px}.journal-card{padding:20px 18px;margin-top:15px}.journal-row{gap:9px;padding:15px 0}.journal-symbol{width:27px;height:27px;flex-basis:27px}.journal-symbol svg{width:15px}.journal-main b{font-size:12px}.journal-main>span{font-size:9px}.journal-main>p{font-size:10px}.journal-row>strong{font-size:15px}.journal-row>strong small{font-size:9px}.journal-row>.icon-button{width:22px;flex-shrink:0}.journal-row>.icon-button svg{width:13px}.section-subtitle{font-size:9px}.progress-footer{flex-direction:column;align-items:flex-start;gap:8px;font-size:10px;padding-top:16px;margin-top:22px}.progress-footnote{font-size:9px}.progress-method{font-size:10px}.demo-banner{gap:8px;flex-wrap:wrap;padding:12px 14px;font-size:11px}.demo-banner>span{font-size:10px;order:3;flex-basis:100%}.grade-route{display:flex;overflow:auto;padding:2px 2px 7px;gap:10px;scroll-snap-type:x proximity;margin-bottom:20px}.grade-stop{flex:0 0 116px;scroll-snap-align:start;padding:14px}.grade-stop-number{font-size:26px;margin-bottom:10px}.grade-stop b{font-size:12px}.grade-stop>div>span{font-size:10px}.grade-stop small{font-size:9px}.level-heading{gap:13px;align-items:flex-start}.level-heading h2{font-size:22px}.level-heading .eyebrow{font-size:8px;letter-spacing:1px}.level-heading p:not(.eyebrow){font-size:11px}.level-total strong{font-size:27px}.level-total>span{font-size:9px;max-width:80px;display:block;line-height:1.8}.curriculum-notice{font-size:10px;margin:16px 0}.skill-grid{grid-template-columns:1fr;gap:13px}.skill-task{min-height:0;padding:17px 18px}.skill-card-head{padding:16px 18px}.skill-task p{font-size:11px}.level-materials{padding:20px}.level-materials h3{font-size:14px}.level-materials p{font-size:10px}.level-materials>.row{gap:8px}.level-materials .button{font-size:10px;padding:7px 10px;min-height:33px}.plan-grid{grid-template-columns:1fr;gap:13px}.plan-card{padding:20px}.progress-dialog{padding:23px 20px}.progress-dialog-head h2{font-size:19px}.progress-dialog-head .eyebrow{font-size:9px;letter-spacing:1px}.form-grid{gap:14px}.form-grid label,.form-wide{font-size:11px}.progress-dialog input,.progress-dialog select,.progress-dialog textarea{font-size:13px;padding:9px 10px}.progress-dialog-head{margin-bottom:20px}.form-hint{font-size:10px}.check-detail{font-size:12px}.studio-layout{display:flex}.piece-header{padding:22px 18px}.piece-header h2{font-size:22px}.sheet-toolbar{padding:9px 13px}.connection-card{padding:17px}.connection-card h3{font-size:13px}.connection-card h4{font-size:12px}.connection-illustration{display:none}.connection-card>p{font-size:11px}.library-banner h2{font-size:18px}.library-banner p:not(.eyebrow){font-size:11px}.filter-tabs button{font-size:11px}.tile-body h3{font-size:13px}.text-button{font-size:12px}.toast{left:50%}.source-card{display:block;margin-top:12px}.coach-note{display:none}.source-card summary{font-size:12px}.source-card p{font-size:11px}.source-card .score-file-actions{display:flex;flex-wrap:wrap;gap:14px}.source-card .text-button{font-size:11px}}
@media(prefers-reduced-motion:no-preference){.button,.nav-link,.grade-stop,.skill-task{transition:background-color .18s,border-color .18s}.week-track i{transition:width .4s}}
/* Reading contrast: keep quiet surfaces without making the guidance faint. */
.progress-metrics article>span,.progress-metrics p,.journal-main>span,.section-subtitle,.progress-footer,.progress-footnote,.progress-method,.progress-method p,.grade-stop>div>span,.grade-stop small,.level-heading p:not(.eyebrow),.level-total>span,.curriculum-notice,.skill-task p,.skill-task .task-state,.skill-card-head>span:last-child,.level-materials p,.plan-card>p,.plan-evidence>small,.form-hint,.form-grid label,.form-wide,.check-detail{color:#66785b}
.progress-metrics article>span{font-size:13px}.progress-metrics p{font-size:11px}.section-heading p:not(.eyebrow),.next-step-card>p:not(.eyebrow),.level-heading p:not(.eyebrow){font-size:13px;color:#6b785b}.skill-task p{font-size:12px;line-height:1.9}.skill-task b{font-size:14px;color:#46633b}.skill-task .task-state{font-size:11px}.skill-task .task-note{color:#5b7447}.grade-stop small,.level-total>span,.curriculum-notice,.progress-method,.progress-footnote,.form-hint{font-size:11px}.grade-stop>div>span{font-size:12px}.grade-stop b{font-size:14px;color:#47673d}.level-materials p,.journal-main>span,.journal-main>p,.plan-card>p,.plan-evidence>small{font-size:12px}.journal-main b{font-size:14px;color:#42613a}.journal-main>p{color:#687e56}.calendar-card>p:not(.eyebrow),.calendar-total p,.calendar-total>span,.calendar-card>.text-button{font-size:12px;color:#657d53}.chart-legend{font-size:11px;color:#6e815d}.accuracy-section>.row{font-size:12px;color:#698056}.accuracy-section small,.empty-accuracy{font-size:11px;color:#788969}.plan-card h3{color:#456837}.plan-evidence>span{color:#54763e}.plan-card .plan-note{font-size:12px;color:#617d4a}.progress-footer .text-button,.plan-card .text-button{font-size:12px}.progress-dialog input,.progress-dialog select,.progress-dialog textarea{font-size:14px;color:#34532a}.form-grid label,.form-wide{font-size:13px}.next-step-card h3{color:#46553a}.next-step-foot{color:#72785f}.hero-main>p:not(.eyebrow),.hero-meter>p,.week-goal>p{font-size:12px}.progress-ring span{font-size:11px}.week-goal small{font-size:12px}
@media(max-width:780px){.progress-metrics article>span{font-size:12px}.progress-metrics p{font-size:10px}.hero-main>p:not(.eyebrow){font-size:11px}.hero-meter>p{font-size:9px}.progress-ring span{font-size:9px}.week-goal>p{font-size:10px}.week-goal small{font-size:11px}.next-step-card>p:not(.eyebrow){font-size:12px}.section-heading p:not(.eyebrow){font-size:12px}.chart-legend{font-size:10px}.accuracy-section>.row{font-size:11px}.accuracy-section small{font-size:9px}.journal-main b{font-size:13px}.journal-main>span,.journal-main>p{font-size:11px}.grade-stop b{font-size:13px}.grade-stop>div>span{font-size:11px}.grade-stop small{font-size:10px}.level-heading p:not(.eyebrow){font-size:12px}.level-total>span{font-size:9px}.skill-task p{font-size:12px}.progress-footnote{font-size:10px}.form-grid label,.form-wide{font-size:12px}}
/* Regular controls stay at 14px; secondary metadata at 12px. */
body{font-size:1rem}.button,.text-button,.check-label,.sheet-label,.practice-options>label,.range-options,.tempo-setting,.practice-options select{font-size:.875rem}.intro,.page-heading .intro{font-size:1rem}.piece-header .muted,.sheet-caption,.micro,.connection-card>p,.coach-note p,.source-card p{font-size:.8125rem}.connection-card h4,.keyboard-panel summary,.keyboard-controls p,.keyboard-footer{font-size:.875rem}.eyebrow,.brand small,.sidebar-bottom small,.private-label,.today-summary,.next-step-card .eyebrow,.next-step-foot,.hero-main .eyebrow,.progress-ring span,.hero-meter>p,.hero-main>p:not(.eyebrow),.hero-edit,.week-goal>p,.week-goal small{font-size:.75rem}.hero-main .eyebrow{letter-spacing:1.2px}.journey-tabs [role=tab],.period-switch button{font-size:.875rem}.journey-tabs [role=tab]>span{font-size:.75rem}.progress-metrics article>span,.progress-metrics strong small{font-size:.875rem}.progress-metrics p{font-size:.75rem}.section-heading h2,.calendar-card h2,.journal-card h2{font-size:1.125rem}.section-heading p:not(.eyebrow),.next-step-card>p:not(.eyebrow),.level-heading p:not(.eyebrow),.skill-task p,.plan-card .plan-note,.check-detail{font-size:1rem}.chart-legend,.chart-gridlines span,.column-label,.accuracy-section>.row,.accuracy-section small,.empty-accuracy,.calendar-legend,.calendar-card>p:not(.eyebrow),.calendar-total p,.calendar-total>span,.calendar-card>.text-button,.section-subtitle,.journal-main>span,.journal-main>p,.journal-row>strong small,.progress-method,.progress-footer,.progress-footnote,.grade-stop small,.level-total>span,.curriculum-notice,.skill-card-head>span:last-child,.skill-task .task-state,.level-materials p,.plan-card>p,.plan-evidence>small,.grade-chip,.form-hint{font-size:.75rem}.chart-gridlines span{background:transparent}.accuracy-chart text{font-size:12px}.grade-stop>div>span,.grade-stop b,.skill-task b,.skill-card h3,.level-materials .button,.plan-evidence>span,.plan-card .text-button,.progress-footer .text-button,.journal-main b,.form-grid label,.form-wide{font-size:.875rem}.progress-dialog input,.progress-dialog select,.progress-dialog textarea{font-size:1rem}.grade-stop{min-height:177px}.skill-task{padding:20px}.plan-card h3{font-size:1.125rem}.progress-metrics article{min-width:0}.journal-row>.icon-button{width:32px;height:32px}.journal-main{min-width:0}.journey-empty h3{font-size:1.125rem}.journey-empty p{font-size:1rem}.hero-meter>p{text-align:center;line-height:1.8}.section-subtitle{max-width:220px}.grade-stop small{line-height:1.7}.hero-main h2{letter-spacing:0}.level-total>span{max-width:200px;display:block;line-height:1.8}
@media(max-width:1230px){.journey-tabs{flex-wrap:wrap}.journey-tabs [role=tablist]{gap:20px}.period-switch{margin-bottom:8px}.grade-stop{padding:15px 12px}.grade-stop>div>span{font-size:.8125rem}}
@media(max-width:780px){.page-heading .intro{font-size:.875rem}.journey-heading .button,.page-heading .button,.filter-tabs button,.sheet-caption .text-button,.connection-card #virtual-button,.connection-card #demo-button,.source-card .text-button{font-size:.8125rem}.topbar .today-summary{font-size:.75rem}.sidebar-bottom small{font-size:.75rem}.hero-main h2{font-size:26px}.hero-main .eyebrow{font-size:.75rem;letter-spacing:0}.progress-ring span{font-size:.75rem;max-width:100px}.hero-meter>p{font-size:.75rem;line-height:1.6}.hero-main>p:not(.eyebrow){font-size:.75rem}.hero-main{padding-right:8px}.hero-edit{font-size:.75rem}.week-goal>div:first-child{font-size:.8125rem}.week-goal small,.week-goal>p{font-size:.75rem}.next-step-card .eyebrow{font-size:.75rem;letter-spacing:.5px}.next-step-card h3{font-size:1rem}.next-step-card>p:not(.eyebrow){font-size:1rem}.journey-tabs [role=tablist]{gap:8px}.journey-tabs [role=tab]{font-size:.875rem}.journey-tabs [role=tab]>span{display:none}.period-switch{margin:0}.period-switch button{font-size:.8125rem}.progress-metrics article{padding:16px}.progress-metrics article>span,.progress-metrics strong small{font-size:.8125rem}.progress-metrics p{font-size:.75rem}.section-heading .eyebrow,.calendar-card .eyebrow,.level-heading .eyebrow{font-size:.75rem;letter-spacing:1px}.accuracy-section>.row{flex-direction:column;gap:5px;align-items:flex-start}.accuracy-section small{max-width:none;text-align:left;font-size:.75rem}.grade-stop{flex-basis:138px;min-height:180px}.grade-stop b{font-size:.875rem}.grade-stop>div>span{font-size:.8125rem}.grade-stop small{font-size:.75rem}.level-heading{flex-direction:column;gap:10px}.level-total{text-align:left;display:flex;align-items:center;gap:12px}.level-total>span{max-width:none;font-size:.75rem}.curriculum-notice{font-size:.75rem}.skill-task p{font-size:1rem}.skill-task b{font-size:.875rem}.skill-task .task-state,.progress-footnote,.form-hint{font-size:.75rem}.skill-task{padding:18px 16px;gap:9px}.journal-main>span,.journal-main>p{font-size:.75rem}.journal-main b{font-size:.875rem}.journal-symbol{display:none}.journal-row{gap:7px;flex-wrap:wrap}.journal-row>strong{font-size:1rem}.journal-row>strong small{font-size:.75rem}.journal-row>.icon-button{width:28px;height:32px}.journal-main{flex-basis:calc(100% - 135px)}.form-grid label,.form-wide{font-size:.875rem}.progress-dialog .eyebrow{font-size:.75rem}.level-materials .button{font-size:.8125rem;white-space:normal;text-align:left}.level-materials p{font-size:.75rem}.connection-card>.micro{font-size:.75rem!important}.sheet-toolbar .check-label{font-size:.8125rem}.console-actions>span{font-size:.75rem}.keyboard-panel summary,.keyboard-controls p,.keyboard-footer{font-size:.8125rem}.tile-body h3{font-size:.875rem}}
/* Comfortable reading sizes for long practice sessions. */
.page-heading .intro{font-size:16px}.button,.text-button,.journey-tabs [role=tab],.progress-metrics article>span,.journal-main b,.skill-task b,.skill-task p,.grade-stop b,.plan-card>p,.plan-card .plan-note,.form-grid label,.form-wide,.check-detail{font-size:14px}.next-step-card>p:not(.eyebrow),.section-heading p:not(.eyebrow),.level-heading p:not(.eyebrow){font-size:14px;line-height:1.9}.progress-metrics p,.journal-main>span,.journal-main>p,.section-subtitle,.progress-footer,.progress-footnote,.progress-method,.grade-stop>div>span,.grade-stop small,.level-total>span,.curriculum-notice,.skill-task .task-state,.skill-card-head>span:last-child,.level-materials p,.plan-evidence>small,.form-hint,.progress-footer .text-button,.plan-card .text-button,.period-switch button,.chart-legend,.accuracy-section small,.empty-accuracy,.next-step-foot{font-size:12px}.skill-task{min-height:150px}.progress-dialog input,.progress-dialog select,.progress-dialog textarea{font-size:16px}.level-materials .button{font-size:13px}.hero-main>p:not(.eyebrow),.hero-meter>p,.week-goal>p,.progress-ring span{font-size:12px}.journey-tabs{flex-wrap:wrap}.journey-tabs [role=tablist]{gap:20px}.progress-metrics strong small{font-size:12px}.accuracy-section>.row{flex-wrap:wrap}.accuracy-section small{text-align:left}.next-step-card .eyebrow{font-size:10px}.chart-columns .column-label,.chart-gridlines span,.calendar-legend{font-size:11px}
@media(max-width:1230px){.journey-tabs [role=tablist]{gap:16px}.journey-tabs [role=tab]{font-size:13px}.period-switch button{font-size:12px}}
@media(max-width:780px){.page-heading .intro{font-size:14px}.journey-heading .button{font-size:13px}.journey-tabs [role=tablist]{gap:10px}.journey-tabs [role=tab]{font-size:13px}.progress-metrics article>span{font-size:13px}.progress-metrics p{font-size:12px}.hero-meter>p{font-size:10px}.progress-ring span{font-size:10px}.week-goal>p{font-size:12px}.hero-main>p:not(.eyebrow){font-size:12px}.journal-main b{font-size:14px}.journal-main>span,.journal-main>p,.journal-row>strong small,.grade-stop>div>span,.grade-stop small,.progress-footer,.progress-footnote,.section-subtitle{font-size:12px}.journal-row{flex-wrap:wrap;gap:8px}.journal-main{min-width:145px}.journal-row>.icon-button{width:25px}.grade-stop{flex-basis:132px}.level-heading{flex-wrap:wrap}.level-total{display:flex;align-items:center;gap:12px;text-align:left}.level-total>span{max-width:none;font-size:12px}.skill-task{min-height:0}.form-grid label,.form-wide{font-size:14px}.accuracy-section small{max-width:none;font-size:12px}.chart-legend{font-size:12px}.level-materials .button{font-size:12px}}

/* Stage reflections share the existing notebook typography. */
.coach-panel{max-width:960px;margin:auto;padding:26px;background:#fffef9;border:1px solid var(--line);border-radius:14px}.coach-panel h2{font-size:26px}.coach-panel>p,.coach-panel details p{line-height:1.9;color:#536557}.coach-panel .row{margin:22px 0;flex-wrap:wrap}.coach-panel select{padding:9px;background:white;border:1px solid var(--line);border-radius:6px}.coach-preview,.coach-report,.coach-history{margin-top:24px;padding-top:24px;border-top:1px solid var(--line)}.coach-preview pre{max-height:300px;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px;background:var(--pale);padding:16px}.coach-preview .primary{margin-top:15px}.coach-report-text{white-space:pre-wrap;overflow-wrap:anywhere;line-height:2;font-size:15px;margin:20px 0}.coach-history button{margin:8px 8px 0 0}.journey-tabs [role=tablist]{flex-wrap:wrap}.grade-route{grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.library-grade{display:flex;align-items:center;gap:10px;margin:16px 0;flex-wrap:wrap}.library-grade select{padding:9px;border:1px solid var(--line);border-radius:7px;background:white}
@media(max-width:780px){.coach-panel{padding:18px}.coach-panel h2{font-size:22px}.grade-route{display:flex;overflow-x:auto}.coach-panel .row{align-items:flex-start;gap:12px}}

.listen-controls{display:flex;align-items:center;justify-content:flex-end;gap:14px;flex-wrap:wrap}.playback-position{font-variant-numeric:tabular-nums;font-size:12px;white-space:nowrap}.listen-controls [hidden],.result-actions [hidden]{display:none}@media(max-width:780px){.sheet-caption{flex-wrap:wrap;gap:12px}.listen-controls{flex:1 0 100%;justify-content:flex-start;gap:16px}}

/* Leave room to read ahead: full-width systems and controls outside the music. */
#view-practice .page-heading{display:none}
#score-card .piece-header{padding:14px 22px}
#score-card .piece-header h2{font-size:22px;line-height:1.4}
#score-card .piece-header .eyebrow{margin-bottom:2px;font-size:10px}
#score-card .piece-header .muted{margin-top:3px;font-size:12px}
#score-card .sheet-toolbar{padding:8px 18px;gap:10px 18px;flex-wrap:wrap;scroll-margin-top:12px}
#score-card .sheet-toolbar>.row{gap:10px}
#score-card .sheet-toolbar .check-label,#score-card .sheet-label{font-size:12px}
#score-card .listen-controls{margin-left:auto;gap:10px;flex-wrap:wrap;flex:0 1 auto}
#score-card .listen-controls .text-button{font-size:12px;white-space:nowrap}
#score-card .score-zoom{margin-left:auto}
#zoom-value{min-width:36px;text-align:center;font-size:12px;font-variant-numeric:tabular-nums}
#zoom-reset{font-size:12px}
#score-viewer{height:clamp(440px,calc(100dvh - 250px),760px);max-height:none;min-height:0;padding:0}
#score-card>.play-console{position:static}
.focus-mode #score-viewer{height:calc(100dvh - 190px);min-height:400px;max-height:none}
.focus-mode #score-card .piece-header{padding:10px 18px}
@media(min-width:781px){
  #view-practice .studio-main{display:contents}
  #score-card{grid-column:1/-1}
  #feedback-content,#view-practice .keyboard-panel{grid-column:1;align-self:start}
  #view-practice .right-rail{grid-column:2;grid-row:2 / span 2}
}
@media(max-width:780px){
  #view-practice .right-rail{order:1}
  #score-card .piece-header{padding:12px 14px}
  #score-card .piece-header h2{font-size:20px}
  #score-card .sheet-toolbar{gap:8px 12px;padding:8px 12px}
  #score-card .sheet-toolbar>.row:first-child{flex-basis:100%}
  #score-card .listen-controls{margin:0;flex-basis:100%;order:3}
  #score-card .score-zoom{margin-left:0}
  #score-viewer{height:clamp(430px,calc(100dvh - 220px),700px)}
  .focus-mode #score-viewer{height:calc(100dvh - 260px);min-height:360px}
}

.demo-expression{display:flex;flex-direction:column;gap:3px}.demo-expression label{white-space:nowrap}.demo-expression select{max-width:180px}.demo-expression .micro{max-width:300px;line-height:1.6}.sheet-caption{flex-wrap:wrap;gap:10px 18px}

.practice-mode-row{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:14px 24px;border-top:1px solid var(--line);font-size:12px}
.practice-mode-row label{display:flex;align-items:center;gap:10px;white-space:nowrap}
.practice-mode-row select{padding:6px;border:1px solid var(--line);border-radius:5px;background:#f9fbf4}
.practice-mode-row p{color:var(--muted);line-height:1.8;flex:1;min-width:220px}
.follow-live{padding:9px 22px;background:#edf2e6;color:#38543e;font-size:13px;border-bottom:1px solid var(--line);line-height:1.6;font-variant-numeric:tabular-nums}
.follow-live.has-error{background:#fff1df;color:#80562b}
.follow-summary{padding:12px 0;line-height:1.8}
.coach-export-actions{display:flex;flex-wrap:wrap;gap:12px;margin:18px 0 10px}
#coach-export-status{min-height:1.8em;overflow-wrap:anywhere}
.feedback-result>.form-hint{display:block;line-height:1.9;padding:12px 0}
.focus-mode .practice-mode-row{display:none}
.practice-brief{display:flex;justify-content:space-between;gap:20px;padding:18px 22px;margin:0 0 22px;border:1px solid var(--line);border-left:3px solid #63816c;background:#f4f7ef;border-radius:8px;font-size:13px}
.practice-brief b{display:block;font-size:15px;color:var(--ink)}
.practice-brief p{margin:7px 0;line-height:1.7;color:var(--muted)}
.practice-brief small{color:var(--muted)}
.practice-brief>div:last-child{display:flex;flex-direction:column;align-items:flex-end;justify-content:center;gap:6px;white-space:nowrap}
.profile-summaries{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px;margin:18px 0 24px}
.profile-summaries article{padding:16px 18px;border:1px solid var(--line);border-radius:8px;background:#f8faf5;font-size:13px}
.profile-summaries p{line-height:1.8;margin:8px 0;color:var(--muted)}
.profile-summaries small{color:var(--muted);line-height:1.7}
.musical-observations{margin:18px 0}
.musical-observations p{display:flex;gap:16px;border-bottom:1px solid var(--line);padding:12px 0;font-size:13px;line-height:1.8}
.musical-observations b{flex:0 0 100px;color:var(--ink)}
.musical-observations span{color:var(--muted)}
.focus-mode .practice-brief,.focus-mode #human-demo{display:none}
@media(max-width:720px){.practice-brief{flex-direction:column;padding:15px}.practice-brief>div:last-child{align-items:flex-start;white-space:normal}.musical-observations p{flex-direction:column;gap:4px}.musical-observations b{flex-basis:auto}.profile-summaries{grid-template-columns:1fr}}

.human-listen-primary{font-weight:600;color:#335e42}.demo-resource-tag{color:#335e42;background:#edf3e5!important}.practice-recent-issues{max-width:75ch;line-height:1.65}.musical-note-summary{color:#425b47;font-size:14px;margin:12px 0}