:root{color-scheme:dark;--surface-0:#0f1115;--surface-1:#171a21;--surface-2:#1e222b;--line:#2a2f3a;--text:#e9ebf1;--text-dim:#969db0;--brand:#f5b53d;--loop: rgb(245 181 61 / .22);--sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:24px;--sp-6:40px;--fs-xs:11px;--fs-sm:12.5px;--fs-md:15px;--fs-lg:20px;--fs-xl:32px;--fs-hero:56px;--r-sm:9px;--r-md:14px;--r-pill:999px}html,body,#root{height:100%;margin:0}.mt-root{--bg:var(--surface-0);--panel:var(--surface-1);--panel-2:var(--surface-2);--border:var(--line);--ink:var(--text);--ink-dim:var(--text-dim);--accent:var(--brand);--root:#f5b53d;--third:#3fd0c5;--fifth:#7c9bff;--seventh:#f06595;--ext:#9bd653;--motif:#2f9bff;--ghost:#5a6172;--penta:#4ea1ff;--fret:#737b8a;--nut:#d9cbb3;--string:#aab0bc;--wood:#1c1510;background:var(--bg);color:var(--ink);min-height:100%;font-family:JetBrains Mono,ui-monospace,monospace;padding:26px clamp(14px,4vw,40px);box-sizing:border-box}.mt-root *{box-sizing:border-box}.mt-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:22px;border-bottom:1px solid var(--border);padding-bottom:18px}.mt-head h1{margin:0;font-size:clamp(26px,4vw,40px);font-weight:500;letter-spacing:-.5px;line-height:1;font-family:Fraunces,Georgia,serif;font-style:italic}.mt-head h1 .amp{color:var(--accent)}.sub{margin:8px 0 0;color:var(--ink-dim);font-size:12.5px}.legend-states{display:flex;gap:14px;flex-wrap:wrap}.legend-states .lg{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;color:var(--ink-dim)}.legend-states .sw{width:15px;height:15px;border-radius:50%;display:inline-block;box-shadow:0 0 0 1px #0008}.legend-states .sw.chord.root{background:var(--root)}.legend-states .sw.ghost{background:transparent;border:1.6px solid var(--ghost);box-shadow:none}.legend-states .sw.motif-ring{background:transparent;border:2.6px solid var(--motif);box-shadow:none}.legend-states .sw.target{background:var(--third);box-shadow:0 0 0 2.6px var(--motif)}.legend-states .sw.penta{background:var(--penta)}.panel{background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:18px;margin-bottom:24px}.field{display:flex;flex-direction:column;gap:7px}.field>span{font-size:11px;text-transform:uppercase;letter-spacing:1px;color:var(--ink-dim)}.field.wide{flex:1 1 100%;margin-bottom:6px}.panel input[type=text],.panel input:not([type=range]):not([type=checkbox]){width:100%}.field input,.field select{background:var(--panel-2);border:1px solid var(--border);color:var(--ink);border-radius:9px;padding:11px 13px;font-family:inherit;font-size:15px;outline:none}.field input:focus,.field select:focus{border-color:var(--accent)}.field input[type=range]{padding:0;accent-color:var(--accent);height:26px}.key-badge{display:flex;flex-direction:column;gap:2px;background:var(--panel-2);border:1px solid var(--border);border-radius:9px;padding:9px 13px}.key-badge strong{font-size:15px}.key-badge em{font-style:normal;font-size:11px;color:var(--ink-dim)}.key-badge em.flag{color:var(--seventh)}.presets{display:flex;gap:9px;flex-wrap:wrap;margin:0 0 16px}.chip{background:var(--panel-2);border:1px solid var(--border);color:var(--ink-dim);border-radius:999px;padding:7px 13px;font-family:inherit;font-size:12px;cursor:pointer;transition:.15s}.chip:hover{border-color:var(--accent);color:var(--ink)}.chip.on{background:var(--motif);border-color:var(--motif);color:#06121f;font-weight:700}.chip.ghost-chip{border-style:dashed}.motif-chips{display:flex;gap:8px;flex-wrap:wrap}.row{display:flex;gap:22px;align-items:flex-end;flex-wrap:wrap;margin-top:14px}.row .field{min-width:120px}.seg{display:flex;border:1px solid var(--border);border-radius:9px;overflow:hidden}.seg button{background:var(--panel-2);border:none;color:var(--ink-dim);padding:10px 16px;font-family:inherit;font-size:13px;cursor:pointer;transition:.15s}.seg button.on{background:var(--accent);color:#181307;font-weight:700}.field.check{flex-direction:row;align-items:center;gap:9px}.field.check input{width:17px;height:17px;accent-color:var(--accent)}.field.check span{font-size:13px;text-transform:none;letter-spacing:0;color:var(--ink)}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:18px}.card{background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:16px 16px 8px}.card-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:6px}.card-head h2{margin:0;font-size:24px;font-weight:600;letter-spacing:-.3px;font-family:Fraunces,Georgia,serif;font-style:italic}.card-head h2.warn{color:var(--seventh)}.notes{display:flex;gap:7px;color:var(--ink-dim);font-size:12.5px;flex-wrap:wrap;justify-content:flex-end}.notes span{color:var(--ink)}.hint{margin:0 0 6px;font-size:11px;color:var(--seventh)}.empty{color:var(--ink-dim);grid-column:1/-1;text-align:center;padding:40px}.dot.hl circle{filter:brightness(1.25)}.dot.target text{font-weight:700}.track-picker{display:flex;gap:8px;list-style:none;padding:0;margin:0}.transport{display:flex;align-items:center;gap:16px}.layer-controls{display:flex;flex-wrap:wrap;gap:16px;align-items:center}.layer-controls .layer{display:flex;align-items:center;gap:6px}.jam-status{margin:0;color:var(--text-dim);font-size:var(--fs-sm)}.player-root{max-width:1100px;margin:0 auto;padding:var(--sp-4) clamp(14px,4vw,40px);display:flex;flex-direction:column;gap:var(--sp-4);background:var(--surface-0);color:var(--text);min-height:100%;font-family:JetBrains Mono,ui-monospace,monospace}.player-root *{box-sizing:border-box}.player-top{display:flex;justify-content:space-between;align-items:center;gap:var(--sp-4);border-bottom:1px solid var(--line);padding-bottom:var(--sp-3)}.player-top h1{margin:0;font-size:var(--fs-lg);font-family:Fraunces,Georgia,serif;font-style:italic;font-weight:500}.player-top h1 a{color:inherit;text-decoration:none}.chord-strip{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:var(--sp-4)}.chord-strip .sym{font-family:Fraunces,Georgia,serif;font-style:italic;display:block}.chord-strip .roman{color:var(--text-dim);font-size:var(--fs-sm);display:block;margin-top:var(--sp-1)}.strip-side{background:var(--surface-1);border:1px solid var(--line);border-radius:var(--r-md);padding:var(--sp-3) var(--sp-4);color:var(--text-dim);font-family:inherit;cursor:pointer;transition:border-color .15s,color .15s,opacity .15s}.strip-side .sym{font-size:var(--fs-xl)}.strip-prev{opacity:.55;justify-self:end}.strip-next{justify-self:start}.strip-side:hover{border-color:var(--brand);color:var(--text)}.strip-next.prelight{border-color:var(--brand);color:var(--text);box-shadow:0 0 0 1px var(--brand)}.strip-current{position:relative;background:var(--surface-2);border:1px solid var(--brand);border-radius:var(--r-md);padding:var(--sp-3) var(--sp-6);text-align:center;min-width:180px;animation:beat-pulse .45s ease-out}.strip-current .sym{font-size:var(--fs-hero);line-height:1.05;color:var(--text)}.strip-current .count{position:absolute;top:var(--sp-2);right:var(--sp-3);font-size:var(--fs-md);color:var(--brand);font-weight:700}@keyframes beat-pulse{0%{box-shadow:0 0 0 3px var(--loop)}to{box-shadow:0 0 0 0 transparent}}@media (prefers-reduced-motion: reduce){.strip-current{animation:none}}.card.hero{padding:var(--sp-4)}.hero-foot{display:flex;justify-content:space-between;align-items:center;gap:var(--sp-4);flex-wrap:wrap;margin-top:var(--sp-3);border-top:1px solid var(--line);padding-top:var(--sp-3)}.player-dock{display:flex;flex-direction:column;gap:var(--sp-3);background:var(--surface-1);border:1px solid var(--line);border-radius:var(--r-md);padding:var(--sp-4)}.dock-row{display:flex;justify-content:space-between;align-items:center;gap:var(--sp-4);flex-wrap:wrap}.progress{display:flex;flex-direction:column;gap:var(--sp-2)}.progress-bar{position:relative;height:14px;background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-pill);cursor:pointer;touch-action:none}.progress-fill{position:absolute;inset:0 auto 0 0;background:#f5b53d59;border-radius:var(--r-pill);pointer-events:none}.loop-region{position:absolute;inset:0 auto 0 auto;top:0;bottom:0;background:var(--loop);border-radius:var(--r-pill);pointer-events:none}.section-tick{position:absolute;top:-3px;bottom:-3px;width:2px;background:var(--line);pointer-events:none}.playhead{position:absolute;top:-4px;bottom:-4px;width:3px;background:var(--brand);border-radius:2px;transform:translate(-50%);pointer-events:none}.progress-label{display:flex;gap:var(--sp-2);align-items:center;color:var(--text-dim);font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:1px}.loop-badge{color:var(--brand);font-size:var(--fs-md)}.track-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:var(--sp-4)}.track-card{display:block;text-decoration:none;color:var(--text);transition:border-color .15s}.track-card:hover{border-color:var(--brand)}.track-card h2{margin:0 0 var(--sp-1);font-size:var(--fs-lg);font-family:Fraunces,Georgia,serif;font-style:italic}.track-card .meta{color:var(--text-dim);font-size:var(--fs-sm);margin:0}