@font-face{font-family:Inter;src:url(/fonts/InterVariable.woff2)format("woff2");font-style:normal;font-weight:100 900;font-display:swap}:root{color-scheme:dark;color:#eeedf5;--bg:#141419;--panel:#1c1c23;--border:#3a3843;--border-soft:#302d38;--text:#eeedf5;--muted:#bcb6ce;--lavender:#c6bef2;--pink:#df9ccd;--cyan:#b6dcad;--amber:#dfbf88;--mono:ui-monospace, SFMono-Regular, Consolas, monospace;--panel-padding:28px;--string-height:42px;--note-size:38px;--card-height:92px;background:#141419;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html{min-width:320px}body{-webkit-font-smoothing:antialiased;min-width:320px;margin:0;font-size:14px;line-height:1.5}button,input,select{font:inherit;color:inherit;touch-action:manipulation}button{cursor:pointer;background:0 0;border:0}button:disabled,button[aria-disabled=true]{cursor:not-allowed;opacity:.45}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--lavender);outline-offset:3px}h1,h2,h3,p{margin:0}h2{letter-spacing:-.4px;color:#d8d3ee;font-size:24px;font-weight:600;line-height:1.25}svg{flex-shrink:0;display:block}select{background:#1c1b23;border:1px solid #4b4355;border-radius:7px;max-width:100%;min-height:40px;padding:7px 12px}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.skip-link{z-index:100;background:var(--lavender);color:#211b29;border-radius:6px;padding:10px 14px;position:fixed;top:-60px;left:20px}.skip-link:focus{top:10px}.boot-screen{justify-content:center;align-items:center;gap:10px;min-height:100dvh;display:flex}.app-header{border-bottom:1px solid var(--border);background:linear-gradient(110deg,#202027,#19191f);justify-content:space-between;align-items:center;gap:16px;height:58px;padding:0 32px;display:flex}.brand{color:inherit;align-items:center;gap:18px;text-decoration:none;display:flex}.brand-mark{fill:var(--bg);stroke:var(--lavender);stroke-width:1.5px;flex:none}.brand strong{letter-spacing:.2px;white-space:nowrap;font-size:22px;font-weight:600}.brand-dot{color:var(--pink)}.header-actions{align-items:center;gap:12px;display:flex}.tool-divider{background:var(--border);width:1px;height:28px;margin:0 10px}.status-dot{background:var(--cyan);border-radius:50%;width:7px;height:7px}.save-button{min-height:40px;color:var(--muted);flex-shrink:0;align-items:center;gap:12px;font-size:14px;display:flex}.save-button:disabled{opacity:1}.save-icon{flex:0 0 21px;place-items:center;width:21px;height:21px;display:grid}.save-icon svg{width:20px;height:20px}.save-label{text-align:left;white-space:nowrap;width:112px}.save-button.busy .save-icon svg{animation:1s linear infinite save-spin}.save-button.error{color:var(--amber)}@keyframes save-spin{to{transform:rotate(360deg)}}.icon-button{width:40px;height:40px;color:var(--muted);border:1px solid #0000;border-radius:7px;flex:none;justify-content:center;align-items:center;display:inline-flex}.icon-button:hover{color:var(--text);background:#302b39}.icon-button.locked{border-color:var(--pink);color:var(--pink)}.tooltip-anchor{display:inline-flex;position:relative}.tooltip{z-index:80;background:#25222d;border:1px solid #51485e;border-radius:6px;width:max-content;max-width:min(250px,100vw - 24px);padding:7px 9px;font-size:12px;position:absolute;top:calc(100% + 8px);right:0;box-shadow:0 10px 30px #0008}.project-heading{align-items:center;gap:28px;min-width:0;min-height:40px;display:flex}.project-title-label{align-items:center;gap:20px;min-width:0;display:flex}.project-title-label svg{color:var(--muted)}.project-title{letter-spacing:-.7px;background:0 0;border:0;width:20ch;min-width:0;max-width:100%;padding:0;font-size:28px;font-weight:600}@supports (field-sizing:content){.project-title{field-sizing:content;width:auto;max-width:34ch}}.project-tuning{color:var(--muted);background:0 0;border-color:#0000;font-size:14px}.panel{border:1px solid var(--border);background:linear-gradient(115deg,#1d1d24,#1a1b20);border-radius:9px;min-width:0}.panel-heading{justify-content:space-between;align-items:center;gap:12px;display:flex}.microcopy{color:var(--muted);font-size:14px;line-height:1.5}.eyebrow{color:var(--muted);font-size:11px}.button{white-space:nowrap;background:#25212d;border:1px solid #66576f;border-radius:7px;justify-content:center;align-items:center;gap:10px;min-height:40px;padding:8px 16px;font-size:14px;display:inline-flex}.button.quiet{color:#edcce5;background:0 0;border-color:#b687a8}.button.primary{color:#251827;background:linear-gradient(130deg,#e6abd8,#d68cc4);border-color:#e6afd9;font-weight:650;box-shadow:inset 0 1px #ffffff26}.button.lavender{color:var(--lavender)}.button.danger{color:#e2a8bf}.button:hover:not(:disabled){filter:brightness(1.12)}.wide{width:100%}.text-button{min-height:36px;color:var(--lavender)}.projects-button{background:0 0;font-size:16px;color:var(--text)!important;border:0!important}.fret-heading{min-width:0}.segmented{background:#1b1a22;border:1px solid #4a4254;border-radius:8px;padding:2px;display:inline-flex}.segmented button{min-height:34px;color:var(--muted);border-radius:6px;padding:5px 30px;font-size:14px}.segmented button.active{color:#251c27;background:linear-gradient(130deg,#e6acd8,#d490c5);font-weight:600;box-shadow:inset 0 1px #ffffff30}.fret-cell{isolation:isolate;background:repeating-linear-gradient(2deg,#76624e0a 0 1px,#17191b08 2px 5px),linear-gradient(95deg,#312d29,#252628 55%,#2d2b29);border-right:1px solid #777570;place-items:center;min-width:44px;padding:0;display:grid;position:relative}.fret-cell:before{content:"";z-index:-1;background:linear-gradient(#e3cfb3,#8e7b62);height:1.5px;position:absolute;top:50%;left:0;right:-1px;box-shadow:0 1px 2px #000b}.fret-cell[data-string="2"]:before{height:2px}.fret-cell[data-string="1"]:before{height:2.5px}.fret-cell[data-string="0"]:before{height:3px}.fret-cell[data-inlay=true]:after{content:"";z-index:-1;opacity:.65;background:#aaa8a4;border-radius:50%;width:12px;height:12px;position:absolute;top:-6px;left:calc(50% - 6px)}.fret-cell[data-string="5"]{box-shadow:inset 0 2px #8d8170}.fret-cell[data-string="0"]{box-shadow:inset 0 -2px #8d8170}.fret-cell:hover{background-color:#373238}.fret-cell:hover .fret-note{filter:brightness(1.1)}.fret-cell:focus-visible{outline-offset:-3px;z-index:2}.fret-cell[aria-disabled=true]{opacity:1;cursor:default}.fret-note{width:var(--note-size);height:var(--note-size);color:#242132;background:linear-gradient(135deg,#dfdcfd,#b8b2e9);border:1px solid #e4defa;border-radius:50%;place-items:center;font-size:17px;font-weight:600;display:grid;box-shadow:inset 0 1px #fff7,0 2px 4px #0005}.fret-note.root{background:linear-gradient(135deg,#ecb1dc,#d58ac0);border-color:#f2c3e4}.fret-note.scale{color:#d1e9d9;border-color:var(--cyan);background:#334b40}.fret-note.ghost{width:calc(var(--note-size) - 8px);height:calc(var(--note-size) - 8px);opacity:.65;font-size:12px}.pinned .fret-note{outline:2px solid var(--cyan);outline-offset:2px}.changed .fret-note{outline:2px dashed var(--amber);outline-offset:3px}.fret-lock{left:calc(50% + var(--note-size) / 2 + 5px);color:var(--cyan);background:#203028;border-radius:4px;width:20px;height:20px;padding:2px;position:absolute}.open-marker{width:var(--note-size);text-align:center;color:#eee6ed;font-size:27px;line-height:1}.fret-number{text-align:center;color:#c9c2dc;font:16px var(--mono);padding-top:10px}.chord-extension{font:inherit}.chord-notes{color:#d0c7df;font-size:15px}.shape-display{color:#d7cce2;font:16px var(--mono);gap:13px;margin-top:6px;display:flex}.shape-display .mute{color:#b6a7bd}.held-notes{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.held{color:#c9e9c1;background:#253129;border:1px solid #7fa174;border-radius:15px;align-items:center;gap:8px;min-height:34px;padding:4px 12px;font-size:14px;display:inline-flex}.pin-picker{position:relative}.pin-picker>summary{min-height:34px;color:var(--muted);cursor:pointer;border:1px solid #575063;border-radius:15px;align-items:center;gap:8px;padding:4px 12px;font-size:14px;list-style:none;display:flex}.pin-options,.suite-menu-items{z-index:10;background:#27232e;border:1px solid #564960;border-radius:8px;min-width:220px;padding:6px;position:absolute;top:calc(100% + 8px);box-shadow:0 10px 25px #0008}.pin-options{left:0}.pin-options button,.suite-menu-items button{text-align:left;border-radius:5px;align-items:center;gap:10px;width:100%;min-height:40px;padding:8px 10px;font-size:13px;display:flex}.pin-options button:hover,.suite-menu-items button:hover{background:#393143}.editor-message{color:var(--amber);margin-top:8px;font-size:13px}.suite-tools{align-items:center;gap:10px;display:flex}.measure-count{color:var(--muted);font-size:14px}.suite-menu{position:relative}.suite-menu>summary{width:28px;height:28px;color:var(--muted);cursor:pointer;place-items:center;list-style:none;display:grid}.suite-menu-items{right:0}.measure-marker{text-align:center;color:#c0b6d3;height:24px;font:14px/20px var(--mono);border-bottom:1px solid #45404e;margin-bottom:9px;display:block;position:relative}.measure-marker.selected{color:var(--pink)}.measure-marker.selected:after,.measure-marker.playing:after{content:"";background:var(--pink);border-radius:50%;width:5px;height:5px;position:absolute;bottom:-3px;left:calc(50% - 3px)}.measure-marker.playing{color:var(--cyan)}.measure-marker.playing:after{background:var(--cyan)}.chord-card.active{border-color:var(--pink);box-shadow:inset 0 0 0 1px var(--pink)}.chord-card.playing{box-shadow:inset 0 -3px var(--cyan)}.exploration-tabs{border-bottom:1px solid var(--border);margin-top:12px;display:flex}.exploration-tabs button{min-height:44px;color:var(--muted);border-bottom:2px solid #0000;flex:1;font-size:15px}.exploration-tabs button.active{color:#e6afd9;border-bottom-color:var(--pink)}.exploration-intro{min-height:52px;color:var(--muted);flex-wrap:wrap;align-items:center;gap:8px;margin:10px 8px 0;font-size:14px;display:flex}.exploration-intro>span{color:#a59bb2}.suggestion-card.previewing{border-color:var(--amber)}.preview-button{color:#f0e6ef;border:1px solid #b783a7;border-radius:50%;place-items:center;width:44px;height:44px;display:grid}.preview-button svg{fill:currentColor}.empty-suggestions{color:var(--muted);padding:12px 0;font-size:14px}.workshop-details{border-top:1px solid var(--border);margin-top:20px}.workshop-details>summary{color:#d7d0e8;cursor:pointer;min-height:44px;padding:14px 0 6px;font-size:14px}.audio-state.is-active{color:var(--muted);max-width:230px;padding-top:4px;font-size:12px;display:block}.transport-toggle{min-height:40px;color:var(--muted);cursor:pointer;align-items:center;gap:16px;font-size:14px;display:flex}.transport-toggle input{appearance:none;cursor:pointer;background:#514d63;border:1px solid #635e73;border-radius:20px;width:47px;height:27px;margin:0}.transport-toggle input:before{content:"";background:#c2bed5;border-radius:50%;width:21px;height:21px;margin:2px;display:block;box-shadow:0 1px 4px #0005}.transport-toggle input:checked{background:var(--pink);border-color:#e5addb}.transport-toggle input:checked:before{background:#f4e3f5;transform:translate(19px)}.desktop-footer{color:#9f94aa;justify-content:flex-end;max-width:1548px;margin:auto;padding:3px 18px;font-size:10px;display:flex}.desktop-footer a{color:inherit}.note-chip{width:40px;height:40px;color:var(--muted);border:1px solid #51475e;border-radius:50%;place-items:center;padding:0;display:grid}.note-chip.selected{background:var(--lavender);color:#252034}.note-chip.is-root{background:var(--pink)}.root-row{color:var(--muted);justify-content:space-between;align-items:center;gap:16px;margin:18px 0 0;font-size:13px;display:flex}.interval-symbol{color:var(--lavender)}.position-navigation{align-items:center;gap:8px;font-size:13px;display:flex}.fret-footer{color:var(--muted);flex-wrap:wrap;justify-content:space-between;gap:8px;margin:12px 0;font-size:12px;display:flex}.mode-button.active{color:var(--lavender);background:#2b2436;border-color:#88729a}.optimizer-note{margin-top:10px;font-size:12px}.harmony-section .segmented{margin:14px 0}.harmony-section .segmented button{flex:1;padding-inline:8px}.field-label{color:var(--muted);margin-bottom:8px;font-size:13px;display:block}.scale-notes{flex-wrap:wrap;gap:7px;margin-top:14px;display:flex}.scale-notes span{color:var(--cyan);border:1px solid #52705b;border-radius:5px;padding:4px 8px;font-size:13px}.scale-notes span.chord-tone{color:var(--lavender);border-color:#7b6d8e}.scale-notes span.root{color:var(--pink);border-color:#a47799}.scale-overlay{color:var(--muted);gap:8px;margin:14px 0;font-size:13px;display:flex}.scale-overlay input{accent-color:var(--cyan)}.common-notes{border-top:1px solid var(--border);gap:6px;margin-top:16px;padding-top:14px;display:grid}.common-notes strong{color:var(--cyan);font-size:13px}.project-dialog{background:var(--panel);width:min(720px,100vw - 32px);max-height:min(760px,100dvh - 32px);color:var(--text);border:1px solid #494151;border-radius:12px;padding:22px;overflow:hidden auto;box-shadow:0 24px 80px #000b}.project-dialog::backdrop{backdrop-filter:blur(3px);background:#09080dbd}.dialog-heading{justify-content:space-between;align-items:flex-start;gap:16px;display:flex}.dialog-heading h2{margin-top:3px;font-size:22px;font-weight:550}.dialog-intro{color:var(--muted);margin:8px 0 18px;font-size:11px}.project-list{flex-direction:column;gap:8px;margin:16px 0;display:flex}.project-row{border:1px solid var(--border);background:#17171d;border-radius:8px;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px 12px;padding:13px;display:grid}.project-row.active{background:#241e2a;border-color:#725d79}.project-row.error{color:var(--amber)}.project-row.error p{color:var(--muted);margin-top:3px;font-size:10px}.project-row-main{min-width:0}.project-row-title{background:0 0;border:1px solid #0000;border-radius:5px;width:100%;padding:5px 7px;font-size:14px;font-weight:600}.project-row-title:hover,.project-row-title:focus{border-color:var(--border);background:#202027}.project-row-meta{color:var(--muted);margin:3px 7px 0;font-size:10px;display:block}.project-pill{color:var(--lavender);font:8px var(--mono);letter-spacing:.08em;text-transform:uppercase;border:1px solid #5c4c66;border-radius:999px;padding:3px 6px}.project-row-actions{grid-column:1/-1;justify-content:flex-end;gap:7px;display:flex}.project-row-actions .button{min-height:34px;padding:6px 10px}.dialog-error{color:var(--amber);background:#2b241b;border:1px solid #695035;border-radius:6px;margin:12px 0;padding:9px 10px;font-size:11px}.pwa-notice{z-index:70;max-width:min(420px,100vw - 32px);color:var(--text);background:#25222d;border:1px solid #5b4e70;border-radius:8px;align-items:center;gap:10px;padding:11px 12px;font-size:11px;display:flex;position:fixed;bottom:20px;right:20px;box-shadow:0 12px 35px #000b}.pwa-notice span{flex:1}.pwa-notice button{color:var(--lavender);font-weight:600}.pwa-notice{bottom:98px}:root{--string-height:38px;--note-size:30px;--card-height:78px;--fret-width:64px}[hidden]{display:none!important}fieldset{border:0;min-width:0;margin:0;padding:0}fieldset:disabled{opacity:.6}h2{font-size:20px}h3{color:var(--muted);font-size:14px;font-weight:550}.project-bar{max-width:1900px;margin:auto;padding:10px 24px}.workspace{grid-template-columns:248px minmax(0,1fr) 280px;align-items:start;gap:16px;max-width:1900px;margin:auto;padding:0 16px;display:grid}.composition-column{flex-direction:column;grid-area:1/2;gap:12px;min-width:0;display:flex}.understanding-slot{grid-area:1/1;min-width:0}.exploration-slot{grid-area:1/3;min-width:0}.side-tabs{display:none}.inspector-panel,.exploration-panel{padding:18px 16px}.target-caption{color:var(--muted);margin-top:5px;font-size:12px;line-height:1.5}.inspector-panel .chord-result-name{letter-spacing:-.8px;color:var(--lavender);flex-wrap:wrap;align-items:baseline;margin:20px 0 6px;font-size:32px;line-height:1.2;display:flex}.chord-result-name strong{font-weight:600}.chord-result-name small{width:100%;color:var(--muted);letter-spacing:0;font-size:12px}.chord-notes{font-size:13px}.shape-display{gap:12px;margin-top:10px;font-size:14px}.bass-label{color:var(--muted);justify-content:space-between;margin-top:18px;font-size:13px;display:flex}.bass-label strong{color:var(--text);font-weight:500}.root-row{margin-top:8px}.root-row select{min-height:34px}.interval-list{margin-top:18px}.interval-row{border-bottom:1px solid var(--border-soft);text-align:left;grid-template-columns:28px 35px 1fr;align-items:center;gap:6px;width:100%;min-height:40px;padding:6px 0;font-size:11px;display:grid}.interval-row strong{color:var(--lavender);font-size:13px}.interval-row:hover,.interval-row:focus-visible{background:#c6bef212}.inspector-positions{border-top:1px solid var(--border);margin:20px 0;padding-top:14px}.position-navigation{justify-content:space-between;gap:0;margin:6px 0}.inspector-positions .microcopy{font-size:11px}.held-notes{flex-wrap:wrap;align-items:flex-start;gap:6px}.held-notes legend{color:var(--muted);margin-bottom:8px;font-size:13px}.held,.pin-picker>summary{min-height:36px;font-size:11px}.pin-options{z-index:12;min-width:210px;max-width:calc(100vw - 64px);left:0;right:auto}.note-selector{grid-template-columns:repeat(4,40px);gap:10px;padding-top:12px;display:grid}.empty-instruction{margin-top:18px}.progression-panel{padding:14px 16px 8px}.progression{scrollbar-width:thin;align-items:flex-start;gap:10px;padding:10px 2px;display:flex;overflow-x:auto}.progression-step{flex:1 0 140px;min-width:0;max-width:220px}.chord-card{width:100%;height:var(--card-height);background:linear-gradient(115deg,#25232c,#201f27);border:1px solid #51495b;border-radius:7px;position:relative}.chord-select{text-align:left;flex-wrap:wrap;align-items:baseline;gap:0 3px;width:100%;min-height:38px;padding:8px 12px 0;font-size:18px;display:flex}.chord-select small{color:var(--muted);font-size:11px}.chord-select .chord-extension{font-size:12px}.card-duration{color:var(--muted);align-items:center;gap:5px;padding-left:12px;padding-right:30px;font-size:12px;display:flex}.card-duration input{width:26px;min-height:30px}.duration-stepper{display:grid;position:absolute;bottom:6px;right:4px}.duration-stepper button{height:17px}.chord-card.add-card{height:var(--card-height);border-style:dashed;flex:0 0 60px;place-items:center;margin-top:28px;display:grid}.draft-badge{border:1px solid var(--amber);color:var(--amber);background:#28231f;border-radius:4px;padding:0 5px;font-size:9px;line-height:16px;position:absolute;top:-7px;right:5px}.insertion-card{width:100%;color:var(--amber);border:1px dashed #7b6853;border-radius:6px;margin-top:8px;padding:8px 5px;font-size:11px}.insertion-card.active{background:#dfbf8814;border-style:solid}.progression-optimizer{margin-top:0}.progression-optimizer>summary{min-height:32px;padding:5px 0;font-size:12px}.optimization-modes{flex-wrap:wrap;gap:8px;margin:12px 0;display:flex}.mode-button{border:1px solid var(--border);text-align:left;color:var(--muted);border-radius:7px;flex:150px;align-items:center;gap:8px;padding:10px;display:flex}.fret-panel{padding:16px}.fret-toolbar{flex-wrap:wrap;justify-content:space-between;align-items:start;gap:12px;margin-bottom:16px;display:flex}.segmented button{padding-inline:14px}.fret-scroll{overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:#887895 #222029;padding-bottom:8px;position:relative;overflow-x:auto}.fret-grid{width:100%;min-width:calc(80px + 12 * var(--fret-width));grid-template-columns:28px 52px repeat(12, minmax(var(--fret-width), 1fr));grid-template-rows:repeat(6, var(--string-height)) 28px;display:grid;position:relative}.string-label{z-index:5;color:#c9c2dc;font:13px var(--mono);background:#1c1c23;align-items:center;display:flex;position:sticky;left:0}.open-cell{z-index:4;background:#28262b;border-left:0;border-right:2px solid #b99570;justify-items:center;padding:0;position:sticky;left:28px;box-shadow:5px 0 8px #0005}.open-cell:before{right:0}.open-cell .fret-lock{top:0;left:auto;right:0}.open-cell:focus-visible{z-index:6}.open-number{z-index:4;background:#1c1c23;position:sticky;left:28px}.fret-number{padding-top:5px;font-size:12px}.fret-note{font-size:13px}.fret-cell.highlighted{box-shadow:inset 0 0 0 2px var(--lavender)}.fret-cell.highlighted .fret-note{opacity:1}.fret-lock{width:16px;height:16px;top:0;left:auto;right:0}.fret-scroll-tools{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:0 8px;margin:2px 0 8px;display:flex}.fret-scroll-tools .microcopy{font-size:11px}.fret-scroll-tools .text-button{align-items:center;gap:5px;font-size:11px;display:inline-flex}.trial-summary{border-top:1px solid var(--border);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:12px 0 0;display:flex}.working-title{color:var(--text);flex-wrap:wrap;align-items:baseline;gap:3px;font-size:22px;display:flex}.working-title small{color:var(--muted);font-size:12px}.trial-summary .microcopy{margin-top:3px;font-size:12px}.trial-listen,.trial-actions{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.trial-listen .button,.trial-actions .button{padding-inline:12px;font-size:12px}.trial-actions{border-top:1px dashed #645649;margin-top:14px;padding-top:12px}.trial-actions .text-button{margin-left:auto;font-size:12px}.editor-message:empty{display:none}.editor-message{margin-top:8px;font-size:12px}.draft-error{border:1px solid var(--amber);color:var(--amber);border-radius:6px;margin-bottom:10px;padding:10px;font-size:12px}.exploration-content{flex-direction:column;display:flex}.exploration-tabs{margin-top:12px}.exploration-tabs button{min-height:40px;font-size:12px}.exploration-intro{min-height:36px;font-size:11px}.suggestions{gap:10px;display:grid}.suggestion-card{background:linear-gradient(120deg,#25222d,#211f28);border:1px solid #4a4252;border-radius:8px;padding:14px}.suggestion-card h3{color:var(--text);font-size:23px}.suggestion-card p{color:var(--muted);margin:4px 0 12px;font-size:12px}.suggestion-actions{justify-content:flex-end;align-items:center;gap:10px;display:flex}.suggestion-actions .button{font-size:12px}.exploration-content>.workshop-details{margin-top:16px;padding:0}.harmony-select{text-align:left;background:#242129;border:1px solid #4b4355;border-radius:7px;justify-content:space-between;align-items:center;gap:10px;min-width:0;max-width:100%;min-height:44px;padding:8px 12px;font-size:13px;display:inline-flex}.harmony-select:hover:not(:disabled),.harmony-select[aria-expanded=true]{border-color:var(--lavender);background:#302936}.harmony-select:focus-visible{outline:2px solid var(--lavender);outline-offset:3px}[data-select=value]{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}[data-select=indicator]{color:var(--muted);flex-shrink:0;display:flex}.harmony-select-menu{z-index:100;overscroll-behavior:contain;width:max-content;min-width:150px;max-width:calc(100vw - 16px);max-height:min(320px,45dvh);color:var(--text);background:#25222d;border:1px solid #5b5066;border-radius:9px;padding:5px;font-size:13px;overflow-y:auto;box-shadow:0 14px 35px #0008}.harmony-select-menu [data-select=option]{cursor:pointer;border-radius:5px;justify-content:space-between;align-items:center;gap:16px;min-height:44px;padding:9px 12px;display:flex;position:relative}.harmony-select-menu [data-active=true]{background:#3b3246}.harmony-select-menu [aria-selected=true]{color:#f0c2e4;font-weight:600}.harmony-select-menu [aria-disabled=true]{opacity:.45;cursor:default}[data-select=check]{flex-shrink:0;width:16px}.about-popover{width:min(300px,100vw - 24px);color:var(--text);background:#25222d;border:1px solid #5b5066;border-radius:10px;margin:0;padding:16px;font-size:13px;inset:auto;box-shadow:0 14px 35px #0008}.about-heading{justify-content:space-between;align-items:center;gap:12px;display:flex}.about-heading .icon-button,.about-button{width:44px;height:44px}.about-popover p{color:var(--muted);margin:8px 0 12px}.about-popover a{min-height:44px;color:var(--lavender);align-items:center;display:inline-flex}.open-marker.available-string{color:#89828e;font-size:16px}.open-marker.muted-string{color:var(--muted);font-size:19px}.open-number{white-space:nowrap;font-size:10px}.transport{border:1px solid var(--border);background:linear-gradient(125deg,#222128,#191a20);border-radius:9px;width:100%;min-width:0;padding:12px 16px;container-type:inline-size}.transport-controls{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:10px 16px;display:grid}.transport-primary{flex-wrap:wrap;grid-column:1/-1;justify-content:space-between;align-items:center;gap:16px;display:flex}.transport-play{white-space:nowrap;align-items:center;gap:9px;min-height:44px;padding:0;font-size:12px;font-weight:600;display:flex}.play-circle{background:var(--pink);color:#251c29;border-radius:50%;place-items:center;width:44px;height:44px;display:grid}.transport-rhythm{align-items:center;gap:6px;display:flex}.tempo-control{white-space:nowrap;align-items:center;gap:0;font-size:12px;display:flex}.tempo-control label{align-items:center;gap:4px;display:flex}.tempo-control label>span{color:var(--muted);font-size:10px}.tempo-control .icon-button{width:44px;height:44px;font-size:18px}.transport .tempo-control input{text-align:center;width:3ch;min-height:44px}.meter{font:11px var(--mono);color:var(--muted)}.transport-options{border-block:1px solid var(--border-soft);grid-column:1/-1;align-items:center;gap:20px;padding-block:4px;display:flex}.transport-toggle{white-space:nowrap;gap:7px;min-height:44px;font-size:12px}.transport-toggle input{width:31px;height:19px;margin:0}.transport-toggle input:before{width:13px;height:13px}.transport-toggle input:checked:before{transform:translate(12px)}.accompaniment-control{min-width:0;display:flex}.accompaniment-control .harmony-select{width:100%}.volume-control{justify-content:flex-end;align-items:center;gap:7px;min-width:0;min-height:44px;display:flex}.volume-control input{width:80px;min-width:40px;height:44px;accent-color:var(--pink);flex:1;margin:0}.volume-control output{min-width:35px;font:11px var(--mono);text-align:right;white-space:nowrap}.transport-notices{color:var(--amber);font-size:11px}.transport-notices:has(>:not(.sr-only)){margin-top:8px}.transport-notices>span:not(.sr-only){display:block}@container (width>=850px){.transport-controls{gap:14px;display:flex}.transport-primary{flex-wrap:nowrap;gap:12px}.transport-options{border:0;border-left:1px solid var(--border);gap:12px;padding:0 0 0 12px}.accompaniment-control{margin-left:auto}.volume-control{flex:0 0 145px}}@container (width<=370px){.accompaniment-control,.volume-control{grid-column:1/-1}.transport-primary{gap:6px}.volume-control input{max-width:none}}@media (width<=1199px){.workspace[data-side-view=explore] .understanding-slot,.workspace[data-side-view=understand] .exploration-slot{display:none}.workspace{grid-template-columns:minmax(0,1fr);max-width:900px}.composition-column{grid-area:1/1}.side-tabs{grid-area:2/1;justify-self:start;display:flex}.side-tabs button{min-height:44px}.understanding-slot,.exploration-slot{grid-area:3/1}.inspector-panel .interval-list{max-width:500px}.inspector-panel .root-row,.inspector-panel .bass-label{max-width:320px}.position-navigation{max-width:250px}.note-selector{grid-template-columns:repeat(6,40px)}.suggestions{grid-template-columns:repeat(3,minmax(0,1fr))}.exploration-panel .harmony-section{max-width:420px}}@media (width<=600px){:root{--string-height:44px;--note-size:30px;--card-height:86px;--fret-width:56px}.app-header{flex-wrap:wrap;gap:8px;height:auto;min-height:58px;padding:8px 10px}.brand{gap:7px}.brand strong{font-size:16px}.brand-mark{width:22px;height:30px}.header-actions{gap:0}.save-label,.projects-button-label,.tool-divider{display:none}.save-button{min-width:28px;padding:0 4px}.projects-button{padding:0 8px}.project-bar{padding:10px 14px}.project-heading{flex-wrap:wrap;gap:4px 12px}.project-title-label{max-width:100%}.project-title{font-size:22px}.project-tuning{padding-left:0;font-size:12px}.workspace{gap:12px;padding:0 10px}.fret-panel{padding:12px 8px}.fret-toolbar{margin-bottom:12px}.fret-heading{width:100%}.fret-grid{grid-template-rows:repeat(6,44px) 28px}.segmented button,.button,select,.fret-scroll-tools .text-button{min-height:44px}.progression-panel{padding:12px 12px 6px}.progression-step{flex-basis:144px}.chord-select{min-height:44px}.card-duration input{min-height:34px}.duration-stepper{display:none}.suite-menu>summary,.icon-button{width:44px;height:44px}.pin-picker>summary,.held,.pin-options button,.suite-menu-items button{min-height:44px}.trial-listen{width:100%}.trial-actions .text-button{min-height:44px;margin-left:0}.transport{padding:12px}.transport-play{min-height:44px}.play-circle,.tempo-control .icon-button{width:44px;height:44px}.suggestions{grid-template-columns:1fr}.suggestion-card{padding:16px}.preview-button{width:44px;height:44px}.note-selector{grid-template-columns:repeat(6,40px);gap:6px}.project-dialog{padding:18px 14px}.project-row-actions .button{min-height:44px}.pwa-notice{bottom:12px}}@media (width<=370px){.note-selector{grid-template-columns:repeat(5,40px)}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}.card-duration input,.tempo-control input{color:var(--text);font:inherit;appearance:textfield;background:0 0;border:0;padding:0}.card-duration input{width:24px}.tempo-control input{text-align:right;width:32px}.card-duration input::-webkit-inner-spin-button{-webkit-appearance:none}.tempo-control input::-webkit-inner-spin-button{-webkit-appearance:none}.duration-stepper button{width:24px;color:var(--muted);place-items:center;padding:0;display:grid}.preview-notice{color:var(--amber);flex-wrap:wrap;align-items:center;gap:8px;font-size:12px;display:flex}.inspector-panel .chord-extension{font-size:20px}@media (width>=1200px) and (height<=850px){:root{--string-height:32px;--note-size:26px;--card-height:70px}.app-header{height:50px}.project-bar{padding-block:6px}.fret-panel{padding:12px}.fret-toolbar{margin-bottom:10px}.progression-panel{padding-top:10px}.measure-marker{margin-bottom:4px}.progression{padding-top:6px}.trial-summary{padding-top:8px}}