header nav{gap:18px}header nav a{font-size:12px}.synth-style-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin:26px 0 12px}.synth-style{border:2px solid transparent;border-radius:20px;background:#e6ecde;padding:20px 12px;text-align:left;display:flex;flex-direction:column;gap:9px;min-width:0}.synth-style:nth-child(2){background:#e7e0f1}.synth-style:nth-child(3){background:#efe2d5}.synth-style:nth-child(4){background:#deeaec}.synth-style:nth-child(5){background:#eee9d2}.synth-style>span{font-size:27px;color:#44734d}.synth-style strong{font:600 20px Outfit}.synth-style small{font-size:10px;line-height:1.6;color:#6d7865}.synth-style.selected{border-color:var(--green);box-shadow:0 3px 0 #cad6be}.harmony-console{border:1px solid #e2e7d9;border-radius:27px;padding:28px;background:white;margin:24px 0}.harmony-console label{font-size:12px}.harmony-console input[type=range]{accent-color:var(--green);max-width:140px;vertical-align:middle}.harmony-console input[type=checkbox]{accent-color:var(--green)}.harmony-console select,.chord-editor select{font:inherit;padding:10px 12px;border:1px solid #dce2d3;border-radius:12px;background:#f8f6ef;color:var(--ink)}.harmony-console .row{margin-bottom:16px}.harmony-transport{justify-content:space-between}.harmony-transport label{display:flex;gap:7px;align-items:center;flex-wrap:wrap}#harmony-count{color:var(--green);font:600 16px Outfit;min-width:90px}.progression-slots{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:26px 0}.chord-slot{border:2px solid transparent;border-radius:18px;padding:18px;text-align:left;min-width:0;background:#e8eddf;color:var(--ink);display:flex;flex-direction:column;gap:9px}.chord-slot:nth-child(2n){background:#e8e1f1}.chord-slot small{font-size:11px;color:#879479}.chord-slot strong{font:600 30px Outfit;letter-spacing:-1px}.chord-slot span{font-size:11px;color:#768367}.chord-slot.selected{border-color:#74956b}.chord-slot.sounding{background:#f5d172;border-color:#d5ae47;box-shadow:0 0 0 3px #f7e6b6}.harmony-presets{flex-wrap:wrap}.harmony-presets .secondary{padding:8px 15px}.chord-editor{background:#f6f5ed;border-radius:23px;padding:24px;margin-top:20px}.chord-editor h2{font-size:25px}.chord-note-tags{display:flex;gap:12px;flex-wrap:wrap;margin:20px 0}.chord-note-tags>span{display:flex;flex-direction:column;gap:4px;border-radius:14px;background:#e7e0f0;color:#70578e;min-width:75px;padding:12px 18px;font:600 23px Outfit}.chord-note-tags>span:first-child{background:#dfe9d4;color:var(--green)}.chord-note-tags small{font:400 10px 'DM Sans';color:#7a8570}.harmony-piano{position:relative;height:185px;width:100%;max-width:760px;margin:20px 0 14px}.piano-white{display:grid;grid-template-columns:repeat(8,1fr);height:100%;gap:3px}.piano-key{position:relative;background:white;border:1px solid #d0d7c6;border-bottom:6px solid #d9dfd0;border-radius:0 0 10px 10px;min-width:0;font:600 17px Outfit;color:#667c55;touch-action:manipulation}.piano-key span{position:absolute;bottom:14px;left:0;right:0;text-align:center}.piano-key.black{position:absolute;top:0;width:7.6%;height:61%;background:#344739;border-color:#293d2d;border-bottom-color:#1f3323;z-index:2;border-radius:0 0 7px 7px}.piano-key.lit{background:#f2cd6c;border-bottom-color:#d8b658}.piano-key.black.lit{background:#aa8bbe;border-bottom-color:#8a6ca4}.piano-key:hover{box-shadow:inset 0 0 0 2px #c9bf91}.harmony-knobs{margin:25px 0 5px;border-top:1px solid #dce2d1;padding-top:18px}.harmony-knobs summary{cursor:pointer;font-size:13px;font-weight:600}.harmony-knobs .row{margin-top:18px;gap:25px}.harmony-knobs label{display:flex;flex-direction:column;gap:9px}.harmony-source{font-size:11px;line-height:1.8;color:#7a866e}.harmony-source a{color:var(--green)}.harmony-staff{width:100%;max-width:760px;height:auto;display:block;margin:22px 0}.harmony-theory{margin:25px 0;background:white;border:1px solid #e3e7dc;border-radius:23px;padding:25px}.harmony-theory>p{font-size:14px;line-height:1.8}.harmony-theory h2{font-size:26px}.harmony-theory .row{margin-bottom:18px}.tone-steps{display:grid;grid-template-columns:repeat(8,1fr);gap:4px;margin:25px 0}.tone-steps>span{background:#e8eddf;border-radius:12px;padding:12px 6px;text-align:center}.tone-steps strong{font:600 22px Outfit}.tone-steps small{display:block;font-size:9px;margin-top:7px;color:#728268}.theory-note{font:600 23px Outfit;color:var(--green)}.interval-diagram{display:grid;grid-template-columns:1fr 1fr;gap:12px}.interval-diagram>div{background:#e7e0f0;padding:20px;border-radius:15px;font-size:14px}.interval-diagram strong{display:block;font:600 25px Outfit;margin-top:8px}.theory-progression{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:25px 0}.theory-progression span{background:#e8eddf;border-radius:14px;padding:16px 20px;font:600 26px Outfit}.theory-progression b{color:#879d74}@media(max-width:750px){.synth-style-grid{grid-template-columns:repeat(2,1fr)}.synth-style-grid .synth-style:last-child{grid-column:span 2}.harmony-console{padding:20px 16px}.harmony-transport{justify-content:flex-start}.progression-slots{gap:8px}.chord-slot{padding:14px 10px}.chord-slot strong{font-size:24px}.chord-editor{padding:18px 12px}.harmony-theory{padding:20px 15px}.tone-steps{grid-template-columns:repeat(4,1fr)}.harmony-piano{height:150px}.piano-key{font-size:14px}.interval-diagram{grid-template-columns:1fr}.theory-progression{gap:4px}.theory-progression span{padding:12px;font-size:20px}.harmony-console .primary{padding:14px 20px}}@media(max-width:440px){.progression-slots{grid-template-columns:repeat(2,1fr)}.chord-note-tags{gap:7px}.chord-note-tags>span{min-width:60px;padding:10px 12px}.chord-slot strong{font-size:26px}}
/* Compact chord desk; the theory chapters retain their larger keyboards. */
.harmony-workspace .harmony-heading{display:flex;align-items:center;justify-content:space-between;gap:15px}.harmony-workspace h1{font-size:30px;margin:5px 0}.harmony-workspace .eyebrow{font-size:11px}.harmony-intro{font-size:13px;margin:5px 0 10px;color:#667360}
.harmony-workspace .synth-style-grid{gap:8px;margin:8px 0}.harmony-workspace .synth-style{padding:9px 12px;display:grid;grid-template-columns:22px 1fr;gap:2px 6px;border-radius:13px}.harmony-workspace .synth-style>span{font-size:20px;grid-row:span 2}.harmony-workspace .synth-style strong{font-size:16px}.harmony-workspace .synth-style small{font-size:9px;line-height:1.3}
.harmony-workspace .harmony-console{margin:8px 0;padding:12px 16px;border-radius:20px}.harmony-workspace .row{gap:10px;margin-bottom:8px}.harmony-workspace button.primary,.harmony-workspace button.secondary{padding:8px 13px;font-size:12px}.harmony-workspace .harmony-console select{padding:6px 8px;font-size:12px}.harmony-workspace .harmony-transport input[type=range]{width:100px}.harmony-workspace #harmony-count{font-size:13px}.harmony-shortcut{font-size:11px;color:#6c7865}.harmony-shortcut kbd{background:#e9eddf;border-radius:4px;padding:3px 6px;font-weight:700}
.harmony-workspace .harmony-build{gap:14px;padding:7px 0;border-top:1px solid #edf0e8}.harmony-build label{white-space:nowrap}.harmony-workspace .progression-slots{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:6px 0 10px}.harmony-workspace .chord-slot{gap:4px;padding:7px 9px;border-radius:13px}.harmony-workspace .slot-title{display:flex;align-items:baseline;gap:9px}.harmony-workspace .slot-title strong{font-size:23px;letter-spacing:-.5px}.harmony-workspace .slot-title>span{margin-left:auto;font-size:10px}.harmony-workspace .slot-notes{text-align:center;font-size:11px;font-weight:600;color:#526347}.mini-piano{display:block;width:100%;height:65px;min-width:0}.harmony-workspace .chord-slot.sounding{box-shadow:0 0 0 2px #f5e5b3}
.chord-chooser{padding:9px 11px;background:#f5f4ec;border-radius:14px;margin:7px 0}.chooser-heading{display:flex;align-items:center;gap:12px;font-size:13px;margin-bottom:7px}.chooser-heading>span{font-size:11px;color:#6e7766}.chord-palette{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:7px}.chord-palette button{display:flex;flex-direction:column;align-items:flex-start;gap:3px;padding:7px 9px;border:2px solid transparent;background:#e4eadc;border-radius:11px;color:#354c36;min-width:0}.chord-palette button:nth-child(2n){background:#e9e0f0}.chord-palette button.selected{border-color:#66885c;box-shadow:0 2px #b6c6aa}.chord-palette strong{font:600 21px Outfit}.chord-palette small{font-size:10px}.chord-palette span{font-size:10px;color:#637158}.harmony-workspace .harmony-presets{gap:7px;margin:8px 0 4px}.harmony-workspace .harmony-presets .secondary{padding:5px 10px}.key-hint{font-size:11px;color:#5c7052;margin-left:auto;max-width:420px}.harmony-workspace .harmony-knobs{margin:7px 0 2px;padding-top:7px}.harmony-workspace .harmony-knobs summary{font-size:11px}.harmony-workspace .harmony-knobs p{font-size:12px;line-height:1.6}.harmony-workspace #harmony-status{font-size:11px;margin:5px 0 0;min-height:17px}.harmony-workspace .chord-editor{padding:0;margin:0;background:transparent}.harmony-workspace .chord-editor h2{display:none}.harmony-workspace .chord-editor>.row:first-child{display:none}.harmony-workspace .chord-note-tags{margin:6px 0;gap:6px}.harmony-workspace .chord-note-tags>span{padding:5px 10px;font-size:15px;min-width:50px}.harmony-workspace .chord-note-tags small{font-size:9px}
body.harmony-focus>header,body.harmony-focus main>section:not(#course-view),body.harmony-focus main>footer,body.harmony-focus #course-view>.site-nav,body.harmony-focus .harmony-intro{display:none!important}body.harmony-focus main{max-width:1180px;padding:8px 12px;margin:0 auto}body.harmony-focus .course-page{padding:0;min-height:0}body.harmony-focus .harmony-workspace h1{font-size:24px}body.harmony-focus .mini-piano{height:55px}body.harmony-focus .harmony-console{padding:10px 14px}
@media(max-width:750px){.harmony-workspace .harmony-heading{gap:8px}.harmony-workspace h1{font-size:24px}.harmony-workspace .synth-style-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.harmony-workspace .synth-style-grid .synth-style:last-child{grid-column:auto}.harmony-workspace .synth-style{padding:7px;display:flex;gap:3px}.harmony-workspace .synth-style>span,.harmony-workspace .synth-style small{display:none}.harmony-workspace .synth-style strong{font-size:12px}.harmony-workspace .harmony-console{padding:10px}.harmony-workspace .progression-slots{grid-template-columns:repeat(2,minmax(0,1fr))}.chord-palette{grid-template-columns:repeat(3,minmax(0,1fr))}.chooser-heading{flex-wrap:wrap;gap:7px}.chooser-heading>span{width:100%}.key-hint{max-width:none;width:100%}.harmony-workspace .harmony-build{gap:9px}.harmony-workspace .slot-title strong{font-size:21px}}
body.harmony-focus .harmony-workspace .chord-slot{padding:5px 8px;gap:2px}body.harmony-focus .harmony-workspace .slot-title{line-height:1}body.harmony-focus .harmony-workspace .slot-title strong{font-size:21px;line-height:1.1}body.harmony-focus .harmony-workspace .slot-notes{line-height:1.1;font-size:10px}body.harmony-focus .mini-piano{height:48px}body.harmony-focus .chord-palette button{padding:5px 8px;gap:2px}body.harmony-focus .chord-palette strong{font-size:20px;line-height:1.1}body.harmony-focus .chord-palette small,body.harmony-focus .chord-palette span{line-height:1.2}body.harmony-focus .harmony-workspace .synth-style{padding:6px 12px}body.harmony-focus .harmony-workspace .synth-style strong{line-height:1.2}body.harmony-focus .harmony-workspace .synth-style small{line-height:1.1}
.harmony-workspace #harmony-status:empty{display:none}