.ear-training{width:min(520px,100%);margin:0 auto;padding:36px 24px 50px}.ear-training button,.ear-training summary{cursor:pointer;touch-action:manipulation;min-height:44px}.ear-training button:disabled{cursor:default}.ear-training h1{font-size:36px}.ear-training h2{margin:18px 0 8px;font-family:Georgia,serif;font-size:27px;font-weight:500}.ear-training h2:focus{outline:none}.ear-heading{justify-content:space-between;align-items:center;gap:10px;margin-bottom:28px;display:flex}.ear-text-button{color:var(--muted);background:0 0;border:0;padding:8px 0;font-size:12px}.ear-round-label{color:var(--muted);letter-spacing:.7px;font-size:11px}.ear-progress{background:var(--line);border-radius:4px;height:4px;margin:12px 0 25px;overflow:hidden}.ear-progress>div{background:var(--green);height:100%;transition:width .2s}.ear-meta{color:var(--muted);flex-wrap:wrap;justify-content:space-between;gap:10px;font-size:11px;display:flex}.ear-feedback p{color:var(--muted);font-size:13px;line-height:1.65}.ear-player{border:1px solid var(--line);background:var(--green-soft);border-radius:10px;margin:23px 0;padding:15px 17px}.ear-player-row{justify-content:space-between;align-items:center;gap:12px;display:flex}.ear-player-row span{font-variant-numeric:tabular-nums;color:var(--green);font-size:12px}.ear-play,.ear-primary{background:var(--green);color:#fff;border:1px solid var(--green);border-radius:7px;padding:12px 17px;font-size:14px}.ear-play{min-width:110px}.ear-player input{width:100%;height:32px;accent-color:var(--green);margin-top:12px}.ear-answers{gap:12px;display:grid}.ear-answer{border:1px solid var(--line);background:var(--paper);text-align:left;border-radius:10px;justify-content:space-between;align-items:center;gap:10px;width:100%;padding:17px;display:flex;min-height:66px!important}.ear-answer strong{font-family:Georgia,serif;font-size:17px;font-weight:500}.ear-answer:hover:not(:disabled){border-color:var(--green)}.ear-answer.correct{background:var(--green-soft);border-color:#719080}.ear-answer.wrong{background:#f5e6e3;border-color:#b97868}.ear-feedback{margin-top:20px;font-size:13px}.ear-feedback h3{color:var(--green);font-size:14px}.ear-feedback.missed h3,.ear-error{color:#a3544b}.ear-primary{width:100%;margin-top:17px;min-height:50px!important}.ear-primary:hover,.ear-play:hover{background:#193d34}.ear-secondary{color:var(--green);background:0 0}.ear-secondary:hover{background:var(--green-soft)}.ear-training summary{padding:12px 0;font-size:12px}.ear-score{margin:24px 0 10px;font-family:Georgia,serif;font-size:64px}.ear-score small{color:var(--muted);font-size:27px}.ear-results{padding:0;list-style:none}.ear-results li{border-bottom:1px solid var(--line);justify-content:space-between;gap:12px;padding:12px 0;font-size:12px;line-height:1.5;display:flex}.ear-results li>span:last-child{white-space:nowrap}.ear-shuffle{min-height:48px;color:var(--muted);align-items:center;gap:10px;margin-top:14px;font-size:13px;display:flex}.ear-shuffle input{width:20px;height:20px;accent-color:var(--green)}.ear-error{font-size:12px}.ear-training button:focus-visible,.ear-training input:focus-visible,.ear-training summary:focus-visible{outline:3px solid var(--ochre);outline-offset:3px}@media (width<=760px){.ear-training{padding:28px 18px 40px}}@media (prefers-reduced-motion:reduce){.ear-progress>div{transition:none}}.ear-autoplay{min-height:44px;color:var(--muted);align-items:center;gap:8px;margin:-10px 0 12px;font-size:12px;display:flex}.ear-autoplay input{width:18px;height:18px;accent-color:var(--green)}.transcription{max-width:1280px}.transcription button,.transcription select,.transcription input{border:1px solid var(--line);background:var(--paper);min-height:44px;color:var(--ink);font:inherit;border-radius:7px;font-size:13px}.transcription button{cursor:pointer;padding:8px 13px}.transcription button:hover{border-color:var(--green);background:var(--green-soft)}.transcription button:disabled{opacity:.4;cursor:not-allowed}.transcription :is(button,select,input):focus-visible{outline:3px solid var(--ochre);outline-offset:2px}.transcription input,.transcription select{width:100%;padding:9px 11px}.transcription label{min-width:0;color:var(--muted);flex-direction:column;gap:7px;font-size:11px;display:flex}.transcription h2{margin-bottom:7px;font-family:Georgia,serif;font-size:24px;font-weight:500}.transcription .tx-primary{background:var(--green);border-color:var(--green);color:#fff}.tx-library{flex-wrap:wrap;align-items:flex-end;gap:14px;margin:30px 0 24px;display:flex}.tx-library>label{flex:1;min-width:190px}.tx-create{flex:1.4;align-items:flex-end;gap:8px;display:flex}.tx-create label{flex:1}.tx-backups{gap:7px;display:flex}.tx-chart,.tx-edit,.tx-audition{border:1px solid var(--line);background:var(--paper);border-radius:12px;margin-top:20px;padding:22px}.tx-chart-heading{flex-wrap:wrap;align-items:flex-end;gap:14px;margin-bottom:20px;display:flex}.tx-chart-heading .tx-title{flex:1;min-width:180px}.tx-title input{font-family:Georgia,serif;font-size:24px}.tx-bars{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;display:grid}.tx-bar{border:1px solid var(--line);border-radius:8px;min-height:116px;overflow:hidden}.tx-bar.is-selected{border-color:var(--green);box-shadow:0 0 0 2px var(--green);background:#f1f6f0}.transcription .tx-bar-select{border:0;border-bottom:1px solid var(--line);text-align:left;width:100%;min-height:44px;color:var(--muted);background:0 0;border-radius:0;justify-content:space-between;align-items:center;gap:6px;font-size:11px;display:flex}.tx-bar-select small{overflow-wrap:anywhere;text-align:right}.tx-chips{flex-wrap:wrap;align-content:flex-start;gap:7px;padding:10px;display:flex}.transcription .tx-chips button{font-variant-numeric:lining-nums;padding:7px 10px;font-size:18px}.transcription .tx-chips .is-editing{background:var(--green);color:#fff;border-color:var(--green)}.transcription .tx-chips .tx-empty-bar{color:var(--muted);background:0 0;border:0;font-size:11px}.tx-chart-actions{flex-wrap:wrap;align-items:center;gap:10px;margin-top:15px;display:flex}.tx-chart-actions span{color:var(--muted);margin-left:auto;font-size:11px}.tx-edit{border-color:#a6b9ad}.tx-edit-heading,.tx-grid-heading{justify-content:space-between;align-items:center;gap:16px;margin-bottom:15px;display:flex}.tx-edit-heading h2{margin:0}.tx-edit-fields{flex-wrap:wrap;align-items:flex-end;gap:9px;display:flex}.tx-edit-fields label{flex:1;min-width:130px;max-width:230px}.tx-chord-editor{border-top:1px solid var(--line);margin-top:18px;padding-top:18px}.tx-chord-editor>strong{margin-bottom:13px;font-size:15px;font-weight:500;display:block}.tx-grid-heading p,.tx-welcome p{color:var(--muted);margin-bottom:0;font-size:13px;line-height:1.6}.tx-grid-heading>button{flex-shrink:0}.tx-grid-scroll{overflow-x:auto}.tx-grid{table-layout:fixed;border-collapse:collapse;width:100%}.tx-grid th{color:var(--muted);overflow-wrap:anywhere;padding:8px 3px;font-size:11px;font-weight:500}.tx-grid th:first-child{width:45px}.tx-grid td{padding:3px}.transcription .tx-grid button{width:100%;min-height:48px;padding:8px 3px;font-size:17px}.tx-footnote{color:var(--muted);margin:14px 0 0;font-size:11px;line-height:1.7}.tx-notice{background:#f5e9d7;border-radius:7px;justify-content:space-between;align-items:center;gap:12px;padding:10px 14px;font-size:13px;display:flex}.tx-welcome{margin:30px 0;padding:25px 0}@media (width<=760px){.tx-library{gap:14px 10px}.tx-library>label,.tx-create{flex-basis:100%}.tx-chart,.tx-edit,.tx-audition{padding:14px}.tx-bars{grid-template-columns:repeat(2,minmax(0,1fr))}.tx-chart-heading{gap:12px}.tx-chart-heading .tx-title{flex-basis:100%}.tx-chart-heading>label{flex:1}.tx-chart-actions span{width:100%;margin:2px 0 0}.tx-grid th{font-size:9px}.tx-grid th:first-child{width:27px}.tx-grid td{padding:2px}.transcription .tx-grid button{letter-spacing:-.3px;font-size:13px}.tx-grid-heading{align-items:flex-start}.tx-grid-heading p{font-size:12px}.tx-grid-heading h2{font-size:23px}.tx-edit-fields label{max-width:none}.tx-edit-fields>button{flex:1}}@media (width<=360px){.tx-chart,.tx-edit,.tx-audition{padding:10px}.transcription .tx-grid button{font-size:12px}}.tx-transport{flex-wrap:wrap;align-items:center;gap:12px;padding:0 0 18px;display:flex}.tx-transport label{width:110px}.tx-transport>span{color:var(--muted);font-size:11px;line-height:1.5}.tx-bar.is-playing{border-color:var(--ochre);box-shadow:inset 0 0 0 2px var(--ochre);background:#f8edda}.transcription .tx-chips .is-sounding{background:var(--ochre);color:#fff;border-color:var(--ochre);opacity:1}.tx-bar.is-playing .tx-bar-select{color:var(--ink);opacity:1}@media (width<=760px){.tx-transport>span{flex-basis:100%}.tx-transport>button{flex:1}}.feature-nav{border-bottom:1px solid var(--line);background:var(--paper)}.feature-nav-inner{gap:8px;width:min(1280px,100%);margin:0 auto;padding:10px 42px;display:flex}.feature-nav a{min-height:40px;color:var(--muted);border-radius:7px;align-items:center;padding:0 16px;font-size:13px;text-decoration:none;display:inline-flex}.feature-nav a[aria-current]{background:var(--green);color:#fff}.feature-nav a:hover:not([aria-current]){background:var(--green-soft);color:var(--green)}.feature-nav a:focus-visible{outline:3px solid var(--ochre);outline-offset:2px}@media (width<=1050px){.feature-nav-inner{padding-inline:30px}}@media (width<=760px){.feature-nav-inner{padding-inline:18px}}.quiz-hub{width:min(1280px,100%);margin:0 auto;padding:45px 42px 70px}.quiz-category-list{gap:36px;margin-top:36px;display:grid}.quiz-category-list h2{margin-bottom:8px;font-family:Georgia,serif;font-size:24px;font-weight:500}.quiz-card-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),380px));gap:16px;display:grid}.quiz-card{border:1px solid var(--line);background:var(--paper);color:var(--ink);border-radius:10px;padding:24px;text-decoration:none;display:block}.quiz-card:hover{border-color:var(--green);background:#f5f7f1}.quiz-card h3{justify-content:space-between;gap:16px;margin-bottom:12px;font-family:Georgia,serif;font-size:22px;font-weight:500;display:flex}.quiz-card h3 span{color:var(--green)}.quiz-card small{color:var(--green);font-size:11px}.quiz-breadcrumb{width:min(520px,100%);color:var(--muted);flex-wrap:wrap;align-items:center;gap:8px;margin:0 auto;padding:22px 24px 0;font-size:11px;display:flex}.quiz-breadcrumb a{min-height:44px;color:var(--green);align-items:center;text-decoration:none;display:inline-flex}.quiz-breadcrumb a:hover{text-decoration:underline}.quiz-breadcrumb+.ear-training{padding-top:16px}.quiz-card:focus-visible,.quiz-breadcrumb a:focus-visible{outline:3px solid var(--ochre);outline-offset:3px}@media (width<=1050px){.quiz-hub{padding-inline:30px}}@media (width<=760px){.quiz-hub{padding:32px 18px 50px}.quiz-breadcrumb{padding:14px 18px 0}.quiz-card{padding:20px}}:root{color:#282823;font-synthesis:none;text-rendering:optimizelegibility;--ink:#282823;--muted:#77776d;--paper:#fbfaf6;--line:#dfddd4;--green:#234d42;--green-soft:#dfe9e3;--ochre:#bf7c35;background:#f4f1ea;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{background:#f4f1ea;min-width:320px;min-height:100vh;margin:0}button,input,textarea{font:inherit}button{color:inherit}.app-shell{min-height:100vh}.family-quality.minor{color:#4b776d}.family-quality.major{color:#b56e28}.family-quality.half-diminished{color:#a65d56}.family-quality.dominant{color:#69618b}.family-quality.suspended{color:#52799a}main{min-width:0}.content{width:min(1280px,100%);margin:0 auto;padding:45px 42px 70px}.page-heading{justify-content:space-between;align-items:flex-end;gap:30px;display:flex}.eyebrow{color:var(--ochre);letter-spacing:1.7px;text-transform:uppercase;margin:0 0 10px;font-size:10px;font-weight:750}h1,h2,h3,p{margin-top:0}h1{letter-spacing:-1.7px;margin-bottom:9px;font-family:Georgia,Times New Roman,serif;font-size:clamp(35px,4vw,48px);font-weight:500;line-height:1.05}.lede{color:var(--muted);margin-bottom:0;font-family:Georgia,serif;font-size:15px;font-style:italic}.summary-card{border:1px solid var(--line);background:#fbfaf6bf;border-radius:10px;align-items:center;gap:22px;padding:16px 20px;display:flex}.summary-card div{flex-direction:column;display:flex}.summary-card strong{font-family:Georgia,serif;font-size:22px;font-weight:500}.summary-card span{color:#8b897f;letter-spacing:.7px;text-transform:uppercase;margin-top:2px;font-size:9px}.summary-card i{background:var(--line);width:1px;height:29px}.filter-panel{border:1px solid var(--line);background:#fbfaf6a8;border-radius:10px;margin-top:36px;overflow:hidden}.filter-row{align-items:center;gap:20px;min-height:58px;padding:10px 14px 10px 19px;display:flex}.filter-row+.filter-row{border-top:1px solid var(--line)}.filter-heading{border-right:1px solid var(--line);min-width:104px;padding-right:18px}.filter-heading span{font-family:Georgia,serif;font-size:13px;display:block}.filter-heading small{color:#9a978e;letter-spacing:.9px;text-transform:uppercase;margin-top:3px;font-size:8px;display:block}.filter-options{scrollbar-width:none;align-items:center;gap:5px;display:flex;overflow-x:auto}.filter-options::-webkit-scrollbar{display:none}.filter-options button{color:#6d6b63;cursor:pointer;white-space:nowrap;background:0 0;border:1px solid #0000;border-radius:7px;flex:none;min-width:42px;height:34px;padding:0 12px;font-family:Georgia,serif;font-size:12px}.filter-options button:hover{border-color:#d6d2c8}.filter-options button.active{border-color:var(--green);background:var(--green);color:#fff}.midi-controls{flex:1;align-items:center;gap:10px;min-width:0;display:flex}.midi-connect{border:1px solid var(--green);background:var(--green);color:#fff;cursor:pointer;border-radius:7px;flex:none;height:34px;padding:0 13px;font-family:Georgia,serif;font-size:11px}.midi-connect:hover{background:#193d34}.midi-status{color:#77746c;align-items:center;gap:6px;min-width:0;font-size:10px;display:flex}.midi-status i{background:#aaa79f;border-radius:50%;flex:none;width:7px;height:7px}.midi-status.connected i{background:#3f8d70;box-shadow:0 0 0 3px #3f8d701f}.midi-status.connecting i{background:var(--ochre)}.midi-status.error i{background:#b65f53}.midi-status span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.held-notes{align-items:center;gap:3px;display:flex}.held-notes span{color:#4f4e48;text-align:center;background:#fff;border:1px solid #d3cfc5;border-radius:5px;min-width:29px;padding:4px 6px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:9px}.midi-hint{color:#9a978e;letter-spacing:.35px;white-space:nowrap;margin-left:auto;font-size:8px}.midi-hint.active{color:var(--green);font-weight:700}.result-toolbar{justify-content:space-between;align-items:center;gap:16px;min-height:58px;display:flex}.result-toolbar strong{letter-spacing:.1px;font-size:11px}.result-toolbar span{color:#99968d;font-size:10px}.library-actions{gap:7px;display:flex}.primary-action,.secondary-action{cursor:pointer;border-radius:7px;min-height:34px;padding:0 13px;font-size:11px}.primary-action{border:1px solid var(--green);background:var(--green);color:#fff}.primary-action:hover{background:#193d34}.secondary-action{background:var(--paper);color:#64625b;border:1px solid #d3cfc5}.secondary-action:hover{background:#f0ede6;border-color:#aaa69c}.secondary-action:disabled{opacity:.45;cursor:not-allowed}.voicing-stack{color:#55544d;gap:1px;min-width:max-content;font-family:ui-monospace,SFMono-Regular,Consolas,Liberation Mono,monospace;font-size:11px;line-height:1.12;display:grid}.note-line{gap:4px;display:flex}.degree{grid-template-columns:.65em .65em;align-items:baseline;display:inline-grid}.accidental{text-align:right}.top-degree{color:var(--ochre)}.matrix-shell{border:1px solid var(--line);background:var(--paper);border-radius:10px;overflow:auto;box-shadow:0 2px 6px #1e1e1908}.matrix{border-collapse:collapse;table-layout:fixed;width:100%;min-width:960px;font-size:10px}.matrix th,.matrix td{text-align:center;vertical-align:middle;border-bottom:1px solid #e7e4dc;border-right:1px solid #e7e4dc;height:40px;padding:1px 4px}.matrix thead th{z-index:2;color:#747169;background:#eeebe4;height:30px;font-family:Georgia,serif;font-size:10px;position:sticky;top:0}.matrix thead th:first-child,.matrix tbody th:first-child{z-index:3;background:#f5f2ec;width:64px;position:sticky;left:0}.matrix thead th:nth-child(2),.matrix tbody th:nth-child(2){z-index:3;text-align:left;background:#f9f7f2;width:110px;padding-left:10px;position:sticky;left:64px}.matrix thead th:nth-child(2){text-align:center;padding-left:4px}.matrix tbody th:first-child{font-size:9px;font-weight:650}.matrix tbody th:nth-child(2) strong{font-family:Georgia,serif;font-size:12px;font-weight:500;display:block}.matrix tbody th:nth-child(2) small{color:#a19e95;text-transform:uppercase;margin-top:1px;font-size:7px;font-weight:500;display:block}.matrix td{color:#99968f;text-align:left;padding-left:7px}.matrix td .voicing-stack{gap:3px;font-size:9px;line-height:1}.matrix td .note-line{justify-content:flex-start;gap:2px}.empty-cell{color:#d2cfc6;text-align:center;display:block}.voicing-button{text-align:left;cursor:pointer;background:0 0;border:0;border-radius:5px;width:100%;min-height:34px;padding:3px}.voicing-button:hover,.voicing-button:focus-visible{background:#ebe8df;outline:none}.shape-edit-button{text-align:left;cursor:pointer;background:0 0;border:0;border-radius:5px;width:100%;min-height:36px;padding:3px 20px 3px 0;position:relative}.shape-edit-button:hover,.shape-edit-button:focus-visible{background:#ebe8df;outline:none}.shape-edit-button i{background:var(--ochre);border-radius:50%;width:6px;height:6px;position:absolute;top:7px;right:7px;box-shadow:0 0 0 2px #f3e5d5}.matrix td.midi-match-cell{background:#edf4ef;padding-left:3px;box-shadow:inset 0 0 0 1px #aac8b7}.midi-match-button{justify-content:space-between;align-items:center;gap:3px;display:flex}.midi-match-button .degree:not(.midi-note-match){opacity:.4}.degree.midi-note-match{background:var(--green);color:#fff;opacity:1;border-radius:3px;margin:-1px -2px;padding:1px 2px}.midi-root{min-width:22px;color:var(--green);flex-direction:column;align-items:center;margin-left:auto;font-family:Georgia,serif;font-size:12px;font-weight:700;line-height:1;display:flex}.midi-root small{color:#7b9689;letter-spacing:.5px;text-transform:uppercase;margin-bottom:2px;font-family:Inter,sans-serif;font-size:5px;font-weight:750}.dialog-backdrop{z-index:20;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#1d1f1b8f;place-items:center;padding:24px;display:grid;position:fixed;inset:0}.voicing-dialog{background:var(--paper);border:1px solid #d6d1c5;border-radius:14px;width:min(760px,100%);padding:28px;position:relative;overflow:hidden;box-shadow:0 22px 65px #14161340}.voicing-dialog h2{margin-bottom:8px;font-family:Georgia,serif;font-size:30px;font-weight:500}.dialog-close{color:#66645d;cursor:pointer;background:#ece9e1;border:0;border-radius:50%;width:34px;height:34px;font-size:24px;line-height:1;position:absolute;top:15px;right:16px}.shape-editor,.export-dialog{background:var(--paper);border:1px solid #d6d1c5;border-radius:14px;width:min(720px,100%);max-height:calc(100vh - 48px);position:relative;overflow-y:auto;box-shadow:0 22px 65px #14161340}.shape-editor form,.export-dialog{padding:28px}.shape-editor h2,.export-dialog h2{margin-bottom:21px;font-family:Georgia,serif;font-size:28px;font-weight:500}.editor-fields{grid-template-columns:1fr 1fr;gap:13px;display:grid}.editor-fields label{grid-column:1/-1}.editor-fields label>span{color:#77746c;letter-spacing:.65px;text-transform:uppercase;margin:0 0 6px 2px;font-size:9px;font-weight:700;display:block}.editor-fields input{width:100%;height:39px;color:var(--ink);background:#fff;border:1px solid #d4d0c6;border-radius:7px;outline:none;padding:0 11px;font-size:12px}.editor-fields input:focus{border-color:var(--green);box-shadow:0 0 0 3px #234d421a}.editor-section-heading{justify-content:space-between;align-items:flex-start;margin-top:24px;display:flex}.editor-section-heading h3{margin-bottom:3px;font-family:Georgia,serif;font-size:16px;font-weight:500}.editor-section-heading p{color:#918e85;margin-bottom:10px;font-size:9px}.editor-section-heading>strong{background:var(--green-soft);min-width:25px;color:var(--green);text-align:center;border-radius:12px;padding:4px 7px;font-size:10px}.editor-voicings{gap:5px;display:grid}.editor-voicing{background:#fff;border:1px solid #e1ded6;border-radius:7px;grid-template-columns:25px minmax(120px,1fr) auto auto;align-items:center;gap:10px;min-height:44px;padding:6px 8px;display:grid}.voicing-number{color:#88857c;background:#efede7;border-radius:50%;place-items:center;width:22px;height:22px;font-size:9px;display:grid}.voicing-top-note{color:var(--ochre);white-space:nowrap;font-size:9px}.editor-voicing>button{color:#a3544b;cursor:pointer;background:0 0;border:0;border-radius:5px;padding:5px 7px;font-size:9px}.editor-voicing>button:hover{background:#f5e6e3}.no-voicings{color:#96938b;text-align:center;border:1px dashed #d7d3ca;border-radius:7px;padding:22px;font-family:Georgia,serif;font-size:12px;font-style:italic}.midi-capture{background:#f2f0e9;border:1px solid #d8d4ca;border-radius:8px;align-items:center;gap:12px;min-height:55px;margin-top:14px;padding:9px 11px;display:flex}.midi-capture>div:first-child{align-items:center;gap:9px;min-width:190px;display:flex}.midi-capture strong,.midi-capture small{display:block}.midi-capture strong{margin-bottom:2px;font-family:Georgia,serif;font-size:11px;font-weight:500}.midi-capture small{color:#8e8b82;font-size:8px}.capture-light{background:#aaa79f;border-radius:50%;flex:none;width:9px;height:9px}.midi-capture.recording{background:#eaf2ed;border-color:#9ec0ad}.midi-capture.recording .capture-light{background:#3f8d70;box-shadow:0 0 0 4px #3f8d7024}.midi-capture .held-notes{margin-left:auto;overflow-x:auto}.capture-notice{min-height:15px;color:var(--green);margin:5px 2px 0;font-size:9px}.editor-actions{justify-content:space-between;gap:7px;margin-top:16px;display:flex}.editor-actions>div{gap:7px;display:flex}.danger-action{color:#a3544b;cursor:pointer;background:0 0;border:1px solid #d8b7b1;border-radius:7px;min-height:34px;padding:0 11px;font-size:10px}.danger-action:hover,.danger-action.confirming{color:#fff;background:#a3544b;border-color:#a3544b}.danger-action:disabled{opacity:.45;cursor:not-allowed}.danger-action:disabled:hover{color:#a3544b;background:0 0;border-color:#d8b7b1}.export-dialog{width:min(760px,100%)}.export-dialog>p:not(.eyebrow){color:#77746c;margin:-10px 45px 14px 0;font-size:11px;line-height:1.55}.export-dialog code{color:#4b554f;font-family:ui-monospace,monospace;font-size:10px}.export-dialog textarea{resize:vertical;color:#e8e5dc;background:#292b28;border:1px solid #d1cdc3;border-radius:8px;outline:none;width:100%;min-height:340px;padding:13px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:10px;line-height:1.55}.export-dialog textarea:focus{border-color:var(--green)}.root-picker{flex-wrap:wrap;gap:4px;margin:0 0 15px;display:flex}.root-picker button{color:#6d6b63;cursor:pointer;background:0 0;border:1px solid #d8d4ca;border-radius:5px;min-width:34px;height:28px;padding:0 7px;font-family:Georgia,serif;font-size:11px}.root-picker button:hover{background:#eeebe4}.root-picker button.active{border-color:var(--green);background:var(--green);color:#fff}.voicing-picker{flex-wrap:wrap;align-items:center;gap:4px;margin:0 0 14px;display:flex}.voicing-picker button{color:#6d6b63;cursor:pointer;background:0 0;border:1px solid #d8d4ca;border-radius:5px;min-width:34px;height:28px;padding:0 7px;font-family:ui-monospace,monospace;font-size:10px}.voicing-picker button:hover{background:#eeebe4}.voicing-picker button.active{border-color:var(--ochre);background:var(--ochre);color:#fff}.piano-scroll{padding-bottom:6px;overflow-x:auto}.piano{-webkit-user-select:none;user-select:none;min-width:max-content;height:76px;position:relative}.white-keys{height:100%;display:flex}.piano-key{justify-content:center;align-items:flex-end;display:flex;position:relative}.white-key{background:#fff;border:1px solid #aaa79f;border-radius:0 0 3px 3px;flex:0 0 20px;width:20px;height:76px}.white-key+.white-key{border-left:0}.black-key{z-index:1;background:#292a27;border-radius:0 0 2px 2px;width:12px;height:46px;position:absolute;top:0;box-shadow:0 2px 3px #0003}.piano-key.pressed{background:var(--note-color)}.piano-key span{color:#fff;margin-bottom:8px;font-family:ui-monospace,monospace;font-size:8px;font-weight:750}.white-key span{color:var(--paper)}.empty-state{text-align:center;color:var(--muted);border:1px dashed #d4d0c7;border-radius:10px;padding:70px 20px}.empty-state div{color:#aaa79d;font-family:Georgia,serif;font-size:32px}.empty-state h2{color:var(--ink);margin:12px 0 6px;font-family:Georgia,serif;font-weight:500}.empty-state p{font-size:12px}.empty-state button{cursor:pointer;background:#fff;border:1px solid #d4d0c7;border-radius:6px;padding:8px 13px}@media (width<=1050px){.content{padding-inline:30px}.summary-card{display:none}}@media (width<=760px){.content{padding:32px 18px 50px}.page-heading{display:block}h1{font-size:36px}.filter-panel{margin-top:28px}.filter-row{padding:10px;display:block}.filter-heading{border:0;margin:0 0 8px 4px;padding:0}.filter-heading small{margin-left:5px;display:inline}.filter-heading span{display:inline}.midi-controls{flex-wrap:wrap}.midi-hint{width:100%;margin-left:0}.held-notes{overflow-x:auto}.result-toolbar{flex-direction:column;align-items:flex-start;padding:10px 0}.library-actions{width:100%}.library-actions button{flex:1}.dialog-backdrop{padding:12px}.voicing-dialog{padding:24px 18px}.shape-editor,.export-dialog{max-height:calc(100vh - 24px)}.shape-editor form,.export-dialog{padding:24px 16px}.editor-fields{grid-template-columns:1fr}.editor-fields label{grid-column:auto}.editor-voicing{grid-template-columns:25px minmax(100px,1fr) auto}.voicing-top-note{display:none}.midi-capture{flex-wrap:wrap;align-items:flex-start}.midi-capture .held-notes{width:100%;margin-left:0}}