@import "https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@500;600;700&family=IBM+Plex+Sans:wght@400;500;600;700;800&family=IBM+Plex+Serif:wght@600;700&display=swap";:root{--bg:#eee8dc;--paper:#fbf7ee;--panel:#fbf7ee;--surface:#efe6d6;--surface-strong:#e2d4bd;--ink:#211b15;--line:#d5c5ab;--line-strong:#8a765d;--text:#2c251d;--text-strong:#17120e;--muted:#746652;--gold:#b66d19;--mint:#2d766e;--rose:#a84a3f;--focus:#205f86;--shadow:0 .35rem 0 #231b1214;--sans:"IBM Plex Sans", Avenir, "Avenir Next", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--serif:"IBM Plex Serif", Georgia, ui-serif, serif;--mono:"IBM Plex Mono", "SFMono-Regular", Consolas, "Liberation Mono", monospace;color:var(--text);background:var(--bg);font-family:var(--sans);letter-spacing:0;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px;line-height:1.45}*{box-sizing:border-box}body{min-width:320px;min-height:100svh;margin:0}button,input,select{-webkit-tap-highlight-color:transparent}button:disabled{cursor:not-allowed;opacity:.55}a{color:inherit}#root{min-height:100svh}.app-shell{background:linear-gradient(90deg, #211b1509 1px, transparent 1px), linear-gradient(180deg, #211b1508 1px, transparent 1px), var(--bg);min-height:100svh;color:var(--text);background-size:28px 28px}.topbar{border-bottom:2px solid var(--ink);background:var(--paper);z-index:20;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.6rem 1rem;padding:.85rem clamp(1rem,3vw,2rem);display:flex;position:sticky;top:0}.brand-block{align-items:center;gap:.85rem;min-width:0;display:flex}.brand-mark{border:2px solid var(--ink);background:var(--surface);width:3.1rem;height:3.1rem;color:var(--ink);font-family:var(--mono);box-shadow:.25rem .25rem 0 var(--ink);border-radius:3px;place-items:center;font-weight:900;display:grid}.brand-block h1{font-family:var(--serif);letter-spacing:0;margin:0;font-size:clamp(1.35rem,2vw,1.95rem);line-height:1}.brand-block p{color:var(--muted);font-family:var(--mono);white-space:nowrap;text-overflow:ellipsis;max-width:52vw;margin-top:.25rem;font-size:.78rem;overflow:hidden}.transport-strip,.topbar-actions,.surface-switch,.view-tabs,.toggle-stack,.template-stack,.mini-pad-list,.sequencer-toolbar{align-items:center;gap:.5rem;display:flex}.icon-button,.surface-switch button,.master-key-button,.tab-button,.toggle,.primary-action,.secondary-action,.file-action,.mode-button,.home-action-card,.chord-chip,.shape-row,.suggestion,.mini-pad,.template-button,.step,.mpc-pad,.piano-key,.segmented button{border:1px solid var(--line);color:var(--text);background:var(--surface);font:inherit;letter-spacing:0;cursor:pointer;transition:border-color .14s,background .14s,color .14s,box-shadow .14s}.icon-button:hover,.surface-switch button:hover,.master-key-button:hover,.tab-button:hover,.toggle:hover,.primary-action:hover,.secondary-action:hover,.file-action:hover,.mode-button:hover,.home-action-card:hover,.chord-chip:hover,.shape-row:hover,.suggestion:hover,.mini-pad:hover,.template-button:hover,.step:hover,.mpc-pad:hover,.piano-key:hover,.segmented button:hover{border-color:var(--line-strong)}.icon-button:focus-visible,.surface-switch button:focus-visible,.master-key-button:focus-visible,.tab-button:focus-visible,.toggle:focus-visible,.primary-action:focus-visible,.secondary-action:focus-visible,.file-action:focus-visible,.mode-button:focus-visible,.home-action-card:focus-visible,.chord-chip:focus-visible,.shape-row:focus-visible,.suggestion:focus-visible,.mini-pad:focus-visible,.template-button:focus-visible,.step:focus-visible,.mpc-pad:focus-visible,.piano-key:focus-visible,.segmented button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.icon-button{border-radius:4px;place-items:center;width:2.75rem;height:2.75rem;display:grid}.icon-button.accent{color:var(--paper);background:var(--ink);border-color:var(--ink)}.topbar-actions{flex-wrap:wrap;justify-content:flex-end;margin-left:auto}.surface-switch{border:1px solid var(--line);background:#e8dece;border-radius:4px;padding:.2rem}.surface-switch button{min-height:2.35rem;color:var(--muted);background:0 0;border-color:#0000;border-radius:3px;justify-content:center;align-items:center;gap:.35rem;padding:0 .65rem;font-size:.85rem;font-weight:800;display:inline-flex}.surface-switch button.active{color:var(--paper);border-color:var(--ink);background:var(--ink)}.master-key-wrap{position:relative}.master-key-button{white-space:nowrap;background:#f4ecdf;border-radius:4px;align-items:center;gap:.5rem;min-height:2.75rem;padding:0 .85rem;font-weight:800;display:inline-flex}.master-key-button span{color:var(--muted)}.master-key-button strong{font-family:var(--mono);color:var(--text-strong)}.master-key-button[aria-expanded=true]{color:var(--paper);background:var(--ink);border-color:var(--ink)}.master-key-button[aria-expanded=true] span,.master-key-button[aria-expanded=true] strong{color:inherit}.master-key-popover{z-index:40;border:2px solid var(--ink);background:var(--paper);width:min(22rem,100vw - 2rem);box-shadow:.28rem .28rem 0 var(--ink);border-radius:4px;gap:.85rem;padding:.95rem;display:grid;position:absolute;top:calc(100% + .55rem);right:0}.master-key-popover .control-row{margin-bottom:0}.master-key-popover p{color:var(--muted);margin:0;font-size:.85rem;line-height:1.4}.master-key-popover-head{gap:.25rem;display:grid}.master-key-popover-head span{color:var(--muted);text-transform:uppercase;font-size:.78rem;font-weight:800}.master-key-popover-head b{color:var(--text-strong);font-family:var(--serif);font-size:1.25rem}.view-tabs{border-bottom:1px solid var(--line);scrollbar-width:thin;background:#e8dece;padding:.6rem clamp(1rem,3vw,2rem);overflow-x:auto}.tab-button{min-width:max-content;min-height:2.65rem;color:var(--muted);border-radius:4px;justify-content:center;align-items:center;gap:.45rem;padding:0 .85rem;display:inline-flex}button.tab-button.active{color:var(--paper);background:var(--ink);border-color:var(--ink)}main{width:min(1440px,100%);margin:0 auto;padding:clamp(1rem,3vw,2rem)}.home-layout,.studio-grid,.chord-finder-layout,.melody-layout,.levels-layout,.groove-layout,.split-layout{gap:1rem;display:grid}.studio-grid{grid-template-columns:minmax(0,1fr) minmax(20rem,.36fr);align-items:start}.home-layout{grid-template-columns:minmax(19rem,.74fr) minmax(30rem,1.22fr) minmax(20rem,.74fr);grid-template-areas:"start start setup""pads pads sound""now now now";align-items:start}.home-start{grid-area:start}.home-setup{grid-area:setup}.home-pad-panel{grid-area:pads}.home-sound{grid-area:sound}.home-now{grid-area:now}.helper-grid{grid-template-columns:minmax(20rem,.74fr) minmax(30rem,1.3fr) minmax(20rem,.72fr);grid-template-areas:"setup pads monitor""results chord pitch";align-items:start;gap:1rem;display:grid}.chord-pad-layout{grid-template-columns:minmax(20rem,.72fr) minmax(32rem,1.35fr) minmax(20rem,.72fr);align-items:start;gap:1rem;display:grid}.chord-finder-layout{grid-template-columns:minmax(20rem,.82fr) minmax(30rem,1.18fr);grid-template-areas:"palette pads""progression progression";align-items:start}.chord-finder-palette{grid-area:palette}.chord-finder-pads{grid-area:pads}.chord-finder-progression{grid-area:progression}.chord-chip-row{align-items:stretch;gap:.45rem;min-width:0;display:flex}.chord-chip-row .chord-chip{flex:1;min-width:0}.chip-add{border:1px solid var(--line-strong);width:2.75rem;color:var(--ink);cursor:pointer;background:#efe6d6;border-radius:4px;flex:none;font-size:1.25rem;font-weight:800;line-height:1}.chip-add:hover{background:var(--ink);color:var(--paper)}.chip-add:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.custom-chord{margin-top:1rem}.custom-chord summary,.play-sheet summary{justify-content:flex-start;width:100%;display:flex}.play-sheet{margin-top:1.1rem}.progression-tools{flex-wrap:wrap;gap:.5rem;margin:.75rem 0 1rem;display:flex}.keyfinder-layout{grid-template-columns:minmax(0,46rem);justify-content:center}.drop-zone{border:2px dashed var(--line-strong);text-align:center;color:var(--muted);background:#f4ecdf;border-radius:6px;justify-items:center;gap:.65rem;padding:2.4rem 1.4rem;display:grid}.drop-zone strong{color:var(--text-strong);font-family:var(--serif);font-size:1.1rem}.drop-zone.drag-over{border-color:var(--ink);background:#efe6d6}.analysis-status{justify-items:start;gap:.65rem;padding:1.6rem .4rem;display:grid}.progress-track{border:1px solid var(--line-strong);background:#f4ecdf;border-radius:999px;width:100%;height:.85rem;overflow:hidden}.progress-fill{background:var(--mint);height:100%;transition:width .16s}.keyfinder-results{gap:.75rem;display:grid}.keyfinder-ranking{gap:.5rem;display:grid}.keyfinder-row{border:1px solid var(--line);background:#f6efe4;border-radius:4px;flex-wrap:wrap;align-items:center;gap:.6rem;padding:.6rem .75rem;display:flex}.keyfinder-row strong{min-width:5.5rem;font-family:var(--serif)}.confidence-track{border:1px solid var(--line);background:#efe6d6;border-radius:999px;flex:1;min-width:6rem;height:.6rem;overflow:hidden}.confidence-fill{background:var(--mint);height:100%}.keyfinder-row:first-of-type .confidence-fill{background:var(--gold)}.pad-actions{flex-wrap:wrap;gap:.55rem;margin-top:.9rem;display:flex}.chord-pad-controls,.chord-pad-coach,.chord-pad-surface{gap:1rem;display:grid}.chord-pad-summary{gap:.75rem;display:grid}.helper-setup{grid-area:setup}.helper-pad-panel{grid-area:pads}.helper-grid .control-panel{grid-area:monitor}.helper-results{grid-area:results}.helper-chord{grid-area:chord}.helper-pitch{grid-area:pitch}.levels-layout{grid-template-columns:minmax(19rem,.72fr) minmax(30rem,1.2fr) minmax(19rem,.72fr);grid-template-areas:"setup pads notes""retune retune retune";align-items:start}.levels-setup{grid-area:setup}.levels-pad-panel{grid-area:pads}.levels-notes{grid-area:notes}.levels-retune{grid-area:retune}.melody-layout{grid-template-columns:minmax(20rem,.72fr) minmax(30rem,1.2fr) minmax(20rem,.72fr);grid-template-areas:"setup pads phrases";align-items:start}.melody-setup{grid-area:setup}.melody-pad-panel{grid-area:pads}.melody-phrases{grid-area:phrases}.groove-layout{grid-template-columns:minmax(0,1fr) minmax(20rem,.35fr);align-items:start}.split-layout .wide-panel{grid-column:1/-1}.split-layout{grid-template-columns:repeat(3,minmax(0,1fr))}.panel{border:1px solid var(--line);background:var(--panel);box-shadow:var(--shadow);border-radius:4px;padding:clamp(1rem,2vw,1.35rem)}.guide-panel{margin:-.35rem 0 1rem}.guide-panel summary{border:1px solid var(--line);min-height:2.65rem;color:var(--muted);cursor:pointer;background:#f4ecdf;border-radius:4px;align-items:center;gap:.4rem;padding:0 .85rem;font-size:.82rem;font-weight:800;list-style:none;display:inline-flex}.guide-panel summary::-webkit-details-marker{display:none}.guide-panel summary:hover,.guide-panel summary:focus-visible{color:var(--text-strong);border-color:var(--line-strong)}.guide-panel summary:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.guide-panel[open] summary{color:var(--paper);background:var(--ink);border-color:var(--ink)}.guide-panel>div{border:1px solid var(--line);color:var(--text);background:#f4ecdf;border-radius:4px;gap:.45rem;margin-top:.65rem;padding:.85rem;display:grid}.guide-panel p{max-width:68ch;color:var(--muted);margin:0}.main-surface{min-height:32rem}.panel-header{grid-template-columns:1fr auto;align-items:baseline;gap:.25rem .75rem;margin-bottom:1rem;display:grid}.panel-header span{color:var(--rose);font-size:.78rem;font-family:var(--mono);text-transform:uppercase}.panel-header h2{font-family:var(--serif);letter-spacing:0;grid-column:1;margin:0;font-size:clamp(1.1rem,1.6vw,1.45rem)}.panel-header b{color:var(--mint);text-align:right;grid-area:1/2/3;align-self:center;font-size:.9rem;font-weight:700}.pad-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(.6rem,1.6vw,.9rem);animation:.18s both surface-slide-in;display:grid}.mpc-pad{aspect-ratio:1;color:#f4efe5;background:#2d2a24;border:2px solid #2b251d;border-radius:5px;grid-template-rows:auto 1fr auto;place-items:center;min-height:4.2rem;display:grid;position:relative;box-shadow:inset 0 -.35rem #0003}.mpc-pad.active{color:var(--paper);background:var(--gold);border-color:#70410f}.mpc-pad.safe{color:#f4efe5;background:var(--mint);border-color:#1f5952}.mpc-pad.root{color:var(--paper);background:var(--gold);border-color:#70410f}.mpc-pad.chord{color:#fff8ec;background:var(--rose);border-color:#75332b}.mpc-pad.chord.root{color:var(--paper);background:var(--gold)}.mpc-pad.melody-home{color:var(--paper);background:var(--gold);border-color:#70410f}.mpc-pad.melody-strong{color:#fff8ec;background:var(--rose);border-color:#75332b}.mpc-pad.melody-safe{color:#f4efe5;background:var(--mint);border-color:#1f5952}.mpc-pad.melody-passing{color:var(--ink);border-color:var(--line-strong);background:#f4ecdf}.mpc-pad.melody-tension{color:#f4efe5;background:#2d2a24;border-color:#2b251d}.mpc-pad.original{outline:2px dashed var(--ink);outline-offset:-.45rem}.mpc-pad.pulse{transform:translateY(-3px);box-shadow:inset 0 -.35rem #0000002e,0 0 0 3px #211b1529}.mpc-pad strong{font-size:clamp(1.15rem,2.6vw,1.9rem);font-family:var(--serif)}.mpc-pad small,.pad-number{font-family:var(--mono);color:currentColor;opacity:.72;font-size:.75rem}.pad-number{position:absolute;top:.45rem;left:.55rem}.keyboard-surface{gap:.65rem;animation:.18s both surface-slide-in;display:grid}.keyboard-scroll{scrollbar-width:thin;padding-bottom:.35rem;overflow-x:auto}.keyboard-frame{min-width:max(100%, calc(var(--white-key-count) * 3.15rem));border:2px solid var(--ink);background:#2d2a24;border-radius:4px;height:clamp(12rem,23vw,16rem);position:relative;overflow:hidden;box-shadow:inset 0 -.45rem #00000038}.keyboard-white-row{grid-template-columns:repeat(var(--white-key-count), minmax(2.7rem, 1fr));height:100%;display:grid}.keyboard-black-layer{pointer-events:none;position:absolute;inset:0}.piano-key{cursor:pointer;border:2px solid #907c62;border-radius:0 0 5px 5px;min-width:0;height:100%;padding:0;position:relative;box-shadow:inset 0 -.3rem #0000001f}.piano-key.white{color:#2b251d;background:#faf5ea}.piano-key.black{top:0;left:var(--black-left);z-index:2;width:calc(100% / var(--white-key-count) * .66);color:#f4efe5;pointer-events:auto;background:#1f1b16;border-color:currentColor #18140f #18140f;border-top-style:none;border-top-width:0;border-radius:0 0 4px 4px;height:62%;position:absolute;transform:translate(-50%);box-shadow:inset 0 -.25rem #00000059}.piano-key:focus-visible{outline:2px solid var(--focus);outline-offset:-2px;z-index:3}.piano-key.no-pad{cursor:not-allowed;opacity:.45;filter:grayscale(.6)}.piano-key.no-pad.white{background:#ece5d7}.key-marker{pointer-events:none;border-top:2px solid #18140f59;border-radius:0 0 3px 3px;height:13%;position:absolute;bottom:0;left:0;right:0}.piano-key.black .key-marker{border-radius:0 0 2px 2px;height:18%}.piano-key.mark-root .key-marker{background:var(--gold)}.piano-key.mark-chord .key-marker{background:var(--rose)}.piano-key.mark-scale .key-marker{background:var(--mint)}.piano-key.mark-passing .key-marker{border:2px dashed var(--line-strong);background:#f4ecdf;border-bottom:0}.piano-key.mark-outside .key-marker{background:#4a4238}.key-chip{border:1px solid var(--line-strong);color:var(--ink);font-family:var(--mono);white-space:nowrap;pointer-events:none;background:#efe6d6;border-radius:999px;padding:.08rem .3rem;font-size:.62rem;font-weight:700;line-height:1.4;position:absolute;bottom:34%;left:50%;transform:translate(-50%)}.piano-key.black .key-chip{color:#f4efe5;background:#3a342c;border-color:#4a4238;font-size:.56rem;bottom:26%}.piano-key.original .key-chip{outline:2px dashed var(--ink);outline-offset:2px}.piano-key.black.original .key-chip{outline-color:#f4efe5}.key-label{font-family:var(--serif);pointer-events:none;font-size:.82rem;font-weight:700;position:absolute;bottom:15%;left:50%;transform:translate(-50%)}.piano-key.pulse{transform:translateY(-3px);box-shadow:inset 0 -.3rem #00000029,0 0 0 3px #b66d1966}.piano-key.black.pulse{transform:translate(-50%)translateY(-3px)}.keyboard-caption{flex-wrap:wrap;gap:.45rem;display:flex}.keyboard-caption span{border:1px solid var(--line);color:var(--muted);background:#f4ecdf;border-radius:3px;padding:.35rem .55rem;font-size:.78rem;font-weight:700}@keyframes surface-slide-in{0%{opacity:0;transform:translateY(.35rem)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.pad-grid,.keyboard-surface{animation:none}}.control-panel{gap:1rem;display:grid}.helper-mini-row,.helper-actions,.helper-pad-actions,.result-stack,.pitch-list{gap:.65rem;display:grid}.helper-mini-row{grid-template-columns:repeat(2,minmax(0,1fr))}.helper-actions{grid-template-columns:1fr}.helper-pad-actions{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:1rem}.helper-legend,.legend{flex-wrap:wrap;gap:.45rem;margin-top:.4rem;display:flex}.helper-legend span,.legend span{border:1px solid var(--line);color:var(--muted);background:#f4ecdf;border-radius:3px;padding:.35rem .55rem;font-size:.8rem;font-weight:700}.legend-item{align-items:center;gap:.4rem;display:inline-flex}.legend-swatch{border:1px solid #211b1559;border-radius:2px;flex:none;width:.85rem;height:.85rem;display:inline-block}.legend-swatch.swatch-root{background:var(--gold)}.legend-swatch.swatch-chord{background:var(--rose)}.legend-swatch.swatch-scale{background:var(--mint)}.legend-swatch.swatch-passing{border-style:dashed;border-color:var(--line-strong);background:#f4ecdf}.legend-swatch.swatch-outside{background:#2d2a24}.legend-swatch.swatch-original{border:2px dashed var(--ink);background:0 0}.legend-swatch.swatch-noPad{opacity:.55;background:#e6ded0}.panel-note{color:var(--muted);margin:.55rem 0 0;font-size:.82rem;line-height:1.45}.result-box,.pitch-row{border:1px solid var(--line);color:var(--muted);background:#f6efe4;border-radius:4px;padding:.85rem}.result-box strong{color:var(--text-strong)}.pitch-row{grid-template-columns:1fr auto;align-items:center;gap:.75rem;display:grid}.pill{border:1px solid var(--line-strong);min-height:1.85rem;color:var(--ink);font-family:var(--mono);white-space:nowrap;background:#ebe0cf;border-radius:3px;align-items:center;padding:0 .65rem;font-size:.78rem;font-weight:700;display:inline-flex}.toggle-stack{flex-direction:column;align-items:stretch}.toggle,.primary-action,.secondary-action,.file-action{border-radius:4px;justify-content:center;align-items:center;gap:.55rem;min-height:2.9rem;padding:0 .9rem;font-weight:700;display:inline-flex}button.toggle.active,.primary-action{color:var(--paper);background:var(--ink);border-color:var(--ink)}.secondary-action,.file-action{background:#f4ecdf}.home-action-grid,.home-recipe-grid,.home-mode-grid{gap:.65rem;display:grid}.home-action-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.home-action-card{text-align:left;background:#f4ecdf;border-radius:4px;gap:.35rem;min-height:9rem;padding:1rem;display:grid}.home-action-card span{border:1px solid var(--line-strong);width:1.8rem;min-height:1.8rem;color:var(--paper);background:var(--ink);font-family:var(--mono);border-radius:3px;place-items:center;font-weight:900;display:inline-grid}.home-action-card strong{color:var(--text-strong);font-family:var(--serif);font-size:clamp(1.05rem,1.4vw,1.35rem)}.home-action-card small{color:var(--muted)}.home-action-card.quiet{background:#f6efe4}.home-mode-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.home-recipe-grid{grid-template-columns:minmax(14rem,1fr) minmax(14rem,1fr) minmax(18rem,1.1fr)}.home-repitch-box{gap:.65rem;display:grid}.home-repitch-box .control-row{margin-bottom:0}.master-key-readout{border:1px solid var(--line);background:#f4ecdf;border-radius:4px;gap:.2rem;margin-bottom:1rem;padding:.85rem;display:grid}.master-key-readout span{color:var(--muted);text-transform:uppercase;font-size:.78rem;font-weight:800}.master-key-readout strong{color:var(--text-strong);font-family:var(--serif);font-size:1.25rem}.master-key-readout small{color:var(--muted)}.status-stack{gap:.6rem;margin:0;display:grid}.status-stack div{border:1px solid var(--line);background:#f6efe4;border-radius:4px;grid-template-columns:7rem 1fr;gap:.5rem;padding:.7rem;display:grid}.status-stack dt{color:var(--muted)}.status-stack dd{color:var(--text);margin:0;font-weight:700}.control-row{gap:.5rem;margin-bottom:1rem;display:grid}.control-row>span{color:var(--muted);font-size:.85rem;font-weight:700}.control-row>div{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}select,input{border:1px solid var(--line);background:var(--paper);min-height:2.65rem;color:var(--text);font:inherit;border-radius:4px;padding:0 .75rem}input[type=range]{min-width:10rem;accent-color:var(--gold)}output{min-width:4.5rem;color:var(--gold);font-family:var(--mono)}.segmented{flex-wrap:wrap;gap:.35rem;display:flex}.segmented button{min-width:2.65rem;min-height:2.65rem;color:var(--muted);border-radius:4px;padding:0 .7rem}.segmented button.active{color:var(--paper);background:var(--ink);border-color:var(--ink)}.chord-palette,.coach-stage-grid,.next-chord-grid,.recipe-grid,.playbook-list,.phrase-list,.shape-list,.suggestion-stack,.escape-stack,.template-stack{gap:.6rem;display:grid}.chord-palette{grid-template-columns:repeat(auto-fit,minmax(5.2rem,1fr))}.chord-palette.chord-degree-grid{grid-template-columns:repeat(auto-fill,minmax(11.5rem,1fr))}.coach-stage-grid,.next-chord-grid,.recipe-grid{grid-template-columns:repeat(auto-fit,minmax(10rem,1fr))}.mode-strip{flex-wrap:wrap;gap:.45rem;margin-bottom:.85rem;display:flex}.mode-button{border-radius:4px;min-height:2.35rem;padding:0 .7rem;font-weight:800}button.mode-button.active{color:var(--paper);background:var(--ink);border-color:var(--ink)}.chord-chip{min-height:3.2rem;color:var(--muted);text-align:left;border-radius:4px;gap:.18rem;padding:.72rem;font-weight:800;display:grid}button.chord-chip.active{color:var(--paper);background:var(--ink);border-color:var(--ink)}.chord-chip strong{color:var(--text-strong);font-size:1.05rem}button.chord-chip.active strong,button.chord-chip.active small,button.chord-chip.active span{color:var(--paper)}.chord-chip small,.shape-row small,.shape-row span,.escape-card small,.escape-card span,.suggestion small,.suggestion span{color:var(--muted)}.shape-row,.suggestion,.recipe-card,.playbook-card,.escape-card,.template-button{text-align:left;border-radius:4px;gap:.28rem;padding:.9rem;display:grid}.shape-row strong,.recipe-card strong,.playbook-card strong,.escape-card strong,.suggestion strong{color:var(--text-strong)}.suggestion b,.recipe-card b{color:var(--mint);font-family:var(--mono);font-size:.8rem}.coach-card span,.next-card span,.phrase-card span{color:var(--rose);font-family:var(--mono);text-transform:uppercase;font-size:.76rem}.recipe-card,.playbook-card{border:1px solid var(--line);background:#f6efe4}.recipe-card.retune{border-color:#b99a67}.recipe-card.missing{background:#f3ded7;border-color:#c79b90}.playbook-card small,.recipe-card span{color:var(--muted)}.warning-box{background:#f3ded7;border-color:#c79b90}.empty-state{border:1px dashed var(--line-strong);color:var(--muted);background:#f6efe4;border-radius:4px;padding:.9rem}.progression-flow{overscroll-behavior-x:contain;scrollbar-width:thin;grid-auto-columns:minmax(14rem,1fr);grid-auto-flow:column;gap:.75rem;margin-bottom:.85rem;padding-bottom:.35rem;display:grid;overflow-x:auto}.progression-block{border:1px solid var(--line);background:#f6efe4;border-radius:4px;gap:.75rem;padding:.85rem;display:grid}.progression-info{gap:.15rem;display:grid}.progression-block strong{color:var(--text-strong)}.progression-block small{color:var(--muted)}.progression-pad-recipe{border:1px solid var(--line);background:#ebe0cf;border-radius:4px;gap:.2rem;padding:.65rem;display:grid}.progression-pad-recipe span{color:var(--muted);font-size:.78rem;font-weight:800}.progression-pad-recipe b{color:var(--mint);font-family:var(--mono);font-size:.9rem}.progression-index{border:1px solid var(--line-strong);width:max-content;color:var(--ink);font-family:var(--mono);border-radius:3px;padding:.08rem .38rem;font-size:.75rem;font-weight:800}.compact-action{min-height:2.25rem;padding:0 .65rem}.progression-actions{flex-wrap:wrap;gap:.4rem;display:flex}.mpc-final-recipe{border-top:1px solid var(--line);gap:.65rem;margin-top:1rem;padding-top:.85rem;display:grid}.mpc-setup-strip,.mpc-recipe-list{gap:.65rem;display:grid}.mpc-setup-strip{grid-template-columns:repeat(auto-fit,minmax(12rem,1fr))}.mpc-recipe-list{grid-template-columns:repeat(auto-fit,minmax(13rem,1fr))}.mpc-recipe-step{border:1px solid var(--line);background:#f6efe4;border-radius:4px;gap:.28rem;padding:.85rem;display:grid}.mpc-recipe-step strong{color:var(--text-strong)}.mpc-recipe-step small{color:var(--muted)}.escape-stack{margin-bottom:1rem}.escape-card{border:1px solid var(--line);background:#f6efe4;border-radius:4px;padding:.85rem}.shape-panel{min-height:34rem}.scale-note-list,.retune-grid{gap:.65rem;display:grid}.scale-note-card{border:1px solid var(--line);background:#f6efe4;border-radius:4px;grid-template-columns:3.2rem 1fr;align-items:center;gap:.65rem;padding:.75rem;display:grid}.scale-note-card strong{color:var(--text-strong);font-family:var(--serif);font-size:1.15rem}.scale-note-card span{color:var(--mint);font-family:var(--mono);font-size:.82rem;font-weight:800}.scale-note-card.missing{background:#f4ecdf}.scale-note-card.missing span{color:var(--muted)}.retune-grid{grid-template-columns:minmax(16rem,1fr) minmax(17rem,1fr) minmax(18rem,1fr) auto;align-items:start}.retune-grid .control-row{margin-bottom:0}.rank-pill{border:1px solid var(--line);font-size:.75rem;font-family:var(--mono);background:#ebe0cf;border-radius:3px;justify-self:start;padding:.18rem .45rem}.rank-full{border-color:#79906b}.rank-strong{border-color:#b48236}.rank-shell{border-color:#66848b}.rank-not-playable{border-color:#a84a3f}.mini-pad-list{flex-wrap:wrap;align-items:stretch}.mini-pad{border-radius:4px;gap:.2rem;min-width:5rem;min-height:4rem;display:grid}button.mini-pad.active{color:var(--paper);background:var(--ink)}.groove-layout .wide-panel{overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-color:var(--line-strong) transparent;overflow-x:auto}.groove-layout .wide-panel::-webkit-scrollbar{height:.75rem}.groove-layout .wide-panel::-webkit-scrollbar-thumb{background:var(--line-strong);background-clip:content-box;border:.2rem solid #0000;border-radius:999px}.sequencer-toolbar{flex-wrap:wrap;align-items:flex-end}.sequencer{min-width:min(62rem, calc(var(--steps) * 3.1rem));gap:.65rem;margin-top:1rem;display:grid}.lane{grid-template-columns:5rem repeat(var(--steps), minmax(2.2rem, 1fr));align-items:center;gap:.32rem;display:grid}.lane-label{color:var(--muted);font-weight:800}.step{aspect-ratio:1;background:var(--paper);border-radius:3px;place-items:center;min-width:2.2rem;display:grid}.step:nth-child(4n+2){border-color:var(--line-strong)}.step.active{color:var(--paper);background:var(--rose);border-color:#75332b}.step span{font-family:var(--mono);font-size:.7rem}.setup-list{color:var(--text);gap:.65rem;margin:0 0 1rem;padding-left:1.3rem;display:grid}.setup-list li::marker{color:var(--gold);font-weight:900}.connection-card{border:1px solid var(--line);background:#f6efe4;border-radius:4px;grid-template-columns:auto 1fr;align-items:start;gap:.7rem;padding:.85rem;display:grid}.connection-card svg{margin-top:.1rem}.connection-card strong,.connection-card span{display:block}.connection-card strong{color:var(--text-strong)}.connection-card span{color:var(--muted);margin-top:.18rem;font-size:.9rem}.connection-card.detected{border-color:#c49a57}.connection-card.detected svg{color:var(--gold)}.connection-card.confirmed{background:#e4eee7;border-color:#8bb3a8}.connection-card.confirmed svg{color:var(--mint)}.connection-card.offline{border-color:#c79b90}.connection-card.offline svg{color:var(--rose)}.mini-heading{color:var(--rose);font-size:.88rem;font-family:var(--mono);text-transform:uppercase;margin:.2rem 0 -.35rem}.file-action{position:relative}.file-action input{opacity:0;cursor:pointer;position:absolute;inset:0}@media (width<=1120px){.home-layout{grid-template-columns:1fr 1fr;grid-template-areas:"start start""setup sound""pads pads""now now"}.home-action-grid,.home-recipe-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.chord-finder-layout{grid-template-columns:1fr 1fr;grid-template-areas:"palette palette""pads pads""progression progression"}.melody-layout{grid-template-columns:1fr 1fr;grid-template-areas:"setup phrases""pads pads"}.levels-layout{grid-template-columns:1fr 1fr;grid-template-areas:"setup notes""pads pads""retune retune"}.retune-grid,.chord-pad-layout{grid-template-columns:1fr 1fr}.chord-pad-surface{grid-area:1/1/auto/-1}.helper-grid{grid-template-columns:1fr 1fr;grid-template-areas:"setup pads""monitor pads""results chord""pitch pitch"}.home-layout,.studio-grid,.chord-finder-layout,.melody-layout,.levels-layout,.groove-layout,.split-layout{grid-template-columns:1fr 1fr}.studio-grid .main-surface,.home-layout .home-pad-panel,.melody-layout .melody-pad-panel,.levels-layout .levels-pad-panel,.groove-layout .wide-panel,.split-layout .wide-panel{grid-column:1/-1}}@media (width<=720px){.topbar{flex-wrap:wrap;align-items:flex-start}.brand-block{flex:14rem}.brand-block p{max-width:58vw}.topbar-actions{order:3;grid-template-columns:1fr;width:100%;margin-left:0;display:grid}.surface-switch{width:100%}.surface-switch button{flex:1 1 0}.master-key-wrap,.master-key-button{width:100%}.master-key-button{justify-content:space-between}.master-key-popover{width:100%;margin-top:.55rem;position:static}.transport-strip{flex-direction:row;margin-left:auto}main{padding:.85rem}.view-tabs{flex-wrap:wrap;overflow-x:visible}.tab-button{flex:calc(33.333% - .5rem);min-width:6.6rem}.home-layout{grid-template-areas:"start""setup""pads""sound""now"}.studio-grid,.home-layout,.helper-grid,.chord-finder-layout,.melody-layout,.chord-pad-layout,.levels-layout,.groove-layout,.split-layout{grid-template-columns:1fr}.helper-grid{grid-template-areas:"setup""pads""results""chord""pitch""monitor"}.chord-finder-layout{grid-template-areas:"palette""pads""progression"}.melody-layout{grid-template-areas:"setup""pads""phrases"}.levels-layout{grid-template-areas:"setup""pads""notes""retune"}.chord-pad-layout{grid-template-columns:1fr}.chord-pad-surface{grid-area:auto}.helper-mini-row,.helper-pad-actions,.home-action-grid,.home-mode-grid,.home-recipe-grid,.retune-grid{grid-template-columns:1fr}.home-action-card{min-height:6.8rem}.pad-grid{gap:.55rem}.mpc-pad{min-height:4rem}.status-stack div{grid-template-columns:1fr}.progression-flow{grid-auto-columns:minmax(13rem,82vw)}.progression-actions{justify-content:flex-start}.lane{grid-template-columns:4rem repeat(var(--steps), minmax(2.65rem, 1fr))}.groove-layout .wide-panel{box-shadow:var(--shadow), inset -1.35rem 0 1rem -1.1rem #231c1447}}