:root{--mth-pink: #ff007f;--mth-mint: #92e0b9;--mth-charcoal: #161b22;--mth-pink-hover: #e00070;--mth-pink-press: #c60063;--canvas-cream: #fffaf0;--surface-white: #ffffff;--text-body: #333333;--grey-500: #5f6672;--grey-300: #d5d2ca;--grey-100: #f1ede3;--tier-mild: #92e0b9;--tier-warm: #f5a623;--tier-spicy: #ff007f;--font-brand: "Lato", "Segoe UI", system-ui, -apple-system, sans-serif;--text-display: 2.5rem;--text-h1: 2rem;--text-h2: 1.5rem;--text-h3: 1.25rem;--text-body-size: 1rem;--text-small: .875rem;--line-height-body: 1.5;--line-height-heading: 1.25;--radius-card: 16px;--radius-cell: 8px;--radius-input: 10px;--radius-pill: 999px;--shadow-card: 0 2px 8px rgba(22, 27, 34, .08);--shadow-raised: 0 4px 16px rgba(22, 27, 34, .12);--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-6: 32px;--space-7: 48px;--space-8: 64px;--target-min: 48px;--target-comfort: 44px;--target-transport: 56px;--header-height: 72px;--transport-height: 80px;--line-step: var(--grey-300);--line-beat: #b3ada0;--line-bar: #4a5058;--track-chords: #7b61ff;--track-chords-soft: #ece8ff;--track-drums: #f5a623;--track-drums-soft: #fdf0da;--track-melody: #ff007f;--track-melody-soft: #ffe4f0;--loop-gold: #f2b705;--loop-gold-soft: #fdf3d4;--response-soft: #f1ede3;--motion-quick: .15s;--motion-calm: .25s;--ease-out: cubic-bezier(.22, .61, .36, 1)}@media(prefers-reduced-motion:reduce){:root{--motion-quick: 1ms;--motion-calm: 1ms}}@font-face{font-family:Lato;src:url(/assets/lato-400-DXRmO6t1.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Lato;src:url(/assets/lato-700-D0hIvJyG.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}*,*:before,*:after{box-sizing:border-box}html{color:var(--mth-charcoal);background:var(--canvas-cream);font-family:var(--font-brand);font-size:var(--text-body-size);line-height:var(--line-height-body);-webkit-font-smoothing:antialiased}body{margin:0;min-width:320px;min-height:100vh}h1,h2,h3{line-height:var(--line-height-heading);margin:0}h1{font-size:var(--text-h1);font-weight:700}h2{font-size:var(--text-h2);font-weight:700}h3{font-size:var(--text-h3);font-weight:600}small,.text-small{font-size:var(--text-small)}button,input,textarea,select{font:inherit}:focus-visible{outline:3px solid var(--mth-charcoal);outline-offset:2px}.skip-link{position:fixed;z-index:30;top:var(--space-2);left:var(--space-2);padding:var(--space-3) var(--space-4);border-radius:var(--radius-cell);color:#fff;background:var(--mth-charcoal);transform:translateY(-150%)}.skip-link:focus{transform:translateY(0)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:var(--target-comfort);padding:0 var(--space-4);border:2px solid var(--grey-300);border-radius:var(--radius-pill);background:var(--surface-white);color:var(--mth-charcoal);font-weight:700;cursor:pointer;transition:background var(--motion-quick) var(--ease-out),border-color var(--motion-quick) var(--ease-out)}.btn:hover:not(:disabled){background:var(--grey-100)}.btn:disabled{color:var(--grey-500);background:var(--grey-100);cursor:not-allowed}.btn--primary{background:var(--mth-pink-hover);border-color:var(--mth-pink-hover);color:#fff}.btn--primary:hover:not(:disabled){background:var(--mth-pink-press);border-color:var(--mth-pink-press)}.btn--primary:disabled{background:var(--grey-100);border-color:var(--grey-300);color:var(--grey-500)}.btn--secondary{background:var(--mth-mint);border-color:var(--mth-mint)}.btn--secondary:hover:not(:disabled){background:#7fd3aa;border-color:#7fd3aa}.btn--ghost{border-color:transparent;background:transparent}.btn--ghost:hover:not(:disabled){background:var(--grey-100)}.btn--icon{min-width:var(--target-comfort);padding:0 var(--space-2)}.btn--small{min-height:36px;padding:0 var(--space-3);font-size:var(--text-small)}.btn[aria-pressed=true]{background:var(--mth-charcoal);border-color:var(--mth-charcoal);color:#fff}.btn[aria-pressed=true]:hover:not(:disabled){background:#262d38;border-color:#262d38}.app-shell{display:flex;flex-direction:column;height:100dvh;height:100%;min-height:0;position:relative}.app-header{z-index:10;display:flex;flex:none;flex-wrap:wrap;align-items:center;gap:var(--space-3);min-height:var(--header-height);padding:var(--space-2) var(--space-4);border-bottom:1px solid var(--grey-300);background:var(--surface-white)}.brand-logo{width:104px;height:auto;object-fit:contain}.app-identity{display:flex;flex-direction:column;min-width:max-content}.app-name{margin:0;font-size:1.05rem;font-weight:900;line-height:1.1}.app-name small{display:block;font-size:.72rem;font-weight:700;color:var(--grey-500)}.title-field{flex:1 1 200px;min-width:140px;max-width:340px;padding:8px var(--space-3);border:2px solid transparent;border-radius:var(--radius-input);background:var(--grey-100);font-weight:700}.title-field:hover{border-color:var(--grey-300)}.title-field:focus{border-color:var(--mth-charcoal);background:var(--surface-white);outline:none}.header-actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2);margin-left:auto}.dirty-dot{width:8px;height:8px;border-radius:50%;background:var(--mth-pink)}.transport{display:flex;flex:none;flex-wrap:wrap;align-items:center;gap:var(--space-3);min-height:var(--transport-height);padding:var(--space-2) var(--space-4);border-bottom:1px solid var(--grey-300);background:var(--grey-100)}.transport__group{display:flex;align-items:center;gap:var(--space-2)}.transport__spacer{margin-left:auto}.transport__play{width:var(--target-transport);height:var(--target-transport);min-height:var(--target-transport);padding:0;border-radius:50%;background:var(--mth-pink-hover);border-color:var(--mth-pink-hover);color:#fff}.transport__play:hover:not(:disabled){background:var(--mth-pink-press);border-color:var(--mth-pink-press)}.stepper{display:flex;align-items:center;gap:4px}.stepper__value{min-width:4.5rem;text-align:center;font-weight:700;font-variant-numeric:tabular-nums}.stepper__value small{display:block;font-size:.68rem;font-weight:700;color:var(--grey-500)}.tempo-slider{width:120px;accent-color:var(--mth-pink)}.count-in{display:flex;gap:6px;align-items:center}.count-in__dot{width:12px;height:12px;border-radius:50%;border:2px solid var(--grey-300);background:var(--surface-white)}.count-in__dot--lit{background:var(--mth-pink);border-color:var(--mth-pink)}.switch-pair{display:flex;align-items:stretch;gap:2px}.switch-pair__cog{min-width:36px;padding:0}.field-inline{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-small)}.field-inline select,.select{min-height:var(--target-comfort);padding:0 var(--space-3);border:2px solid var(--grey-300);border-radius:var(--radius-input);background:var(--surface-white);color:var(--mth-charcoal);font-weight:700}.workspace{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;overflow:hidden}.arrangement{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;padding:var(--space-4);background:var(--canvas-cream)}.ruler-row,.hscroll{display:grid;grid-template-columns:var(--head-width, 210px) 1fr}.ruler-row__head{display:flex;flex-direction:column;justify-content:center;padding-left:var(--space-3);font-size:var(--text-small);font-weight:700;color:var(--grey-500)}.ruler-row__head small{font-size:.68rem;font-weight:400}.ruler-row__body,.lanes{overflow-x:auto}.lanes{padding-left:13px}.ruler-row__body{padding-left:var(--bar-inset-start, 26px);padding-right:var(--bar-inset-end, 13px)}.ruler-row__body{overflow-y:hidden;scrollbar-width:none}.ruler-row__body::-webkit-scrollbar{display:none}.lanes{overflow-y:visible;scrollbar-width:none}.lanes::-webkit-scrollbar{display:none}.hscroll{margin:2px 0 var(--space-3)}.hscroll__rail{position:relative;height:16px;margin-left:var(--bar-inset-start, 26px);margin-right:var(--bar-inset-end, 13px);border-radius:var(--radius-pill);background:var(--grey-100);cursor:pointer;touch-action:none}.hscroll__rail--idle{opacity:.45;cursor:default}.hscroll__rail:focus-visible{outline:3px solid var(--mth-charcoal);outline-offset:2px}.hscroll__thumb{position:absolute;top:2px;bottom:2px;min-width:36px;border-radius:var(--radius-pill);background:var(--grey-500);cursor:grab;touch-action:none}.hscroll__thumb:hover{background:var(--mth-charcoal)}.hscroll__thumb:active{cursor:grabbing;background:var(--mth-charcoal)}.lane{position:relative;display:grid;grid-template-columns:var(--head-width, 210px) max-content;gap:0;width:max-content;min-width:100%;margin-bottom:var(--space-3);border:1px solid var(--grey-300);border-radius:var(--radius-card);background:var(--surface-white);box-shadow:var(--shadow-card)}.lane__head{position:sticky;left:0;z-index:3;display:flex;flex-direction:column;gap:6px;width:210px;padding:var(--space-3);border-right:1px solid var(--grey-300);border-radius:var(--radius-card) 0 0 var(--radius-card);background:var(--grey-100)}.lane__title{display:flex;align-items:center;gap:var(--space-2);flex-wrap:wrap;font-weight:700}.lane--silent .lane__body{background:repeating-linear-gradient(135deg,var(--grey-100),var(--grey-100) 10px,#ece7db 10px,#ece7db 20px);border-radius:0 var(--radius-card) var(--radius-card) 0}.lane__state{padding:1px 8px;border-radius:var(--radius-pill);border:1px solid var(--grey-300);background:var(--surface-white);color:var(--text-body);font-size:.68rem;font-weight:700}.lane__swatch{width:12px;height:12px;border-radius:3px;flex:none}.lane__controls{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.lane__body{position:relative;padding:var(--space-3)}.mini-btn{min-width:30px;min-height:30px;padding:0 6px;border:2px solid var(--grey-300);border-radius:8px;background:var(--surface-white);color:var(--mth-charcoal);font-size:.72rem;font-weight:800;cursor:pointer}.mini-btn[aria-pressed=true]{background:var(--mth-charcoal);border-color:var(--mth-charcoal);color:#fff}.mini-btn:hover:not(:disabled){background:var(--grey-100)}.mini-btn[aria-pressed=true]:hover{background:#262d38}.lane__change{display:flex;flex-direction:column;align-items:flex-start;gap:1px;width:100%;min-height:var(--target-comfort);padding:6px 10px;text-align:left;line-height:1.25}.lane__change span{font-size:.72rem;font-weight:700}.lane__change span+span{color:var(--grey-500);font-weight:400}.lane__change strong{color:var(--mth-pink-hover);font-size:.68rem;font-weight:800;text-decoration:underline}.lane__change:hover strong{color:var(--mth-pink-press)}.fader{width:100%;accent-color:var(--mth-pink)}.timeline{position:relative;min-height:84px;padding:18px 0 6px;user-select:none}.timeline__grid{position:absolute;inset:0;pointer-events:none}.timeline__line{position:absolute;top:14px;bottom:2px;width:1px;background:var(--line-step)}.timeline__line--beat{background:var(--line-beat)}.timeline__line--bar{width:2px;background:var(--line-bar)}.timeline__bar-number{position:absolute;top:0;font-size:.62rem;font-weight:800;color:var(--grey-500);font-variant-numeric:tabular-nums}.timeline__space{position:absolute;top:18px;bottom:6px;border:none;background:transparent;cursor:copy;padding:0}.timeline__space:hover{background:#7b61ff0f}.chord-block{position:absolute;top:18px;bottom:6px;border-radius:var(--radius-cell);background:var(--track-chords-soft);border:2px solid var(--track-chords);overflow:visible}.chord-block--selected{border-color:var(--mth-charcoal);border-width:3px}.chord-block--playing{box-shadow:0 0 0 3px var(--mth-pink)}.chord-block--dragging{opacity:.85}.chord-block__face{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;padding:2px 10px;border:none;border-radius:calc(var(--radius-cell) - 2px);background:transparent;color:var(--mth-charcoal);cursor:pointer;overflow:hidden}.chord-block__symbol{font-size:1.25rem;font-weight:900;line-height:1.1;white-space:nowrap}.chord-block__numeral{font-size:.68rem;font-weight:700;color:var(--grey-500)}.chord-block__feel{font-size:.64rem;color:var(--grey-500)}.chord-block__section{position:absolute;top:-11px;left:6px;z-index:2;padding:1px 6px;border-radius:var(--radius-pill);background:var(--mth-mint);color:var(--mth-charcoal);font-size:.62rem;font-weight:800;white-space:nowrap}.chord-block__grip{position:absolute;top:0;bottom:0;width:10px;cursor:ew-resize;touch-action:none}.chord-block__grip--start{left:-1px;border-radius:var(--radius-cell) 0 0 var(--radius-cell)}.chord-block__grip--end{right:-1px;border-radius:0 var(--radius-cell) var(--radius-cell) 0}.chord-block__grip:hover{background:var(--track-chords);opacity:.55}.bars{display:flex;gap:6px;align-items:stretch;min-width:max-content}.block-row>.block,.loop-strip>.loop-cell{width:calc(var(--bar-width, 232px) - 6px);margin-right:6px;flex:none}.bar-tile{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;width:104px;min-height:76px;padding:var(--space-2);border:2px solid var(--grey-300);border-radius:var(--radius-cell);background:var(--surface-white);color:var(--mth-charcoal);cursor:pointer;transition:transform var(--motion-quick) var(--ease-out),border-color var(--motion-quick) var(--ease-out)}.bar-tile:hover{border-color:var(--track-chords)}.bar-tile--filled{background:var(--track-chords-soft);border-color:var(--track-chords)}.bar-tile--selected{border-color:var(--mth-charcoal);border-width:3px}.bar-tile--playing{box-shadow:0 0 0 3px var(--mth-pink)}.bar-tile__symbol{font-size:1.35rem;font-weight:900}.bar-tile__symbol--empty{color:var(--grey-500);font-size:1rem;font-weight:700}.bar-tile__numeral{font-size:.72rem;font-weight:700;color:var(--grey-500)}.bar-tile__rhythm{font-size:.68rem;color:var(--grey-500)}.bar-tile__number{position:absolute;top:3px;left:6px;font-size:.62rem;font-weight:800;color:var(--grey-500);font-variant-numeric:tabular-nums}.bar-tile__section{position:absolute;top:-9px;left:6px;padding:1px 6px;border-radius:var(--radius-pill);background:var(--mth-mint);color:var(--mth-charcoal);font-size:.62rem;font-weight:800}.bar-add{width:56px;min-height:76px;border:2px dashed var(--grey-300);border-radius:var(--radius-cell);background:transparent;color:var(--grey-500);font-size:1.4rem;font-weight:700;cursor:pointer}.bar-add:hover:not(:disabled){border-color:var(--mth-pink);color:var(--mth-pink)}.slim{position:relative;height:28px}.slim__block,.slim__gap{position:absolute;top:0;bottom:0;display:flex;align-items:center;justify-content:center;padding:0 8px;border-radius:6px;font-size:.68rem;font-weight:700;cursor:pointer;overflow:hidden;white-space:nowrap}.slim__block--drums{background:var(--track-drums-soft);border:2px solid var(--track-drums);color:var(--mth-charcoal)}.slim__block--playing{box-shadow:0 0 0 3px var(--mth-pink)}.slim__gap{border:2px dashed var(--grey-300);background:transparent;color:var(--grey-500);font-size:1rem}.slim__gap:hover{border-color:var(--mth-pink);color:var(--mth-pink)}.slim__gap--playing{border-color:var(--mth-pink)}.lane--slim .lane__head{flex-direction:row;flex-wrap:wrap;align-items:center;gap:3px 6px;padding:5px 10px}.lane--slim .lane__title{order:1;gap:5px;font-size:.8rem}.lane--slim .lane__title .lane__state{padding:0 5px;font-size:.6rem}.lane--slim .lane__change{order:3;flex-direction:row;align-items:baseline;flex-wrap:nowrap;width:100%;min-height:24px;padding:2px 6px;gap:5px;overflow:hidden}.lane--slim .lane__change span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.68rem}.lane--slim .lane__change strong{margin-left:auto;font-size:.64rem}.lane--slim .lane__controls{order:2;gap:3px;flex:1 1 96px;min-width:0}.lane--slim .mini-btn{min-width:24px;min-height:24px;padding:0 4px;font-size:.66rem}.lane--slim .fader{flex:1 1 40px;min-width:40px;width:auto;height:14px}.lane--slim .lane__body{padding-top:4px;padding-bottom:4px}.lane--slim .lane__body{padding-left:var(--space-3);padding-right:var(--space-3)}.lane--slim .slim{height:28px}.block-row{display:flex;gap:0;min-width:max-content}.block{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:48px;border:2px solid var(--grey-300);border-radius:var(--radius-cell);background:var(--surface-white);font-size:.72rem;font-weight:700;color:var(--grey-500);cursor:pointer}.block--on{background:var(--track-drums-soft);border-color:var(--track-drums);color:var(--mth-charcoal)}.block--playing{box-shadow:0 0 0 3px var(--mth-pink)}.lane__actions{margin-top:10px}.lane__actions-snap{gap:4px;margin-left:auto}@media(max-width:900px){.lane__actions-snap{margin-left:0}}.lane__select{width:100%;min-height:34px;padding:0 8px;font-size:.78rem}.lane__wide-btn{width:100%}.lane-preview{display:block;width:100%;height:34px}.lane-preview__empty{font-size:.72rem;font-weight:700;color:var(--grey-500)}.ruler-numbers{display:flex;gap:0;min-width:max-content}.ruler-numbers__bar{width:calc(var(--bar-width, 232px) - 6px);margin-right:6px;flex:none;padding-left:2px;font-size:.68rem;font-weight:800;color:var(--grey-500);font-variant-numeric:tabular-nums;border-left:2px solid var(--grey-300)}.loop-strip{display:flex;gap:0;min-width:max-content;margin-bottom:6px}.loop-cell{height:18px;border:2px dashed var(--grey-300);border-radius:6px;background:transparent;font-size:.6rem;font-weight:800;color:var(--grey-500);cursor:pointer}.loop-cell:hover{border-style:solid;border-color:var(--loop-gold)}.loop-cell--in{background:var(--loop-gold-soft);border-style:solid;border-color:var(--loop-gold);color:var(--mth-charcoal)}.panel{flex:none;display:flex;flex-direction:column;border-top:1px solid var(--grey-300);background:var(--surface-white);max-height:54dvh;overflow:auto}.panel__head{position:sticky;top:0;z-index:2;display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--grey-300);background:var(--surface-white)}.panel__title{font-weight:800}.panel--closed{flex-direction:row;flex-wrap:wrap;align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-4)}.panel__body{padding:var(--space-4)}.panel__close{margin-left:auto}.sheet-backdrop{position:fixed;inset:0;z-index:40;display:grid;place-items:center;padding:var(--space-4);background:#161b2273}.sheet{width:100%;max-width:640px;max-height:88dvh;overflow:auto;border-radius:var(--radius-card);background:var(--surface-white);box-shadow:var(--shadow-raised)}.sheet__head{position:sticky;top:0;display:flex;align-items:center;gap:var(--space-3);padding:var(--space-4);border-bottom:1px solid var(--grey-300);background:var(--surface-white)}.sheet__body{padding:var(--space-4);display:flex;flex-direction:column;gap:var(--space-4)}.sheet__foot{display:flex;gap:var(--space-2);justify-content:flex-end;padding:var(--space-4);border-top:1px solid var(--grey-300)}.sheet__problem{padding:var(--space-3);border-radius:var(--radius-cell);background:#fdecea;color:#a8331f;font-weight:700;font-size:var(--text-small)}.sheet__note{padding:var(--space-3);border-radius:var(--radius-cell);background:var(--grey-100);color:var(--text-body);font-size:var(--text-small)}.field{display:flex;flex-direction:column;gap:6px}.field>span{font-size:var(--text-small);font-weight:700}.field input[type=text],.field input[type=number],.field select,.field textarea{min-height:var(--target-comfort);padding:0 var(--space-3);border:2px solid var(--grey-300);border-radius:var(--radius-input);background:var(--surface-white)}.field-row{display:flex;flex-wrap:wrap;gap:var(--space-3)}.field-row>.field{flex:1 1 180px}.palette{display:flex;flex-direction:column;gap:var(--space-3)}.palette__row{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.palette__label{font-size:var(--text-small);font-weight:700;min-width:92px}.chord-chip{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:84px;min-height:var(--target-min);padding:6px var(--space-3);border:2px solid var(--grey-300);border-radius:var(--radius-cell);background:var(--surface-white);color:var(--mth-charcoal);font-weight:800;cursor:pointer}.chord-chip:hover{background:var(--track-chords-soft);border-color:var(--track-chords)}.chord-chip--active{background:#6a4dff;border-color:#6a4dff;color:#fff}.chord-chip small{font-size:.66rem;font-weight:700;opacity:.75}.option-chip{min-height:var(--target-comfort);padding:0 var(--space-3);border:2px solid var(--grey-300);border-radius:var(--radius-pill);background:var(--surface-white);font-weight:700;cursor:pointer}.option-chip[aria-pressed=true]{background:var(--mth-charcoal);border-color:var(--mth-charcoal);color:#fff}.option-chip:hover:not([aria-pressed=true]){background:var(--grey-100)}.pattern-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:var(--space-2)}.pattern-card{display:flex;flex-direction:column;gap:2px;align-items:flex-start;min-height:var(--target-min);padding:var(--space-3);border:2px solid var(--grey-300);border-radius:var(--radius-cell);background:var(--surface-white);text-align:left;cursor:pointer}.pattern-card strong{font-weight:800}.pattern-card small{color:var(--grey-500);font-size:.72rem;line-height:1.35}.pattern-card[aria-pressed=true]{background:var(--track-drums-soft);border-color:var(--track-drums)}.pattern-card:disabled{opacity:.5;cursor:not-allowed}.pattern-card:hover:not(:disabled):not([aria-pressed=true]){background:var(--grey-100)}.chord-pop{z-index:30;display:flex;flex-direction:column;overflow:hidden;border:2px solid var(--mth-charcoal);border-radius:var(--radius-card);background:var(--surface-white);box-shadow:var(--shadow-raised)}.chord-pop__head{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--grey-300);background:var(--grey-100)}.chord-pop__title{display:flex;align-items:baseline;gap:var(--space-2);font-weight:800}.chord-pop__numeral{padding:1px 8px;border-radius:var(--radius-pill);background:var(--track-chords-soft);color:var(--mth-charcoal);font-size:.72rem;font-weight:800}.chord-pop__head .btn{margin-left:auto}.chord-pop__body{display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-3);overflow:auto}.chord-pop__row{display:flex;align-items:flex-start;gap:var(--space-2);flex-wrap:wrap}.chord-pop__row--foot{padding-top:var(--space-2);border-top:1px solid var(--grey-300)}.chord-pop__label{width:84px;flex:none;padding-top:8px;font-size:var(--text-small);font-weight:700}.chord-pop__chips{display:flex;flex-wrap:wrap;gap:4px;flex:1 1 240px}.chord-pop__toggle{align-items:flex-start;gap:var(--space-2)}.degree-chip{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:52px;min-height:var(--target-min);padding:4px 8px;border:2px solid var(--grey-300);border-radius:var(--radius-cell);background:var(--surface-white);color:var(--mth-charcoal);cursor:pointer}.degree-chip strong{font-size:.92rem;font-weight:800}.degree-chip small{font-size:.66rem;color:var(--grey-500)}.degree-chip:hover{background:var(--track-chords-soft);border-color:var(--track-chords)}.degree-chip--active{background:#6a4dff;border-color:#6a4dff;color:#fff}.degree-chip--active small{color:#ffffffd1}.degree-chip--borrowed{background:repeating-linear-gradient(135deg,var(--grey-100),var(--grey-100) 6px,#e7e2d6 6px,#e7e2d6 12px)}.degree-chip--borrowed.degree-chip--active{background:#6a4dff}.option-chip--tight{min-height:var(--target-comfort);padding:0 10px;font-size:.8rem}.cycler{display:flex;align-items:stretch;border:2px solid var(--grey-300);border-radius:var(--radius-pill);background:var(--surface-white);overflow:hidden}.cycler__step{min-width:40px;min-height:var(--target-comfort);border:none;background:transparent;color:var(--mth-charcoal);font-size:1.2rem;font-weight:800;cursor:pointer}.cycler__step:hover:not(:disabled){background:var(--grey-100)}.cycler__step:disabled{color:var(--grey-500);cursor:not-allowed}.cycler__value{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:148px;padding:0 var(--space-2);border-left:2px solid var(--grey-300);border-right:2px solid var(--grey-300);font-size:.82rem;font-weight:700;text-align:center}.cycler__value small{font-size:.64rem;font-weight:400;color:var(--grey-500)}.panel--display{flex:1 1 auto;max-height:none;min-height:0;overflow:hidden}.panel--display .panel__body{flex:1 1 auto;min-height:0;display:flex;padding-top:0}.display{flex:1 1 auto;min-height:0;overflow:auto;padding:var(--space-2) 0}.display:focus-visible{outline:3px solid var(--mth-charcoal);outline-offset:-3px}.display__sheet{position:relative}.display svg{display:block;margin:0 auto}.bar-picker{gap:var(--space-2)}.bar-picker__label{font-size:1.25rem;font-weight:900;min-width:4.5rem}.bar-picker__hint{margin-left:auto}.value-palette{gap:var(--space-3);align-items:center}.value-palette__values{gap:6px}.value-palette__colours{margin-left:auto;white-space:nowrap}.value-chip{display:flex;align-items:center;gap:8px;min-height:var(--target-min);padding:0 var(--space-3);border:2px solid var(--grey-300);border-radius:var(--radius-pill);background:var(--surface-white);color:var(--mth-charcoal);font-weight:700;cursor:pointer}.value-chip:hover:not([aria-pressed=true]){background:var(--grey-100)}.value-chip[aria-pressed=true]{background:var(--mth-pink-hover);border-color:var(--mth-pink-hover);color:#fff}.value-chip__name{font-size:.86rem}.value-chip__fraction{font-size:.72rem;font-weight:800;color:var(--grey-500);font-variant-numeric:tabular-nums}.value-chip[aria-pressed=true] .value-chip__fraction{color:#fff}.value-chip--rubber{margin-left:var(--space-2)}.block--editing{border-color:var(--mth-charcoal)!important;box-shadow:inset 0 0 0 2px var(--mth-charcoal)}.stave{overflow-x:auto;overflow-y:hidden;padding:var(--space-2) 0 0;border:1px solid var(--grey-300);border-radius:var(--radius-cell);background:var(--surface-white)}.stave__sheet{position:relative;min-width:max-content}.stave svg{display:block}.stave__footnote{padding:0 var(--space-3) var(--space-3);color:var(--grey-500);font-size:var(--text-small)}.stave__note{cursor:pointer}.stave__note--selected{outline:none}@keyframes note-bounce{0%{transform:translateY(0) scale(1)}40%{transform:translateY(-3px) scale(1.12)}to{transform:translateY(0) scale(1)}}.is-sounding{animation:note-bounce var(--motion-calm) var(--ease-out);transform-box:fill-box;transform-origin:center}@media(prefers-reduced-motion:reduce){.is-sounding{animation:none}}.playhead{position:absolute;top:0;bottom:0;width:2px;background:var(--mth-pink);pointer-events:none}.playhead--response{background:var(--loop-gold)}.response-banner{display:flex;align-items:center;gap:var(--space-2);padding:6px var(--space-3);border-radius:var(--radius-pill);background:var(--loop-gold-soft);border:2px solid var(--loop-gold);font-weight:800;font-size:var(--text-small)}.muted-text{color:var(--grey-500);font-size:var(--text-small)}.stack{display:flex;flex-direction:column;gap:var(--space-3)}.row{display:flex;flex-wrap:wrap;gap:var(--space-2);align-items:center}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}@media(max-width:1100px){.arrangement{padding:var(--space-3)}.lane__body{padding:var(--space-2)}.lane--slim .lane__body{padding-left:var(--space-2);padding-right:var(--space-2)}.lanes{padding-left:6px}.app-header{padding:var(--space-2) var(--space-3)}.transport{padding:var(--space-2) var(--space-3);gap:var(--space-2)}.tempo-slider{width:92px}.lane__title{font-size:.85rem}.panel{max-height:58dvh}}@media(max-width:760px){.app-shell{min-width:0}.lane{grid-template-columns:1fr}.lane__head{position:static;flex-direction:row;flex-wrap:wrap;align-items:center;gap:var(--space-2);border-right:none;border-bottom:1px solid var(--grey-300);border-radius:var(--radius-card) var(--radius-card) 0 0}.lane__controls{margin-left:auto}.lane__select,.lane__wide-btn{width:auto;flex:1 1 140px}.lane__change{flex:1 1 160px}.ruler-row__head{padding:var(--space-2) var(--space-3) 0}.ruler-row,.hscroll{grid-template-columns:1fr}.lanes{padding-left:3px}.fader{width:100px}.app-header,.transport{flex-wrap:wrap;height:auto;min-height:0}.title-field{flex:1 1 140px;min-width:0}.header-actions,.transport__spacer{margin-left:0}.panel{max-height:62dvh}.bar-picker__jump{max-width:100%;margin-left:0}}@media(max-width:520px){.brand-logo{width:72px}.app-name small{display:none}.btn{padding:0 var(--space-2)}.arrangement{padding:var(--space-2)}.panel__body{padding:var(--space-3)}.sheet{width:100%;max-width:none;border-radius:0}}@media(max-height:700px){.panel{max-height:46dvh}.bar-picker__label{font-size:1.05rem}}.gate{min-height:100vh;min-height:100dvh;display:grid;place-items:center;padding:var(--space-5);background:var(--grey-100)}.gate__inner{width:100%;max-width:420px}.gate__logo{display:block;width:200px;max-width:70%;height:auto;margin:0 auto var(--space-5)}.gate__card{display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-5);background:var(--surface-white);border:1px solid var(--grey-300);border-radius:var(--radius-card);box-shadow:var(--shadow-card)}.gate__title{margin:0;font-family:var(--font-brand);font-size:1.5rem;font-weight:800;color:var(--mth-charcoal)}.gate__lead{margin:0;color:var(--grey-500)}.gate__field{display:flex;flex-direction:column;gap:4px;font-size:var(--text-small);color:var(--mth-charcoal)}.gate__input,.gate__code-input{width:100%;padding:10px 12px;border:2px solid var(--grey-300);border-radius:var(--radius-pill);background:var(--surface-white);color:var(--mth-charcoal);font:inherit}.gate__code-input{text-align:center;font-size:1.5rem;font-weight:700;letter-spacing:.08em;border-radius:var(--radius-card)}.gate__input:focus-visible,.gate__code-input:focus-visible{outline:2px solid var(--mth-charcoal);outline-offset:2px}.gate__btn{padding:11px 16px;border:2px solid var(--grey-300);border-radius:var(--radius-pill);background:var(--surface-white);color:var(--mth-charcoal);font:inherit;font-weight:700;cursor:pointer}.gate__btn--primary{background:var(--mth-pink-hover);border-color:var(--mth-pink-hover);color:#fff}.gate__btn:disabled{opacity:.55;cursor:default;background:var(--surface-white)}.gate__btn--primary:disabled,.gate__btn--primary:hover:not(:disabled){background:var(--mth-pink-hover);border-color:var(--mth-pink-hover);color:#fff}.gate__btn--primary:hover:not(:disabled){background:var(--mth-pink-press);border-color:var(--mth-pink-press)}.gate__link:hover:not(:disabled){background:none}.gate__link{align-self:center;border:none;background:none;color:var(--grey-500);font:inherit;cursor:pointer;text-decoration:underline}.gate__error{margin:0;color:#a8331f;font-size:var(--text-small);font-weight:700}.gate__waiting{padding:var(--space-5);text-align:center;color:var(--grey-500)}.teacher-shell{display:flex;flex-direction:column;height:100vh;height:100dvh;overflow:hidden}.teacher-shell>:not(.teacher-bar){flex:1 1 0;min-height:0}.teacher-bar{display:flex;align-items:center;gap:var(--space-4);flex-wrap:wrap;padding:8px var(--space-4);background:var(--mth-charcoal);color:#fff}.teacher-bar__who{display:flex;align-items:baseline;gap:8px;min-width:0}.teacher-bar__role{padding:2px 8px;border-radius:var(--radius-pill);background:#ffffff24;font-size:.75rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase}.teacher-bar__email{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.teacher-bar__session{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-width:0}.teacher-bar__code-label{font-size:.75rem;letter-spacing:.06em;text-transform:uppercase;color:#fff9}.teacher-bar__code{font-family:var(--font-brand);font-size:1.5rem;font-weight:800;letter-spacing:.06em;color:#f2b705}.teacher-bar__actions{display:flex;align-items:center;gap:10px;margin-left:auto}.teacher-bar__btn{padding:7px 14px;border:1px solid rgb(255 255 255 / 30%);border-radius:var(--radius-pill);background:transparent;color:#fff;font:inherit;font-weight:700;cursor:pointer}.teacher-bar__btn:hover:not(:disabled){background:#ffffff1f}.teacher-bar__btn--primary,.teacher-bar__btn--primary:hover:not(:disabled){background:var(--mth-pink-hover);border-color:var(--mth-pink-hover)}.teacher-bar__btn--primary:hover:not(:disabled){background:var(--mth-pink-press)}.teacher-bar__btn:disabled{opacity:.55;cursor:default}.teacher-bar__error{color:#ffb3c6;font-size:.8rem}