@font-face{font-family:MontserratLocal;src:url(/fonts/montserrat-latin-400.woff2)format("woff2");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:MontserratLocal;src:url(/fonts/montserrat-latin-500.woff2)format("woff2");font-weight:500;font-style:normal;font-display:swap}@font-face{font-family:MontserratLocal;src:url(/fonts/montserrat-latin-600.woff2)format("woff2");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:MontserratLocal;src:url(/fonts/montserrat-latin-700.woff2)format("woff2");font-weight:700;font-style:normal;font-display:swap}:root{--bg:#f5f8fb;--panel:#fff;--panel-border:#c6d2de;--text:#213444;--muted:#5c7488;--select-bg:#f8fbfe;--select-border:#c6d4e1;--chip-bg:#f3f7fb;--chip-border:#c7d6e3;--chip-active-bg:#dff0ff;--chip-active-border:#5d9bd1;--chip-hover-border:#8db2d2;--heading:#193042;--link:#2f6087;--link-hover:#1e4462;--nav-hover-bg:#dff0ff99;--nav-active-bg:#dff0ff;--handpan-shell-grad-start:#f3f6fb;--handpan-shell-grad-end:#dbe2ea;--handpan-shell-stroke:#b7c2cd;--handpan-tone-fill:#f9fbfd;--handpan-tone-stroke:#9aacbe;--handpan-tone-center-stroke:#8ea2b7;--handpan-chord-fill:#ffe2ad;--handpan-chord-stroke:#de9b3e;--handpan-chord-root-stroke:color-mix(in srgb, var(--handpan-chord-stroke) 76%, #000 24%);--handpan-chord-active-stroke:#c6b18a;--handpan-chord-played-fill:#ffd296;--handpan-tone-label:#243647;--handpan-slot-label:#567188;--step-card-bg:#f9fbfd;--step-name-color:#213444;--step-action-bg:#fff;--step-action-border:#c7d6e3;--step-action-text:#355063;--add-chord-text:#234058;--social-btn-bg:#e9f3fb;--social-btn-border:#b8cde0;--social-btn-icon:#2f6087;--ui-surface-bg:var(--panel);--ui-surface-border:var(--panel-border);--ui-surface-strong-border:var(--chip-active-border);--ui-surface-shadow:0 18px 36px #00000047;--ui-overlay-bg:#0e1c2757;--ui-action-bg:var(--chip-active-bg);--ui-action-border:var(--chip-active-border);--ui-action-muted-bg:var(--chip-bg);--ui-action-muted-border:var(--chip-border);--page-bg:radial-gradient(circle at 20% 0%, #fff 0%, #f5f8fb 55%, #edf3f8 100%);--font-body:"MontserratLocal", "Avenir Next", "Segoe UI", sans-serif;--font-display:"MontserratLocal", "Avenir Next", "Segoe UI", sans-serif;--font-size-body:1rem;--line-body:1.5;--line-heading:1.2;font-family:var(--font-body);color:var(--text);line-height:var(--line-body);font-weight:500}:root[data-theme=forest]{--bg:#eef4ef;--panel:#f8fcf8;--panel-border:#b5c8b8;--text:#22372d;--muted:#4f6e5f;--select-bg:#f3faf4;--select-border:#b9cfbf;--chip-bg:#eaf6ec;--chip-border:#b6d1be;--chip-active-bg:#dcedd4;--chip-active-border:#4f8a62;--chip-hover-border:#75a888;--heading:#1f3c2d;--link:#2f6e49;--link-hover:#1e4f34;--nav-hover-bg:#d2eccc94;--nav-active-bg:#d2eccc;--handpan-shell-grad-start:#f1f6f1;--handpan-shell-grad-end:#d5dfd7;--handpan-shell-stroke:#a8b7ac;--handpan-tone-fill:#f8fcf8;--handpan-tone-stroke:#8ca394;--handpan-tone-center-stroke:#7c9383;--handpan-chord-fill:#bfd7a5;--handpan-chord-stroke:#6f9d5b;--handpan-chord-root-stroke:color-mix(in srgb, var(--handpan-chord-stroke) 76%, #000 24%);--handpan-chord-active-stroke:#8aa07f;--handpan-chord-played-fill:color-mix(in srgb, var(--handpan-chord-fill) 72%, var(--chip-active-bg) 28%);--handpan-tone-label:#233b2e;--handpan-slot-label:#4e6f5b;--step-card-bg:#f0f8f1;--step-name-color:#294735;--step-action-bg:#f6fbf7;--step-action-border:#b6d1be;--step-action-text:#365b45;--add-chord-text:#2c5c3e;--social-btn-bg:#dff0e4;--social-btn-border:#b5cfbd;--social-btn-icon:#2f6e49;--ui-surface-bg:var(--panel);--ui-surface-border:var(--panel-border);--ui-surface-strong-border:var(--chip-active-border);--ui-surface-shadow:0 18px 36px #00000038;--ui-overlay-bg:#0c180f52;--ui-action-bg:var(--chip-active-bg);--ui-action-border:var(--chip-active-border);--ui-action-muted-bg:var(--chip-bg);--ui-action-muted-border:var(--chip-border);--page-bg:radial-gradient(circle at 20% -10%, #f5fbf6 0%, #ebf5ed 45%, #dfece2 100%)}:root[data-theme=night]{--bg:#0f1620;--panel:#192431;--panel-border:#3a4f64;--text:#e5eef8;--muted:#a5bbcf;--select-bg:#223243;--select-border:#3d5468;--chip-bg:#243546;--chip-border:#44607a;--chip-active-bg:#35597a;--chip-active-border:#79b2e1;--chip-hover-border:#669ec9;--heading:#f1f7ff;--link:#9ecdf3;--link-hover:#d0e9ff;--nav-hover-bg:#79b2e13d;--nav-active-bg:#79b2e157;--handpan-shell-grad-start:#2a3948;--handpan-shell-grad-end:#1b2835;--handpan-shell-stroke:#4f6578;--handpan-tone-fill:#2b3d4f;--handpan-tone-stroke:#6e89a0;--handpan-tone-center-stroke:#86a2bb;--handpan-chord-fill:#7f6340;--handpan-chord-stroke:#caa06f;--handpan-chord-root-stroke:#534432;--handpan-chord-active-stroke:#9f8e7a;--handpan-chord-played-fill:#b58a59;--handpan-tone-label:#e6f1fb;--handpan-slot-label:#9bb4ca;--step-card-bg:#223242;--step-name-color:#deecfa;--step-action-bg:#2a3b4d;--step-action-border:#4b647a;--step-action-text:#bdd2e6;--add-chord-text:#c7def2;--social-btn-bg:#2a3b4d;--social-btn-border:#4b647a;--social-btn-icon:#b9d4ec;--ui-surface-bg:var(--panel);--ui-surface-border:var(--panel-border);--ui-surface-strong-border:var(--chip-active-border);--ui-surface-shadow:0 18px 36px #00000075;--ui-overlay-bg:#04090d94;--ui-action-bg:var(--chip-active-bg);--ui-action-border:var(--chip-active-border);--ui-action-muted-bg:var(--chip-bg);--ui-action-muted-border:var(--chip-border);--page-bg:radial-gradient(circle at 20% -10%, #182332 0%, #111a24 48%, #0b1219 100%)}*{box-sizing:border-box}:where(a[href],button,summary,select,input[type=checkbox],input[type=radio],input[type=range],input[type=button],input[type=submit],[role=button]){cursor:pointer}:where(button,input,select):disabled{cursor:not-allowed}body{min-height:100vh;font-size:var(--font-size-body);font-family:var(--font-body);letter-spacing:.01em;background:var(--page-bg);margin:0}#app{min-height:100vh;padding:24px}.page{flex-direction:column;min-height:calc(100vh - 48px);display:flex}.layout{flex:1;grid-template-columns:320px 1fr;align-items:start;gap:20px;width:100%;max-width:1100px;margin:0 auto;display:grid}.panel,.diagram-wrap{background:var(--panel);border:1px solid var(--panel-border);border-radius:18px;padding:16px}h1,h2,h3,h4{font-family:var(--font-display);line-height:var(--line-heading);letter-spacing:.01em;color:var(--heading)}h1{margin:0;font-size:clamp(1.45rem,1.2rem + 1vw,2rem);font-weight:700}.subtitle{color:var(--muted);margin:8px 0 16px;font-size:.98rem;line-height:1.45}.field{gap:6px;margin-top:6px;margin-bottom:12px;display:grid}.field>span{letter-spacing:.03em;text-transform:uppercase;color:var(--muted);font-size:.86rem;font-weight:700}.field .field-label-small{letter-spacing:0;text-transform:none;color:var(--text);font-size:.92rem;font-weight:500}.field-after-toggles{margin-top:10px}select,textarea{border:1px solid var(--select-border);background:var(--select-bg);width:100%;color:var(--text);font-family:var(--font-body);border-radius:10px;padding:10px;font-size:.95rem;font-weight:500}.chord-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.chord-chip{border:1px solid var(--chip-border);background:var(--chip-bg);color:var(--text);font-family:var(--font-body);letter-spacing:.01em;cursor:pointer;text-align:center;border-radius:10px;padding:10px 12px;font-size:.92rem;font-weight:700}.chord-chip:hover{border-color:var(--chip-hover-border)}.chord-chip.is-active{background:var(--chip-active-bg);border-color:var(--chip-active-border);box-shadow:inset 0 0 0 1px #5d9bd133}.diagram-wrap{place-items:center;min-height:560px;display:grid}.advanced{border-top:1px dashed var(--panel-border);margin-top:14px;padding-top:10px}.advanced summary{color:var(--muted);text-transform:uppercase;letter-spacing:.04em;cursor:pointer;-webkit-user-select:none;user-select:none;font-size:.84rem;font-weight:700}.check-row{color:var(--text);align-items:center;gap:8px;margin-top:10px;font-size:.92rem;display:flex}.toggle-row{justify-content:space-between}.switch{width:44px;height:26px;display:inline-flex;position:relative}.switch input{opacity:0;width:0;height:0}.switch-slider{background:var(--chip-border);border:1px solid var(--select-border);border-radius:999px;transition:background .2s,border-color .2s;position:absolute;inset:0}.switch-slider:before{content:"";background:#fff;border-radius:50%;width:18px;height:18px;transition:transform .2s;position:absolute;top:3px;left:3px;box-shadow:0 1px 2px #0000003d}.switch input:checked+.switch-slider{background:var(--chip-active-border);border-color:var(--chip-active-border)}.switch input:checked+.switch-slider:before{transform:translate(18px)}.volume-row{justify-content:space-between}.volume-row input[type=range]{width:150px}.scale-play-btn{border:1px solid var(--chip-active-border);background:color-mix(in srgb, var(--chip-active-bg) 76%, var(--panel) 24%);width:100%;color:var(--add-chord-text);font-family:var(--font-body);cursor:pointer;border-radius:10px;margin-top:10px;padding:10px;font-size:.9rem;font-weight:700}.scale-play-btn:disabled{opacity:.65;cursor:not-allowed}.scale-play-btn.stop{background:color-mix(in srgb, var(--chip-bg) 72%, #c95f5f 28%);color:color-mix(in srgb, var(--text) 72%, #7a1f1f 28%);border-color:color-mix(in srgb, var(--step-action-border) 72%, #b85a5a 28%)}.reset-view-btn{border:1px solid var(--step-action-border);background:var(--step-action-bg);width:100%;color:var(--muted);font-family:var(--font-body);border-radius:10px;margin-top:8px;padding:9px;font-size:.88rem;font-weight:700}.social-block{border-top:1px solid #c7d6e380;gap:8px;margin-top:14px;padding-top:10px;display:grid}.social-title{letter-spacing:.04em;text-transform:uppercase;color:var(--muted);font-size:.8rem;font-weight:700}.social-link{color:var(--link);align-items:center;gap:8px;font-size:.9rem;font-weight:600;text-decoration:none;display:inline-flex}.social-link svg{fill:currentColor;width:18px;height:18px}.social-link:hover{color:var(--link-hover)}.footer{border-top:1px solid var(--panel-border);width:100%;max-width:1100px;color:var(--muted);flex-wrap:wrap;justify-content:space-between;gap:10px;margin:18px auto 0;padding:10px 4px;font-size:.84rem;display:flex}.footer a{color:var(--link);text-underline-offset:2px;font-weight:700;-webkit-text-decoration:underline #2f608759;text-decoration:underline #2f608759;transition:color .2s,text-decoration-color .2s}.footer a:hover{color:var(--link-hover);text-decoration-color:#1e4462b3}.footer-right{justify-items:end;gap:6px;display:grid}.footer-version{color:inherit;font-size:.72rem;font-weight:600}.footer-service{align-items:center;gap:10px;display:flex}.footer-social{flex-wrap:wrap;gap:8px;display:flex}.footer-social a{background:var(--social-btn-bg);border:1px solid var(--social-btn-border);width:30px;height:30px;color:var(--social-btn-icon);border-radius:999px;justify-content:center;align-items:center;margin-top:6px;text-decoration:none;display:inline-flex}.footer-social svg{fill:currentColor;width:16px;height:auto}.footer-theme-switcher{color:var(--muted);align-items:center;gap:6px;font-size:.78rem;font-weight:500;display:inline-flex}.footer-theme-switcher select{border:1px solid var(--chip-border);background:var(--panel);color:var(--text);border-radius:9px;min-width:96px;padding:6px 8px;font-size:.8rem;font-weight:500}.legal-page{background:var(--panel);border:1px solid var(--panel-border);width:100%;max-width:1100px;color:var(--text);border-radius:18px;margin:0 auto;padding:24px}.legal-page h1,.panel>h2:first-child{margin-top:0}.legal-page h2{margin-top:1.6rem;margin-bottom:.7rem;font-size:1.2rem}.legal-page h3{margin-top:1.3rem;margin-bottom:.55rem;font-size:1.02rem}.legal-page h4{margin-top:1rem;margin-bottom:.4rem;font-size:.95rem}.legal-page p,.legal-page li{font-size:.95rem;line-height:1.55}.about-cta a{border:1px solid var(--chip-border);background:var(--chip-bg);color:var(--link);border-radius:10px;padding:9px 12px;font-weight:700;text-decoration:none;display:inline-block}a{color:var(--link);text-underline-offset:2px;-webkit-text-decoration:underline #2f608759;text-decoration:underline #2f608759}a:hover{color:var(--link-hover);text-decoration-color:#1e4462b3}@media (width<=900px){#app{padding:12px}.layout{grid-template-columns:1fr}.diagram-wrap{min-height:420px}.footer{text-align:center;justify-content:center;font-size:.82rem}.footer-right{text-align:center;justify-items:center;width:100%}.footer-service{flex-direction:column;gap:6px}.footer-social,.footer-theme-switcher{justify-content:center;width:100%}}.app-message[data-v-74c0517f]{z-index:1200;border:1px solid var(--ui-surface-border);background:var(--ui-surface-bg);width:min(560px,100vw - 24px);color:var(--text);box-shadow:var(--ui-surface-shadow);border-radius:12px;justify-content:space-between;align-items:center;gap:12px;padding:14px 16px;font-weight:600;display:flex;position:fixed;top:17vh;left:50%;transform:translate(-50%)}.app-message.is-info[data-v-74c0517f],.app-message.is-warning[data-v-74c0517f],.app-message.is-error[data-v-74c0517f],.app-message.is-success[data-v-74c0517f]{border-color:var(--ui-surface-border);background:var(--ui-surface-bg)}.app-message-close[data-v-74c0517f]{border:1px solid var(--ui-action-border);background:var(--ui-action-bg);color:var(--text);cursor:pointer;border-radius:8px;padding:5px 9px;font-size:.76rem;font-weight:700}.app-message-close[data-v-74c0517f]:hover{background:color-mix(in srgb, var(--ui-action-bg) 76%, var(--ui-surface-bg) 24%)}@media (width<=640px){.app-message[data-v-74c0517f]{top:12vh}}.topbar[data-v-c0edef2e]{border-bottom:1px solid var(--panel-border);grid-template-columns:1fr auto;align-items:center;gap:12px;width:100%;max-width:1100px;margin:0 auto 16px;padding:10px 2px;display:grid}.brand[data-v-c0edef2e]{align-items:center;display:inline-flex}.logo-desktop[data-v-c0edef2e]{width:auto;height:64px;display:block}.logo-mobile[data-v-c0edef2e]{width:auto;height:52px;display:none}.topnav[data-v-c0edef2e]{align-items:center;gap:10px;display:inline-flex}.menu-toggle[data-v-c0edef2e]{display:none}.topnav-link[data-v-c0edef2e]{letter-spacing:.02em;color:var(--link);border-radius:10px;padding:7px 10px;font-size:.86rem;font-weight:700;text-decoration:none}.topnav-link[data-v-c0edef2e]:hover{color:var(--link-hover);background:var(--nav-hover-bg)}.topnav-link.router-link-exact-active[data-v-c0edef2e]{color:var(--link-hover);background:var(--nav-active-bg)}@media (width<=800px){.topbar[data-v-c0edef2e]{grid-template-columns:1fr auto;gap:12px;margin-bottom:12px;padding-top:6px;padding-bottom:8px;position:relative}.logo-desktop[data-v-c0edef2e]{display:none}.logo-mobile[data-v-c0edef2e]{display:block}.menu-toggle[data-v-c0edef2e]{border:1px solid var(--chip-border);background:var(--panel);cursor:pointer;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;gap:4px;width:40px;height:40px;display:inline-flex}.menu-toggle span[data-v-c0edef2e]{background:var(--link);border-radius:2px;width:18px;height:2px}.topnav[data-v-c0edef2e]{background:var(--panel);border:1px solid var(--panel-border);z-index:20;border-radius:12px;flex-direction:column;align-items:stretch;min-width:210px;padding:8px;display:none;position:absolute;top:calc(100% + 8px);right:0;box-shadow:0 8px 16px #00000014}.topnav.open[data-v-c0edef2e]{display:flex}.topnav-link[data-v-c0edef2e]{text-align:left;width:100%}}.confirm-overlay[data-v-0ab390a8]{background:var(--ui-overlay-bg);z-index:50;justify-content:center;align-items:flex-start;padding:17vh 16px 16px;display:flex;position:fixed;inset:0}.confirm-card[data-v-0ab390a8]{background:var(--ui-surface-bg);border:1px solid var(--ui-surface-border);width:min(460px,100%);color:var(--text);box-shadow:var(--ui-surface-shadow);border-radius:12px;padding:14px 16px}.confirm-card h3[data-v-0ab390a8]{margin:0 0 8px;font-size:1.02rem}.confirm-card p[data-v-0ab390a8]{color:var(--muted);margin:0 0 12px;line-height:1.45}.confirm-actions[data-v-0ab390a8]{justify-content:flex-end;gap:8px;display:flex}.confirm-btn[data-v-0ab390a8]{border:1px solid var(--ui-action-border);background:var(--ui-action-bg);color:var(--text);border-radius:8px;padding:8px 11px;font-weight:700}.confirm-btn.cancel[data-v-0ab390a8]{border-color:var(--ui-action-muted-border);background:var(--ui-action-muted-bg);color:var(--muted)}@media (width<=640px){.confirm-overlay[data-v-0ab390a8]{padding-top:12vh}}.advanced-content[data-v-db736f9b]{opacity:0;grid-template-rows:0fr;transition:grid-template-rows .18s,opacity .16s;display:grid}.advanced.is-open .advanced-content[data-v-db736f9b]{opacity:1;grid-template-rows:1fr}.advanced-inner[data-v-db736f9b]{overflow:hidden}.advanced-summary[data-v-db736f9b]{width:100%;color:var(--muted);font-family:var(--font-body);text-transform:uppercase;letter-spacing:.03em;cursor:pointer;-webkit-user-select:none;user-select:none;background:0 0;border:none;align-items:center;gap:8px;padding:0;font-size:.86rem;font-weight:700;display:flex}.advanced-chevron[data-v-db736f9b]{border-right:1.8px solid var(--muted);border-bottom:1.8px solid var(--muted);transform-origin:50%;flex-shrink:0;width:7px;height:7px;transition:transform .18s;position:relative;top:-1px;transform:rotate(-45deg)}.advanced.is-open .advanced-chevron[data-v-db736f9b]{transform:rotate(45deg)}@media (prefers-reduced-motion:reduce){.advanced-content[data-v-db736f9b]{transition:none}}.editor[data-v-b66e2612]{grid-template-columns:340px 1fr;gap:16px;width:100%;max-width:1100px;margin:0 auto;display:grid}.editor-controls hr[data-v-b66e2612]{border:none;border-top:1px solid var(--panel-border);margin:12px 0}.editor-controls[data-v-b66e2612] :is(select,textarea,input[type=text],input[type=number]){border:1px solid var(--select-border);background:var(--select-bg);width:100%;color:var(--text);font-family:var(--font-body);border-radius:10px;padding:10px;font-size:.95rem;font-weight:500;transition:border-color .2s,box-shadow .2s,background .2s}.tuning-string-card[data-v-b66e2612]{width:min(640px,100%)}.tuning-string-card code[data-v-b66e2612]{color:var(--text);font-size:.84rem}.tuning-string-input[data-v-b66e2612]{margin-top:4px}.tuning-modal-overlay[data-v-b66e2612]{background:var(--ui-overlay-bg);z-index:70;justify-content:center;align-items:flex-start;padding:12vh 16px 16px;display:flex;position:fixed;inset:0}.tuning-modal-card[data-v-b66e2612]{background:var(--ui-surface-bg);border:1px solid var(--ui-surface-border);width:min(640px,100%);color:var(--text);box-shadow:var(--ui-surface-shadow);border-radius:12px;padding:14px 16px}.tuning-modal-card h3[data-v-b66e2612]{margin:0 0 8px;font-size:1.02rem}.tuning-modal-card p[data-v-b66e2612]{color:var(--muted);margin:0 0 10px;line-height:1.45}.tuning-modal-actions[data-v-b66e2612]{justify-content:flex-end;gap:8px;margin-top:10px;display:flex}.tuning-modal-btn[data-v-b66e2612]{border:1px solid var(--ui-action-border);background:var(--ui-action-bg);color:var(--text);border-radius:8px;padding:8px 11px;font-weight:700}.tuning-modal-btn.cancel[data-v-b66e2612]{border-color:var(--ui-action-muted-border);background:var(--ui-action-muted-bg);color:var(--muted)}.editor-controls[data-v-b66e2612] :is(select,textarea,input[type=text],input[type=number]):focus{border-color:var(--chip-active-border);box-shadow:0 0 0 2px color-mix(in srgb, var(--chip-active-bg) 55%, transparent);outline:none}.editor-controls textarea[data-v-b66e2612]{resize:vertical}.editor-controls input[data-v-b66e2612]::placeholder{color:var(--muted);opacity:.8}.editor-title[data-v-b66e2612]{align-items:center;gap:8px;margin:0;display:inline-flex}.beta-badge[data-v-b66e2612]{border:1px solid var(--chip-active-border);background:color-mix(in srgb, var(--chip-active-bg) 78%, var(--panel) 22%);color:var(--add-chord-text);letter-spacing:.04em;text-transform:uppercase;border-radius:999px;align-items:center;padding:2px 8px;font-size:.68rem;font-weight:700;display:inline-flex}.debug-box[data-v-b66e2612]{border:1px solid var(--panel-border);border-radius:10px;gap:6px;margin:8px 0 10px;padding:10px;display:grid}.debug-hint[data-v-b66e2612]{color:var(--muted);margin:4px 0 2px;font-size:.76rem}.debug-title[data-v-b66e2612]{color:var(--muted);margin:0 0 4px;font-size:.82rem}.row-field[data-v-b66e2612]{grid-template-columns:1fr 120px;align-items:center;gap:10px;display:grid}.row-field-label[data-v-b66e2612]{color:var(--text);font-size:.88rem}.add-btn[data-v-b66e2612],.remove-btn[data-v-b66e2612],.load-btn[data-v-b66e2612]{border:1px solid var(--chip-active-border);background:var(--chip-active-bg);width:100%;color:var(--add-chord-text);cursor:pointer;border-radius:10px;margin-top:8px;padding:10px;font-weight:700}.remove-btn[data-v-b66e2612]{background:var(--step-action-bg);color:var(--step-action-text);border-color:var(--step-action-border)}.remove-btn[data-v-b66e2612]:disabled{opacity:.45;cursor:not-allowed}.reset-btn[data-v-b66e2612]{margin-top:14px}.load-btn[data-v-b66e2612]{background:var(--panel);color:var(--link);border-color:var(--chip-border)}.note-row[data-v-b66e2612],.transpose-row[data-v-b66e2612]{grid-template-columns:1fr 1fr;gap:10px;display:grid}.transpose-field[data-v-b66e2612]{margin-top:8px;margin-bottom:0}.draft-io-row[data-v-b66e2612]{grid-template-columns:1fr 1fr;gap:10px;margin-top:8px;display:grid}.generated-chords[data-v-b66e2612]{grid-template-columns:1fr 1fr;gap:6px;margin:10px 0 0;padding:0;list-style:none;display:grid}.generated-chords li[data-v-b66e2612]{border:1px solid var(--panel-border);cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:8px;gap:2px;padding:6px 8px;transition:border-color .15s,background .15s;display:grid}.generated-chords li[data-v-b66e2612]:hover{border-color:var(--chip-active-border)}.generated-chords li.is-playing[data-v-b66e2612]{border-color:var(--chip-active-border);background:color-mix(in srgb, var(--chip-active-bg) 20%, var(--panel) 80%)}.generated-chords strong[data-v-b66e2612]{font-size:.88rem}.chord-variant-muted[data-v-b66e2612]{opacity:.68;font-weight:500}.generated-chords span[data-v-b66e2612]{color:var(--muted);font-size:.82rem}.sr-only-input[data-v-b66e2612]{clip:rect(0, 0, 0, 0);border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.transpose-btn[data-v-b66e2612]{border:1px solid var(--chip-border);background:var(--chip-bg);color:var(--text);font-family:var(--font-body);cursor:pointer;border-radius:10px;padding:9px 10px;font-size:.84rem;font-weight:700}.transpose-btn[data-v-b66e2612]:hover{border-color:var(--chip-hover-border)}.editor-preview[data-v-b66e2612]{align-content:start;display:grid}.playback-section[data-v-b66e2612]{border-top:1px dashed var(--panel-border);padding-top:12px}.playback-title[data-v-b66e2612]{letter-spacing:.03em;text-transform:uppercase;color:var(--muted);margin:0 0 8px;font-size:.86rem;font-weight:700}.editor-pan[data-v-b66e2612]{width:min(620px,100%);height:auto;margin:4px auto 0}.shell[data-v-b66e2612]{fill:url(#editorShellGradient);stroke:var(--handpan-shell-stroke);stroke-width:.8px}.tone[data-v-b66e2612]{fill:var(--handpan-tone-fill);stroke:var(--handpan-tone-stroke);stroke-width:.5px;cursor:grab}.tone.active[data-v-b66e2612],.tone.chord-active[data-v-b66e2612]{fill:var(--handpan-chord-fill);stroke:var(--handpan-chord-stroke)}.tone.scale-active[data-v-b66e2612]{fill:var(--handpan-chord-played-fill)}.tone-label[data-v-b66e2612]{fill:var(--handpan-tone-label);text-anchor:middle;dominant-baseline:middle;pointer-events:none;font-size:3.6px;font-weight:600}.hint[data-v-b66e2612]{color:var(--muted);text-align:center;margin:10px 0 0;font-size:.86rem}@media (width<=900px){.editor[data-v-b66e2612]{grid-template-columns:1fr}}.faq-item[data-v-b42cdead]{border:1px solid var(--panel-border);background:color-mix(in srgb, var(--panel) 92%, var(--chip-bg) 8%);border-radius:12px;margin-bottom:10px}.faq-group[data-v-b42cdead]{margin-bottom:6px}.faq-trigger[data-v-b42cdead]{text-align:left;cursor:pointer;width:100%;color:var(--heading);background:0 0;border:0;padding:12px 14px;font-size:.98rem;font-weight:700}.faq-answer[data-v-b42cdead]{padding:0 14px 12px}.faq-answer p[data-v-b42cdead]{margin-top:0;margin-bottom:10px}.app-header[data-v-7d5877b6]{margin-bottom:8px}.chord-meta-muted[data-v-281f0e9e]{opacity:.68}.tuning-info-overlay[data-v-fa4126f2]{background:var(--ui-overlay-bg);z-index:50;justify-content:center;align-items:flex-start;padding:17vh 16px 16px;display:flex;position:fixed;inset:0}.tuning-info-card[data-v-fa4126f2]{background:var(--ui-surface-bg);border:1px solid var(--ui-surface-border);width:min(520px,100%);color:var(--text);box-shadow:var(--ui-surface-shadow);border-radius:12px;padding:14px 16px}.tuning-info-head[data-v-fa4126f2]{justify-content:space-between;align-items:center;gap:10px;display:flex}.tuning-info-head h3[data-v-fa4126f2]{margin:0;font-size:1.02rem}.tuning-info-close[data-v-fa4126f2]{border:1px solid var(--ui-action-muted-border);background:var(--ui-action-muted-bg);color:var(--muted);border-radius:8px;padding:7px 10px;font-weight:700}.tuning-info-grid[data-v-fa4126f2]{gap:8px;margin-top:10px;display:grid}.tuning-info-grid p[data-v-fa4126f2]{color:var(--muted);margin:0}.tuning-info-grid strong[data-v-fa4126f2]{color:var(--text)}@media (width<=640px){.tuning-info-overlay[data-v-fa4126f2]{padding-top:12vh}}.tuning-row[data-v-794a521d]{grid-template-columns:1fr auto;align-items:center;gap:8px;display:grid}.tuning-info-btn[data-v-794a521d]{border:1px solid var(--chip-border);background:var(--chip-bg);width:40px;height:41px;color:var(--text);border-radius:10px;padding:0;font-weight:700;line-height:1}.playback-section[data-v-363d4bb3]{border-top:1px dashed var(--panel-border);padding-top:12px}.playback-title[data-v-363d4bb3]{letter-spacing:.03em;text-transform:uppercase;color:var(--muted);margin:0 0 8px;font-size:.86rem;font-weight:700}.handpan[data-v-c2c53294]{width:min(560px,100%);max-width:100%;height:auto}.handpan.mini[data-v-c2c53294]{width:140px}.shell[data-v-c2c53294]{fill:url(#shellGradient);stroke:var(--handpan-shell-stroke);stroke-width:.8px}.tone[data-v-c2c53294]{fill:var(--handpan-tone-fill);stroke:var(--handpan-tone-stroke);stroke-width:.5px;cursor:pointer;transition:fill .2s,stroke .2s}.center-tone[data-v-c2c53294]{stroke:var(--handpan-tone-center-stroke);stroke-width:.6px}.tone-highlighted[data-v-c2c53294]{fill:var(--handpan-chord-fill);stroke:var(--handpan-chord-stroke)}.tone-highlighted.tone-root[data-v-c2c53294]{stroke:var(--handpan-chord-root-stroke)}.tone-played[data-v-c2c53294]{fill:var(--chip-active-bg)}.tone-highlighted.tone-played[data-v-c2c53294]{fill:var(--handpan-chord-played-fill);stroke:var(--handpan-chord-stroke)}.tone-highlighted.tone-root.tone-played[data-v-c2c53294]{stroke:var(--handpan-chord-root-stroke)}.tone-label[data-v-c2c53294]{fill:var(--handpan-tone-label);text-anchor:middle;dominant-baseline:middle;pointer-events:none;font-size:3.6px;font-weight:600}.slot-label[data-v-c2c53294]{fill:var(--handpan-slot-label);text-anchor:middle;dominant-baseline:middle;pointer-events:none;font-size:2.5px;font-weight:700}.extension-label[data-v-c2c53294]{fill:var(--muted);text-anchor:middle;dominant-baseline:middle;pointer-events:none;font-size:2.5px;font-weight:700}.not-found-page[data-v-fc5c2a97]{text-align:center}.not-found-actions[data-v-fc5c2a97]{flex-wrap:wrap;justify-content:center;gap:10px;margin-top:8px;display:inline-flex}.not-found-link[data-v-fc5c2a97]{border:1px solid var(--chip-border);background:var(--chip-bg);color:var(--text);border-radius:10px;padding:8px 12px;font-weight:700;text-decoration:none}.not-found-link[data-v-fc5c2a97]:hover{border-color:var(--chip-active-border);background:var(--chip-active-bg)}.sequencer[data-v-7c02f540]{grid-template-columns:380px 1fr;gap:16px;width:100%;max-width:1100px;margin:0 auto;display:grid}.sequence-preview[data-v-7c02f540],.sequence-lane[data-v-7c02f540]{min-height:100%}.sequence-lane[data-v-7c02f540]{grid-column:1/-1}.sequencer.is-compact-layout .sequence-preview[data-v-7c02f540],.sequencer.is-compact-layout .sequence-lane[data-v-7c02f540]{min-height:0}.sequencer.is-compact-layout[data-v-7c02f540]{grid-template-columns:320px 1fr}.sequencer.is-compact-layout .sequence-lane[data-v-7c02f540]{grid-area:1/2}.sequencer.is-compact-layout .sequence-preview[data-v-7c02f540]{grid-area:2/2}.sequencer.is-compact-layout .sequence-controls[data-v-7c02f540]{grid-area:1/1/span 2}.sequencer.is-compact-layout .step-grid[data-v-7c02f540]{grid-template-columns:repeat(4,minmax(0,1fr))}.active-chord-name[data-v-7c02f540]{color:var(--muted);margin:4px 0 14px;font-weight:700}.preview-diagram-wrap[data-v-7c02f540]{gap:6px;display:grid}.preview-main[data-v-7c02f540]{place-items:center;display:grid}.preview-info-bar[data-v-7c02f540]{grid-template-columns:1fr auto;align-items:end;min-height:78px;display:grid}.preview-info-left[data-v-7c02f540]{min-height:1px}.next-chord-preview[data-v-7c02f540]{align-items:flex-end;gap:8px;display:flex;transform:translateY(-22px)}.next-chord-badge[data-v-7c02f540]{color:var(--muted);margin:0;font-size:.78rem;font-weight:700;line-height:1.1}.next-chord-mini[data-v-7c02f540] .handpan.mini{width:118px}.dev-hint[data-v-7c02f540]{color:var(--muted);margin:0;font-size:.78rem}.add-chord[data-v-7c02f540]{border:1px solid var(--chip-active-border);background:var(--chip-active-bg);color:var(--add-chord-text);cursor:pointer;border-radius:10px;margin-top:10px;padding:10px;font-weight:700}.insert-hint[data-v-7c02f540]{color:var(--muted);margin:7px 0 0;font-size:.82rem}.player-controls[data-v-7c02f540]{margin-top:16px}.playback-section[data-v-7c02f540]{border-top:1px dashed var(--panel-border);padding-top:12px}.playback-title[data-v-7c02f540]{letter-spacing:.03em;text-transform:uppercase;color:var(--muted);margin:0 0 8px;font-size:.86rem;font-weight:700}.player-btn[data-v-7c02f540]{border:1px solid var(--chip-active-border);background:color-mix(in srgb, var(--chip-active-bg) 76%, var(--panel) 24%);width:100%;color:var(--add-chord-text);cursor:pointer;border-radius:10px;padding:10px;font-weight:700}.player-btn.stop[data-v-7c02f540]{background:color-mix(in srgb, var(--chip-bg) 72%, #c95f5f 28%);color:color-mix(in srgb, var(--text) 72%, #7a1f1f 28%);border-color:color-mix(in srgb, var(--step-action-border) 72%, #b85a5a 28%)}.options-subheading[data-v-7c02f540]{letter-spacing:.03em;text-transform:uppercase;color:var(--muted);margin:12px 0 8px;font-size:.86rem;font-weight:700}.metronome-toggle-row[data-v-7c02f540]{justify-content:space-between;align-items:center;margin-bottom:10px;display:flex}.row-field[data-v-7c02f540]{grid-template-columns:1fr 150px;align-items:center;gap:10px;display:grid}.row-field-label[data-v-7c02f540]{letter-spacing:0;text-transform:none;color:var(--text);font-size:.92rem;font-weight:500}.row-field select[data-v-7c02f540]{width:150px}.empty-lane[data-v-7c02f540]{color:var(--muted)}.step-grid[data-v-7c02f540]{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px;display:grid}.step-card[data-v-7c02f540]{border:1px solid var(--panel-border);background:var(--step-card-bg);cursor:pointer;border-radius:12px;justify-items:center;padding:10px;display:grid}.step-card.is-active[data-v-7c02f540]{border-color:var(--chip-active-border);box-shadow:inset 0 0 0 1px #5d9bd133}.step-select[data-v-7c02f540]{text-align:left;cursor:pointer;background:0 0;border:none;width:100%;padding:0}.step-index[data-v-7c02f540]{color:var(--muted);text-transform:uppercase;letter-spacing:.03em;font-size:.78rem;display:block}.step-name[data-v-7c02f540]{color:var(--step-name-color);margin-bottom:6px;font-weight:700;display:block}.chord-variant-muted[data-v-7c02f540]{opacity:.68;font-weight:500}.step-card[data-v-7c02f540] .handpan.mini{margin-inline:auto}.step-actions[data-v-7c02f540]{grid-template-columns:repeat(3,1fr);gap:6px;margin-top:8px;display:grid}.step-actions button[data-v-7c02f540]{border:1px solid var(--step-action-border);background:var(--step-action-bg);color:var(--step-action-text);cursor:pointer;border-radius:8px;padding:6px}@media (width<=900px){.sequencer[data-v-7c02f540],.sequencer.is-compact-layout[data-v-7c02f540]{grid-template-columns:1fr}.sequencer.is-compact-layout .sequence-controls[data-v-7c02f540],.sequencer.is-compact-layout .sequence-lane[data-v-7c02f540],.sequencer.is-compact-layout .sequence-preview[data-v-7c02f540]{grid-area:auto}.sequencer.is-compact-layout .step-grid[data-v-7c02f540]{grid-template-columns:repeat(4,minmax(0,1fr))}}@media (width<=620px){.sequencer.is-compact-layout .step-grid[data-v-7c02f540]{grid-template-columns:repeat(4,minmax(0,1fr))}.sequencer.is-compact-layout .sequence-controls[data-v-7c02f540]{order:1}.sequencer.is-compact-layout .sequence-preview[data-v-7c02f540]{order:2}.sequencer.is-compact-layout .sequence-lane[data-v-7c02f540]{order:3}}